handle responsive videos
authorThierry Florac <tflorac@ulthar.net>
Mon, 28 Sep 2020 15:45:00 +0200
changeset 526 d904c24ce798
parent 525 44cbf3df1bc6
child 527 ab116b73446e
handle responsive videos
src/pyams_default_theme/resources/js/pyams-default.js
src/pyams_default_theme/resources/js/pyams-default.min.js
--- a/src/pyams_default_theme/resources/js/pyams-default.js	Wed Sep 23 16:46:35 2020 +0200
+++ b/src/pyams_default_theme/resources/js/pyams-default.js	Mon Sep 28 15:45:00 2020 +0200
@@ -146,6 +146,61 @@
 	});
 
 	/**
+	 * Videos sources updates
+	 *
+	 * Update videos sources based on current screen resolution
+	 */
+	function resetVideosSources() {
+		var videos = $('video');
+		if (videos.length > 0) {
+			var width;
+			if (window.matchMedia === undefined) {
+				width = (window.innerWidth > 0) ? window.innerWidth : screen.width
+			}
+			videos.each(function(idx, elt) {
+				var video = $(elt),
+					position = elt.currentTime || 0,
+					sources = video.data('ams-sources'),
+					loaded = {};
+				if (sources) {
+					video.empty();
+					for (var idxSrc in sources) {
+						if (!sources.hasOwnProperty(idxSrc)) {
+							continue;
+						}
+						var source = sources[idxSrc],
+							type = source.type,
+							condition;
+						if (loaded[type] !== undefined) {
+							continue;
+						}
+						if (window.matchMedia === undefined) {
+							condition = (source.min < width);
+							if (condition && source.max) {
+								condition = (width <= source.max);
+							}
+						} else {
+							var min = source.min ? '(min-device-width: ' + source.min + 'px)' : '',
+								max = source.max ? '(max-device-width: ' + source.max + 'px)' : '',
+								query = min + ((min && max) ? ' and ' : '') + max;
+							condition = window.matchMedia(query).matches;
+						}
+						if (condition) {
+							$('<source>').attr('type', type)
+								.attr('src', source.src)
+								.appendTo(video);
+							loaded[type] = true;
+						}
+					}
+					elt.currentTime = position;
+				}
+			});
+		}
+	}
+	resetVideosSources();
+	window.addEventListener('resize', resetVideosSources);
+
+	/**
 	 * Glossary terms access
 	 */
 	var clickTerm = function() {
--- a/src/pyams_default_theme/resources/js/pyams-default.min.js	Wed Sep 23 16:46:35 2020 +0200
+++ b/src/pyams_default_theme/resources/js/pyams-default.min.js	Mon Sep 28 15:45:00 2020 +0200
@@ -1,1 +1,1 @@
-!function(a,t){"use strict";var e=t.MyAMS;t.PyAMS_default={search:{updateSort:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).val();a('input[name="order_by"]',t).val(e),t.submit()}},updatePageLength:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).val();a('input[name="start"]',t).val(0),a('input[name="length"]',t).val(e),t.submit()}},previousPage:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).parents("ol.pagination").data("ams-current-page"),n=a('input[name="length"]',t).val();a('input[name="start"]',t).val(n*(e-2)),t.submit()}},nextPage:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).parents("ol.pagination").data("ams-current-page"),n=a('input[name="length"]',t).val();a('input[name="start"]',t).val(n*e),t.submit()}},gotoPage:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=parseInt(a(this).text()),n=a('input[name="length"]',t).val();a('input[name="start"]',t).val(n*(e-1)),t.submit()}}}},a(document).on("click",'[data-toggle="lightbox"]',(function(t){t.preventDefault();var n=a(this);e.ajax.check(a.fn.ekkoLightbox,"/--static--/pyams_default_theme/js/ext/ekko-lightbox"+e.devext+".js",(function(){n.ekkoLightbox({wrapping:!1,alwaysShowClose:!0,onContentLoaded:function(){var t=this.element().data("description"),e=this.modal(),n=a(".ekko-lightbox-container",e);a(".description",n).remove(),t&&a("<div></div>").addClass("description").text(t).appendTo(n)}})}))})),a(document).on("click","[data-ams-click-handler]",(function(t){var n=a(this),i=n.data("ams-disabled-handlers");if(!0!==i&&"click"!==i&&"all"!==i){var s=n.data();if(s.amsClickHandler){!0!==s.amsStopPropagation&&!0!==s.amsClickStopPropagation||t.stopPropagation(),!0!==s.amsClickKeepDefault&&t.preventDefault();for(var r=s.amsClickHandler.split(/\s+/),o=0;o<r.length;o++){var l=e.getFunctionByName(r[o]);void 0!==l&&l.call(n,t,s.amsClickHandlerOptions)}}}})),a(document).on("change","[data-ams-change-handler]",(function(t){var n=a(this);if(!n.prop("readonly")){var i=n.data("ams-disabled-handlers");if(!0!==i&&"change"!==i&&"all"!==i){var s=n.data();if(s.amsChangeHandler){!0!==s.amsStopPropagation&&!0!==s.amsChangeStopPropagation||t.stopPropagation(),!0!==s.amsChangeKeepDefault&&t.preventDefault();for(var r=s.amsChangeHandler.split(/\s+/),o=0;o<r.length;o++){var l=e.getFunctionByName(r[o]);void 0!==l&&l.call(n,t,s.amsChangeHandlerOptions)}}}}}));var n=function(){var t=a(".modal >div");t.exists()&&e.dialog.close(t);var i=a(this).data("term")||a(this).text();e.dialog.open("/get-glossary-term.html?term="+i,{},{shown:function(){a(".thesaurus-term").off("click").on("click",n)}})};e.require(["error","ajax","dialog"],(function(){a(".thesaurus-term").off("click").on("click",n)}))}(jQuery,this);
+!function(a,t){"use strict";var e=t.MyAMS;function i(){var t,e=a("video");e.length>0&&(void 0===window.matchMedia&&(t=window.innerWidth>0?window.innerWidth:screen.width),e.each((function(e,i){var n=a(i),r=i.currentTime||0,s=n.data("ams-sources"),o={};if(s){for(var l in n.empty(),s)if(s.hasOwnProperty(l)){var d,c=s[l],m=c.type;if(void 0===o[m]){if(void 0===window.matchMedia)(d=c.min<t)&&c.max&&(d=t<=c.max);else{var u=c.min?"(min-device-width: "+c.min+"px)":"",h=c.max?"(max-device-width: "+c.max+"px)":"",p=u+(u&&h?" and ":"")+h;d=window.matchMedia(p).matches}d&&(a("<source>").attr("type",m).attr("src",c.src).appendTo(n),o[m]=!0)}}i.currentTime=r}})))}t.PyAMS_default={search:{updateSort:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).val();a('input[name="order_by"]',t).val(e),t.submit()}},updatePageLength:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).val();a('input[name="start"]',t).val(0),a('input[name="length"]',t).val(e),t.submit()}},previousPage:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).parents("ol.pagination").data("ams-current-page"),i=a('input[name="length"]',t).val();a('input[name="start"]',t).val(i*(e-2)),t.submit()}},nextPage:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=a(this).parents("ol.pagination").data("ams-current-page"),i=a('input[name="length"]',t).val();a('input[name="start"]',t).val(i*e),t.submit()}},gotoPage:function(){var t=a('form[id="search-results"]');if(t.exists()){var e=parseInt(a(this).text()),i=a('input[name="length"]',t).val();a('input[name="start"]',t).val(i*(e-1)),t.submit()}}}},a(document).on("click",'[data-toggle="lightbox"]',(function(t){t.preventDefault();var i=a(this);e.ajax.check(a.fn.ekkoLightbox,"/--static--/pyams_default_theme/js/ext/ekko-lightbox"+e.devext+".js",(function(){i.ekkoLightbox({wrapping:!1,alwaysShowClose:!0,onContentLoaded:function(){var t=this.element().data("description"),e=this.modal(),i=a(".ekko-lightbox-container",e);a(".description",i).remove(),t&&a("<div></div>").addClass("description").text(t).appendTo(i)}})}))})),a(document).on("click","[data-ams-click-handler]",(function(t){var i=a(this),n=i.data("ams-disabled-handlers");if(!0!==n&&"click"!==n&&"all"!==n){var r=i.data();if(r.amsClickHandler){!0!==r.amsStopPropagation&&!0!==r.amsClickStopPropagation||t.stopPropagation(),!0!==r.amsClickKeepDefault&&t.preventDefault();for(var s=r.amsClickHandler.split(/\s+/),o=0;o<s.length;o++){var l=e.getFunctionByName(s[o]);void 0!==l&&l.call(i,t,r.amsClickHandlerOptions)}}}})),a(document).on("change","[data-ams-change-handler]",(function(t){var i=a(this);if(!i.prop("readonly")){var n=i.data("ams-disabled-handlers");if(!0!==n&&"change"!==n&&"all"!==n){var r=i.data();if(r.amsChangeHandler){!0!==r.amsStopPropagation&&!0!==r.amsChangeStopPropagation||t.stopPropagation(),!0!==r.amsChangeKeepDefault&&t.preventDefault();for(var s=r.amsChangeHandler.split(/\s+/),o=0;o<s.length;o++){var l=e.getFunctionByName(s[o]);void 0!==l&&l.call(i,t,r.amsChangeHandlerOptions)}}}}})),i(),window.addEventListener("resize",i);var n=function(){var t=a(".modal >div");t.exists()&&e.dialog.close(t);var i=a(this).data("term")||a(this).text();e.dialog.open("/get-glossary-term.html?term="+i,{},{shown:function(){a(".thesaurus-term").off("click").on("click",n)}})};e.require(["error","ajax","dialog"],(function(){a(".thesaurus-term").off("click").on("click",n)}))}(jQuery,this);