progress polyfill for IE

This commit is contained in:
onli 2015-01-29 19:48:43 +01:00
parent 100c344a14
commit 9be0364003
4 changed files with 35 additions and 0 deletions

View File

@ -8,6 +8,9 @@
<link rel="stylesheet" href="{$head_link_stylesheet}">
<!--[if lte IE 8]>
<link rel="stylesheet" href="{serendipity_getFile file='admin/oldie.css'}">
<![endif]-->
<!--[if gte IE 8]>
<link rel="stylesheet" href="{serendipity_getFile file='admin/progress-polyfill.css'}">
<![endif]-->
<script src="{serendipity_getFile file='admin/js/modernizr-2.8.3.min.js'}"></script>
{if $admin_vars.admin_installed}{serendipity_hookPlugin hook="backend_header" hookAll="true"}{/if}

View File

@ -0,0 +1,10 @@
// HTML5 Progress polyfill | Jonathan Stipe | https://github.com/jonstipe/progress-polyfill
(function(){(function($){document.createElement('progress');$.fn.html5Progress=function(){var updatePolyfill;updatePolyfill=function(progressElem,progressBarDiv){var amt,max,val,_ref;_ref=$([$(progressElem).attr('max')||'1.0',$(progressElem).attr('value')]).map(function(){if(/^\-?\d+(?:\.\d+)?$/.test(this)){return parseFloat(this);}}).get(),max=_ref[0],val=_ref[1];if(val>max){val=max;}
amt=max>0?(val/max)*100.0:0;progressBarDiv.style.width=amt+"%";return null;};$(this).filter('progress[value]').each(function(){var $elem,attrHandler,attrMutationCallback,attrObserver,progressBarDiv,progressFrameDiv,_this=this;$elem=$(this);progressFrameDiv=document.createElement('div');progressBarDiv=document.createElement('div');progressFrameDiv.appendChild(progressBarDiv);$(progressFrameDiv).addClass('progress-frame');$(progressBarDiv).addClass('progress-bar');updatePolyfill(this,progressBarDiv);this.appendChild(progressFrameDiv);if((typeof WebKitMutationObserver!=="undefined"&&WebKitMutationObserver!==null)||(typeof MutationObserver!=="undefined"&&MutationObserver!==null)){attrMutationCallback=function(mutations,observer){var mutation,_i,_len,_ref;for(_i=0,_len=mutations.length;_i<_len;_i++){mutation=mutations[_i];if(mutation.type==="attributes"&&((_ref=mutation.attributeName)==="value"||_ref==="max")){if($elem.is("[value]")){updatePolyfill(_this,progressBarDiv);}else{$elem.children("div.progress-frame").remove();attrObserver.disconnect();$elem.html5Progress();}}}
return null;};attrObserver=(typeof WebKitMutationObserver!=="undefined"&&WebKitMutationObserver!==null)?new WebKitMutationObserver(attrMutationCallback):((typeof MutationObserver!=="undefined"&&MutationObserver!==null)?new MutationObserver(attrMutationCallback):null);attrObserver.observe(this,{attributes:true,attributeFilter:["value","max"]});}else if(typeof MutationEvent!=="undefined"&&MutationEvent!==null){attrHandler=function(evt){var _ref;if((_ref=evt.originalEvent.attrName)==="value"||_ref==="max"){if($elem.is("[value]")){updatePolyfill(_this,progressBarDiv);}else{$elem.children("div.progress-frame").remove();$elem.off("DOMAttrModified",attrHandler);$elem.html5Progress();}}
return null;};$elem.on("DOMAttrModified",attrHandler);}
return null;});$(this).filter('progress:not([value])').each(function(){var $elem,attrHandler,attrMutationCallback,attrObserver,progressDiv,_this=this;$elem=$(this);progressDiv=document.createElement('div');$(progressDiv).addClass('progress-undefined');this.appendChild(progressDiv);if((typeof WebKitMutationObserver!=="undefined"&&WebKitMutationObserver!==null)||(typeof MutationObserver!=="undefined"&&MutationObserver!==null)){attrMutationCallback=function(mutations,observer){var mutation,_i,_len;for(_i=0,_len=mutations.length;_i<_len;_i++){mutation=mutations[_i];if(mutation.type==="attributes"&&mutation.attributeName==="value"&&$elem.is("[value]")){$elem.children("div.progress-undefined").remove();attrObserver.disconnect();$elem.html5Progress();}}
return null;};attrObserver=(typeof WebKitMutationObserver!=="undefined"&&WebKitMutationObserver!==null)?new WebKitMutationObserver(attrMutationCallback):((typeof MutationObserver!=="undefined"&&MutationObserver!==null)?new MutationObserver(attrMutationCallback):null);attrObserver.observe(this,{attributes:true,attributeFilter:["value"]});}else if(typeof MutationEvent!=="undefined"&&MutationEvent!==null){attrHandler=function(evt){if(evt.originalEvent.attrName==="value"&&$elem.is("[value]")){$elem.children("div.progress-undefined").remove();$elem.off("DOMAttrModified",attrHandler);$elem.html5Progress();}
return null;};$elem.on("DOMAttrModified",attrHandler);}
return null;});return $(this);};$(function(){$('progress').html5Progress();return null;});return null;})(jQuery);}).call(this);

View File

@ -150,6 +150,7 @@
<div id="updateIndicator" />
<progress id="updateProgress" value="0" />
</div>
<script src="{serendipity_getFile file='admin/js/progress-polyfill.min.js'}"></script>
{else}
<h2>{$CONST.CONFIGURE_PLUGINS}</h2>
{if $save}

View File

@ -0,0 +1,21 @@
/*
HTML5 Progress polyfill | Jonathan Stipe | https://github.com/jonstipe/progress-polyfill
*/
progress {
width: 10em; }
progress div.progress-frame {
height: 1em;
width: 100%;
padding: 2px;
border: 1px solid black;
background-color: white; }
progress div.progress-bar {
height: 1em;
border: none;
background-color: #1E90FF; }
progress div.progress-undefined {
height: 1em;
width: 100%;
padding: 2px;
border: 1px solid black;
background-color: #FF9999; }