BGAFC Vendégkönyv

Σ: 1 post

Flood3r (statz)

#8, Lófasz (840)

3548 | #40c3 | ^ | Idézet | Mon, 30 Jan 2017 00:40:39 +01

89.132.*.*

*.catv.broadband.hu

@TCH:
Eléggé, lévén webgányerként tengetem tyúkszaros életem még szarabb mindennapjait. Mi jón ügyködsz?

Van egy jó kis adult site-om azt fejlesztgetem.
Egy kicsit körülményes a probléma. Szal most wall of text jön. :D

Akarok egy olyan csinálni, hogy a videósávon ha húzod az egeret, akkor kis thumbnailek jelenjenek meg a videóból, attól függően, hol van az egér, mint a tecsőn.
Lejátszónak a Video.js-t használom. Ehhez vannak különböző pluginek. Találtam is hozzá egy thumbnail plugin-t itt: https://github.com/brightcove/videojs-thumbnails
Ezzel az a baj, hogy ahogy az oldalon is láthatod, kézzel kell megadni, hanyadik másodpercnél melyik thumbnail ugorjon fel. Viszont a videók nálam különböző hosszúságúak, szóval hiába állítom be egy 3 perces videóhoz a 19 darab thumbnailt amit generál minden videóhoz az oldal, az 1 órás videónál érdekesen néz ki, szóval egyenletesen kéne elosztogassa őket, a videó hosszától függően. Az oldal egyébként smarty-t is használ.

A thumbnailek generálására írtam egy ilyet, hogy ne kézzel kelljen beírogatni 1-től 19 ig:

{php}
global $video, $tmbint;
echo "<script>";
echo "video.thumbnails({";

for($i = 0; $i <= 19; $i++) {
    
    if($i == 0) { echo "0: { src: '/media/videos/tmb/".$video['VID'].'/'.($i+1).".jpg', style: { width: '120px', left: '-60px' }  }"; }
          else  { echo $i * $tmbint.": { src: '/media/videos/tmb/".$video['VID'].'/'.($i).".jpg', style: { width: '120px', left: '-60px' }  }"; }
    if($i != 19) echo ", \n";
}

  
echo "});";
 
echo "</script>";
 
{/php}

A videojs.thumbnail.js-t is módosítóttam az alábbiak szerint, ez kb a vége fele van.
Erről:

  mouseTime = Math.floor((left - progressControl.el().offsetLeft) / progressControl.width() * duration);
      for (time in settings) {
        if (mouseTime > time) {
          active = Math.max(active, time);
        }
      }
      setting = settings[active];
      if (setting.src && img.src != setting.src) {
        img.src = setting.src;
      }
      if (setting.style && img.style != setting.style) {
        extend(img.style, setting.style);
      }

      width = getVisibleWidth(img, setting.width || settings[0].width);
      halfWidth = width / 2;

Erre:

  mouseTime = Math.floor((left - progressControl.el().offsetLeft) / progressControl.width() * duration);

      unit = (progressControl.width()) / 20;
      moffset = left;

      for (time in settings) {
        if (mouseTime > time) {
          active = Math.max(active, time);
        }
      }

      active = Math.floor(moffset / unit) * Math.floor(duration / 20);
	
      setting = settings[active];
      if (setting.src && img.src != setting.src) {
        img.src = setting.src;
      }
      if (setting.style && img.style != setting.style) {
        extend(img.style, setting.style);
      }

      width = getVisibleWidth(img, setting.width || settings[0].width);
      halfWidth = width / 2;

Ha ezt így belövöm, akkor a következő történik: Az első thumbnail a helyén van, és ha tovább megyünk kb a 10 ik másodpercnél a vidóban,nem updateli a következő thumbnail-re, hanem kiköp egy hibát:

Uncaught TypeError: Cannot read property 'src' of undefined

Bocs a hosszú szövegért. Próbáltam rájönni a dologra, de nem sikerült. :/