Vimeo fixes + small bug fixes
This commit is contained in:
		
							
								
								
									
										2
									
								
								.vscode/settings.json
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										2
									
								
								.vscode/settings.json
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,2 @@ | |||||||
|  | { | ||||||
|  | } | ||||||
| @ -1,5 +1,13 @@ | |||||||
| # Changelog | # Changelog | ||||||
|  |  | ||||||
|  | ## v2.0.17 | ||||||
|  | - Vimeo controls fix (fixes #697) | ||||||
|  | - SVG4everybody compatibility fix | ||||||
|  | - Allow Plyr.setup event listeners to be set up as separate event listeners (https://github.com/sampotts/plyr/pull/703) | ||||||
|  | - Added title to the layer html template (for custom controls) (https://github.com/sampotts/plyr/pull/649) | ||||||
|  | - Target is null bug fix (https://github.com/sampotts/plyr/pull/617) | ||||||
|  | - fix #684 memory leaks issues after destroy (https://github.com/sampotts/plyr/pull/700) | ||||||
|  |  | ||||||
| ## v2.0.16 | ## v2.0.16 | ||||||
| - Fullscreen bug fix (fixes #664) | - Fullscreen bug fix (fixes #664) | ||||||
|  |  | ||||||
|  | |||||||
							
								
								
									
										2
									
								
								demo/dist/demo.css
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								demo/dist/demo.css
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										2
									
								
								demo/dist/demo.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								demo/dist/demo.js
									
									
									
									
										vendored
									
									
								
							| @ -1 +1 @@ | |||||||
| "document"in self&&("classList"in document.createElement("_")?!function(){"use strict";var e=document.createElement("_");if(e.classList.add("c1","c2"),!e.classList.contains("c2")){var t=function(e){var t=DOMTokenList.prototype[e];DOMTokenList.prototype[e]=function(e){var i,s=arguments.length;for(i=0;i<s;i++)e=arguments[i],t.call(this,e)}};t("add"),t("remove")}if(e.classList.toggle("c3",!1),e.classList.contains("c3")){var i=DOMTokenList.prototype.toggle;DOMTokenList.prototype.toggle=function(e,t){return 1 in arguments&&!this.contains(e)==!t?t:i.call(this,e)}}e=null}():!function(e){"use strict";if("Element"in e){var t="classList",i="prototype",s=e.Element[i],o=Object,n=String[i].trim||function(){return this.replace(/^\s+|\s+$/g,"")},r=Array[i].indexOf||function(e){for(var t=0,i=this.length;t<i;t++)if(t in this&&this[t]===e)return t;return-1},a=function(e,t){this.name=e,this.code=DOMException[e],this.message=t},c=function(e,t){if(""===t)throw new a("SYNTAX_ERR","An invalid or illegal string was specified");if(/\s/.test(t))throw new a("INVALID_CHARACTER_ERR","String contains an invalid character");return r.call(e,t)},l=function(e){for(var t=n.call(e.getAttribute("class")||""),i=t?t.split(/\s+/):[],s=0,o=i.length;s<o;s++)this.push(i[s]);this._updateClassName=function(){e.setAttribute("class",this.toString())}},u=l[i]=[],d=function(){return new l(this)};if(a[i]=Error[i],u.item=function(e){return this[e]||null},u.contains=function(e){return e+="",c(this,e)!==-1},u.add=function(){var e,t=arguments,i=0,s=t.length,o=!1;do e=t[i]+"",c(this,e)===-1&&(this.push(e),o=!0);while(++i<s);o&&this._updateClassName()},u.remove=function(){var e,t,i=arguments,s=0,o=i.length,n=!1;do for(e=i[s]+"",t=c(this,e);t!==-1;)this.splice(t,1),n=!0,t=c(this,e);while(++s<o);n&&this._updateClassName()},u.toggle=function(e,t){e+="";var i=this.contains(e),s=i?t!==!0&&"remove":t!==!1&&"add";return s&&this[s](e),t===!0||t===!1?t:!i},u.toString=function(){return this.join(" ")},o.defineProperty){var p={get:d,enumerable:!0,configurable:!0};try{o.defineProperty(s,t,p)}catch(h){h.number===-2146823252&&(p.enumerable=!1,o.defineProperty(s,t,p))}}else o[i].__defineGetter__&&s.__defineGetter__(t,d)}}(self)),function(){function e(e,t,i){if(e)if(e.classList)e.classList[i?"add":"remove"](t);else{var s=(" "+e.className+" ").replace(/\s+/g," ").replace(" "+t+" ","");e.className=s+(i?" "+t:"")}}function t(t,i){if(t in n&&(i||t!==r)&&(r.length||t!==n.video)){switch(t){case n.video:s.source({type:"video",title:"View From A Blue Moon",sources:[{src:"https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.mp4",type:"video/mp4"},{src:"https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.webm",type:"video/webm"}],poster:"https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.jpg",tracks:[{kind:"captions",label:"English",srclang:"en",src:"https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.en.vtt","default":!0}]});break;case n.audio:s.source({type:"audio",title:"Kishi Bashi – “It All Began With A Burst”",sources:[{src:"https://cdn.selz.com/plyr/1.5/Kishi_Bashi_-_It_All_Began_With_a_Burst.mp3",type:"audio/mp3"},{src:"https://cdn.selz.com/plyr/1.5/Kishi_Bashi_-_It_All_Began_With_a_Burst.ogg",type:"audio/ogg"}]});break;case n.youtube:s.source({type:"video",title:"View From A Blue Moon",sources:[{src:"bTqVqk7FSmY",type:"youtube"}]});break;case n.vimeo:s.source({type:"video",title:"View From A Blue Moon",sources:[{src:"143418951",type:"vimeo"}]})}r=t;for(var a=o.length-1;a>=0;a--)e(o[a].parentElement,"active",!1);e(document.querySelector('[data-source="'+t+'"]').parentElement,"active",!0)}}var i=plyr.setup({debug:!0,title:"Video demo",iconUrl:"../dist/plyr.svg",tooltips:{controls:!0},captions:{defaultActive:!0}});plyr.loadSprite("dist/demo.svg");for(var s=i[0],o=document.querySelectorAll("[data-source]"),n={video:"video",audio:"audio",youtube:"youtube",vimeo:"vimeo"},r=window.location.hash.replace("#",""),a=window.history&&window.history.pushState,c=o.length-1;c>=0;c--)o[c].addEventListener("click",function(){var e=this.getAttribute("data-source");t(e),a&&history.pushState({type:e},"","#"+e)});if(window.addEventListener("popstate",function(e){e.state&&"type"in e.state&&t(e.state.type)}),a){var l=!r.length;l&&(r=n.video),r in n&&history.replaceState({type:r},"",l?"":"#"+r),r!==n.video&&t(r,!0)}}(),document.domain.indexOf("plyr.io")>-1&&(!function(e,t,i,s,o,n,r){e.GoogleAnalyticsObject=o,e[o]=e[o]||function(){(e[o].q=e[o].q||[]).push(arguments)},e[o].l=1*new Date,n=t.createElement(i),r=t.getElementsByTagName(i)[0],n.async=1,n.src=s,r.parentNode.insertBefore(n,r)}(window,document,"script","//www.google-analytics.com/analytics.js","ga"),ga("create","UA-40881672-11","auto"),ga("send","pageview")); | "document"in self&&("classList"in document.createElement("_")?function(){"use strict";var t=document.createElement("_");if(t.classList.add("c1","c2"),!t.classList.contains("c2")){var e=function(t){var e=DOMTokenList.prototype[t];DOMTokenList.prototype[t]=function(t){var i,o=arguments.length;for(i=0;i<o;i++)t=arguments[i],e.call(this,t)}};e("add"),e("remove")}if(t.classList.toggle("c3",!1),t.classList.contains("c3")){var i=DOMTokenList.prototype.toggle;DOMTokenList.prototype.toggle=function(t,e){return 1 in arguments&&!this.contains(t)==!e?e:i.call(this,t)}}t=null}():function(t){"use strict";if("Element"in t){var e=t.Element.prototype,i=Object,o=String.prototype.trim||function(){return this.replace(/^\s+|\s+$/g,"")},s=Array.prototype.indexOf||function(t){for(var e=0,i=this.length;e<i;e++)if(e in this&&this[e]===t)return e;return-1},n=function(t,e){this.name=t,this.code=DOMException[t],this.message=e},r=function(t,e){if(""===e)throw new n("SYNTAX_ERR","An invalid or illegal string was specified");if(/\s/.test(e))throw new n("INVALID_CHARACTER_ERR","String contains an invalid character");return s.call(t,e)},a=function(t){for(var e=o.call(t.getAttribute("class")||""),i=e?e.split(/\s+/):[],s=0,n=i.length;s<n;s++)this.push(i[s]);this._updateClassName=function(){t.setAttribute("class",this.toString())}},c=a.prototype=[],l=function(){return new a(this)};if(n.prototype=Error.prototype,c.item=function(t){return this[t]||null},c.contains=function(t){return t+="",-1!==r(this,t)},c.add=function(){var t,e=arguments,i=0,o=e.length,s=!1;do{t=e[i]+"",-1===r(this,t)&&(this.push(t),s=!0)}while(++i<o);s&&this._updateClassName()},c.remove=function(){var t,e,i=arguments,o=0,s=i.length,n=!1;do{for(t=i[o]+"",e=r(this,t);-1!==e;)this.splice(e,1),n=!0,e=r(this,t)}while(++o<s);n&&this._updateClassName()},c.toggle=function(t,e){t+="";var i=this.contains(t),o=i?!0!==e&&"remove":!1!==e&&"add";return o&&this[o](t),!0===e||!1===e?e:!i},c.toString=function(){return this.join(" ")},i.defineProperty){var u={get:l,enumerable:!0,configurable:!0};try{i.defineProperty(e,"classList",u)}catch(t){-2146823252===t.number&&(u.enumerable=!1,i.defineProperty(e,"classList",u))}}else i.prototype.__defineGetter__&&e.__defineGetter__("classList",l)}}(self)),function(){function t(t,e,i){if(t)if(t.classList)t.classList[i?"add":"remove"](e);else{var o=(" "+t.className+" ").replace(/\s+/g," ").replace(" "+e+" ","");t.className=o+(i?" "+e:"")}}function e(e,i){if(e in n&&(i||e!==r)&&(r.length||e!==n.video)){switch(e){case n.video:o.source({type:"video",title:"View From A Blue Moon",sources:[{src:"https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.mp4",type:"video/mp4"},{src:"https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.webm",type:"video/webm"}],poster:"https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.jpg",tracks:[{kind:"captions",label:"English",srclang:"en",src:"https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.en.vtt",default:!0}]});break;case n.audio:o.source({type:"audio",title:"Kishi Bashi – “It All Began With A Burst”",sources:[{src:"https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.mp3",type:"audio/mp3"},{src:"https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.ogg",type:"audio/ogg"}]});break;case n.youtube:o.source({type:"video",title:"View From A Blue Moon",sources:[{src:"bTqVqk7FSmY",type:"youtube"}]});break;case n.vimeo:o.source({type:"video",title:"View From A Blue Moon",sources:[{src:"147865858",type:"vimeo"}]})}r=e;for(var a=s.length-1;a>=0;a--)t(s[a].parentElement,"active",!1);t(document.querySelector('[data-source="'+e+'"]').parentElement,"active",!0)}}var i=plyr.setup({debug:!0,title:"Video demo",iconUrl:"../dist/plyr.svg",tooltips:{controls:!0},captions:{defaultActive:!0}});plyr.loadSprite("dist/demo.svg");for(var o=i[0],s=document.querySelectorAll("[data-source]"),n={video:"video",audio:"audio",youtube:"youtube",vimeo:"vimeo"},r=window.location.hash.replace("#",""),a=window.history&&window.history.pushState,c=s.length-1;c>=0;c--)s[c].addEventListener("click",function(){var t=this.getAttribute("data-source");e(t),a&&history.pushState({type:t},"","#"+t)});if(window.addEventListener("popstate",function(t){t.state&&"type"in t.state&&e(t.state.type)}),a){var l=!r.length;l&&(r=n.video),r in n&&history.replaceState({type:r},"",l?"":"#"+r),r!==n.video&&e(r,!0)}}(),document.domain.indexOf("plyr.io")>-1&&(!function(t,e,i,o,s,n,r){t.GoogleAnalyticsObject=s,t.ga=t.ga||function(){(t.ga.q=t.ga.q||[]).push(arguments)},t.ga.l=1*new Date,n=e.createElement(i),r=e.getElementsByTagName(i)[0],n.async=1,n.src="//www.google-analytics.com/analytics.js",r.parentNode.insertBefore(n,r)}(window,document,"script",0,"ga"),ga("create","UA-40881672-11","auto"),ga("send","pageview")); | ||||||
| @ -3,17 +3,15 @@ | |||||||
| // ========================================================================== | // ========================================================================== | ||||||
|  |  | ||||||
| @font-face { | @font-face { | ||||||
|     font-family: "Avenir"; |     font-family: 'Avenir'; | ||||||
|     src: url("//cdn.plyr.io/static/fonts/avenir-medium.woff2") format("woff2"), |     src: url('https://cdn.plyr.io/static/fonts/avenir-medium.woff2') format('woff2'), url('https://cdn.plyr.io/static/fonts/avenir-medium.woff') format('woff'); | ||||||
|         url("//cdn.plyr.io/static/fonts/avenir-medium.woff") format("woff"); |  | ||||||
|     font-style: normal; |     font-style: normal; | ||||||
|     font-weight: @font-weight-base; |     font-weight: @font-weight-base; | ||||||
|     font-display: swap; |     font-display: swap; | ||||||
| } | } | ||||||
| @font-face { | @font-face { | ||||||
|     font-family: "Avenir"; |     font-family: 'Avenir'; | ||||||
|     src: url("//cdn.plyr.io/static/fonts/avenir-bold.woff2") format("woff2"), |     src: url('https://cdn.plyr.io/static/fonts/avenir-bold.woff2') format('woff2'), url('https://cdn.plyr.io/static/fonts/avenir-bold.woff') format('woff'); | ||||||
|         url("//cdn.plyr.io/static/fonts/avenir-bold.woff") format("woff"); |  | ||||||
|     font-style: normal; |     font-style: normal; | ||||||
|     font-weight: @font-weight-bold; |     font-weight: @font-weight-bold; | ||||||
|     font-display: swap; |     font-display: swap; | ||||||
|  | |||||||
							
								
								
									
										2
									
								
								dist/plyr.css
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								dist/plyr.css
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										3
									
								
								dist/plyr.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										3
									
								
								dist/plyr.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										364
									
								
								gulpfile.js
									
									
									
									
									
								
							
							
						
						
									
										364
									
								
								gulpfile.js
									
									
									
									
									
								
							| @ -4,72 +4,69 @@ | |||||||
| /*global require, __dirname,Buffer*/ | /*global require, __dirname,Buffer*/ | ||||||
| /*jshint -W079 */ | /*jshint -W079 */ | ||||||
|  |  | ||||||
| var fs          = require("fs"), | var fs = require('fs'), | ||||||
|     path        = require("path"), |     path = require('path'), | ||||||
|     gulp        = require("gulp"), |     gulp = require('gulp'), | ||||||
|     gutil       = require("gulp-util"), |     gutil = require('gulp-util'), | ||||||
|     concat      = require("gulp-concat"), |     concat = require('gulp-concat'), | ||||||
|     uglify      = require("gulp-uglify"), |     uglify = require('gulp-uglify'), | ||||||
|     less        = require("gulp-less"), |     less = require('gulp-less'), | ||||||
|     sass        = require("gulp-sass"), |     sass = require('gulp-sass'), | ||||||
|     cleanCSS    = require("gulp-clean-css"), |     cleanCSS = require('gulp-clean-css'), | ||||||
|     run         = require("run-sequence"), |     run = require('run-sequence'), | ||||||
|     prefix      = require("gulp-autoprefixer"), |     prefix = require('gulp-autoprefixer'), | ||||||
|     svgstore    = require("gulp-svgstore"), |     svgstore = require('gulp-svgstore'), | ||||||
|     svgmin      = require("gulp-svgmin"), |     svgmin = require('gulp-svgmin'), | ||||||
|     rename      = require("gulp-rename"), |     rename = require('gulp-rename'), | ||||||
|     s3          = require("gulp-s3"), |     s3 = require('gulp-s3'), | ||||||
|     replace     = require("gulp-replace"), |     replace = require('gulp-replace'), | ||||||
|     open        = require("gulp-open"), |     open = require('gulp-open'), | ||||||
|     size        = require("gulp-size"), |     size = require('gulp-size'), | ||||||
|     through     = require("through2"); |     through = require('through2'); | ||||||
|  |  | ||||||
| var root = __dirname, | var root = __dirname, | ||||||
| paths = { |     paths = { | ||||||
|     plyr: { |         plyr: { | ||||||
|         // Source paths |             // Source paths | ||||||
|         src: { |             src: { | ||||||
|             less:       path.join(root, "src/less/**/*"), |                 less: path.join(root, 'src/less/**/*'), | ||||||
|             scss:       path.join(root, "src/scss/**/*"), |                 scss: path.join(root, 'src/scss/**/*'), | ||||||
|             js:         path.join(root, "src/js/**/*"), |                 js: path.join(root, 'src/js/**/*'), | ||||||
|             sprite:     path.join(root, "src/sprite/*.svg") |                 sprite: path.join(root, 'src/sprite/*.svg'), | ||||||
|  |             }, | ||||||
|  |             // Output paths | ||||||
|  |             output: path.join(root, 'dist/'), | ||||||
|         }, |         }, | ||||||
|         // Output paths |         demo: { | ||||||
|         output:         path.join(root, "dist/") |             // Source paths | ||||||
|     }, |             src: { | ||||||
|     demo: { |                 less: path.join(root, 'demo/src/less/**/*'), | ||||||
|         // Source paths |                 js: path.join(root, 'demo/src/js/**/*'), | ||||||
|         src: { |                 sprite: path.join(root, 'demo/src/sprite/**/*'), | ||||||
|             less:       path.join(root, "demo/src/less/**/*"), |             }, | ||||||
|             js:         path.join(root, "demo/src/js/**/*"), |             // Output paths | ||||||
|             sprite:     path.join(root, "demo/src/sprite/**/*") |             output: path.join(root, 'demo/dist/'), | ||||||
|  |             // Demo | ||||||
|  |             root: path.join(root, 'demo/'), | ||||||
|         }, |         }, | ||||||
|         // Output paths |         upload: [path.join(root, 'dist/**'), path.join(root, 'demo/dist/**')], | ||||||
|         output:         path.join(root, "demo/dist/"), |  | ||||||
|         // Demo |  | ||||||
|         root:           path.join(root, "demo/") |  | ||||||
|     }, |     }, | ||||||
|     upload: [path.join(root, "dist/**"), path.join(root, "demo/dist/**")] |     // Task arrays | ||||||
| }, |     tasks = { | ||||||
|  |         less: [], | ||||||
| // Task arrays |         scss: [], | ||||||
| tasks = { |         js: [], | ||||||
|     less:   [], |         sprite: [], | ||||||
|     scss:   [], |     }, | ||||||
|     js:     [], |     // Fetch bundles from JSON | ||||||
|     sprite: [] |     bundles = loadJSON(path.join(root, 'bundles.json')), | ||||||
| }, |     package = loadJSON(path.join(root, 'package.json')); | ||||||
|  |  | ||||||
| // Fetch bundles from JSON |  | ||||||
| bundles = loadJSON(path.join(root, "bundles.json")), |  | ||||||
| package = loadJSON(path.join(root, "package.json")); |  | ||||||
|  |  | ||||||
| // Load json | // Load json | ||||||
| function loadJSON(path) { | function loadJSON(path) { | ||||||
|     try { |     try { | ||||||
|         return JSON.parse(fs.readFileSync(path)); |         return JSON.parse(fs.readFileSync(path)); | ||||||
|     } |     } catch (err) { | ||||||
|     catch(err) { |  | ||||||
|         return {}; |         return {}; | ||||||
|     } |     } | ||||||
| } | } | ||||||
| @ -78,37 +75,39 @@ function loadJSON(path) { | |||||||
| // http://stackoverflow.com/questions/23230569/how-do-you-create-a-file-from-a-string-in-gulp | // http://stackoverflow.com/questions/23230569/how-do-you-create-a-file-from-a-string-in-gulp | ||||||
| function createFile(filename, string) { | function createFile(filename, string) { | ||||||
|     var src = require('stream').Readable({ |     var src = require('stream').Readable({ | ||||||
|         objectMode: true |         objectMode: true, | ||||||
|     }); |     }); | ||||||
|     src._read = function () { |     src._read = function() { | ||||||
|         this.push(new gutil.File({ |         this.push( | ||||||
|             cwd: "", |             new gutil.File({ | ||||||
|             base: "", |                 cwd: '', | ||||||
|             path: filename, |                 base: '', | ||||||
|             contents: new Buffer(string), |                 path: filename, | ||||||
|             // stats also required for some functions |                 contents: new Buffer(string), | ||||||
|             // https://nodejs.org/api/fs.html#fs_class_fs_stats |                 // stats also required for some functions | ||||||
|             stat: { |                 // https://nodejs.org/api/fs.html#fs_class_fs_stats | ||||||
|                 size: string.length |                 stat: { | ||||||
|             } |                     size: string.length, | ||||||
|         })); |                 }, | ||||||
|  |             }), | ||||||
|  |         ); | ||||||
|         this.push(null); |         this.push(null); | ||||||
|     } |     }; | ||||||
|     return src |     return src; | ||||||
| } | } | ||||||
|  |  | ||||||
| var build = { | var build = { | ||||||
|     js: function (files, bundle) { |     js: function(files, bundle) { | ||||||
|         for (var key in files) { |         for (var key in files) { | ||||||
|             (function(key) { |             (function(key) { | ||||||
|                 var name = "js-" + key; |                 var name = 'js-' + key; | ||||||
|                 tasks.js.push(name); |                 tasks.js.push(name); | ||||||
|  |  | ||||||
|                 gulp.task(name, function () { |                 gulp.task(name, function() { | ||||||
|                     return gulp |                     return gulp | ||||||
|                         .src(bundles[bundle].js[key]) |                         .src(bundles[bundle].js[key]) | ||||||
|                         .pipe(concat(key)) |                         .pipe(concat(key)) | ||||||
|                         .pipe(uglify()) |                         .pipe(uglify().on('error', gutil.log)) | ||||||
|                         .pipe(gulp.dest(paths[bundle].output)); |                         .pipe(gulp.dest(paths[bundle].output)); | ||||||
|                 }); |                 }); | ||||||
|             })(key); |             })(key); | ||||||
| @ -116,17 +115,17 @@ var build = { | |||||||
|     }, |     }, | ||||||
|     less: function(files, bundle) { |     less: function(files, bundle) { | ||||||
|         for (var key in files) { |         for (var key in files) { | ||||||
|             (function (key) { |             (function(key) { | ||||||
|                 var name = "less-" + key; |                 var name = 'less-' + key; | ||||||
|                 tasks.less.push(name); |                 tasks.less.push(name); | ||||||
|  |  | ||||||
|                 gulp.task(name, function () { |                 gulp.task(name, function() { | ||||||
|                     return gulp |                     return gulp | ||||||
|                         .src(bundles[bundle].less[key]) |                         .src(bundles[bundle].less[key]) | ||||||
|                         .pipe(less()) |                         .pipe(less()) | ||||||
|                         .on("error", gutil.log) |                         .on('error', gutil.log) | ||||||
|                         .pipe(concat(key)) |                         .pipe(concat(key)) | ||||||
|                         .pipe(prefix(["last 2 versions"], { cascade: true })) |                         .pipe(prefix(['last 2 versions'], { cascade: true })) | ||||||
|                         .pipe(cleanCSS()) |                         .pipe(cleanCSS()) | ||||||
|                         .pipe(gulp.dest(paths[bundle].output)); |                         .pipe(gulp.dest(paths[bundle].output)); | ||||||
|                 }); |                 }); | ||||||
| @ -135,17 +134,17 @@ var build = { | |||||||
|     }, |     }, | ||||||
|     scss: function(files, bundle) { |     scss: function(files, bundle) { | ||||||
|         for (var key in files) { |         for (var key in files) { | ||||||
|             (function (key) { |             (function(key) { | ||||||
|                 var name = "scss-" + key; |                 var name = 'scss-' + key; | ||||||
|                 tasks.scss.push(name); |                 tasks.scss.push(name); | ||||||
|  |  | ||||||
|                 gulp.task(name, function () { |                 gulp.task(name, function() { | ||||||
|                     return gulp |                     return gulp | ||||||
|                         .src(bundles[bundle].scss[key]) |                         .src(bundles[bundle].scss[key]) | ||||||
|                         .pipe(sass()) |                         .pipe(sass()) | ||||||
|                         .on("error", gutil.log) |                         .on('error', gutil.log) | ||||||
|                         .pipe(concat(key)) |                         .pipe(concat(key)) | ||||||
|                         .pipe(prefix(["last 2 versions"], { cascade: true })) |                         .pipe(prefix(['last 2 versions'], { cascade: true })) | ||||||
|                         .pipe(cleanCSS()) |                         .pipe(cleanCSS()) | ||||||
|                         .pipe(gulp.dest(paths[bundle].output)); |                         .pipe(gulp.dest(paths[bundle].output)); | ||||||
|                 }); |                 }); | ||||||
| @ -153,48 +152,52 @@ var build = { | |||||||
|         } |         } | ||||||
|     }, |     }, | ||||||
|     sprite: function(bundle) { |     sprite: function(bundle) { | ||||||
|         var name = "sprite-" + bundle; |         var name = 'sprite-' + bundle; | ||||||
|         tasks.sprite.push(name); |         tasks.sprite.push(name); | ||||||
|  |  | ||||||
|         // Process Icons |         // Process Icons | ||||||
|         gulp.task(name, function () { |         gulp.task(name, function() { | ||||||
|             return gulp |             return gulp | ||||||
|                 .src(paths[bundle].src.sprite) |                 .src(paths[bundle].src.sprite) | ||||||
|                 .pipe(svgmin({ |                 .pipe( | ||||||
|                     plugins: [{ |                     svgmin({ | ||||||
|                         removeDesc: true |                         plugins: [ | ||||||
|                     }] |                             { | ||||||
|                 })) |                                 removeDesc: true, | ||||||
|  |                             }, | ||||||
|  |                         ], | ||||||
|  |                     }), | ||||||
|  |                 ) | ||||||
|                 .pipe(svgstore()) |                 .pipe(svgstore()) | ||||||
|                 .pipe(rename({ basename: bundle })) |                 .pipe(rename({ basename: bundle })) | ||||||
|                 .pipe(gulp.dest(paths[bundle].output)); |                 .pipe(gulp.dest(paths[bundle].output)); | ||||||
|         }); |         }); | ||||||
|     } |     }, | ||||||
| }; | }; | ||||||
|  |  | ||||||
| // Plyr core files | // Plyr core files | ||||||
| build.js(bundles.plyr.js, "plyr"); | build.js(bundles.plyr.js, 'plyr'); | ||||||
| build.less(bundles.plyr.less, "plyr"); | build.less(bundles.plyr.less, 'plyr'); | ||||||
| build.scss(bundles.plyr.scss, "plyr"); | build.scss(bundles.plyr.scss, 'plyr'); | ||||||
| build.sprite("plyr"); | build.sprite('plyr'); | ||||||
|  |  | ||||||
| // Demo files | // Demo files | ||||||
| build.less(bundles.demo.less, "demo"); | build.less(bundles.demo.less, 'demo'); | ||||||
| build.js(bundles.demo.js, "demo"); | build.js(bundles.demo.js, 'demo'); | ||||||
| build.sprite("demo"); | build.sprite('demo'); | ||||||
|  |  | ||||||
| // Build all JS | // Build all JS | ||||||
| gulp.task("js", function(){ | gulp.task('js', function() { | ||||||
|     run(tasks.js); |     run(tasks.js); | ||||||
| }); | }); | ||||||
|  |  | ||||||
| // Build SCSS (for testing, default is LESS) | // Build SCSS (for testing, default is LESS) | ||||||
| gulp.task("scss", function(){ | gulp.task('scss', function() { | ||||||
|     run(tasks.scss); |     run(tasks.scss); | ||||||
| }); | }); | ||||||
|  |  | ||||||
| // Watch for file changes | // Watch for file changes | ||||||
| gulp.task("watch", function () { | gulp.task('watch', function() { | ||||||
|     // Plyr core |     // Plyr core | ||||||
|     gulp.watch(paths.plyr.src.js, tasks.js); |     gulp.watch(paths.plyr.src.js, tasks.js); | ||||||
|     gulp.watch(paths.plyr.src.less, tasks.less); |     gulp.watch(paths.plyr.src.less, tasks.less); | ||||||
| @ -207,131 +210,144 @@ gulp.task("watch", function () { | |||||||
| }); | }); | ||||||
|  |  | ||||||
| // Default gulp task | // Default gulp task | ||||||
| gulp.task("default", function(){ | gulp.task('default', function() { | ||||||
|     run(tasks.js, tasks.less, tasks.sprite, "watch"); |     run(tasks.js, tasks.less, tasks.sprite, 'watch'); | ||||||
| }); | }); | ||||||
|  |  | ||||||
| // Publish a version to CDN and demo | // Publish a version to CDN and demo | ||||||
| // -------------------------------------------- | // -------------------------------------------- | ||||||
|  |  | ||||||
| // Some options | // Some options | ||||||
| var aws = loadJSON(path.join(root, "aws.json")), | var aws = loadJSON(path.join(root, 'aws.json')), | ||||||
| version = package.version, |     version = package.version, | ||||||
| maxAge  = 31536000, // seconds 1 year |     maxAge = 31536000, // seconds 1 year | ||||||
| options = { |     options = { | ||||||
|     cdn: { |         cdn: { | ||||||
|         headers: { |  | ||||||
|             "Cache-Control": "max-age=" + maxAge, |  | ||||||
|             "Vary": "Accept-Encoding" |  | ||||||
|         } |  | ||||||
|     }, |  | ||||||
|     demo: { |  | ||||||
|         headers: { |  | ||||||
|             "Cache-Control": "no-cache, no-store, must-revalidate, max-age=0", |  | ||||||
|             "Vary": "Accept-Encoding" |  | ||||||
|         } |  | ||||||
|     }, |  | ||||||
|     symlinks: function(version, filename) { |  | ||||||
|         return { |  | ||||||
|             headers: { |             headers: { | ||||||
|                 // http://stackoverflow.com/questions/2272835/amazon-s3-object-redirect |                 'Cache-Control': 'max-age=' + maxAge, | ||||||
|                 "x-amz-website-redirect-location": "/" + version + "/" + filename, |                 Vary: 'Accept-Encoding', | ||||||
|                 "Cache-Control": "no-cache, no-store, must-revalidate, max-age=0" |             }, | ||||||
|             } |         }, | ||||||
|         } |         demo: { | ||||||
|     } |             headers: { | ||||||
| }; |                 'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0', | ||||||
|  |                 Vary: 'Accept-Encoding', | ||||||
|  |             }, | ||||||
|  |         }, | ||||||
|  |         symlinks: function(version, filename) { | ||||||
|  |             return { | ||||||
|  |                 headers: { | ||||||
|  |                     // http://stackoverflow.com/questions/2272835/amazon-s3-object-redirect | ||||||
|  |                     'x-amz-website-redirect-location': '/' + version + '/' + filename, | ||||||
|  |                     'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0', | ||||||
|  |                 }, | ||||||
|  |             }; | ||||||
|  |         }, | ||||||
|  |     }; | ||||||
|  |  | ||||||
| // If aws is setup | // If aws is setup | ||||||
| if("cdn" in aws) { | if ('cdn' in aws) { | ||||||
|     var regex       = "(?:0|[1-9][0-9]*)\\.(?:0|[1-9][0-9]*)\.(?:0|[1-9][0-9]*)(?:-[\\da-z\\-]+(?:\.[\\da-z\\-]+)*)?(?:\\+[\\da-z\\-]+(?:\.[\\da-z\\-]+)*)?", |     var regex = '(?:0|[1-9][0-9]*)\\.(?:0|[1-9][0-9]*).(?:0|[1-9][0-9]*)(?:-[\\da-z\\-]+(?:.[\\da-z\\-]+)*)?(?:\\+[\\da-z\\-]+(?:.[\\da-z\\-]+)*)?', | ||||||
|     cdnpath         = new RegExp(aws.cdn.domain + "\/" + regex, "gi"), |         cdnpath = new RegExp(aws.cdn.domain + '/' + regex, 'gi'), | ||||||
|     semver          = new RegExp("v" + regex, "gi"), |         semver = new RegExp('v' + regex, 'gi'), | ||||||
|     localPath       = new RegExp("(\.\.\/)?dist", "gi"), |         localPath = new RegExp('(../)?dist', 'gi'), | ||||||
|     versionPath     = "https://" + aws.cdn.domain + "/" + version; |         versionPath = 'https://' + aws.cdn.domain + '/' + version; | ||||||
| } | } | ||||||
|  |  | ||||||
| // Publish version to CDN bucket | // Publish version to CDN bucket | ||||||
| gulp.task("cdn", function () { | gulp.task('cdn', function() { | ||||||
|     console.log("Uploading " + version + " to " + aws.cdn.domain + "..."); |     console.log('Uploading ' + version + ' to ' + aws.cdn.domain + '...'); | ||||||
|  |  | ||||||
|     // Upload to CDN |     // Upload to CDN | ||||||
|     return gulp.src(paths.upload) |     return gulp | ||||||
|         .pipe(size({ |         .src(paths.upload) | ||||||
|             showFiles: true, |         .pipe( | ||||||
|             gzip: true |             size({ | ||||||
|         })) |                 showFiles: true, | ||||||
|         .pipe(rename(function (path) { |                 gzip: true, | ||||||
|             path.dirname = path.dirname.replace(".", version); |             }), | ||||||
|         })) |         ) | ||||||
|  |         .pipe( | ||||||
|  |             rename(function(path) { | ||||||
|  |                 path.dirname = path.dirname.replace('.', version); | ||||||
|  |             }), | ||||||
|  |         ) | ||||||
|         .pipe(replace(localPath, versionPath)) |         .pipe(replace(localPath, versionPath)) | ||||||
|         .pipe(s3(aws.cdn, options.cdn)); |         .pipe(s3(aws.cdn, options.cdn)); | ||||||
| }); | }); | ||||||
|  |  | ||||||
| // Publish to demo bucket | // Publish to demo bucket | ||||||
| gulp.task("demo", function () { | gulp.task('demo', function() { | ||||||
|     console.log("Uploading " + version + " demo to " + aws.demo.domain + "..."); |     console.log('Uploading ' + version + ' demo to ' + aws.demo.domain + '...'); | ||||||
|  |  | ||||||
|     // Replace versioned files in readme.md |     // Replace versioned files in readme.md | ||||||
|     gulp.src([root + "/readme.md"]) |     gulp | ||||||
|         .pipe(replace(cdnpath, aws.cdn.domain + "/" + version)) |         .src([root + '/readme.md']) | ||||||
|  |         .pipe(replace(cdnpath, aws.cdn.domain + '/' + version)) | ||||||
|         .pipe(gulp.dest(root)); |         .pipe(gulp.dest(root)); | ||||||
|  |  | ||||||
|     // Replace versioned files in plyr.js |     // Replace versioned files in plyr.js | ||||||
|     gulp.src(path.join(root, "src/js/plyr.js")) |     gulp | ||||||
|         .pipe(replace(semver, "v" + version)) |         .src(path.join(root, 'src/js/plyr.js')) | ||||||
|         .pipe(replace(cdnpath, aws.cdn.domain + "/" + version)) |         .pipe(replace(semver, 'v' + version)) | ||||||
|         .pipe(gulp.dest(path.join(root, "src/js/"))); |         .pipe(replace(cdnpath, aws.cdn.domain + '/' + version)) | ||||||
|  |         .pipe(gulp.dest(path.join(root, 'src/js/'))); | ||||||
|  |  | ||||||
|     // Replace local file paths with remote paths in demo HTML |     // Replace local file paths with remote paths in demo HTML | ||||||
|     // e.g. "../dist/plyr.js" to "https://cdn.plyr.io/x.x.x/plyr.js" |     // e.g. "../dist/plyr.js" to "https://cdn.plyr.io/x.x.x/plyr.js" | ||||||
|     gulp.src([paths.demo.root + "*.html"]) |     gulp | ||||||
|  |         .src([paths.demo.root + '*.html']) | ||||||
|         .pipe(replace(localPath, versionPath)) |         .pipe(replace(localPath, versionPath)) | ||||||
|         .pipe(s3(aws.demo, options.demo)); |         .pipe(s3(aws.demo, options.demo)); | ||||||
|  |  | ||||||
|     // Upload error.html to cdn (as well as demo site) |     // Upload error.html to cdn (as well as demo site) | ||||||
|     return gulp.src([paths.demo.root + "error.html"]) |     return gulp | ||||||
|  |         .src([paths.demo.root + 'error.html']) | ||||||
|         .pipe(replace(localPath, versionPath)) |         .pipe(replace(localPath, versionPath)) | ||||||
|         .pipe(s3(aws.cdn, options.demo)); |         .pipe(s3(aws.cdn, options.demo)); | ||||||
| }); | }); | ||||||
|  |  | ||||||
| // Open the demo site to check it's sweet | // Open the demo site to check it's sweet | ||||||
| gulp.task("symlinks", function () { | gulp.task('symlinks', function() { | ||||||
|     console.log("Updating symlinks..."); |     console.log('Updating symlinks...'); | ||||||
|  |  | ||||||
|     return gulp.src(paths.upload) |     return gulp.src(paths.upload).pipe( | ||||||
|         .pipe(through.obj(function (chunk, enc, callback) { |         through.obj(function(chunk, enc, callback) { | ||||||
|             if (chunk.stat.isFile()) { |             if (chunk.stat.isFile()) { | ||||||
|                 // Get the filename |                 // Get the filename | ||||||
|                 var filename = chunk.path.split("/").reverse()[0]; |                 var filename = chunk.path.split('/').reverse()[0]; | ||||||
|  |  | ||||||
|                 // Create the 0 byte redirect files to upload |                 // Create the 0 byte redirect files to upload | ||||||
|                 createFile(filename, "") |                 createFile(filename, '') | ||||||
|                     .pipe(rename(function (path) { |                     .pipe( | ||||||
|                         path.dirname = path.dirname.replace(".", "latest"); |                         rename(function(path) { | ||||||
|                     })) |                             path.dirname = path.dirname.replace('.', 'latest'); | ||||||
|  |                         }), | ||||||
|  |                     ) | ||||||
|                     // Upload to S3 with correct headers |                     // Upload to S3 with correct headers | ||||||
|                     .pipe(s3(aws.cdn, options.symlinks(version, filename))); |                     .pipe(s3(aws.cdn, options.symlinks(version, filename))); | ||||||
|             } |             } | ||||||
|  |  | ||||||
|             callback(null, chunk); |             callback(null, chunk); | ||||||
|         })); |         }), | ||||||
|  |     ); | ||||||
| }); | }); | ||||||
|  |  | ||||||
| // Open the demo site to check it's sweet | // Open the demo site to check it's sweet | ||||||
| gulp.task("open", function () { | gulp.task('open', function() { | ||||||
|     console.log("Opening " + aws.demo.domain + "..."); |     console.log('Opening ' + aws.demo.domain + '...'); | ||||||
|  |  | ||||||
|     // A file must be specified or gulp will skip the task |     // A file must be specified or gulp will skip the task | ||||||
|     // Doesn't matter which file since we set the URL above |     // Doesn't matter which file since we set the URL above | ||||||
|     // Weird, I know... |     // Weird, I know... | ||||||
|     return gulp.src([paths.demo.root + "index.html"]) |     return gulp.src([paths.demo.root + 'index.html']).pipe( | ||||||
|         .pipe(open("", { |         open('', { | ||||||
|             url: "http://" + aws.demo.domain |             url: 'http://' + aws.demo.domain, | ||||||
|         })); |         }), | ||||||
|  |     ); | ||||||
| }); | }); | ||||||
|  |  | ||||||
| // Do everything | // Do everything | ||||||
| gulp.task("publish", function () { | gulp.task('publish', function() { | ||||||
|     run(tasks.js, tasks.less, tasks.sprite, "cdn", "demo", "symlinks"); |     run(tasks.js, tasks.less, tasks.sprite, 'cdn', 'demo', 'symlinks'); | ||||||
| }); | }); | ||||||
|  | |||||||
							
								
								
									
										4604
									
								
								package-lock.json
									
									
									
										generated
									
									
									
										Normal file
									
								
							
							
						
						
									
										4604
									
								
								package-lock.json
									
									
									
										generated
									
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							
							
								
								
									
										40
									
								
								package.json
									
									
									
									
									
								
							
							
						
						
									
										40
									
								
								package.json
									
									
									
									
									
								
							| @ -1,30 +1,38 @@ | |||||||
| { | { | ||||||
|     "name": "plyr", |     "name": "plyr", | ||||||
|     "version": "2.0.16", |     "version": "2.0.17", | ||||||
|     "description": "A simple, accessible and customizable HTML5, YouTube and Vimeo media player", |     "description": "A simple, accessible and customizable HTML5, YouTube and Vimeo media player", | ||||||
|     "homepage": "http://plyr.io", |     "homepage": "http://plyr.io", | ||||||
|     "main": "src/js/plyr.js", |     "main": "src/js/plyr.js", | ||||||
|     "dependencies": {}, |     "dependencies": {}, | ||||||
|     "devDependencies": { |     "devDependencies": { | ||||||
|         "gulp": "^3.9.1", |         "gulp": "^3.9.1", | ||||||
|         "gulp-autoprefixer": "^3.1.0", |         "gulp-autoprefixer": "^4.0.0", | ||||||
|         "gulp-clean-css": "^2.0.6", |         "gulp-clean-css": "^3.9.0", | ||||||
|         "gulp-concat": "^2.3.3", |         "gulp-concat": "^2.6.1", | ||||||
|         "gulp-less": "^3.0.5", |         "gulp-less": "^3.3.2", | ||||||
|         "gulp-open": "^2.0.0", |         "gulp-open": "^2.0.0", | ||||||
|         "gulp-rename": "^1.2.0", |         "gulp-rename": "^1.2.2", | ||||||
|         "gulp-replace": "^0.5.3", |         "gulp-replace": "^0.6.1", | ||||||
|         "gulp-s3": "^0.3.0", |         "gulp-s3": "^0.11.0", | ||||||
|         "gulp-sass": "^2.3.1", |         "gulp-sass": "^3.1.0", | ||||||
|         "gulp-size": "^2.1.0", |         "gulp-size": "^2.1.0", | ||||||
|         "gulp-svgmin": "^1.2.2", |         "gulp-svgmin": "^1.2.4", | ||||||
|         "gulp-svgstore": "^5.0.5", |         "gulp-svgstore": "^6.1.0", | ||||||
|         "gulp-uglify": "^1.5.3", |         "gulp-uglify": "^3.0.0", | ||||||
|         "gulp-util": "^3.0.7", |         "gulp-util": "^3.0.8", | ||||||
|         "run-sequence": "^1.1.5", |         "run-sequence": "^2.2.0", | ||||||
|         "through2": "^2.0.1" |         "through2": "^2.0.3" | ||||||
|     }, |     }, | ||||||
|     "keywords": ["HTML5 Video", "HTML5 Audio", "Media Player", "DASH", "Shaka", "WordPress", "HLS"], |     "keywords": [ | ||||||
|  |         "HTML5 Video", | ||||||
|  |         "HTML5 Audio", | ||||||
|  |         "Media Player", | ||||||
|  |         "DASH", | ||||||
|  |         "Shaka", | ||||||
|  |         "WordPress", | ||||||
|  |         "HLS" | ||||||
|  |     ], | ||||||
|     "repository": { |     "repository": { | ||||||
|         "type": "git", |         "type": "git", | ||||||
|         "url": "git://github.com/sampotts/plyr.git" |         "url": "git://github.com/sampotts/plyr.git" | ||||||
|  | |||||||
| @ -137,7 +137,7 @@ Include the `plyr.js` script before the closing `</body>` tag and then call `ply | |||||||
| If you want to use our CDN (provided by [Fastly](https://www.fastly.com/)) for the JavaScript, you can use the following: | If you want to use our CDN (provided by [Fastly](https://www.fastly.com/)) for the JavaScript, you can use the following: | ||||||
|  |  | ||||||
| ```html | ```html | ||||||
| <script src="https://cdn.plyr.io/2.0.16/plyr.js"></script> | <script src="https://cdn.plyr.io/2.0.17/plyr.js"></script> | ||||||
| ``` | ``` | ||||||
|  |  | ||||||
| ### CSS | ### CSS | ||||||
| @ -150,11 +150,11 @@ Include the `plyr.css` stylsheet into your `<head>` | |||||||
| If you want to use our CDN (provided by [Fastly](https://www.fastly.com/)) for the default CSS, you can use the following: | If you want to use our CDN (provided by [Fastly](https://www.fastly.com/)) for the default CSS, you can use the following: | ||||||
|  |  | ||||||
| ```html | ```html | ||||||
| <link rel="stylesheet" href="https://cdn.plyr.io/2.0.16/plyr.css"> | <link rel="stylesheet" href="https://cdn.plyr.io/2.0.17/plyr.css"> | ||||||
| ``` | ``` | ||||||
|  |  | ||||||
| ### SVG Sprite | ### SVG Sprite | ||||||
| The SVG sprite is loaded automatically from our CDN (provided by [Fastly](https://www.fastly.com/)). To change this, see the [options](#options) below. For reference, the CDN hosted SVG sprite can be found at `https://cdn.plyr.io/2.0.16/plyr.svg`. | The SVG sprite is loaded automatically from our CDN (provided by [Fastly](https://www.fastly.com/)). To change this, see the [options](#options) below. For reference, the CDN hosted SVG sprite can be found at `https://cdn.plyr.io/2.0.17/plyr.svg`. | ||||||
|  |  | ||||||
| ## Advanced | ## Advanced | ||||||
|  |  | ||||||
|  | |||||||
							
								
								
									
										1127
									
								
								src/js/plyr.js
									
									
									
									
									
								
							
							
						
						
									
										1127
									
								
								src/js/plyr.js
									
									
									
									
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							| @ -3,8 +3,8 @@ | |||||||
| // https://github.com/selz/plyr | // https://github.com/selz/plyr | ||||||
| // ========================================================================== | // ========================================================================== | ||||||
|  |  | ||||||
| @import "variables"; | @import 'variables'; | ||||||
| @import "mixins"; | @import 'mixins'; | ||||||
|  |  | ||||||
| // Animation | // Animation | ||||||
| // --------------------------------------- | // --------------------------------------- | ||||||
| @ -61,15 +61,15 @@ | |||||||
|  |  | ||||||
|     // Range inputs |     // Range inputs | ||||||
|     // Specificity is for bootstrap compatibility |     // Specificity is for bootstrap compatibility | ||||||
|     input[type="range"] { |     input[type='range'] { | ||||||
|         display: block; |         display: block; | ||||||
|         height: (@plyr-range-thumb-height * @plyr-range-thumb-active-scale); |         height: (@plyr-range-thumb-height * @plyr-range-thumb-active-scale); | ||||||
|         width: 100%; |         width: 100%; | ||||||
|         margin: 0; |         margin: 0; | ||||||
|         padding: 0; |         padding: 0; | ||||||
|         vertical-align: middle; |  | ||||||
|  |  | ||||||
|         appearance: none; |         -webkit-appearance: none; | ||||||
|  |         -moz-appearance: none; | ||||||
|         cursor: pointer; |         cursor: pointer; | ||||||
|         border: none; |         border: none; | ||||||
|         background: transparent; |         background: transparent; | ||||||
| @ -142,12 +142,12 @@ | |||||||
| } | } | ||||||
|  |  | ||||||
| // Video range inputs | // Video range inputs | ||||||
| .plyr--video input[type="range"].tab-focus:focus { | .plyr--video input[type='range'].tab-focus:focus { | ||||||
|     outline: 1px dotted fade(@plyr-video-control-color, 50%); |     outline: 1px dotted fade(@plyr-video-control-color, 50%); | ||||||
| } | } | ||||||
|  |  | ||||||
| // Audio range inputs | // Audio range inputs | ||||||
| .plyr--audio input[type="range"].tab-focus:focus { | .plyr--audio input[type='range'].tab-focus:focus { | ||||||
|     outline: 1px dotted fade(@plyr-audio-control-color, 50%); |     outline: 1px dotted fade(@plyr-audio-control-color, 50%); | ||||||
| } | } | ||||||
|  |  | ||||||
| @ -292,7 +292,7 @@ | |||||||
|     .plyr__volume { |     .plyr__volume { | ||||||
|         margin-left: (@plyr-control-spacing / 2); |         margin-left: (@plyr-control-spacing / 2); | ||||||
|     } |     } | ||||||
|     [data-plyr="pause"] { |     [data-plyr='pause'] { | ||||||
|         margin-left: 0; |         margin-left: 0; | ||||||
|     } |     } | ||||||
|  |  | ||||||
| @ -428,11 +428,11 @@ | |||||||
| } | } | ||||||
|  |  | ||||||
| // States | // States | ||||||
| .plyr__controls [data-plyr="pause"], | .plyr__controls [data-plyr='pause'], | ||||||
| .plyr--playing .plyr__controls [data-plyr="play"] { | .plyr--playing .plyr__controls [data-plyr='play'] { | ||||||
|     display: none; |     display: none; | ||||||
| } | } | ||||||
| .plyr--playing .plyr__controls [data-plyr="pause"] { | .plyr--playing .plyr__controls [data-plyr='pause'] { | ||||||
|     display: inline-block; |     display: inline-block; | ||||||
| } | } | ||||||
|  |  | ||||||
| @ -448,12 +448,12 @@ | |||||||
| } | } | ||||||
|  |  | ||||||
| // Some options are hidden by default | // Some options are hidden by default | ||||||
| .plyr [data-plyr="captions"], | .plyr [data-plyr='captions'], | ||||||
| .plyr [data-plyr="fullscreen"] { | .plyr [data-plyr='fullscreen'] { | ||||||
|     display: none; |     display: none; | ||||||
| } | } | ||||||
| .plyr--captions-enabled [data-plyr="captions"], | .plyr--captions-enabled [data-plyr='captions'], | ||||||
| .plyr--fullscreen-enabled [data-plyr="fullscreen"] { | .plyr--fullscreen-enabled [data-plyr='fullscreen'] { | ||||||
|     display: inline-block; |     display: inline-block; | ||||||
| } | } | ||||||
|  |  | ||||||
| @ -481,7 +481,7 @@ | |||||||
|  |  | ||||||
|     &::before { |     &::before { | ||||||
|         // Arrows |         // Arrows | ||||||
|         content: ""; |         content: ''; | ||||||
|         position: absolute; |         position: absolute; | ||||||
|         width: 0; |         width: 0; | ||||||
|         height: 0; |         height: 0; | ||||||
| @ -547,7 +547,7 @@ | |||||||
|     display: none; |     display: none; | ||||||
|     flex: 1; |     flex: 1; | ||||||
|  |  | ||||||
|     input[type="range"] { |     input[type='range'] { | ||||||
|         position: relative; |         position: relative; | ||||||
|         z-index: 2; |         z-index: 2; | ||||||
|  |  | ||||||
| @ -582,7 +582,8 @@ | |||||||
|     margin: -(@plyr-range-track-height / 2) 0 0; |     margin: -(@plyr-range-track-height / 2) 0 0; | ||||||
|     padding: 0; |     padding: 0; | ||||||
|     vertical-align: top; |     vertical-align: top; | ||||||
|     appearance: none; |     -webkit-appearance: none; | ||||||
|  |     -moz-appearance: none; | ||||||
|     border: none; |     border: none; | ||||||
|     border-radius: 100px; |     border-radius: 100px; | ||||||
|  |  | ||||||
| @ -695,7 +696,7 @@ | |||||||
|  |  | ||||||
|     // Add a slash in before |     // Add a slash in before | ||||||
|     &::before { |     &::before { | ||||||
|         content: "\2044"; |         content: '\2044'; | ||||||
|         margin-right: @plyr-control-spacing; |         margin-right: @plyr-control-spacing; | ||||||
|     } |     } | ||||||
| } | } | ||||||
| @ -709,7 +710,7 @@ | |||||||
|     flex: 1; |     flex: 1; | ||||||
|     position: relative; |     position: relative; | ||||||
|  |  | ||||||
|     input[type="range"] { |     input[type='range'] { | ||||||
|         position: relative; |         position: relative; | ||||||
|         z-index: 2; |         z-index: 2; | ||||||
|     } |     } | ||||||
| @ -726,7 +727,7 @@ | |||||||
| // It's not supported to change volume using JavaScript: | // It's not supported to change volume using JavaScript: | ||||||
| // https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html | // https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html | ||||||
| .plyr--is-ios .plyr__volume, | .plyr--is-ios .plyr__volume, | ||||||
| .plyr--is-ios [data-plyr="mute"] { | .plyr--is-ios [data-plyr='mute'] { | ||||||
|     display: none !important; |     display: none !important; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | |||||||
		Reference in New Issue
	
	Block a user