javascript - वीडियो एलेमेंट सेट करें। Hulu वीडियो प्लेयर में curentimeime काम नहीं करता है, और खिलाड़ी को तोड़ता है




google-chrome-extension html5-video (2)

समय बदलने के लिए जिम्मेदार जावास्क्रिप्ट को खोजने की कोशिश करने के बजाय, उपयोगकर्ता घटनाओं को अनुकरण करने का प्रयास क्यों नहीं करें जिससे समय बदल सके?

समय की घटना को ट्रिगर करने वाले माउस इवेंट की सटीक अनुक्रम को समझें। यह संभवतः माउसओवर, मूसुडाउन, माउसउप, और क्लिक के कुछ संयोजन है।

फिर उन घटनाओं को कृत्रिम रूप से पुन: बनाएं और उन्हें उचित तत्वों के लिए भेज दें।

यह प्रवाह कुंजी और विमियम जैसे एक्सटेंशन द्वारा लिया गया दृष्टिकोण है

मेरे पास एक क्रोम एक्सटेंशन है जिसमें मैं वीडियो ऑब्जेक्ट की currentTime प्रॉपर्टी सेट करके वीडियो में विशिष्ट समय के लिए आगे या पीछे (पिछली बार उपयोगकर्ता के आधार पर) कूदने का प्रयास कर रहा हूं I currentTime सेट करने की कोशिश करने से पहले, विभिन्न प्रकार के ऑपरेशन केवल ठीक काम करते हैं। उदाहरण के लिए:

document.getElementsByTagName("video")[1].play(); // works fine
document.getElementsByTagName("video")[1].pause(); // works fine
document.getElementsByTagName("video")[1].muted = true; // works fine
document.getElementsByTagName("video")[1].muted = false; // works fine

लेकिन जैसे ही मैं इस तरह से कुछ करके वीडियो में एक विशिष्ट बिंदु पर कूदने की कोशिश करता हूं:

document.getElementsByTagName("video")[1].currentTime = 500; // doesn't work

कोई त्रुटि नहीं फेंक जाती है, वीडियो पॉज़ करता है, और इस बिंदु के बाद किसी भी प्रयास की कार्रवाई कुछ भी नहीं करती है। इसलिए उपरोक्त दिखाए गए आइटम (प्ले / पॉज़ / म्यूट / अनम्यूट) वर्तमान समय सेट करने के प्रयास के बाद अब काम नहीं करते हैं। अगर मैं इसे currentTime बाद currentTime का मूल्य पढ़ता हूं, तो यह सही तरीके से नया समय दिखाता है जिसे मैं इसे सेट करता हूं फिर भी मैं जो कुछ भी करता हूं, वह इसे चलाएगा, और वास्तव में अंतर्निहित उपकरण पट्टी पर क्लिक करके अब वीडियो गेम बनाने की कोशिश नहीं कर रहा है। तो, जाहिरा तौर पर वर्तमान समय सेटिंग वीडियो प्लेयर में सभी प्रकार के कहर को नष्ट कर देता है। फिर भी अगर मैं वीडियो को पुनः लोड करता हूँ, तब तक सभी काम करता है जब तक कि मैं वर्तमान टाइम सेट करने की कोशिश नहीं करता

मैं आसानी से टूलबार पर स्लाइडर को स्लाइड करके कई बार (पिछड़े या आगे) पर जा सकते हैं, इसलिए ऐसा करने के लिए आंतरिक रूप से कोई रास्ता होना चाहिए। क्या कोई रास्ता है जो मुझे पता चल सकता है कि कौन सी कोड एक सफल समय कूदता है? चूंकि यह एक क्रोम एक्सटेंशन है, इसलिए मैं कस्टम जेएस को निष्पादित हुलु जेएस में शामिल कर सकता हूं, लेकिन मुझे नहीं पता कि मैं कौन सी कमान भेजूंगा।

कोई विचार?


ठीक है, मैं इसे थोड़ी देर के लिए चारों ओर देख रहा था कि कैसे मैं खिलाड़ी पर क्लिक ईवेंट को पुन: उत्पन्न कर सकता हूं और निम्नलिखित समाधान के साथ आया हूं:

handleViewer = function(){
    var thumbnailMarker = $('.thumbnail-marker'),
        progressBarTotal = thumbnailMarker.parent(),
        controlsBar = $('.controls-bar'),
        videoPlayer = $('#content-video-player');

    var init = function(){
            thumbnailMarker = $('.thumbnail-marker');
            progressBarTotal = thumbnailMarker.parent();
            controlsBar = $('.controls-bar');
            videoPlayer = $('#content-video-player');
    },
    check = function(){
        if(!thumbnailMarker || !thumbnailMarker.length){
            init();
        }
    },
    show = function(){
            thumbnailMarker.show();
            progressBarTotal.show();
            controlsBar.show();
    },
    hide = function(){
        controlsBar.hide();
    },
    getProgressBarWidth = function(){
        return progressBarTotal[0].offsetWidth;
    };

    return {
        goToTime: function(time){
            var seekPercentage, 
            duration;
            check();
            duration = videoPlayer[0].duration;
            if(time > 0 && time < duration){
                seekPercentage = time/duration;
                this.jumpToPercentage(seekPercentage);
            }

        },
        jumpToPercentage: function(percentage){
            check();
            if(percentage >= 1 && percentage <= 100){
                percentage = percentage/100;
            }
            if(percentage >= 0 && percentage < 1){
                show();
                thumbnailMarker[0].style.left = (getProgressBarWidth()*percentage)+"px";
                thumbnailMarker[0].click();
                hide();
            }
        }
    }
}();

उस कोड को आरम्भ करने के बाद आप निम्न कर सकते हैं:

handleViewer.goToTime(500);

वैकल्पिक रूप से

handleViewer.jumpToPercentage(50);

मैंने मैक्रोबुक प्रो पर क्रोम में यह परीक्षण किया है। मुझे बताएं कि क्या आप किसी भी मुद्दे पर चलते हैं।





html5-video