this._super(div,index);
if(isNew){
this.setEditMode(index,true);
- this.setFocus(index,true);
}
if(index<this.length){
//update indices. Note that this is NOT done at startup as index == this.length ALWAYS
div.detach();
var parent = this.div;
if(to==this.length-1){
- //consolelog('appending '+this.length+' '+parent.children().length+' '+to);
parent.append(div);
}else{
- //consolelog('inserting '+this.length+' '+parent.children().length+' '+to);
this.$J( parent.children()[to] ).before(div);
}
}
//TODO: create a function?
this.setEditMode(to,true);
- this.setFocus(to,true);
return to;
},
//overridden
var e_descriptionText = div.find('.markersdivDescription');
var e_titleText = div.find('.markersdivTitle');
if(value){
- this.debug('setting editmode');
div.css('backgroundColor','#E65911');
e_descriptionText.removeAttr('readonly').removeClass('markersdivUneditable');
e_titleText.removeAttr('readonly').removeClass('markersdivUneditable');
div.css('backgroundColor','');
}
+ this.fire('edit',{'value':value, 'index':index});
//var e_addplaylistButton = div.find('.markersdivAddPlaylist');
- this.setFocus(index,value);
this.stretch(e_titleText);
},
-
-//TODO: what is doing this method here?
- setFocus: function(index,value){
- // this.each(function(i,div){
- // if(i==index && value){
- // div.css('backgroundColor','#E65911'); //'#f5cf23'
- // }else{
- // div.css('backgroundColor','');
- // }
- // });
- },
-
setIndex: function(div,index){
//div.attr('id','_markerdiv'+index);
var e_indexLabel = div.find('.ts-marker');
var e_offsetLabel =div.find('.markersdivOffset');
e_indexLabel.add(e_offsetLabel).unbind('click').click(function(){
- //Timeside.player.moveMarker(index,0.2);return; //just a try
- me.setFocus(index,true);
me.fire('focus', {
'index': index
});
e_addplaylistButton.hide();
}
-
- if(!marker.isEditable){ //marker is editable means that author is superuser or author == getCurrentUserName().
+ if(!marker.canBeSetEditable){ //marker is editable means that author is superuser or author == getCurrentUserName().
//addToPlaylist visibility is skipped because it depends on other circumstances (see above)
e_editButton.hide();
e_deleteButton.hide();
- //we unbind events to be sure
- //e_addplaylistButton.unbind('click').hide();
e_okButton.unbind('click')
e_deleteButton.unbind('click').hide();
e_editButton.remove(); //so that if edit button is not present, we do not edit (safety reasons) see this.setEditMode
return div;
}
-
-
var me = this;
setTimeout(function(){
end('SoundManager is not responding. Try to:\n - Reload the page\n - Empty the cache (see browser preferences) and reload the page\n - Restart the browser');
},maxTime);
-
-
-
-
-
+
//var msgElm = $J('#loading_span_text').html('Loading sound info...');
//var uinqid_ = Timeside.utils.uniqid; //defined in application.js
desc: argument.description,
title: argument.title,
author: argument.author,
- isEditable: argument.author === currentUserName || isStaffOrSuperuser,
+ isEditable: false,
+ canBeSetEditable: (argument.author === currentUserName) || isStaffOrSuperuser,
canBeAddedToPlaylist: currentUserName ? true : false,
isSavedOnServer: true
};
desc: "",
title: "",
author: currentUserName,
- isEditable: true,
+ isEditable: false,
+ canBeSetEditable: true,
canBeAddedToPlaylist: true,
isSavedOnServer: false
};
}
});
+
+ mapUI.bind('edit',function(data){
+ var map = player.getMarkerMap();
+ var len = map.length;
+ var idx = data.index;
+ if(map && idx>=0 && idx<len){
+ map.toArray()[idx].isEditable = data.value;
+ player.getRuler().setEditable(idx,data.value, false);
+ }
+ }); // {'value':value, 'index':index});
+
//bind save marker -> player save
var map = player.getMarkerMap();
if(map){
var marker = data.marker;
var idx = map.insertionIndex(marker);
if(idx<0 || idx>=map.length){
- this.debug('marker not found');
+ this.debug('mapUI.save: marker not found');
return;
}
};
wdw.onbeforeunload = confirmExit;
}
+
+
if(map && wdw.PopupDiv){
var POPUP_TIMEOUT=3; //in seconds. Zero means: no popup, negative numbers:
//popup stays infinitely on the player (until next marker cross)
if(popupTimeoutId !== undefined){
clearHidePopupTimeout(popupTimeoutId);
}
- popupTimeoutId=undefined;
+ popupTimeoutId=undefined;
+
+
+
popupShowFunction(data);
if(POPUP_TIMEOUT<0){
if(next === undefined || next-data.currentSoundPosition > POPUP_TIMEOUT){
popupTimeoutId = popupdiv.setTimeout('close',POPUP_TIMEOUT*1000);
}
-
- //var index = data.index;
- //consolelog('===');
- //consolelog(data.currentSoundPosition);
- //consolelog(data.nextMarkerTimeInterval);
- //consolelog(index+') '+data.marker.offset+' | '+(map.toArray()[index+1].offset+' - '+data.timeMarginInSec));
- //if(index+1 == map.length || map.toArray()[index+1].offset-data.marker.offset-data.timeMarginInSec>3){
- // popupTimeoutId = popupdiv.setTimeout('close',3000);
- //}
- //consolelog('firing markercrossed');
- //consolelog(data.marker.title);
});
var draggingSomeMarker = false;
//now bind mouse events
player.bind('markerMouseEvent', function(data){
-// if(data.index<0 || player.playState>0){ //is the pointer
-// return;
-// }
-
-
-
- // if(popupTimeoutId !== undefined){
- // clearHidePopupTimeout(popupTimeoutId);
- // }
- // if(data.eventName === 'dragstart'){ // || data.eventName === 'mouseleave'){
- // if(popupdiv.isShowing()){
- // popupdiv.close();
- // }
- // return;
- // }
+ if(data.eventName === 'click' && data.index>-1){
+ player.setSoundPosition(data.marker.offset);
+ draggingSomeMarker = false; //to be sure
+ return;
+ }
if(data.eventName === 'mouseenter'){
if(!draggingSomeMarker && data.index>=0 && player.playState===0){
popupShowFunction(data);
}
}else if(data.eventName === 'dragstart'){
draggingSomeMarker = true;
- }else if(data.eventName === 'mouseup'){
+ }else if(data.eventName === 'dragend'){
draggingSomeMarker = false;
}
if(popupdiv.isShowing()){
--- /dev/null
+function PopupDiv(){var a=jQuery;var b=this;var c={};if(arguments.length&&arguments[0]){c=arguments[0]}var d=a('<div/>');var e=a('<div/>').append(a('<a/>').attr('href','#').click(function(){b.close();return false})).append(' ').append(a('<div/>').css('clear','both'));var g=a('<div/>').css('overflow','auto');var h=a('<div/>').append(a('<a/>').attr('href','#').click(function(){b.trigger('ok',true);return false}));d.append(e).append(g).append(h);this.getDiv=function(){return d};var i={};this.getListeners=function(){return i};var k;var j;for(k in PopupDiv){var f=PopupDiv[k];if(PopupDiv.hasOwnProperty(k)&&(typeof f!=='function')){if(!j){j={}}j[k]=f}}if(j){var l=true;var m=undefined;if(typeof Object.getPrototypeOf!=="function"){if(typeof this.__proto__==="object"){m=this.__proto__}else{m=this;l=false}}else{m=Object.getPrototypeOf(this)}for(k in j){if(j.hasOwnProperty(k)){m[k]=j[k];if(l){delete PopupDiv[k]}}}}for(k in c){if(c.hasOwnProperty(k)){if(k==='onOk'||k==='onShow'||k==='onClose'){this.bind(k.substring(2).toLowerCase(),c[k])}else if(k=='content'){this.setContent(c[k])}else{this[k]=c[k]}}}if(!this.popupCss){this.popupCss={}}}(function(p){var $=jQuery;var z=window;var A=document;var B=$(z);var C='popup_'+(new Date().getTime());p.isClickElement=function(a){return a&&a.length==1&&a instanceof $&&a[0]!==z&&a[0]!==A&&(a.is('a')||a.is('input[type=button]')||a.is('button')||a.is('input[type=submit]'))};p.getId=function(){var a=this.getDiv();if(!(a.attr('id'))){a.attr('id',C+'_'+(new Date().getTime()))}return a.attr('id')};p.shadowOffset=4;p.invoker=B;p.bounds={'top':0.25,'left':0.25,'right':0.25,'bottom':0.25};p.boundsExact=false;p.popupClass='';p.popupCss={};p.showOk=false;p.showClose=false;p.title="";p.okButtonClass='';p.okButtonAlign='right';p.closeButtonClass='';p.titleClass='';p.okButtonTitle='Ok';p.closeButtonTitle='x';p.defaultCloseOperation='hide';p.focusable=false;p.fadInTime='fast';p.fadeOutTime=0;p.shadowOpacity=0.25;p.zIndex=10000;p.listItemClass='';p.listItemCss='';p.getFormData=function(){var c=this.find('input,select,textarea');var d={};var f=this.getFormDataAttrName();c.each(function(i,e){var a=$(e);var b=a.attr(f);if(b){d[b]=a.val()}});return d};p.setTitle=function(a){this.getDiv().children().eq(0).find(':title').eq(0).val(a)};p.find=function(a){return this.getDiv().children().eq(1).find(a)};p.bind=function(a,b){var c=this.getListeners();if(c.hasOwnProperty(a)){c[a].push(b)}else{c[a]=[b]}};p.unbind=function(a){var b=this.getListeners();if(a&&b.hasOwnProperty(a)){delete b[a]}else if(!a){for(var k in b){if(b.hasOwnProperty(k)){delete b[k]}}}};p.trigger=function(a){var b=this.getListeners();var c=this;if(b.hasOwnProperty(a)){var d=b[a];var i=0;if(a=='ok'){var e=this.getFormData();for(i=0;i<d.length;i++){d[i].apply(c,[e])}this.__okButtonHasBeenPressed=true;this.close();delete this['__okButtonHasBeenPressed']}else if(a=='close'){var f=this.__okButtonHasBeenPressed||false;for(i=0;i<d.length;i++){d[i].apply(c,[f])}}else{for(i=0;i<d.length;i++){d[i].apply(c)}}}};p.setContent=function(d){var e=this.getDiv();var f=$($(e).children()[1]);f.empty();var g=this.getFormDataAttrName();if(d instanceof $){f.append(d)}else if(d instanceof Array){var j=this;var l=$('<input/>').attr('type','hidden').attr(g,'selIndex');var m=function(a,b,c){b.click(function(){c.val(a);j.trigger('ok',true);return false}).focus(function(){c.val(a)})};var n=$([]);for(var h=0;h<d.length;h++){var o=d[h];var a=$('<a/>').attr('href','#').html(""+o).css('whiteSpace','nowrap');n=n.add(a);m(h,a,l);f.append(a)}n.css({'margin':'2px'});if(this.listItemClass){n.addClass(this.listItemClass)}if(this.listItemCss){n.css(this.listItemCss)}n.css({'position':'','display':'block'});f.append(l)}else if(d&&d.constructor==Object){var p=$([]);var q=$([]);var r=[0,0];var s=function(a,b){var c=$('<div/>');if(!b){b=a;a=$('<span/>')}q=q.add(b);p=p.add(a);f.append(c.append(a).append(b));return c};var t,component;var u=Math.max;var v=undefined;var w=$([]);for(var k in d){if(d.hasOwnProperty(k)){var x=d[k];if(typeof x=='string'||typeof x=='number'){t=$('<span/>').html(k);r[0]=u(r[0],k.length);r[1]=u(r[1],x.length);component=$('<input/>').attr('type','text').val(x).attr(g,k);w=w.add(s(t,component))}else if(x===true||x===false){var y=this.getId()+"_checkbox";t=$('<input/>').attr('type','checkbox').attr(g,k).attr('id',y);if(x){t.attr('checked','checked')}else{t.removeAttr('checked')}component=$('<label/>').attr('for',y).html(k);r[1]=u(r[1],k.length);w=w.add(s($('<span/>').append(t),component))}else if(x instanceof Array){t=$('<span/>').html(k);r[0]=u(r[0],k.length);component=$('<select/>').attr('size',1).attr(g,k);for(var i=0;i<x.length;i++){component.append($('<option/>').val(x[i]).html(x[i]));r[1]=u(r[1],x[i].length)}w=w.add(s(t,component))}if(v){v.css('marginBottom','1ex')}}}w.css({'white-space':'nowrap','marginBottom':'0.5ex'});$(w[w.length-1]).css('marginBottom','');p.add(q).css({'display':'inline-block','margin':'0px','padding':'0px'});p.css({'textAlign':'right','marginRight':'0.5ex','width':Math.round((3/5)*r[0])+'em'});q.css({'width':Math.round((3/5)*u(r[0],r[1]))+'em'})}else{f.append(""+d)}};p.setFocusCycleRoot=function(b){var c=this.getDiv();var d=this.getFocusAttr();var f=this.isClickElement(this.invoker);var g=c.children();var h=$(g[0]);var j=$(g[1]);var k=$(g[2]);var l=j.find('input[type!=hidden],select,textarea,a');var m=l.length?$(l[0]):c;if(this.showClose){l=l.add(h.find('a'))}if(this.showOk||this.title){l=l.add(h.find(':text'));if(this.showOk){l=l.add(k.find('a'))}}l=l.add(c);var n="blur."+this.getId();if(!b){l.each(function(i,a){$(a).unbind(n).removeAttr('tabindex').removeAttr(d)});this.getFirstFocusableElement=function(){return undefined};if(f){this.invoker.removeAttr('tabindex').removeAttr(d)}return}if(f){this.invoker.attr('tabindex',0).attr(d,'true')}var o=A;var p=this;l.each(function(i,e){var a=$(e);a.attr(d,'true');a.attr('tabindex',i+1);a.unbind(n).bind(n,function(){setTimeout(function(){var v=o.activeElement;if((v&&$(v).attr(d))||p.__isClosing){return}p.close()},200)})});this.getFirstFocusableElement=function(){return m}};p.getFirstFocusableElement=function(){return undefined};p.refresh=function(a,b){var c=this.isShowing();var d=this.focusable;if(a!==undefined){this.setContent(a);if(c&&d){this.setFocusCycleRoot(this.focusable)}}if(b!=undefined){if(c){this.setTitle(b)}else{this.title=b}}if(!c){return}var e=this.invoker;if(this.isClickElement(e)){this.setBoundsAsPopup(e)}else{this.setBoundsInside(e,this.bounds,this.boundsExact)}if(d){this.getFirstFocusableElement().focus()}};p.setTitle=function(a){var b=this.getDiv().children().eq(0);var c=b.contents().filter(function(){return this.nodeType==3});var d=c.get(0);if(!a){a=' '}if(d.textContent){d.textContent=a}else if(d.nodeValue){d.nodeValue=a}};p.isShowing=function(){return this.getDiv().is(':visible')};p.show=function(){var c=this.getDiv();var d=this;if(this.popupClass){c.removeClass().addClass(this.popupClass);this.popupClass=''}if(this.popupCss){c.css(this.popupCss);this.popupCss=''}this.setFocusCycleRoot(this.focusable);var e=c.children();var f=$(e[0]);var g=f.find('a').eq(0);if(this.showClose||this.title){f.css({'paddingBottom':'0.25em','whiteSpace':'nowrap'});if(this.titleClass&&this.title){f.attr('class',this.titleClass);this.titleClass=''}if(this.showClose){g.css('marginLeft','0.5em').attr('class',this.closeButtonClass).html(this.closeButtonTitle).css({'display':'inline-block','float':'right'})}else{g.hide()}this.setTitle(this.title)}var i=$(e[2]);var j=i.find('a').eq(0);if(this.showOk){i.css({'paddingTop':'0.25em','textAlign':this.okButtonAlign});j.attr('class',this.okButtonClass);j.html(this.okButtonTitle);j.css({'float':'none','display':'inline-block'})}if(!c.parent().length){c.appendTo('body')}var k=this.invoker;var l=this.isClickElement(k);if(l){this.setBoundsAsPopup(k);this['_tmpHandlers'+this.getId()]=undefined;var m=this.getFirstFocusableElement();if(m){var n=[];var o='click';var p=k.data("events")[o];$.each(p,function(a,b){n.push(b)});k.unbind(o);this['_tmpHandlers'+this.getId()]=n;k.unbind(o).bind(o,function(a){if(c.length&&c.is(':visible')){m.focus();return false}d.close.apply(d);return false})}}else{this.setBoundsInside(k,this.bounds,this.boundsExact)}var q=this.shadow();var r=l?this.placeAsPopup:this.placeInside;var s=function(){var w=B.width();var h=B.height();d._resizeTimeInterval=setInterval(function(){var a=B.width();var b=B.height();if(a!==w||b!==h){setTimeout(function(){if(!d.isShowing()||d.__isClosing){return}if(B.width()===a&&B.height()===b){r.apply(d)}},100)}},200);d.trigger('show');q.fadeTo(d.fadInTime,d.shadowOpacity,function(){var v=d.getFirstFocusableElement();if(v){v.focus()}})};c.show(this.fadInTime,function(){s()})};p.shadow=function(){var a=$('#'+this.getShadowDivId());var b=this.shadowOffset;if(!b&&a.length){a.remove();return $([])}else if(b){var c=this.getDiv();if(!a.length){a=c.clone(false,false).empty().css({'backgroundColor':'#000','borderColor':'#000','display':'block','zIndex':this.zIndex-1}).removeAttr('tabindex').removeAttr(this.getFocusAttr()).fadeTo(0,0).attr('id',this.getShadowDivId()).insertAfter(c)}var d=this.getBounds.apply(this);a.css({'left':(d.x+b)+'px','top':(d.y+b)+'px','width':(d.width)+'px','height':(d.height)+'px'})}return a};p.setBoundsAsPopup=function(a){var b=a;this.preSizeFcn();var c=this.getDiv();var d=this.shadowOffset;var e=this.getBoundsOf(B);var f=b.offset();var g=b.outerHeight();var h=f.top-e.y;var i=e.height-g-h;var j=h>i&&c.outerHeight(false)+d>i;var k=b.outerWidth();var l=e.x+e.width-f.left;var m=f.left+k-e.x;var n=m>l&&c.outerWidth(false)+d>l;this.setMaxSize({height:(j?h:i),width:(n?m:l)});this.setMinSize({width:b.outerWidth()+this.shadowOffset});this.postSizeFcn()};p.setBoundsInside=function(a,b,c){var d=this.getDiv();this.preSizeFcn();var e=this.getBoundsOf(a);var x=e.x;var y=e.y;var w=e.width;var h=e.height;var f=parseInt;var g={top:b['top'],left:b['left'],bottom:b['bottom'],right:b['right']};for(var k in g){if(g.hasOwnProperty(k)){if(g[k]<=0){g[k]=0}else if(g[k]<=1){g[k]=k=='top'||k=='bottom'?h*g[k]:w*g[k]}else{g[k]=f(g[k])}}}var i={'width':w-g['left']-g['right']+this.shadowOffset,'height':h-g['top']-g['bottom']+this.shadowOffset};this.setMaxSize({width:i.width,height:i.height});if(c){this.setMinSize({width:i.width,height:i.height})}this.postSizeFcn()};p.preSizeFcn=function(){var a=this.getDiv();var b=a.children();b.css('display','none');var c=b.eq(1);if(this.showClose||this.title){c=c.add(b.eq(0))}if(this.showOk){c=c.add(b.eq(2))}c=c.add(a);c.css({'display':'block','float':'','overflow':'visible'});c.css({'maxHeight':'','maxWidth':'','minHeight':'','minWidth':'','height':'','width':'','overflow':'','visibility':'visible','float':''});a.css({'margin':'0px','zIndex':this.zIndex,'position':'absolute'});var d=this.getBoundsOf();a.css({'left':d.x+'px','top':d.y+'px'})};p.postSizeFcn=function(){var a=this.getDiv();var b=a.children();var c=b.eq(0);var d=b.eq(1);var e=b.eq(2);var f=d.height();var g=(a.height()-c.outerHeight(true)-e.outerHeight(true)-(d.outerHeight(true)-d.height()));var h=a.width();var i=d.outerWidth(true);if(g<=0||h<=0){return}d.css('height',g+'px');d.css('width',h+'px');d.css('overflow','auto');if(this.isClickElement(this.invoker)){this.placeAsPopup()}else{this.placeInside()}};p.placeAsPopup=function(){var a=this.getDiv();var b=this.shadowOffset;var c=this.getBoundsOf(B);var d=this.invoker;var e=d.offset();var f=d.outerHeight();var g=e.top-c.y;var h=c.height-f-g;var i=g>h&&a.outerHeight(false)+b>h;var j=d.outerWidth();var k=c.x+c.width-e.left;var l=e.left+j-c.x;var m=l>k&&a.outerWidth(false)+b>k;var n={'left':m?e.left+j-a.outerWidth(true)-b:e.left,'top':(i?e.top-a.outerHeight(true):e.top+f)};a.css({'top':n.top+'px','left':n.left+'px'});this.shadow()};p.placeInside=function(){var a=this.getDiv();var b=this.invoker;var c=this.getBoundsOf(b);var d=this.bounds;var x=c.x;var y=c.y;var w=c.width;var h=c.height;var e=parseInt;var f={top:d['top'],left:d['left'],bottom:d['bottom'],right:d['right']};for(var k in f){if(f.hasOwnProperty(k)){if(f[k]<=0){f[k]=0}else if(f[k]<=1){f[k]=k=='top'||k=='bottom'?h*f[k]:w*f[k]}else{f[k]=e(f[k])}}}var g={'width':w-f['left']-f['right']+this.shadowOffset,'height':h-f['top']-f['bottom']+this.shadowOffset};var i=a.outerWidth(true);var j=a.outerHeight(true);var l=0;var m=0;if(i<g.width){l=(g.width-i)/2}if(j<g.height){m=(g.height-j)/2}a.css({'left':(x+f['left']+l)+'px','top':(y+f['top']+m)+'px'});this.shadow()};p.getBounds=function(){return this.getBoundsOf(this.getDiv())};p.getBoundsOf=function(a){var b={x:0,y:0,width:0,height:0};if(!a||!(a instanceof $)){a=B}if(a[0]===z){b.x=a.scrollLeft();b.y=a.scrollTop()}else{var c=a.offset();b.x=c.left;b.y=c.top}b.width=a.width();b.height=a.height();return b};p.setMaxSize=function(a){var b=this.getDiv();this._convertSize(b,a);var c;if(a.hasOwnProperty('width')){if(!c){c={}}c.maxWidth=a.width+'px'}if(a.hasOwnProperty('height')){if(!c){c={}}c.maxHeight=a.height+'px'}if(c){b.css(c)}return a};p.setMinSize=function(a){var b=this.getDiv();this._convertSize(b,a);var c;if(a.hasOwnProperty('width')){if(!c){c={}}c.minWidth=a.width+'px'}if(a.hasOwnProperty('height')){if(!c){c={}}c.minHeight=a.height+'px'}if(c){b.css(c)}return a};p._convertSize=function(a,b){var c={'width':a.outerWidth(true)-a.width(),'height':a.outerHeight(true)-a.height()};if(b.hasOwnProperty('width')){b.width-=(c.width+this.shadowOffset)}if(b.hasOwnProperty('height')){b.height-=(c.height+this.shadowOffset)}};p.offset=function(a){var b=this.getDiv();b.offset(a)};p.close=function(){this.__isClosing=true;if(this._resizeTimeInterval!==undefined){clearInterval(this._resizeTimeInterval);this._resizeTimeInterval=undefined}this.setFocusCycleRoot(false);var c=this.getDiv();var d=$('#'+this.getShadowDivId());d.remove();var e=this;var f=this.defaultCloseOperation=='remove';c.hide(this.fadeOutTime,function(){if(f){c.remove()}var a='_tmpHandlers'+e.getId();if(e[a]){var b=e[a];delete e[a];e.invoker.unbind('click');for(var k=0;k<b.length;k++){var h=b[k];e.invoker.bind(h.type+(h.namespace?"."+h.namespace:""),h.handler)}}delete e['__isClosing'];e.trigger('close')})};p.setTimeout=function(a,b){var c=this;var t=undefined;if(a==='show'){t=setTimeout(function(){c.show()},b)}else if(a==='close'){t=setTimeout(function(){c.close()},b)}return t};p.getShadowDivId=function(){return this.getId()+"_shadow"};p.getFocusAttr=function(){return this.getId()+"_focus"};p.getFormDataAttrName=function(){return this.getId()+"_data"}})(PopupDiv.prototype);
\ No newline at end of file
var listItems = $([]);\r
for(var h=0; h<content.length; h++){\r
var item = content[h];\r
- var a = $('<a/>').attr('href','#').html(""+item).css('whiteSpace','nowrap');\r
+ var a = $('<a/>').attr('href','#').html(""+item); //.css('whiteSpace','nowrap');\r
listItems = listItems.add(a);\r
setEvents(h,a,input);\r
container.append(a);\r
//otherwise execute callback\r
setTimeout(function(){\r
var v = doc_.activeElement;\r
- consolelog(v.tagName+' ' +$(v).attr(focusAttr));\r
- //console.log(v);\r
+ \r
if((v && $(v).attr(focusAttr)) || me.__isClosing){\r
//if we are closing, we will call back this method which removes the focus attributes, bt meanwhile the\r
//timeout should execute\r
} else if (node.nodeValue) {\r
node.nodeValue = title;\r
}\r
- // consolelog('"'+ title+'"');\r
- // consolelog(text);\r
- // consolelog(node);\r
};\r
\r
p.isShowing = function(){\r
\r
if(this.showClose || this.title){\r
topDiv.css({\r
- 'paddingBottom':'0.25em',\r
- 'whiteSpace':'nowrap'\r
+ 'paddingBottom':'0.25em'\r
+ //,'whiteSpace':'nowrap'\r
}); //add padding to bottom\r
//warning: do NOT use real numbers such as 0.5ex cause browsers round it in a different manner\r
//whiteSpace is FUNDAMENTAL in calculating the popup div in case the title is the longest (max width) element\r
'height':h-padding['top']-padding['bottom']+this.shadowOffset\r
};\r
\r
- this.setMaxSize({\r
- width:maxSize.width,\r
- height:maxSize.height\r
- }); //a copy cause the argument will be modified\r
+ this.setMaxSize({\r
+ width:maxSize.width,\r
+ height:maxSize.height\r
+ }); //a copy cause the argument will be modified\r
\r
if(boundsExact){\r
this.setMinSize({\r
\r
this.postSizeFcn();\r
};\r
+ \r
p.preSizeFcn = function(){\r
var div = this.getDiv();\r
var subdivs = div.children();\r
div.css({\r
'left':bounds.x+'px',\r
'top':bounds.y+'px'\r
- });\r
+ });\r
\r
// var topDiv =subdivs.eq(0);\r
// var centralDiv = subdivs.eq(1);\r
// var bottomDiv = subdivs.eq(2);\r
- // consolelog('presize');\r
- // consolelog('width: '+ topDiv.width()+' css-minWidth: ' +topDiv.css('minWidth')+' css-width: ' +topDiv.css('width')+' css-maxWidth: ' +topDiv.css('maxWidth'));\r
- // consolelog('width: '+centralDiv.width()+' css-minWidth: ' +centralDiv.css('minWidth')+' css-width: ' +centralDiv.css('width')+' css-maxWidth: ' +centralDiv.css('maxWidth'));\r
- // consolelog('width: '+bottomDiv.width()+' css-minWidth: ' +bottomDiv.css('minWidth')+' css-width: ' +bottomDiv.css('width')+' css-maxWidth: ' +bottomDiv.css('maxWidth'));\r
- // consolelog(' ' );\r
+ // console.log('presize');\r
+ // console.log('width: '+ topDiv.width()+' css-minWidth: ' +topDiv.css('minWidth')+' css-width: ' +topDiv.css('width')+' css-maxWidth: ' +topDiv.css('maxWidth'));\r
+ // console.log('width: '+centralDiv.width()+' css-minWidth: ' +centralDiv.css('minWidth')+' css-width: ' +centralDiv.css('width')+' css-maxWidth: ' +centralDiv.css('maxWidth'));\r
+ // console.log('width: '+bottomDiv.width()+' css-minWidth: ' +bottomDiv.css('minWidth')+' css-width: ' +bottomDiv.css('width')+' css-maxWidth: ' +bottomDiv.css('maxWidth'));\r
+ // console.log(' ' );\r
};\r
\r
p.postSizeFcn = function(){\r
//It might be a refresh problem cause if we display an alert then the size is properly set.\r
//However:\r
//if(centralDiv.height()==0 && maxHeight>0){\r
- //consolelog('buggy: '+maxHeight);\r
+ \r
//centralDiv.css('height',maxHeight);\r
//}\r
\r
//a specified width property\r
//IE does what it is expected (werird enogh...), ie sets a maxWidth and\r
\r
- // consolelog('postsize');\r
- // consolelog('width: '+ topDiv.width()+' css-minWidth: ' +topDiv.css('minWidth')+' css-width: ' +topDiv.css('width')+' css-maxWidth: ' +topDiv.css('maxWidth'));\r
- // consolelog('width: '+centralDiv.width()+' css-minWidth: ' +centralDiv.css('minWidth')+' css-width: ' +centralDiv.css('width')+' css-maxWidth: ' +centralDiv.css('maxWidth'));\r
- // consolelog('width: '+bottomDiv.width()+' css-minWidth: ' +bottomDiv.css('minWidth')+' css-width: ' +bottomDiv.css('width')+' css-maxWidth: ' +bottomDiv.css('maxWidth'));\r
- // consolelog(' ' );\r
+ // console.log('postsize');\r
+ // console.log('width: '+ topDiv.width()+' css-minWidth: ' +topDiv.css('minWidth')+' css-width: ' +topDiv.css('width')+' css-maxWidth: ' +topDiv.css('maxWidth'));\r
+ // console.log('width: '+centralDiv.width()+' css-minWidth: ' +centralDiv.css('minWidth')+' css-width: ' +centralDiv.css('width')+' css-maxWidth: ' +centralDiv.css('maxWidth'));\r
+ // console.log('width: '+bottomDiv.width()+' css-minWidth: ' +bottomDiv.css('minWidth')+' css-width: ' +bottomDiv.css('width')+' css-maxWidth: ' +bottomDiv.css('maxWidth'));\r
+ // console.log(' ' );\r
if(this.isClickElement(this.invoker)){\r
this.placeAsPopup();\r
}else{\r
div.css({\r
'top':offs.top+'px',\r
'left':offs.left+'px'\r
- });\r
- this.shadow(); //replace the shadow\r
+ });\r
+ this.shadow(); //repositioning the shadow\r
};\r
\r
p.placeInside = function(){\r
div.css({\r
'left':(x+padding['left']+spanLeft)+'px',\r
'top':(y+padding['top']+spanTop)+'px'\r
- });\r
+ });\r
\r
- this.shadow(); //replace the shadow\r
+ this.shadow(); //repositioning the shadow\r
};\r
\r
p.getBounds = function(){\r
--- /dev/null
+/** herre tools or functions mainly copied and modified from internet which might be useful
+ * THIS SCRIPT IS NOT LOADED IN ANY PAGE, WE JUST WANT TO COLLECT HERE FUNCTION UTILITIES WHICH ARE NOT USED ANYMORE, BUT WHICH MIGHT
+ * BE USEFUL AGAIN
+ */
+var temp_utilitites = {
+
+ /**
+ * old function used to assess span width. We calculate the width of a span niw, to be more sure
+ */
+ textWidth : function(text, fontSize) {
+ var ratio = 3/5;
+ return text.length * ratio * fontSize;
+ },
+
+ //css specific functions:
+ //get computed style first (cross browser solution, from http://blog.stchur.com/2006/06/21/css-computed-style/
+ getComputedStyle : function(_elem, _style){
+ var computedStyle;
+ var $J = this.$J;
+ if(_elem instanceof $J){ //note: '_elem instanceof this.$J' doesnt work. why??
+ _elem = _elem.get(0);
+ }
+ if (typeof _elem.currentStyle != 'undefined'){
+ computedStyle = _elem.currentStyle;
+ }else{
+ computedStyle = document.defaultView.getComputedStyle(_elem, null);
+ }
+ return computedStyle[_style];
+ },
+ //returns a hex color from strColor. strColor can be one of the predefined css colors (eg, 'aliceBlue', case insensitive)
+ //or rgb (eg: rgb(12,0,45)) or an hex color (eg, '#ff98a3' or '#f8g'). Leading and trailing spaces will be omitted,
+ //case is insensitive, an empty string is returned in case of error (bad format string, parseInt errors etcetera..)
+ color : function(strColor){
+ if(!strColor){
+ return '';
+ }
+ strColor = strColor.replace(/(^\s+|\s+$)/g,'').toLowerCase();
+ if(!strColor){
+ return '';
+ }
+ var predefined_colors = {
+ aliceblue:"#f0f8ff",
+ antiquewhite:"#faebd7",
+ aqua:"#00ffff",
+ aquamarine:"#7fffd4",
+ azure:"#f0ffff",
+ beige:"#f5f5dc",
+ bisque:"#ffe4c4",
+ black:"#000000",
+ blanchedalmond:"#ffebcd",
+ blue:"#0000ff",
+ blueviolet:"#8a2be2",
+ brown:"#a52a2a",
+ burlywood:"#deb887",
+ cadetblue:"#5f9ea0",
+ chartreuse:"#7fff00",
+ chocolate:"#d2691e",
+ coral:"#ff7f50",
+ cornflowerblue:"#6495ed",
+ cornsilk:"#fff8dc",
+ crimson:"#dc143c",
+ cyan:"#00ffff",
+ darkblue:"#00008b",
+ darkcyan:"#008b8b",
+ darkgoldenrod:"#b8860b",
+ darkgray:"#a9a9a9",
+ darkgrey:"#a9a9a9",
+ darkgreen:"#006400",
+ darkkhaki:"#bdb76b",
+ darkmagenta:"#8b008b",
+ darkolivegreen:"#556b2f",
+ darkorange:"#ff8c00",
+ darkorchid:"#9932cc",
+ darkred:"#8b0000",
+ darksalmon:"#e9967a",
+ darkseagreen:"#8fbc8f",
+ darkslateblue:"#483d8b",
+ darkslategray:"#2f4f4f",
+ darkslategrey:"#2f4f4f",
+ darkturquoise:"#00ced1",
+ darkviolet:"#9400d3",
+ deeppink:"#ff1493",
+ deepskyblue:"#00bfff",
+ dimgray:"#696969",
+ dimgrey:"#696969",
+ dodgerblue:"#1e90ff",
+ firebrick:"#b22222",
+ floralwhite:"#fffaf0",
+ forestgreen:"#228b22",
+ fuchsia:"#ff00ff",
+ gainsboro:"#dcdcdc",
+ ghostwhite:"#f8f8ff",
+ gold:"#ffd700",
+ goldenrod:"#daa520",
+ gray:"#808080",
+ grey:"#808080",
+ green:"#008000",
+ greenyellow:"#adff2f",
+ honeydew:"#f0fff0",
+ hotpink:"#ff69b4",
+ indianred:"#cd5c5c",
+ indigo:"#4b0082",
+ ivory:"#fffff0",
+ khaki:"#f0e68c",
+ lavender:"#e6e6fa",
+ lavenderblush:"#fff0f5",
+ lawngreen:"#7cfc00",
+ lemonchiffon:"#fffacd",
+ lightblue:"#add8e6",
+ lightcoral:"#f08080",
+ lightcyan:"#e0ffff",
+ lightgoldenrodyellow:"#fafad2",
+ lightgray:"#d3d3d3",
+ lightgrey:"#d3d3d3",
+ lightgreen:"#90ee90",
+ lightpink:"#ffb6c1",
+ lightsalmon:"#ffa07a",
+ lightseagreen:"#20b2aa",
+ lightskyblue:"#87cefa",
+ lightslategray:"#778899",
+ lightslategrey:"#778899",
+ lightsteelblue:"#b0c4de",
+ lightyellow:"#ffffe0",
+ lime:"#00ff00",
+ limegreen:"#32cd32",
+ linen:"#faf0e6",
+ magenta:"#ff00ff",
+ maroon:"#800000",
+ mediumaquamarine:"#66cdaa",
+ mediumblue:"#0000cd",
+ mediumorchid:"#ba55d3",
+ mediumpurple:"#9370d8",
+ mediumseagreen:"#3cb371",
+ mediumslateblue:"#7b68ee",
+ mediumspringgreen:"#00fa9a",
+ mediumturquoise:"#48d1cc",
+ mediumvioletred:"#c71585",
+ midnightblue:"#191970",
+ mintcream:"#f5fffa",
+ mistyrose:"#ffe4e1",
+ moccasin:"#ffe4b5",
+ navajowhite:"#ffdead",
+ navy:"#000080",
+ oldlace:"#fdf5e6",
+ olive:"#808000",
+ olivedrab:"#6b8e23",
+ orange:"#ffa500",
+ orangered:"#ff4500",
+ orchid:"#da70d6",
+ palegoldenrod:"#eee8aa",
+ palegreen:"#98fb98",
+ paleturquoise:"#afeeee",
+ palevioletred:"#d87093",
+ papayawhip:"#ffefd5",
+ peachpuff:"#ffdab9",
+ peru:"#cd853f",
+ pink:"#ffc0cb",
+ plum:"#dda0dd",
+ powderblue:"#b0e0e6",
+ purple:"#800080",
+ red:"#ff0000",
+ rosybrown:"#bc8f8f",
+ royalblue:"#4169e1",
+ saddlebrown:"#8b4513",
+ salmon:"#fa8072",
+ sandybrown:"#f4a460",
+ seagreen:"#2e8b57",
+ seashell:"#fff5ee",
+ sienna:"#a0522d",
+ silver:"#c0c0c0",
+ skyblue:"#87ceeb",
+ slateblue:"#6a5acd",
+ slategray:"#708090",
+ slategrey:"#708090",
+ snow:"#fffafa",
+ springgreen:"#00ff7f",
+ steelblue:"#4682b4",
+ tan:"#d2b48c",
+ teal:"#008080",
+ thistle:"#d8bfd8",
+ tomato:"#ff6347",
+ turquoise:"#40e0d0",
+ violet:"#ee82ee",
+ wheat:"#f5deb3",
+ white:"#ffffff",
+ whitesmoke:"#f5f5f5",
+ yellow:"#ffff00",
+ yellowgreen:"#9acd32"
+ };
+ var cl = predefined_colors[strColor];
+ if(cl){
+ return cl;
+ }
+ var pint = parseInt;
+ //color parsers: note that the order is not random: we put first the most likely case ('#aaaaaa') and at last
+ //the less one ('rgb(...)'), this might increase performances in most cases, especially if this method is called from
+ //within a loop
+ var color_defs = [
+ {
+ re: /^#*(\w{2})(\w{2})(\w{2})$/, //example: ['#00ff00', '336699'],
+ process: function (bits){
+ return [pint(bits[1], 16),pint(bits[2], 16),pint(bits[3], 16)];
+ }
+ },
+
+ {
+ re: /^#*(\w{1})(\w{1})(\w{1})$/, //example: ['#fb0', 'f0f'],
+ process: function (bits){
+ return [pint(bits[1] + bits[1], 16),pint(bits[2] + bits[2], 16),pint(bits[3] + bits[3], 16)];
+ }
+ },
+ {
+ re: /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/, //example: ['rgb(123, 234, 45)', 'rgb(255,234,245)'],
+ process: function (bits){
+ return [pint(bits[1]), pint(bits[2]),pint(bits[3])];
+ }
+ }
+
+ ];
+
+ // search through the definitions to find a match
+ var nan = isNaN;
+ for (var i = 0; i < color_defs.length; i++) {
+ var re = color_defs[i].re;
+ var processor = color_defs[i].process;
+ var bits = re.exec(strColor);
+ if (bits) {
+ var channels = processor(bits);
+ if(channels.length ==3){
+ for(var j=0; j<3; j++){
+ var c = channels[j];
+ c = (nan(c) || c< 0 ? 0 : (c>255 ? 255 :c));
+ c = c.toString(16);
+ var len = c.length;
+ switch(len){
+ case 1:
+ c = '0'+c;
+ break;
+ case 2:
+ break;
+ default:
+ return '';
+ }
+ channels[j] = c;
+ }
+ return '#'+channels.join('');
+ }
+ }
+ }
+ return '';
+ }
+}
\ No newline at end of file
var marker = newMarker; //this.createMarker(obj);
var idx = this.insertionIndex(marker);
if(idx>=0){ //it exists? there is a problem....
- this.debug('adding an already existing marker!!'); //should not happen. however...
+ this.debug('markermap.add: adding an already existing marker!!'); //should not happen. however...
return -1;
}
this.fire('add', {
marker: marker,
index: idx
- //,isNew: (typeof obj == 'number' || typeof obj == 'string')
});
- //var temp = new MarkerDiv();
- // this.debug(this.createMarkerDiv());
-
return idx;
},
newIndex = this._super(oldIndex,newIndex);
if(newIndex <0){
- this.debug('markermap.move: index out of bounds');
+ this.debug('markermap.move: new index out of bounds');
return -1;
}
};
this.soundPosition = sound.position ? this.toSec(sound.position) : 0;
- //public methods: returns the sound position
-// this.getSoundPosition = function(){
-// return this.soundPosition;
-// };
+
// if(sound.readyState != 3){
var canAddMarkers = false;
if(newMarkerCallback){
- // this.canAddMarker = function(){
- // return true;
- // }
canAddMarkers = true;
if(typeof newMarkerCallback === 'function'){
this.newMarker = newMarkerCallback;
}
}
- // else{
- // this.canAddMarker = function(){
- // return false;
- // }
- // }
-
-
- // },
+
//sets up the player interface and loads the markers. There is theoretically no need for this method, as it might be included in
//the init constructor, it is separated for "historical" reasons: this method stems from the old _setupInterface,
//which was a separate method in the old player code. Future releases might include it in the init constructor
// setupInterface: function(markersArray) {
- //removed"
- // var sound = this.getSound();
- //removed"
- this.debug('player _setupInterface sound.readyState:'+sound.readyState); //handle also cases 0 and 2????
-
- var $J = this.$J; //defined in the super constructor
+
+ //var $J = this.$J; //defined in the super constructor
var me=this;
//build the innerHTML as array, then join it. This is usually faster than string concatenation in some browsers.
//Note that the player image (see below) is given a src with a temporary 1x1 pixels transparent image
//Basically, NOT specifying any src for image tags can be harmful,
//see http://www.nczonline.net/blog/2009/11/30/empty-image-src-can-destroy-your-site/ and
//http://geekswithblogs.net/bcaraway/archive/2007/08/24/114945.aspx for details
- var html = [//"<div class='ts-viewer'>",
+ var html = [
"<div class='ts-ruler'></div>",
"<div class='ts-wave'>",
"<div class='ts-image-canvas'></div>",
"<div class='ts-image-container'>",
- // "<img class='ts-image' src='/images/transparent.png' alt='' />",
+ //lazily created: "<img class='ts-image' src='xyz.png' alt='' />", //not providing a src attribute is harmful. Dummy src attribute
"</div>",
"</div>",
- //"</div>",
"<div class='ts-control'>",
- //"<div class='ts-layout'>",
- //"<div class='ts-playback'>",
"<a class='ts-play ts-button'></a>",
"<a class='ts-pause ts-button'></a>",
"<a class='ts-rewind ts-button'></a>",
"<a class='ts-forward ts-button'></a>",
"<a class='ts-set-marker ts-button'></a>",
- // "<a class='ts-volume'></a>",
-
- //"<div class='ts-volume'>",
"<a class='ts-volume-speaker ts-button'></a>",
"<div class='ts-volume-wrapper-div'>",
"<a class='ts-volume-bar-container'>",
"<span class='ts-volume-bar'></span>",
"</a>",
"</div>",
-
"<div class='ts-wait'></div>",
- //"<img class='ts-wait'/>",
- //"<select class='ts-visualizer'></select>",
- //"</div>",
- //"</div>",
"</div>"];
//removed"
'display':'inline-block',
'overflow':'hidden'
});
- // if(!canAddMarkers){
- // setMarkerButton.hide().unbind('click');
- // }
+
var waitImg = control.find('.ts-wait');
waitImg.html('wait').css({
return ruler;
}
//bind mouse events:
- ruler.bind('markermouseevent', function(data){
+ ruler.bind('rulermarkermouseevent', function(data){
var idx = data.index;
data.marker = idx > -1 ? me.getMarker(idx) : undefined;
me.fire('markerMouseEvent',data);
//Weird enough (with IE it isn't actually), we have just to set the property we already set in the css:
//ie, top: auto. This is however useful even if somebody specified a top property on the divs
ruler_.add(wave).add(control).css('top','auto');
-// if(h > $J('.ts-wave').position().top){
-// $J('.ts-wave').css('top',0+'px');
-// }
},
play : function(){
var player = this;
var sound = player.getSound();
- //var imgWaitDisplaying = this.isWaitVisible();
- //soundManager multishot set false should prevent the play when already playing. We leave this check for safety
+
if(!player || !sound){
return false;
}
- //setting markercorss callback
- //for these varirables, see explanation below:
- //var numberOfSubsequentPlayCall=0;
- //var minimumNumberOfSubsequentPlayCall=3;
- //var isPlayingId=2;
- //var isBufferingId=1;
- //var uninitializedId=0;
- //var currentState=uninitializedId;
var fireOnMarkerPosition = function(seconds){}; //does nothing by default
var map = player.getMarkerMap();
intervalLowerBound = offs-margin;
data.index = idx;
data.marker = marker;
-// { //if you change data, change it also above
-// index:idx,
-// marker:marker
-// };
-// }else{
-// marker = undefined;
}
}
}
}
};
- // var playOptions = {
- // position: sPosInMsec,
- // whileplaying: function(){
- // var sPos = this.position;
- // var buffering = this.isBuffering; //this refers to the soundmanager sound obj
- // //Now, what are we doing here below? we could simply check whether is buffering or not..
- // //Unfortunately, when buffering some playState (isBuffering = false) are also fired, randomly
- // //ONCE in a while
- // //the result is a blinking 'isBuffering' 'isPlaying' state in the wait element displaying the state (not so nice),
- // //which is also costly in terms of computation. So, we wait for at least N playstate fired SUBSEQUENTLY, without
- // //NO bufferingState fired between them. N is set to minimumNumberOfSubsequentPlayCall. When this happens, we can start moving the
- // //pointer as a result of a real play state, and we avoid blinking of the wait element
- // switch(buffering){
- // case true:
- // numberOfSubsequentPlayCall = 0; //reset the count
- // switch(currentState){
- // case isBufferingId: //do nothing (wait element already displaying)
- // break;
- // default: //update the wait element showing it:
- // currentState = isBufferingId;
- // player.playState = 2;
- // if(bufferingString){
- // player.setWait(bufferingString);
- // }
- // }
- // break;
- // default:
- // switch(currentState){
- // case uninitializedId:
- // case isBufferingId: //in these 2 cases, increment numberOfSubsequentPlayCall
- // numberOfSubsequentPlayCall++;
- // if(numberOfSubsequentPlayCall == minimumNumberOfSubsequentPlayCall){
- // //if is not buffering, we could skip this. However, there could be the waitbar displaying for some other reason:
- // player.setWait(player.isImgRefreshing ? player.msgs.imgRefreshing : '');
- // currentState = isPlayingId; //set state for future subsequent calls of this case
- // player.playState = 3;
- // }else{
- // break; //do not move pointer (default condition below)
- // }
- // default: //move pointer
- // var sPosInSec = toSec(sPos);
- // player.soundPosition = sPosInSec;
- // ruler.movePointer(sPosInSec);
- // }
- // fireOnMarkerPosition(sPosInSec);
- // }
- //
- // },
- // onfinish: function() {
- // //whileplaying is NOT called onsinfish. We must update the pointer:
- // //note that for small length sounds (wg, 5 secs) the pointer shifts abruptly from the last
- // //whileplaying position to the end. We tried with a setTimeout function but the visual effect is not
- // //removed. So we leave this small 'bug'
- // ruler.movePointer(player.getSoundDuration());
- // player.setWait(player.isImgRefreshing ? player.msgs.imgRefreshing : '');
- // player.playState = 0;
- // pauseFunction('endReached');
- //
- // //player.fire('endReached');
- // }
- // };
//if the pointer is already at the end of sound, soundmanager does not fire onfinish but starts buffering
//forever. Therefore, we must check this case here.
}
return false;
},
- isWaitVisible: function(){
- return this.getContainer().find('.ts-control').find('.ts-wait').is(':visible');
- },
- getWaitString: function(){
- return this.getContainer().find('.ts-control').find('.ts-wait').html();
- },
setWaitElement: function(element){
//msg string: undefined: do nothing, empty: hide, otherwise show wait with html = msg
setWait: function(msg){
var wait = undefined;
- // if(typeof msg == 'function'){
- // wait = msg();
- // if(wait){
- // msg = wait.html();
- // }else{
- // return;
- // }
- // }else{
+
wait = this.getWaitElement();
if(!wait || msg === undefined){
return;
if(wait.html()!=msg){
wait.html(msg);
}
- // }
var visible = wait.css('display') != 'none';
},100);
},
resize: function() {
- this.debug("resizing");
var height;
var container = this.getContainer();
var wave = container.find('.ts-wave');
-
height = wave.height();
- this.debug("wave height:" + height);
-
+
if (height) {
//set image, imagecontainer and canvas (container on imagecontainer for lines and pointer triangles) css
moveMarker: function(identifier, newOffset){ //identifier can be an number (marker index) or a marker (the index will be aearched)
var map = this.getMarkerMap();
if(map){
- //note that map.move does everything BUT moving visually a marker on the ruler
-// var r = this.getRuler();
-// var m = r.toArray()[identifier];
-// m.move(r.toPixelOffset(newOffset)); //TODO: check what happens here inside, no 'fire' hopefully...
map.move(identifier,newOffset);
}
},
var rulerAdd = ruler.add;
- var debug_ = player.debug; //TODO: remove
if(markers){
//add markers to the map. No listeners associated to it (for the moment)
//mapuiAdd.apply(mapUI,[data.marker, data.index,data.isNew]);
rulerAdd.apply(ruler,[data.marker.offset, data.index,data.marker.isEditable]);
player.fire('markerAdded',data);
- debug_('add');
- debug_(data);
});
//2) MOVE
//add the binding when we move a marker on the ruler:
ruler.bind('markermoved',function(data){
var soundPos = data.soundPosition;
- var markerClass = data.markerClass;
- if(markerClass=='pointer'){
+ var isPointer = data.isPointer;
+ if(isPointer){
player.setSoundPosition(soundPos);
}else{
map.move(data.markerElement.getIndex(), soundPos);
var to = data.toIndex;
ruler.move.apply(ruler,[from,to,data.marker.offset]);
player.fire('markerMoved',data);
- debug_('moved');
- debug_(data);
});
map.bind('remove',function(data){
ruler.remove.apply(ruler, [data.index]);
player.fire('markerRemoved',data);
- debug_('removed');
- debug_(data);
});
}
return soundDuration;
};
- //var waveContainer = viewer.find('.' + cssPref + 'image-canvas');
- this.debug( 'WAVECONTAINER?? LENGTH='+ waveContainer.length);
+
this.getWaveContainer =function(){
return waveContainer;
};
this.getContainerWidth =function(){
return waveContainer.width();
};
- this.debug( 'init ruler: container width '+this.getContainerWidth());
-
+
//private function used in resize() defined below
//var container = viewer.find('.' + cssPref + 'ruler');
return rulerContainer;
}
},
- // init: function(viewer, soundDuration){
- // this._super();
- // var cssPref = this.cssPrefix;
- //
- // this.getSoundDuration= function(){
- // return soundDuration;
- // };
- //
- // var waveContainer = viewer.find('.' + cssPref + 'image-canvas');
- // this.debug( 'WAVECONTAINER?? LENGTH='+ waveContainer.length);
- // this.getWaveContainer =function(){
- // return waveContainer;
- // };
- // //TODO: we dont need containerWiever here!!!
- // //better: it is usefult only for the canvas defined below. However...
- // this.getContainerWidth =function(){
- // return waveContainer.width();
- // };
- // this.debug( 'init ruler: container width '+this.getContainerWidth());
- //
- // //private function used in resize() defined below
- // var container = viewer.find('.' + cssPref + 'ruler');
- //
- // this.getRulerContainer = function(){
- // return container;
- // }
- // },
-
- //colors:{}, //used to draw rulermarkers
resize : function(){
var duration = this.getSoundDuration(); //in seconds
if (!duration) {
- this.debug("Can't draw ruler with a duration of 0");
+ this.debug("ruler.resize: Can't draw ruler with a duration of 0");
return;
}
var pixelOffset = this.toPixelOffset(newOffset);
if(rulermarker.positionInPixels != pixelOffset){ //should not be the case if this method is called from a mouse event
rulermarker.move(pixelOffset);
- // consolelog('moved');
- // }else{
- // consolelog('nothing to move');
}
- //this.debug('ruler.move: [from:'+from+', to:'+to+', real:'+newIndex+']');
if(to!=from){
var i1 = Math.min(from,to);
var i2 = Math.max(from,to)+1;
- //this.debug('updating ['+i1+','+i2+']');
this.each(i1,i2, function(index,rulermarker){
rulermarker.setIndex(index, true);
});
//add(offset, index, isMovable) adds a marker, movable if isMovable == true
add: function(offset, index, isMovable){
var soundPosition;
- var isMovable;
var markerClass;
if(index<0){
markerClass='marker';
}
- var container = this.getRulerContainer();
- var layout = container.find("."+this.cssPrefix + 'layout');
- var $J = this.$J;
- // var pointer = new RulerMarker($J(layout.get(0)),this.getWaveContainer(),markerClass);
-
-
+
var pointerOrMarker = new Timeside.classes.RulerMarker(this,this.getWaveContainer(),markerClass);
-
-
//call super constructor
//if it is a pointer, dont add it
if(markerClass != 'pointer'){
//rulermarker.setIndex.apply(rulermarker, [i,i!=indexIfMarker]); //update label width only if it is not this marker added
//as for this marker we update the position below (move)
});
- this.debug('added marker at index '+index+' offset: '+offset);
}else{
//note that setText is called BEFORE move as move must have the proper label width
pointerOrMarker.setText(this.makeTimeLabel(0));
//pointer.setText(markerClass== 'pointer' ? this.makeTimeLabel(0) : this.length);
//click on labels stop propagating. Always:
- var lbl = pointerOrMarker.getLabel();
- lbl.bind('click', function(evt){
- evt.stopPropagation();
- return false;
- });
+ var isPointer = markerClass === 'pointer';
+ this._setEditable(pointerOrMarker, isMovable, isPointer);
+ return pointerOrMarker;
+
+ },
- //if there are no events to associate, return it.
- if(!isMovable){
- return pointerOrMarker;
+ eventNamespace : 'rulerMouseEvent', //namespace for mouse events
+ mouseEventType : 'rulermarkermouseevent', //event type for fire TO THE PLAYER. The player then fires markerMouseEvent to outside
+
+ setEditable: function(index, value){
+ var a = this.toArray();
+ if(index>=0 && index < a.length){
+ this._setEditable(a[index],value,false);
}
+ },
+ //do not call, use setEditable(index,value) instead
+ _setEditable: function(pointerOrMarker, value, isPointer){
+ var eventNamespace = this.eventNamespace;
+ var doc = this.$J(document);
+ var lbl = pointerOrMarker.getLabel();
+ var me = this;
+ var mme = this.mouseEventType;
- //namespace for jquery event:
- var eventId = 'markerclicked';
- var doc = $J(document);
- var me = this;
+ lbl.unbind('.'+eventNamespace); //this should delete all previous events
+ //TODO: check!!!!
- //flag to be set to true when moving a poiner from mouse.
- //when true, movePointer (see below) has no effect
- //this.isPointerMovingFromMouse = false;
- //functions to set if we are moving the pointer (for player when playing)
- var mme = 'markermouseevent';
- lbl.bind('mouseenter.'+eventId,function(evt){
+ lbl.bind('mouseenter.'+eventNamespace,function(evt){
me.fire(mme,{
eventName: 'mouseenter',
eventObj: evt,
- index: markerClass=='pointer' ? -1 : pointerOrMarker.getIndex()
+ index: isPointer ? -1 : pointerOrMarker.getIndex()
});
+ return false;
});
- lbl.bind('mouseleave.'+eventId,function(evt){
+ lbl.bind('mouseleave.'+eventNamespace,function(evt){
me.fire(mme,{
eventName: 'mouseleave',
eventObj: evt,
- index: markerClass=='pointer' ? -1 : pointerOrMarker.getIndex()
+ index: isPointer ? -1 : pointerOrMarker.getIndex()
});
+ return false;
+ });
+
+ //to prevent page scrolling after mouseup, as click is also fired
+ lbl.bind('click.'+this.eventNamespace, function(evt){
+ return false;
});
+
- lbl.bind('mousedown.'+eventId,function(evt) {
+ lbl.bind('mousedown.'+eventNamespace,function(evt) {
if(evt.which===1){
- pointerOrMarker.isMovedByMouse = true;
- //consolelog('w '+evt.which);
-
+ if(value){
+ pointerOrMarker.isMovedByMouse = true;
+ }
+
+ //preventClickFire = false;
+
var launchDragStart = true;
var startX = evt.pageX; //lbl.position().left-container.position().left;
var startPos = lbl.position().left+lbl.width()/2;
-
+
evt.stopPropagation(); //dont notify the ruler or other elements;
var newPos = startPos;
- doc.bind('mousemove.'+eventId, function(evt_){
- var x = evt_.pageX;
- newPos = startPos+(x-startX);
- pointerOrMarker.move(newPos);
- //update the text if pointer
- if(markerClass=='pointer'){
- pointerOrMarker.setText(me.makeTimeLabel(me.toSoundPosition(newPos)));
+ doc.bind('mousemove.'+eventNamespace, function(evt_){
+ //preventClickFire=true;
+ if(value){
+ var x = evt_.pageX;
+ newPos = startPos+(x-startX);
+ pointerOrMarker.move(newPos);
+ //update the text if pointer
+ if(isPointer){
+ pointerOrMarker.setText(me.makeTimeLabel(me.toSoundPosition(newPos)));
+ }
}
-
if(launchDragStart){
launchDragStart = false;
me.fire(mme,{
eventName: 'dragstart',
eventObj: evt_,
- index: markerClass=='pointer' ? -1 : pointerOrMarker.getIndex()
+ index: isPointer ? -1 : pointerOrMarker.getIndex()
});
}
return false;
-
+
});
//to avoid scrolling
////TODO: check IE bug on mouseup on the ruler (pointer is moving too)
//TODO: what happens if the user releases the mouse OUTSIDE the browser???? check bug in IE (mouse release)
var mouseup = function(evt_){
- doc.unbind('mousemove.'+eventId);
- doc.unbind('mouseup.'+eventId);
+
+ doc.unbind('mousemove.'+eventNamespace);
+ doc.unbind('mouseup.'+eventNamespace);
evt_.stopPropagation();
- if(newPos == startPos){
- return false;
+ if(value){
+ if(newPos !== startPos){
+
+ var data = {
+ 'markerElement':pointerOrMarker,
+ 'soundPosition': me.toSoundPosition.apply(me,[newPos]),
+ 'isPointer':isPointer
+ };
+ me.fire('markermoved',data);
+ }
+ pointerOrMarker.isMovedByMouse = false;
+ }
+ if(evt_.pageX !== startX){
+ me.fire(mme,{
+ eventName: 'dragend',
+ eventObj: evt_,
+ index: isPointer ? -1 : pointerOrMarker.getIndex()
+ });
+ }else{
+ me.fire(mme,{
+ eventName: 'click',
+ eventObj: evt_,
+ index: isPointer ? -1 : pointerOrMarker.getIndex()
+ });
}
- var data = {
- 'markerElement':pointerOrMarker,
- 'soundPosition': me.toSoundPosition.apply(me,[newPos]),
- 'markerClass':markerClass
- };
- me.fire('markermoved',data);
-
- pointerOrMarker.isMovedByMouse = false;
- // if(markerClass=='pointer'){
- // me.isPointerMovingFromMouse = false;
- // }
-
- me.fire(mme,{
- eventName: 'mouseup',
- eventObj: evt_,
- index: markerClass=='pointer' ? -1 : pointerOrMarker.getIndex()
- });
-
return false;
};
- doc.bind('mouseup.'+eventId, mouseup);
+ doc.bind('mouseup.'+eventNamespace, mouseup);
}
me.fire(mme,{
eventName: 'mousedown',
eventObj: evt,
- index: markerClass=='pointer' ? -1 : pointerOrMarker.getIndex()
+ index: isPointer ? -1 : pointerOrMarker.getIndex()
});
-
+
return false;
});
-
- return pointerOrMarker;
-
-
},
//moves the pointer, does not notify any listener.
pointer.setText(this.makeTimeLabel(soundPosition));
pointer.move(pixelOffset); //does NOT fire any move method
}
- //this.debug('moving pointer: position set to '+offset);
return soundPosition;
},
//soundPosition is in seconds (float)
toPixelOffset: function(soundPosition) {
- //this.debug('sPos:' + soundPosition+ 'sDur: '+this.getSoundDuration());
var duration = this.getSoundDuration();
if (soundPosition < 0){
soundPosition = 0;
canvas = this.createCanvasVml(waveImgDiv, arrowBaselineWidth);
this.jQueryCanvas = $J(canvas.node);
var attributes = vml.getVmlAttr(canvasClass);
-// var attributes = ruler.classToRaphaelAttr[canvasClass];
-// if(!attributes){
-// attributes = ruler.getVmlAttr(canvasClass);
-// ruler.classToRaphaelAttr[canvasClass] = attributes;
-// }
canvas.attr(attributes); //Raphael method
this.moveCanvas = function(pixelOffset){
//for some reason, coordinates inside the VML object are stored by raphael with a zoom of 10:
var shape = paper.path(this.createCanvasPath(0, arrowBaseWidth));
return shape;
},
-// createCanvasVml: function(container, arrowBaseWidth){
-// //for creating a vml object, we make use of raphael to avoid a pain in the ... implementing a non standard Microsoft syntax
-// //(which, after a glance, it's even syntactically a mess)
-// //unfotunately (and this is a real lack not even planned to be fixed, see raphael forums),
-// //raphael does not allow to wrap existing object, so we have to register in this.elementToPaperMap (see timeside.js)
-// //which is a map where to each container is associated a raphael paper:
-// var paper = this.elementToPaperMap && this.elementToPaperMap[container.get(0)];
-// if(!paper){
-// var obj = this.elementToPaperMap;
-// if(!obj){
-// this.elementToPaperMap = {};
-// obj = this.elementToPaperMap;
-// }
-// paper = Raphael(container.get(0),container.width(),container.height());
-// obj[container.get(0)] = paper;
-// //paper canvas is a div with weird dimensions. You can check it by printing paper.canvas.outerHTML in IE.
-// //We set them to 100% so we dont have clipping regions when resizing (maximizing)
-// paper.canvas.style.width='100%';
-// paper.canvas.style.height='100%';
-// paper.canvas.width='100%';
-// paper.canvas.height='100%';
-// //apparently, there is also a clip style declaration made by raphael. The following code trhows an error in IE7:
-// //paper.canvas.style.clip = 'auto';
-// //however, even leaving the clip style declaration as it is, it seems to work (the div spans the whole width)
-// }
-//
-//
-// var shape = paper.path(this.createCanvasPath(0, arrowBaseWidth));
-// return shape;
-// },
//w must be odd. Cause the central line must be centered. Example:
//
classes:{},
player:undefined,
config: {
+ /**
+ *set to true to see debug messages on the console (only error or warning messages shown)
+ */
+ debug: false,
/*
* timeside scripts to be loaded when Timeside.load is called. URL paths are relative to the timeside folder, which
* will be determined according to the src attribute of the timeside.js script path (to be included in the <head> of the page)
$J : jQuery, //reference to jQuery for faster lookup inside methods
$TU : Timeside.utils, //reference to Timeside variable for faster lookup inside methods
debugging : false,
- debug : function(message) {
- if (this.debugging && typeof console != 'undefined' && console.log) {
- console.log(message);
+ debug : Timeside.config.debug ? function(message) {
+ var C = console;
+ if (C && C.log) {
+ C.log(message);
}
- },
+ } : function(message){},
/**
* 3 methods defining listeners, events fire and bind (aloing the lines of jQuery.bind, unbind and trigger.
bind : function(eventType, callback, optionalThisArgInCallback){
if(!callback || typeof callback !== 'function'){
- this.debug('cannot bind '+eventType+' to callback: the latter is null or not a function');
+ this.debug('TimesideClass.bind: cannot bind '+eventType+' to callback: the latter is null or not a function');
return;
}
if(!eventType){
- this.debug('eventType is empty in bind');
+ this.debug('TimesideClass.bind: eventType is empty in bind');
return;
}
var listenersMap = this.listenersMap;
fire : function(key, dataArgument){
var listenersMap = this.listenersMap;
if(!(listenersMap.hasOwnProperty(key))){
- //this.debug('"'+key+'" fired but no binding associated to it');
return;
}
if(arguments.length < 2 || !dataArgument){
}
}
return n;
- }
+ };
var ret = [];
for(var i =0; i<formatArray.length; i++){
var f = formatArray[i];
return ret;
}
return me;
- }
+ };
this.length = me.length; //in order to match the javascript array property
},
//length:0, //implement it as public property to be consistent with Array length property. Be careful however to NOT TO modify directly this property!!!
var l = this.length;
switch(len){
case 0:
- this.debug('each called without arguments!!!');
+ this.debug('TimesideClass.each: each called without arguments!!!');
return;
case 1:
//callback = arg[0];
}
callback = arg[len-1];
if(!(callback instanceof Function)){
- this.debug('callback NOT a function!!!');
+ this.debug('TimesideClass.each: callback NOT a function!!!');
return;
}
var me =this.toArray();
var raphael_papers = {};
ts.utils.vml = {
getVmlAttr: function(className){
- // if(className in classToRaphaelAttr){
- // consolelog('getVmlAttr: '+className+' exists');
- // }else{
- // consolelog('getVmlAttr: '+className+' to be created');
- // }
+
if(classToRaphaelAttr.hasOwnProperty(className)){
//if(className in classToRaphaelAttr){
return classToRaphaelAttr[className];
var l = rules.length;
for(var j=0; j <l; j++){
var rule = rules[j];
- // if(i==2){
- // consolelog(rule.selectorText);
- // }
+
if(rule.selectorText === dottedclassName){
var style = rule.style;
},
Raphael: function(element,w,h){
- //var element = arguments[0]; //the first argument is the html element (NOT jQuery element!!!
-
- // if(raphael_papers[element]){
- // consolelog('vml.Raphael: '+element.tagName+' has paper');
- // }else{
- // consolelog('vml.Raphael: '+element.tagName+' does not have paper');
- // }
+
//pass jQueryElm.get(0) as first argument, in case)
if(raphael_papers[element]){
},onError);
});
});
-}
+};
/**
* Loads scripts asynchronously
});
}
}
-}
\ No newline at end of file
+};
\ No newline at end of file
//loadPlayer(analizerUrl, soundUrl, itemId, visualizers, currentUserName, isStaffOrSuperuser)
- {% if user.is_staff or user.is_superuser %}
+ // django before was: if user.is_staff or user.is_superuser
+
+ {% if user.is_superuser %}
var superuser = true;
{% else %}
var superuser = false;
projects / telemeta.git / commitdiff