From 97dbca262ec430848ca4492c1c4a777ec8c9da75 Mon Sep 17 00:00:00 2001 From: riccardo Date: Tue, 7 Jun 2011 13:54:15 +0200 Subject: [PATCH] fixed cleartimeout in popup automatic close --- telemeta/htdocs/js/playerLoader.js | 52 +++-- telemeta/htdocs/js/popupdiv.js | 209 ++++++++++-------- .../telemeta_default/mediaitem_detail.html | 1 - 3 files changed, 143 insertions(+), 119 deletions(-) diff --git a/telemeta/htdocs/js/playerLoader.js b/telemeta/htdocs/js/playerLoader.js index 78de7ace..d530364f 100644 --- a/telemeta/htdocs/js/playerLoader.js +++ b/telemeta/htdocs/js/playerLoader.js @@ -56,27 +56,32 @@ function togglePlayerMaximization() { } } -//end(''): clears loading span, if any -//end('msg') if loading span is there, clear loading span. If loading span is there, display alert msg -function end(optionalErrorMsg){ - var $ = jQuery; - $(window).ready(function(){ - var elm = $('#loading_span'); - if(elm.length<1){ - return; - } - elm.empty().remove(); - if(optionalErrorMsg){ - $('#rightcol').hide(); - alert(optionalErrorMsg); - } - }); -} function loadPlayer(analizerUrl, soundUrl, itemId, visualizers, currentUserName, isStaffOrSuperuser){ var $J = jQuery; var wdw = window; + + + //end(''): clears loading span, if any + //end('msg') if loading span is there, clear loading span. If loading span is there, display alert msg + + function end(optionalErrorMsg){ + //var $J = jQuery; + $J(wdw).ready(function(){ + var elm = $J('#loading_span'); + if(elm.length<1){ + return; + } + elm.empty().remove(); + if(optionalErrorMsg){ + $J('#rightcol').hide(); + alert(optionalErrorMsg); + } + }); + } + + //grab the case of soundManager init errors: soundManager.onerror = function() { end('SoundManager error. If your browser does not support HTML5, Flash player (version '+soundManager.flashVersion+'+) must be installed.\nIf flash is installed, try to:\n - Reload the page\n - Empty the cache (see browser preferences/options/tools) and reload the page\n - Restart the browser'); @@ -373,17 +378,24 @@ function loadPlayer(analizerUrl, soundUrl, itemId, visualizers, currentUserName, invoker: player.getContainer().find('.ts-wave'), defaultCloseOperation: 'hide' }); + var closeTimeout = undefined; + var ci = clearTimeout; player.bind('markerCrossed',function(data){ + if(closeTimeout !== undefined){ + cl(closeTimeout); + } + closeTimeout=undefined; popupdiv.refresh(data.marker.desc,data.marker.title); + if(!popupdiv.isShowing()){ + popupdiv.show(); + } var index = data.index; if(index+1 == map.length || map.toArray()[index+1].offset-data.marker.offset>3){ - popupdiv.closeLater(3000); + closeTimeout = popupdiv.setTimeout('close',3000); } //consolelog('firing markercrossed'); //consolelog(data.marker.title); - if(!popupdiv.isShowing()){ - popupdiv.show(); - } + }); } diff --git a/telemeta/htdocs/js/popupdiv.js b/telemeta/htdocs/js/popupdiv.js index 50b46888..ad5c39b4 100644 --- a/telemeta/htdocs/js/popupdiv.js +++ b/telemeta/htdocs/js/popupdiv.js @@ -612,16 +612,16 @@ function PopupDiv(){ //set title and close button to span whole width, if necessary //closeButton.outerWidth should be zero if this.showClose = false //titleInput.outerWidth(true) should be equal to titleInput.width(), as margins borders and padding are zero, however we want to calculate it safely -// if(this.showClose || this.title){ -// var topDiv = this.getDiv().children().eq(0); -// var closeBtn = topDiv.find('a').eq(0); -// var titleInput = topDiv.find(':text').eq(0); -// var titleW = topDiv.width() - closeBtn.outerWidth(true) - (titleInput.outerWidth(true)-titleInput.width()); -// titleInput.css({ -// 'maxWidth':'', -// 'width':(titleW)+'px' -// }); -// } + // if(this.showClose || this.title){ + // var topDiv = this.getDiv().children().eq(0); + // var closeBtn = topDiv.find('a').eq(0); + // var titleInput = topDiv.find(':text').eq(0); + // var titleW = topDiv.width() - closeBtn.outerWidth(true) - (titleInput.outerWidth(true)-titleInput.width()); + // titleInput.css({ + // 'maxWidth':'', + // 'width':(titleW)+'px' + // }); + // } this.shadow(); //updates shadow if(focusable){ @@ -644,16 +644,16 @@ function PopupDiv(){ node.nodeValue = title; } -// var titleIpt = subdiv.find(':text').hide(); -// var titleSpan = subdiv.find('span').css({'display':'inline-block','float':'left'}); -// if(title){ -// titleSpan.html(title); -// }else{ -// titleSpan.hide(); -// } -// var titleSpanWidth = titleSpan.html(title).width(); -// titleIpt.val(title).css('width',titleSpanWidth+'px'); -// titleSpan.html('').css('display','none'); + // var titleIpt = subdiv.find(':text').hide(); + // var titleSpan = subdiv.find('span').css({'display':'inline-block','float':'left'}); + // if(title){ + // titleSpan.html(title); + // }else{ + // titleSpan.hide(); + // } + // var titleSpanWidth = titleSpan.html(title).width(); + // titleIpt.val(title).css('width',titleSpanWidth+'px'); + // titleSpan.html('').css('display','none'); } p.isShowing = function(){ @@ -714,7 +714,8 @@ function PopupDiv(){ if(this.showClose){ closeBtn.css('marginLeft','0.5em').attr('class',this.closeButtonClass).html(this.closeButtonTitle).css({ - 'display':'inline-block','float':'right' + 'display':'inline-block', + 'float':'right' //warning: do NOT use real numbers such as 0.5ex cause browsers round it in a different manner //inline-block in order to retrieve/set width and height on the element }); @@ -722,17 +723,17 @@ function PopupDiv(){ closeBtn.hide(); //margin:0 is to be sure, as afterwards we must span the title the whole popup width } //in any case, show titleElement cause even if title="", titleElement is used to position close on the right -// titleInput.css({ -// 'backgroundColor':'transparent', -// 'padding': '0px', -// 'margin':'0px', -// 'border':'0px' -// }).attr('readonly','readonly').attr('class',this.titleClass).css({ -// 'display':'inline-block','float':'left' -// //it is too tricky to set the width of the input spanning the whole title (in case of long titles) -// //we experienced problems in vertical align with the close button, as stated somewhere above. -// //we will use a span (see setTitle below) -// }); + // titleInput.css({ + // 'backgroundColor':'transparent', + // 'padding': '0px', + // 'margin':'0px', + // 'border':'0px' + // }).attr('readonly','readonly').attr('class',this.titleClass).css({ + // 'display':'inline-block','float':'left' + // //it is too tricky to set the width of the input spanning the whole title (in case of long titles) + // //we experienced problems in vertical align with the close button, as stated somewhere above. + // //we will use a span (see setTitle below) + // }); this.setTitle(this.title); } @@ -755,18 +756,18 @@ function PopupDiv(){ bottomDiv.hide(); } -// var centralDiv = $(subdiv[1]); -// //reset properties of the central div -// centralDiv.css({ -// 'overflow':'auto', -// 'maxHeight':'', -// 'maxWidth':'', -// 'minHeight':'', -// 'minWidth':'', -// 'height':'', -// 'width':'', -// 'visibility':'visible' -// }).show(); + // var centralDiv = $(subdiv[1]); + // //reset properties of the central div + // centralDiv.css({ + // 'overflow':'auto', + // 'maxHeight':'', + // 'maxWidth':'', + // 'minHeight':'', + // 'minWidth':'', + // 'height':'', + // 'width':'', + // 'visibility':'visible' + // }).show(); var invoker = this.invoker; @@ -806,31 +807,31 @@ function PopupDiv(){ this.setBoundsInside(invoker, this.bounds, this.boundsExact, true); } -// //set title and close button to span whole width, if necessary -// //closeButton.outerWidth should be zero if this.showClose = false -// //titleInput.outerWidth(true) should be equal to titleInput.width(), as margins borders and padding are zero, however we want to calculate it safely -// if(this.showClose || this.title){ -// var titleW = topDiv.width() - closeBtn.outerWidth(true) - (titleInput.outerWidth(true)-titleInput.width()); -// titleInput.css({ -// 'maxWidth':'', -// 'width':(titleW)+'px' -// }); -// } -// -// //set central div max height ONLY IF NECESSARY (overflow). Until here, the main popup is sized and placed -// //but the central div might overflow -// var height = centralDiv.height(); -// var maxHeight = (div.height()-topDiv.outerHeight(true)-bottomDiv.outerHeight(true)- -// (centralDiv.outerHeight(true)-centralDiv.height())); -// if(maxHeight {% endif %} {% endblock %} -- 2.39.5