Modal dialog

[Gunix]

Θέλω την βοήθεια σας παρακαλώ.

Όπως θα δείτε στο  link έχω ένα voice recoder, που αυτό το παραμετροποίησα.

Πως λειτουργεί. Όταν κάνεις κλικ στο μικρόφωνο και γίνει μπλε τότε ενεργοποιήτε η ηχογραφή. Μέτα όταν κάνεις πάλη κλικ και γίνει γκρι κλείνει το μικρόφωνο και μετά ενεργοποιήτε το εικονίδιο που είναι ο σκληρός δίσκος για να αποθηκεύσουμε το αρχείο wav.

Εγώ θέλω να καταργήσω το εικονίδιο που είναι σε svg και θέλω άλλο τρόπο αποθήκευσης αρχείου. Δήλαδη όταν κλείσει το μικρόφωνο από το κουμπί "από μπλε γίνεται γκρί" τότε αυτόματα θέλω να μου εμφανίζει ένα παραθύρο με το εξής μήνυμα "Θέλετε να αποθηκεύσετε το αρχείο ήχου" και από κάτω με 2 buttons (Ναι) (Όχι). Αν πατήσει Ναι αποθηκεύει το αρχείο του στο pc. Αν πατήσει Όχι τότε κλείνει το παράθυρο και παραμένει στο περιεχόμενο.

Τέλος, θα χρησημοποιήσω bootstrap και βρήκα αυτά εδώ https://v4-alpha.getbootstrap.com/components/modal/#how-it-works https://getbootstrap.com/docs/3.3/javascript/ αλλά δεν ξέρω πολύ καλά προγραμματισμό. Μπορώ να έχω την βοήθεια σας παρακαλώ?

 

Εδώ είναι το project spyvasilas.000webhostapp.com

[kosnik]

Δεν ειναι κατι ιδιαιτερα δυσκολο. Περιγραφικα, σε πρωτη φάση :

 

- Ξεκινα βαζοντας bootstrap στο project σου.

 

- Eξοικοιωσου με το modal. Παιξε με τα παραδειγματα που εχει. Πως κανεις show/hide ena modal manually klp.

 

- Οταν πατας το μικροφωνο για να αρχισει/τελειωσει η ηχογραφηση, καλει την toggleRecording(). Εκει, θα πρεπει στο case που θες (stop recording) να ανοιξεις το modal σου (δες .modal('show') στο documentation). Ένα από τα κουμπιά του modal (Nαι) θα κανει οτι κανει και το κουμπι save που εχεις τωρα. Οποτε στην ουσια το μεταφέρεις εκεί.  Το άλλο θα κλείνει το modal (το κουμπι close των παραδειγματων που εχει, αρκει να αλλαξεις το κειμενο του κουμπιου).

 

Με λιγο πειραματισμό θα τα καταφέρεις