इस प्रोजेक्ट के बारे में
Plyr HTML5 वीडियो और ऑडियो, YouTube और Vimeo एम्बेड के लिए एक सरल, हल्का, सुलभ और अनुकूलन योग्य मीडिया प्लेयर है। यह आधुनिक ब्राउज़रों को लक्षित करता है और बिना किसी फ्रेमवर्क या jQuery निर्भरता के शुद्ध ES6 जावास्क्रिप्ट में लिखा गया है, जिसकी शैलियाँ Sass में लिखी गई हैं और CSS कस्टम प्रॉपर्टीज़ के माध्यम से उपलब्ध कराई गई हैं।
README द्वारा प्रदर्शित प्रमुख क्षमताएँ:
- फ़ॉर्मेट समर्थन: मूल HTML5 वीडियो और ऑडियो तत्व, साथ ही data-plyr-provider और data-plyr-embed-id विशेषताओं का उपयोग करके YouTube और Vimeo iframes या सादे divs का प्रगतिशील संवर्धन।
- पहुंच-क्षमता: VTT कैप्शन और स्क्रीन रीडर समर्थन, वॉल्यूम के लिए input type=range, प्रोग्रेस तत्वों और वास्तविक बटन जैसे सिमेंटिक मार्कअप के साथ।
- अनुकूलन: CSS कस्टम प्रॉपर्टीज़ (उदाहरण के लिए --plyr-color-main) और Sass वेरिएबल्स आपको प्लेयर को वैश्विक रूप से, प्रति क्लास या इनलाइन पुनः-शैली करने की सुविधा देते हैं।
- उत्तरदायी लेआउट और iframe प्रदाताओं के लिए एक उत्तरदायी 16:9 एम्बेड रैपर क्लास।
- hls.js, Shaka Player और dash.js के साथ स्ट्रीमिंग प्लेबैक एकीकरण।
- सभी प्रदाताओं में मानकीकृत जावास्क्रिप्ट API और इवेंट्स, इसलिए YouTube और Vimeo को अलग API हैंडलिंग की आवश्यकता नहीं होती।
- फुलस्क्रीन के साथ फुल-विंडो मोड में फॉलबैक, पिक्चर-इन-पिक्चर, playsinline समर्थन, कीबोर्ड शॉर्टकट, गति नियंत्रण, एकाधिक कैप्शन ट्रैक, नियंत्रणों का i18n और पूर्वावलोकन थंबनेल।
- पार्टनर विज्ञापन एकीकरण या कस्टम ads.tagUrl विकल्प के माध्यम से मुद्रीकरण हुक।
सेटअप सीधा है: CDN या स्व-होस्टेड फ़ाइलों से plyr.css और plyr.js (या पॉलीफिल्ड बिल्ड) शामिल करें, फिर new Plyr('#player') के साथ इंस्टेंशिएट करें। पूर्व-निर्मित मिनिफाइड फ़ाइलें CDN या unpkg से उपलब्ध हैं, या आप npm i && npm run build के साथ स्रोत से बना सकते हैं। आइकन के लिए एक SVG स्प्राइट डिफ़ॉल्ट रूप से CDN से लोड होता है और इसे विकल्पों के माध्यम से ओवरराइड किया जा सकता है।
README रंगों, नियंत्रण स्पेसिंग और रेडी, मेनू, टूलटिप्स, प्रोग्रेस और रेंज स्टाइलिंग, कैप्शन और टाइपोग्राफी को कवर करने वाले CSS कस्टम प्रॉपर्टीज़ के एक बड़े सेट का दस्तावेजीकरण करता है, जिससे स्टाइलशीट को फोर्क किए बिना किसी मौजूदा डिज़ाइन सिस्टम से मेल खाना व्यावहारिक हो जाता है।
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.