|
|
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;">
| |
| </div>
| |
| <script type="text/javascript"> | | <script type="text/javascript"> |
| //var image=</html>{{{loadingimage}}}<html> optional
| | alert('aaa'); |
| 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> | | </script> |
| </html> | | </html> |