Personal tools

Difference between revisions of "Template:Loading"

From referenceTSS

Jump to: navigation, search
(Created page with "<html> <div id="loader" class="hiddeable" style="display:none; position: fixed; top: 0; right: 0; width: 100%; height: 100%; z-index: 1; background: transparent;"> </div> <scr...")
 
m (Replaced content with "<html> <script>var a= 1;</script> </html>")
Line 1: Line 1:
 
<html>
 
<html>
<div id="loader" class="hiddeable" style="display:none; position: fixed; top: 0; right: 0; width: 100%; height: 100%; z-index: 1; background: transparent;">
+
<script>var a= 1;</script>
</div>
 
<script type="text/javascript">
 
//var image=</html>{{{loadingimage}}}<html> optional
 
var cSpeed=10;
 
var cWidth=55;
 
var cHeight=55;
 
var cTotalFrames=18;
 
var cFrameWidth=55;
 
var cImageSrc='/resource_browser/images/LoaderGifs/sprites.gif'; //default but optional with Template
 
 
var cImageTimeout=false;
 
var cIndex=0;
 
var cXpos=0;
 
var cPreloaderTimeout=false;
 
var SECONDS_BETWEEN_FRAMES=0;
 
 
 
function startAnimation(){
 
 
document.getElementById('loader').style.backgroundImage='url('+cImageSrc+')';
 
document.getElementById('loader').style.width=cWidth+'px';
 
document.getElementById('loader').style.height=cHeight+'px';
 
 
//FPS = Math.round(100/(maxSpeed+2-speed));
 
FPS = Math.round(100/cSpeed);
 
SECONDS_BETWEEN_FRAMES = 1 / FPS;
 
 
cPreloaderTimeout=setTimeout('continueAnimation()', SECONDS_BETWEEN_FRAMES/1000);
 
 
}
 
 
function continueAnimation(){
 
 
cXpos += cFrameWidth;
 
//increase the index so we know which frame of our animation we are currently on
 
cIndex += 1;
 
 
//if our cIndex is higher than our total number of frames, we're at the end and should restart
 
if (cIndex >= cTotalFrames) {
 
cXpos =0;
 
cIndex=0;
 
}
 
 
if(document.getElementById('loader'))
 
document.getElementById('loader').style.backgroundPosition=(-cXpos)+'px 0';
 
 
cPreloaderTimeout=setTimeout('continueAnimation()', SECONDS_BETWEEN_FRAMES*1000);
 
}
 
 
function stopAnimation(){//stops animation
 
clearTimeout(cPreloaderTimeout);
 
cPreloaderTimeout=false;
 
}
 
 
function imageLoader(s, fun)//Pre-loads the sprites image
 
{
 
clearTimeout(cImageTimeout);
 
cImageTimeout=0;
 
genImage = new Image();
 
genImage.onload=function (){cImageTimeout=setTimeout(fun, 0)};
 
genImage.onerror=new Function('alert(\'Could not load the image\')');
 
genImage.src=s;
 
}
 
 
//The following code starts the animation
 
new imageLoader(cImageSrc, 'startAnimation()');
 
 
 
$(document).ready(function() {
 
 
 
//var loading_image="</html>{{{loadingimage}}}<html>";
 
 
 
 
 
 
 
$(document).on("click", "a", function() {
 
    //this == the link that was clicked
 
    var href = $(this).attr("href");
 
    if(href!=null){
 
    var url=String(href);
 
    if(String(href).indexOf("resource_browser")!=-1){
 
      if(String(href).length>2){
 
              toggle_visibility('loader');
 
   
 
      }else{
 
      }
 
    }else{
 
    }
 
}else{
 
}
 
});
 
 
 
 
 
function toggle_visibility(id) {
 
        var thelist = $('.hiddeable');
 
    for (var i = 0; i < thelist.length; i++) {
 
    thelist[i].style.display = 'none';
 
    }
 
    var e = $('#loader')[0];
 
    if(e.style.display == 'block') {
 
    e.style.display = 'none';
 
    } else {
 
    e.style.display = 'block';
 
    }
 
    }
 
});
 
</script>
 
 
</html>
 
</html>

Revision as of 16:08, 13 December 2017