Programmazione.it v6.4
Ciao, per farti riconoscere devi fare il login. Non ti sei ancora iscritto? Che aspetti, registrati adesso!
Info Pubblicità Collabora Autori Sottoscrizioni Preferiti Bozze Scheda personale Privacy Archivio Libri Corsi per principianti Forum
Guida ad HTML5: multimedialità, realizzazione di un player video (7/7)
Scritto da Pellegrino Principe il 05-11-2010 ore 12:06
Intel Cluster Studio XE
Concludiamo la disamina delle funzioni presenti del file player.js con la seguente funzione formatDuration che consente di formattare con il pattern hh:mm:ss / hh:mm:ss il testo indicante l'attuale tempo di riproduzione e la durata del video. Ricordiamo che questo testo viene inserito all'interno del div con l'attributo id avente il valore c_text_and_duration:
  1. formatDuration: function (d)
  2. {
  3.     // mette lo 0 a min o sec se < 9
  4.     function adjustData()
  5.     {
  6.         if (arguments.length == 1)
  7.         {
  8.             var w = arguments[0];
  9.             w = w > 9 ? w : "0" + w;
  10.             return { sec: w };
  11.         }
  12.         else if (arguments.length == 2)
  13.         {
  14.             var w = arguments[0];
  15.             var z = arguments[1];
  16.             w = w > 9 ? w : "0" + w;
  17.             z = z > 9 ? z : "0" + z;
  18.             return { min: z, sec: w };
  19.         }
  20.     }
  21.  
  22.     var empty_data = "00:00:00 / ";
  23.     var data = "";
  24.  
  25.     var dur = document.getElementById("c_text_and_duration");
  26.  
  27.     var d_calc = !d ? PLAYER.video_element.currentTime : d;
  28.  
  29.     d_calc = Math.round(d_calc); // arrotonda
  30.  
  31.     if (d_calc < 60) // secondi
  32.     {
  33.         d_obj = adjustData(d_calc);
  34.  
  35.         data = !d ? ("00:00:" + d_obj.sec + " / " + PLAYER.video_duration) :
  36.                    empty_data + "00:00:" + d_obj.sec;
  37.  
  38.         if (d)
  39.             PLAYER.video_duration = "00:00:" + d_obj.sec;
  40.     }
  41.     else if (d_calc < 3600) // minuti
  42.     {
  43.         var sec = d_calc % 60;
  44.         var min = Math.floor(d_calc / 60);
  45.  
  46.         d_obj = adjustData(sec, min);
  47.  
  48.         data = !d ? ("00:" + d_obj.min + ":" + d_obj.sec + " / " + PLAYER.video_duration) :
  49.             empty_data + "00:" + d_obj.min + ":" + d_obj.sec;
  50.  
  51.         if (d)
  52.             PLAYER.video_duration = "00:" + d_obj.min + ":" + d_obj.sec;
  53.     }
  54.     else // ore
  55.     {
  56.         var h = Math.floor(d_calc / 3600);
  57.  
  58.         var m_t = d_calc % 3600;
  59.         var m = Math.floor(m_t / 60);
  60.         var s = m_t % 60;
  61.  
  62.         d_obj = adjustData(s, m);
  63.  
  64.         data = !d ? (h + ":" + d_obj.min + ":" + d_obj.sec + " / " + PLAYER.video_duration) :
  65.             empty_data + h + ":" + d_obj.min + ":" + d_obj.sec;
  66.  
  67.         if (d)
  68.             PLAYER.video_duration = h + ":" + d_obj.min + ":" + d_obj.sec;
  69.     }
  70.  
  71.     dur.innerHTML = data;
  72. }

È possibile scaricare il codice dell'intero progetto del player video.
Precedente: MAP Scripting 101
Successiva: PDC10: un resoconto dello streaming online (4/5)
Copyright Programmazione.it™ 1999-2013. Alcuni diritti riservati. Testata giornalistica iscritta col n. 569 presso il Tribunale di Milano in data 14/10/2002. Pagina generata in 0.299 secondi.