From: riccardo <riccardo@parisson.com>
Date: Fri, 24 Jun 2011 15:07:11 +0000 (+0200)
Subject: fixed some bugs (multiplay=false, load javascript and sound when needed, fixed all... 
X-Git-Tag: 1.1~57
X-Git-Url: https://git.parisson.com/?a=commitdiff_plain;h=e08e04bb1bc360e2bb878fbd53d14467fd3e6d85;p=telemeta.git

fixed some bugs (multiplay=false, load javascript and sound when needed, fixed all cases concerning superuser and authentication)

-------------This line and the following will be ignored --------------

modified:
  telemeta/htdocs/js/divmarker.js
  telemeta/htdocs/js/playerLoader.js
  telemeta/htdocs/timeside/js/markermap.js
  telemeta/htdocs/timeside/js/player.js
  telemeta/htdocs/timeside/js/timeside.js
  telemeta/templates/telemeta_default/mediaitem_detail.html
unknown:
  telemeta/htdocs/timeside/markermap.js
  telemeta/htdocs/timeside/player.js
  telemeta/htdocs/timeside/ruler.js
  telemeta/htdocs/timeside/rulermarker.js
  telemeta/htdocs/timeside/timeside.js
---

diff --git a/telemeta/htdocs/js/divmarker.js b/telemeta/htdocs/js/divmarker.js
index 558d9538..ed027104 100644
--- a/telemeta/htdocs/js/divmarker.js
+++ b/telemeta/htdocs/js/divmarker.js
@@ -136,8 +136,10 @@ Timeside.classes.MarkerMapDiv = Timeside.classes.TimesideArray.extend({
         var e_okButton = div.find('.markersdivSave');
         var e_descriptionText = div.find('.markersdivDescription');
         var e_titleText = div.find('.markersdivTitle');
+        var mas = div.find(".marker_author_span");
         if(value){
             div.css('backgroundColor','#E65911');
+            mas.css('color','#6a0307');
             e_descriptionText.removeAttr('readonly').removeClass('markersdivUneditable');
             e_titleText.removeAttr('readonly').removeClass('markersdivUneditable');
             e_okButton.add(e_okButton.parent()).show(); //hiding also the parent div saves space (padding bottom hidden)
@@ -149,6 +151,7 @@ Timeside.classes.MarkerMapDiv = Timeside.classes.TimesideArray.extend({
             e_okButton.add(e_okButton.parent()).hide(); //hiding also the parent div saves space (padding bottom hidden)
             editButton.show();
             div.css('backgroundColor','');
+            mas.css('color','#999'); //TODO: should be set in one declaration only. Change here and also in marker div creation
         }
 
         this.fire('edit',{'value':value, 'index':index});
@@ -203,8 +206,8 @@ Timeside.classes.MarkerMapDiv = Timeside.classes.TimesideArray.extend({
         '</div>',
         '<div zero_top_padding><textarea class="markersdivDescription"></textarea></div>',
         '<div zero_top_padding><a class="markersdivSave">OK</a></div>',
-        '<div zero_top_padding><span style="font-size:75%;color:#999">'+gettrans('author')+': '+marker.author+'</span></div>'].join("");
-        var div = this.$J('<div/>').attr('tabindex','0').addClass("markerdiv").html(html_); 
+        '<div zero_top_padding><span class="marker_author_span" style="font-size:75%;color:#999">'+gettrans('author')+': '+marker.author+'</span></div>'].join("");
+        var div = this.$J('<div/>').addClass("markerdiv").html(html_); //.attr('tabindex','0')
         div.find('a').attr('href','#');
         
         var e_okButton = div.find('.markersdivSave');
diff --git a/telemeta/htdocs/js/playerLoader.js b/telemeta/htdocs/js/playerLoader.js
index bc968b7a..0eae9e5b 100644
--- a/telemeta/htdocs/js/playerLoader.js
+++ b/telemeta/htdocs/js/playerLoader.js
@@ -155,7 +155,7 @@ function loadPlayer(analizerUrl, soundUrl, soundImgSize, itemId, visualizers, cu
                             title: argument.title,
                             author: argument.author,
                             isEditable: false,
-                            canBeSetEditable: (argument.author === currentUserName) || isStaffOrSuperuser,
+                            canBeSetEditable: isStaffOrSuperuser || (argument.author === currentUserName) ,
                             canBeAddedToPlaylist: currentUserName ? true : false,
                             isSavedOnServer: true
                         };
@@ -183,14 +183,24 @@ function loadPlayer(analizerUrl, soundUrl, soundImgSize, itemId, visualizers, cu
                         return m;
                     };
                 }
-                //create visualizer select element (append it later, document here could NOT be ready)
-                var visualizersSelectElement = $J('<select/>');
-                for(var name in visualizers){
-                    $J('<option/>').html(name).appendTo(visualizersSelectElement);
-                }
+               
 
                 //creating the visualizer <select/> tag
-                var imageSrcFcn = function(width,height){
+                
+//                var playerDiv = '#player';
+//                if(!($J(playerDiv).length)){
+//                    end(); //stop without raising error messages. If passed within Timeside.load, an error will be thrown
+//                }
+
+                var timesideConfig = {
+                    container: '#player',
+                    sound : soundUrl,
+                    soundDuration: timeInMSecs,
+                    onError: end, //globally defined (see above)
+                    markersArray: markerMap,
+                    newMarker: markerMode
+                };
+                timesideConfig.soundImage = function(width,height){
                     var player_image_url = visualizers[""+visualizersSelectElement.val()];
                     var _src_ = null;
                     if (player_image_url && (width || height)) {
@@ -198,17 +208,44 @@ function loadPlayer(analizerUrl, soundUrl, soundImgSize, itemId, visualizers, cu
                     }
                     return _src_;
                 };
-
-                var playerDiv = '#player';
-                if(!($J(playerDiv).length)){
-                    end(); //stop without raising error messages. If passed within Timeside.load, an error will be thrown
+                if(typeof soundImgSize === 'object' && (soundImgSize.hasOwnProperty('width') || soundImgSize.hasOwnProperty('height'))){
+                    timesideConfig.imageSize = soundImgSize;
+                }
+                //onReadyWithImage: set select visualizers:
+                 //create visualizer select element (append it later, document here could NOT be ready)
+                var visualizersSelectElement = $J('<select/>');
+                for(var name in visualizers){
+                    $J('<option/>').html(name).appendTo(visualizersSelectElement);
                 }
+               timesideConfig.onReadyWithImage = function(player){
+                   //setting up the select tag
 
-                //function(container, soundUrl, durationInMsec, visualizers, markerMap, showAddMarkerButton, onError,onReady ){
-                Timeside.load(playerDiv,soundUrl,timeInMSecs,imageSrcFcn,soundImgSize,markerMap,markerMode, function(msg){
-                    end(msg);
-                },
-                function(player){
+                    player.bind('waitShown', function(data){
+                        visualizersSelectElement.hide();
+                    });
+                    player.bind('waitHidden', function(data){
+                        visualizersSelectElement.css('display','inline-block');
+                    });
+
+                    //assigning event on select:
+                    visualizersSelectElement.change(
+                        function (){
+                            player.refreshImage.apply(player);
+                        });
+                    var control = player.getContainer().find('.ts-control');
+                    var ch = control.height();
+                    var margin = 3;
+                    visualizersSelectElement.css({
+                        'display': 'inline-block',
+                        'height':(ch-2*margin)+'px',
+                        'position':'absolute',
+                        'top':margin+'px',
+                        'right':margin,
+                        'margin':0
+                    });
+                    control.append(visualizersSelectElement);
+               };
+                timesideConfig.onReady = function(player){
                     //document here is READY
                     var markersUI = "#markers_div_id";
                     var mapUI = new Timeside.classes.MarkerMapDiv(markersUI);
@@ -256,8 +293,9 @@ function loadPlayer(analizerUrl, soundUrl, soundImgSize, itemId, visualizers, cu
                         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);
+                            map.setEditable(idx,data.value);
+//                            map.toArray()[idx].isEditable = data.value;
+//                            player.getRuler().setEditable(idx,data.value, false);
                         }
                     }); 
 
@@ -309,36 +347,7 @@ function loadPlayer(analizerUrl, soundUrl, soundImgSize, itemId, visualizers, cu
                     //populate the analyzers table
                     $J('#analyzer_div_id').find('table').find('tbody:last').append(analyzerContentArray.join(""));
 
-                    //setting up the select tag
-                   
-                    player.bind('waitShown', function(data){
-                        visualizersSelectElement.hide();
-                    });
-                    player.bind('waitHidden', function(data){
-                        visualizersSelectElement.css('display','inline-block');
-                    });
-
-                    //assigning event on select:
-                    visualizersSelectElement.change(
-                        function (){
-                            player.refreshImage.apply(player);
-                        });
-                    var control = player.getContainer().find('.ts-control');
-                    var ch = control.height();
-                    var margin = 3;
-                    visualizersSelectElement.css({
-                        'display': 'inline-block',
-                        'height':(ch-2*margin)+'px',
-                        'position':'absolute',
-                        'top':margin+'px',
-                        'right':margin,
-                        'margin':0
-                    });
-
-                    if(player.isImgRefreshing){
-                        visualizersSelectElement.hide();
-                    }
-                    control.append(visualizersSelectElement);
+                    
                     //Eventually, do 3 last things:
                     //1) call end (without arguments simply clears the wait span and avoid subsequent calls to end(msg) to
                     //display error messages)
@@ -488,18 +497,20 @@ function loadPlayer(analizerUrl, soundUrl, soundImgSize, itemId, visualizers, cu
                         p.show();
                         return false;
                     });
-                }
-                );
-            }
+                };
+                //and finally, load the player:
+                Timeside.load(timesideConfig);
+
+            };
                 
             //execute all the stuff once the document is ready:
-            var onSuccess = function(data){
-                $J(wdw).ready(function(){
-                    callbackAfterMarkersLoading(data);
-                });
-            }
+//            var onSuccess = function(data){
+//                $J(wdw).ready(function(){
+//                    callbackAfterMarkersLoading(data);
+//                });
+//            }
             //and niow call json method to load markers (load player also onError, no markers will be loaded)
-            json([itemId],"telemeta.get_markers", onSuccess,onSuccess);
+            json([itemId],"telemeta.get_markers", callbackAfterMarkersLoading,callbackAfterMarkersLoading);
         }
     });
    
diff --git a/telemeta/htdocs/timeside/js/markermap.js b/telemeta/htdocs/timeside/js/markermap.js
index 7164b395..ad3ae8c5 100644
--- a/telemeta/htdocs/timeside/js/markermap.js
+++ b/telemeta/htdocs/timeside/js/markermap.js
@@ -221,6 +221,32 @@ Timeside.classes.MarkerMap = Timeside.classes.TimesideArray.extend({
             }
         }
         return -(low + 1);  // key not found
+    },
+
+    //sets isEditable to value
+    setEditable: function(markerOrMarkerIndex, value) {
+        var idx = -1;
+        if(typeof markerOrMarkerIndex == 'number'){
+            idx = markerOrMarkerIndex;
+        }else if('id' in markerOrMarkerIndex && 'offset' in markerOrMarkerIndex){
+            idx = this.insertionIndex(markerOrMarkerIndex);
+            //idx>=0 ONLY if marker has been found
+        }
+        if(idx<0 || idx>=this.length){
+            this.debug('markermap.setEditable: index out of bounds or marker not found');
+            return -1;
+        }
+        var marker = this.toArray()[idx];
+        var oldVal = marker.isEditable ? true : false;
+        marker.isEditable = value;
+        this.fire('markerEditStateChanged',{
+            'index':idx,
+            'marker':marker,
+            'oldValue':oldVal,
+            'value':value
+        });
+        return idx;
     }
+
 }
 );
\ No newline at end of file
diff --git a/telemeta/htdocs/timeside/js/player.js b/telemeta/htdocs/timeside/js/player.js
index dd18d790..8e826fd2 100644
--- a/telemeta/htdocs/timeside/js/player.js
+++ b/telemeta/htdocs/timeside/js/player.js
@@ -35,30 +35,124 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
     // newMarkerCallback must be either a string or a function, the necessary checks is done in Timeside.load
     // (which calls this method)
     //if markersArray is not an array, it defaults to []
-    init: function(container, sound, soundDurationInMsec, soundImgFcn, soundImgSize, markersArray, newMarkerCallback) {
+    init: function(configObject) {
         this._super();
+        var $J = this.$J;
+        var me=this;
+
+        var msgs = configObject.messages;
+        if(msgs){
+            for(var k in msgs){
+                if(msgs.hasOwnProperty(k)){
+                    var ms = msgs[k];
+                    if(typeof ms === 'string'){
+                        this.msgs[k] = ms;
+                    }
+                }
+            }
+        }
+
+        var onError = configObject.onError;
+        if(typeof onError !== 'function'){
+            onError = function(msg){};
+        }
+
+        var onReady = configObject.onReady;
+        if(typeof onReady !== 'function'){
+            onReady = function(player){};
+        }
+
+        var onReadyWithImage = configObject.onReadyWithImage;
+        
+        if(typeof onReadyWithImage === 'function'){
+            var onReadyWithImageNamespace = 'imgRefreshed.temp_'+new Date().getTime(); //get an unique namespace
+            this.bind(onReadyWithImageNamespace,function(data){
+                onReadyWithImage(me);
+                me.unbind(onReadyWithImageNamespace);
+            });
+        }
+
+        var container = configObject.container;
+        container = container instanceof $J ? container : $J(container);
+        container = container.length ? container.eq(0) : undefined;
+        if (!container || !container.length){
+            onError('container not defined or invalid');
+            return;
+        }
+
+        var sMan = soundManager;
+        var sound = configObject.sound;
+        var createSound = false;
+        if(typeof sound !== 'string' && typeof sound !== 'object'){
+            onError('bad sound parameter (specify a a valid soundManager sound-object, an object with at least two properties, url and id, or URL as string)');
+            return;
+        }else if(typeof sound === 'string'){
+            createSound = true;
+            var soundURL = sound;
+            sound = {
+                id: 'sound',
+                autoLoad: false,
+                url: soundURL,
+                multiShot: false
+            };
+        //do a raw check to see if it is a soundmanager object
+        }else if(!sound.hasWonProperty('sID') || !sound.hasWonProperty('_iO') || !sound.hasWonProperty('url')){
+            if(!sound.hasWonProperty('url') || !sound.hasWonProperty('id')){ //it is not a soundManager object, has at least an url???
+                onError('bad sound parameter: object requires properties url and id at minimum');
+                return;
+            }
+            createSound = true;
+        }
+        if(createSound){
+            var soundOptions = sound;
+            if(sMan.canPlayURL(soundOptions.url)){ //this actually checks only if the url is well formed, not if the file is there
+                sound = sMan.createSound(soundOptions);
+            }else{
+                onError('bad sound parameter (soundManager.canPlayURL returned false)');
+                return;
+            }
+        }
+
+
+        var soundDurationInMsec = configObject.soundDuration;
+        if(isNaN(soundDurationInMsec) || soundDurationInMsec<=0){
+            onError('invalid soundDurationInMsec: NaN or not positive');
+            return;
+        }
+
+
+        var soundImgFcn = configObject.soundImage;
+
+        if(!(typeof soundImgFcn === 'string' || typeof soundImgFcn === 'function')){
+            onError('invalid sound soundImgFcn. Provide a callback(width,height) or a string denoting a valid URL');
+            return;
+        }else{
+            if(typeof soundImgFcn === 'string'){
+                var url = soundImgFcn;
+                this.imageCallback =  new function(w,h){
+                    return url;
+                };
+            }else{ //surely a function
+                this.imageCallback = soundImgFcn;
+            }
+        }
+
+        var soundImgSize = configObject.imageSize;
+        var markersArray = configObject.markersArray;
+        var newMarker = configObject.newMarker;
+
+
 
         this.playState = 0; //0: not playing, 1: loading, 2:buffering, 3 playing (sound heard)
         //container is the div #player
        
-        if (!container){
-            this.debug('ERROR: container is null in initializing the player');
-        }
-
         this.getContainer = function(){
             return container;
         };
         this.getSound = function(){
             return sound;
         };
-        if(typeof soundImgFcn == 'string'){
-            var url = soundImgFcn;
-            this.imageCallback =  new function(w,h){
-                return url;
-            };
-        }else if(typeof soundImgFcn === 'function'){
-            this.imageCallback = soundImgFcn;
-        }
+        
 
         var sd = this.toSec(soundDurationInMsec);
         this.getSoundDuration = function(){
@@ -84,15 +178,13 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         };
 
         var canAddMarkers = false;
-        if(newMarkerCallback){
+        if(newMarker === true || (typeof newMarker === 'function')){
             canAddMarkers = true;
-            if(typeof newMarkerCallback === 'function'){
-                this.newMarker = newMarkerCallback;
+            if(typeof newMarker === 'function'){
+                this.newMarker = newMarker;
             }
         }
        
-        //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 not created now, however, if it was, it should be given a src
         //as NOT specifying any src for image tags can be harmful,
@@ -103,7 +195,7 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         "<div class='ts-wave'>",
         "<div class='ts-image-canvas'></div>",
         "<div class='ts-image-container'>",
-       //lazily created:  "<img class='ts-image' src='xyz.png' alt='' />", //not providing a src attribute is harmful. Dummy src attribute
+        //lazily created:  "<img class='ts-image' src='xyz.png' alt='' />", //not providing a src attribute is harmful. Dummy src attribute
         "</div>",
         "</div>",
         "<div class='ts-control'>",
@@ -204,7 +296,11 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
             'overflow':'hidden'
         });
         //assigning display and title to all anchors
-        control.find('*').css({
+        var subcontrolsToBeSetVisible = control.find('*');
+        if(!canAddMarkers){
+            subcontrolsToBeSetVisible = subcontrolsToBeSetVisible.filter(':not(a.ts-set-marker)');
+        }
+        subcontrolsToBeSetVisible.css({
             'display':'inline-block',
             'overflow':'hidden'
         });
@@ -233,9 +329,9 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         };
         //bind mouse events:
         ruler.bind('rulermarkermouseevent', function(data){
-           var idx = data.index;
-           data.marker = idx > -1 ? me.getMarker(idx) : undefined;
-           me.fire('markerMouseEvent',data);
+            var idx = data.index;
+            data.marker = idx > -1 ? me.getMarker(idx) : undefined;
+            me.fire('markerMouseEvent',data);
         });
 
         //setting image size (if provided) and resize player. Note that _setImageSize (with underscore) is intended to be
@@ -273,6 +369,8 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         //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');
 
+
+        onReady(this);
     },
 
 
@@ -329,7 +427,10 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
                 player.play.apply(player);
             },100);
         }
-        this.fire('soundPositionSet',{player:this,oldSoundPosition:oldSoundPosition});
+        this.fire('soundPositionSet',{
+            player:this,
+            oldSoundPosition:oldSoundPosition
+        });
 
     },
     //given a marker at index I, specifies that a marker corss event is fired whenever the sound position (pointer)
@@ -402,15 +503,31 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         
         var updateWaitBar = this.setWait;
         //building immediately data events to be passed instead of bulding them in the loop whileplaying
-        var loadData = {player:this,oldPlayState:0, endOfPlayback:false};
-        var bufferData = {player:this,oldPlayState:0, endOfPlayback:false};
-        var playData = {player:this,oldPlayState:0, endOfPlayback:false};
-        var endData = {player:this,oldPlayState:0, endOfPlayback:true};
+        var loadData = {
+            player:this,
+            oldPlayState:0,
+            endOfPlayback:false
+        };
+        var bufferData = {
+            player:this,
+            oldPlayState:0,
+            endOfPlayback:false
+        };
+        var playData = {
+            player:this,
+            oldPlayState:0,
+            endOfPlayback:false
+        };
+        var endData = {
+            player:this,
+            oldPlayState:0,
+            endOfPlayback:true
+        };
         //done
         var playState = this.playState;
         if(!playState){ 
             if(loadingString){
-            updateWaitBar.apply(this,[loadingString]); //calling setWait of an empty string hides the wait, we dont want it here
+                updateWaitBar.apply(this,[loadingString]); //calling setWait of an empty string hides the wait, we dont want it here
             //ps: without apply this in updateWait is the dom window
             }
             loadData.oldPlayState = playState;
@@ -508,7 +625,11 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         if(sound){
             var v = this.isPlaying();
             sound.stop();
-            var data = {player:this, oldPlayState:this.playState, endOfPlayback:false};
+            var data = {
+                player:this,
+                oldPlayState:this.playState,
+                endOfPlayback:false
+            };
             this.playState = 0;
             this.fire('playStateChanged',data);
             this.setWait(this.isImgRefreshing ? this.msgs.imgRefreshing : '');
@@ -570,6 +691,7 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
             }
         },100);
     },
+    
     resize: function() {
         var height;
         var container = this.getContainer();
@@ -577,20 +699,27 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         var wave = container.find('.ts-wave');
 
         height = wave.height();
-        
-        if (height) {
-            //set image, imagecontainer and canvas (container on imagecontainer for lines and pointer triangles) css
-            var elements = wave.find('.ts-image-container').css('zIndex','0')
-            .add(wave.find('.ts-image-canvas').css('zIndex','1')); //the two children of ts-wave. Set also the zIndex
-                                                                   //in order to visualize the canvas OVER the wav image
-            var style = {
-                width: wave.width(),
-                height: height
-            };
-            elements.css(style);
-            elements.css('position','absolute');
-
-        }
+        //        if(!height){
+        //            height = this.minWaveHeight;
+        //            wave.css('height',height+'px');
+        //        }
+        //if (height) {
+        //set image, imagecontainer and canvas (container on imagecontainer for lines and pointer triangles) css
+        var elements = wave.find('.ts-image-container').css('zIndex','0')
+        .add(wave.find('.ts-image-canvas').css('zIndex','1')); //the two children of ts-wave. Set also the zIndex
+        //in order to visualize the canvas OVER the wav image
+        var style = {
+            width: wave.width(),
+            height: height,
+            border: 0,
+            padding:0,
+            margin:0,
+            top:0,
+            left:0
+        };
+        elements.css(style);
+        elements.css('position','absolute');
+        //}
 
         //refreshing images:
         this.refreshImage();
@@ -649,14 +778,14 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
             }
             updateWait();
             player.isImgRefreshing = false;
-            player.fire('ImgRefreshed');
+            player.fire('imgRefreshed');
         });
         if(ir && we && (!this.playState || this.playState===3)){ //if loading (1) or buffering (2) do not update wait.
             //If not playing (undefined or 0) playing (3) update wait
             this.setWait(ir);
         }
         this.isImgRefreshing = true;
-        this.fire('ImgRefreshing');
+        this.fire('imgRefreshing');
         image.attr('src', imgSrc);
        
     },
@@ -778,7 +907,7 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
     },
 
     each: function(){
-      var map = this.getMarkerMap();
+        var map = this.getMarkerMap();
         if(map){
             map.each.apply(map,arguments);
         }
@@ -818,6 +947,15 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         }
         return undefined;
     },
+
+    setMarkerEditable: function(identifier, value){
+        var map = this.getMarkerMap();
+        if(map){
+            return map.setEditable(identifier,value);
+        }
+        return undefined;
+    },
+
     //markers is an array of objects with at least the field offset:sconds.milliseconds
     loadMarkers: function(markers){
         //ruler.bind('markermoved',this.markerMoved,this);
@@ -830,8 +968,8 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
         var ruler = this.getRuler();
 
         //TODO: think about if clearing or not: we assign some bindings in the constructor, too:
-//        map.clear();
-//        ruler.clear();
+        //        map.clear();
+        //        ruler.clear();
        
   
         var rulerAdd = ruler.add;
@@ -887,6 +1025,12 @@ Timeside.classes.Player = Timeside.classes.TimesideClass.extend({
             player.fire('markerRemoved',data);
         });
 
+        //edit state changed
+        map.bind('markerEditStateChanged',function(data){
+            ruler.setEditable.apply(ruler, [data.index, data.value]);
+            player.fire('markerEditStateChanged',data);
+        });
+
     }
 
 });
\ No newline at end of file
diff --git a/telemeta/htdocs/timeside/js/timeside.js b/telemeta/htdocs/timeside/js/timeside.js
index d59510cb..2b709cb1 100644
--- a/telemeta/htdocs/timeside/js/timeside.js
+++ b/telemeta/htdocs/timeside/js/timeside.js
@@ -554,48 +554,48 @@ Timeside.classes.TimesideArray = Timeside.classes.TimesideClass.extend({
  *Main Timeside method to load player (see Timeside online doc)
  */
 
-Timeside.load =function(container, soundUrl, durationInMsec, soundImgFcn, soundImgSize, markersArray, newMarkerCallback, onError, onReady){
+Timeside.load =function(config){
 
     var $J = jQuery;
     var win = window;
     var doc = document;
-    var playerDiv = container;
-    onError = onError && typeof onError === 'function' ? onError : function(msg){
-        //if no error callback is defined, we want however warn onError.
-        // Define a cross-browser window.console.log method.
-        // For IE and FF without Firebug, fallback to using an alert.
-        var console = win.console;
-        var log = console && console.error ? console.error : (console && console.log ? console.log : undefined);
-        if (!log) {
-            log = win.opera ? win.opera.postError : alert;
-        }
-        log(msg);
-    };
-    //onREady, if not defined, we set it as an empty function
-    onReady = onReady && typeof onReady === 'function' ? onReady : function(player){};
-    
-    playerDiv = container instanceof $J ? container : $J(container);
-    playerDiv = playerDiv.length ? playerDiv.eq(0) : undefined;
-    
-    if (!playerDiv || !playerDiv.length){
-        onError('container not defined or invalid');
-        return;
-    }
-    durationInMsec = parseInt(durationInMsec);
-    if(isNaN(durationInMsec) || durationInMsec<=0){
-        onError('invalid duration: NaN or not positive');
-        return;
-    }
-
-    if(!(soundUrl)){
-        onError('invalid sound url');
-        return;
-    }
-
-    if(!(typeof soundImgFcn == 'string' || typeof soundImgFcn === 'function')){
-        onError('invalid sound image. Provide a callback(width,height) or a string denoting a valid url');
-        return;
-    }
+//    var playerDiv = container;
+//    onError = onError && typeof onError === 'function' ? onError : function(msg){
+//        //if no error callback is defined, we want however warn onError.
+//        // Define a cross-browser window.console.log method.
+//        // For IE and FF without Firebug, fallback to using an alert.
+//        var console = win.console;
+//        var log = console && console.error ? console.error : (console && console.log ? console.log : undefined);
+//        if (!log) {
+//            log = win.opera ? win.opera.postError : alert;
+//        }
+//        log(msg);
+//    };
+//    //onREady, if not defined, we set it as an empty function
+//    onReady = onReady && typeof onReady === 'function' ? onReady : function(player){};
+//
+//    playerDiv = container instanceof $J ? container : $J(container);
+//    playerDiv = playerDiv.length ? playerDiv.eq(0) : undefined;
+//
+//    if (!playerDiv || !playerDiv.length){
+//        onError('container not defined or invalid');
+//        return;
+//    }
+//    durationInMsec = parseInt(durationInMsec);
+//    if(isNaN(durationInMsec) || durationInMsec<=0){
+//        onError('invalid duration: NaN or not positive');
+//        return;
+//    }
+//
+//    if(!(soundUrl)){
+//        onError('invalid sound url');
+//        return;
+//    }
+//
+//    if(!(typeof soundImgFcn == 'string' || typeof soundImgFcn === 'function')){
+//        onError('invalid sound image. Provide a callback(width,height) or a string denoting a valid url');
+//        return;
+//    }
   
 
     $J(win).ready(function(){
@@ -603,11 +603,8 @@ Timeside.load =function(container, soundUrl, durationInMsec, soundImgFcn, soundI
         //onready is executed BEFORE onload, it basically queues several onload events.
         //It it is executed immetiately if soundmanager has already been loaded
         soundManager.onready(function() {
-            var sound = soundManager.createSound({
-                id: 'sound',
-                autoLoad: false,
-                url: soundUrl
-            });
+            
+            
             //get the current script path (this file name is timeside.js?... or simplt timeside.js)
             var scripts = $J('script');
             var thisScriptPath = '';
@@ -709,12 +706,10 @@ Timeside.load =function(container, soundUrl, durationInMsec, soundImgFcn, soundI
             }
             //finally,define the error function
             ts.utils.loadScripts(thisScriptPath,ts_scripts, function() {
-                var p = new ts.classes.Player(playerDiv, sound, durationInMsec, soundImgFcn, soundImgSize,
-                    markersArray,newMarkerCallback);
+                var p = new ts.classes.Player(config);
                 ts.player = p;
-                onReady(p);
                 return false;
-            },onError);
+            },config.onError);
         });
     });
 };
@@ -736,7 +731,7 @@ Timeside.utils.loadScripts = function(scriptsOptionalRoot,scriptArray, optionalO
     if(!optionalOnOkCallback || typeof optionalOnOkCallback !== 'function'){
         optionalOnOkCallback = function(){};
     }
-    if(!optionalOnErrorCallback|| typeof optionalOnErrorCallback !== 'function'){
+    if(!optionalOnErrorCallback || typeof optionalOnErrorCallback !== 'function'){
         optionalOnErrorCallback = function(msg){};
     }
 
diff --git a/telemeta/templates/telemeta_default/mediaitem_detail.html b/telemeta/templates/telemeta_default/mediaitem_detail.html
index 0c3532f7..02117338 100644
--- a/telemeta/templates/telemeta_default/mediaitem_detail.html
+++ b/telemeta/templates/telemeta_default/mediaitem_detail.html
@@ -12,53 +12,66 @@
 
 {% block extra_javascript %}
 {% if item %}
+
+{% if item.file %}
+{% if public_access or perms.telemeta.can_play_all_items %}
 <script src="{% url telemeta-timeside "js/libs/soundmanager2-nodebug-jsmin.js" %}" type="text/javascript"></script>
 <script src="{% url telemeta-timeside "js/timeside.js" %}" type="text/javascript"></script>
+{% endif %}
+{% endif %}
+
 <script src="{% url telemeta-js "popupdiv-min.js" %}" type="text/javascript"></script>
 <script src="{% url telemeta-js "playlist.js" %}" type="text/javascript"></script>
+
+{% if item.file %}
+{% if public_access or perms.telemeta.can_play_all_items %}
 <script src="{% url telemeta-js "playerLoader.js" %}" type="text/javascript"></script>
 <script src="{% url telemeta-js "divmarker.js" %}" type="text/javascript"></script>
-<script type="text/javascript">
-    soundManager.url = "{% url telemeta-timeside "swf/" %}";
-    soundManager.flashVersion = 9;
-    soundManager.useMovieStar = true; // enable MP4/M4A/AAC
-    soundManager.debugMode = false;
-    soundManager.allowPolling = true;
+{% endif %}
+{% endif %}
 
+<script type="text/javascript">
+    {% if item.file %}
+    {% if public_access or perms.telemeta.can_play_all_items %}
+        //initializing soundManager default properties
+        soundManager.url = "{% url telemeta-timeside "swf/" %}";
+        soundManager.flashVersion = 9;
+        soundManager.useMovieStar = true; // enable MP4/M4A/AAC
+        soundManager.debugMode = false;
+        soundManager.allowPolling = true;
+        //initializing the visualizers to be passed to the player
+        var visualizers = {};
+        {% for v in visualizers %}
+            visualizers["{{v.name}}"] = "{% url telemeta-item-visualize item.public_id,v.id,"WIDTH","HEIGHT" %}";
+        {% endfor %}
+        {% if user.is_superuser %}
+             loadPlayer('{% url telemeta-item-analyze-xml item.public_id %}',
+              "{% url telemeta-item-export item.public_id,"mp3" %}", undefined, '{{item.id}}', visualizers,
+              CURRENT_USER_NAME,  //undefined if !user.is_authenticated
+              true); //true because superuser
+        {% else %}
+           loadPlayer('{% url telemeta-item-analyze-xml item.public_id %}',
+             "{% url telemeta-item-export item.public_id,"mp3" %}", undefined, '{{item.id}}', visualizers,
+             CURRENT_USER_NAME,  //undefined if !user.is_authenticated
+             false); //false because not superuser
+        {% endif %}
+    {% endif %}
+    {% endif %}
+    //playlists:
     {% if user.is_authenticated %}
         {% for playlist in playlists %}
-        playlistUtils.addPlaylist('{{ playlist.playlist.title }}','{{playlist.playlist.public_id}}');
+            playlistUtils.addPlaylist('{{ playlist.playlist.title }}','{{playlist.playlist.public_id}}');
         {% endfor %}
-    {% endif %}
-
-    jQuery(window).ready(function(){
-        var anchor = jQuery('#_add_to_playlist');
-        if(anchor.length){
-            anchor.unbind('click').click(function(){
-                playlistUtils.showAddResourceToPlaylist(anchor,'item','{{item.id}}',gettrans('item added to the selected playlist'));
-                return false;
+            jQuery(window).ready(function(){
+                var anchor = jQuery('#_add_to_playlist');
+                if(anchor.length){
+                    anchor.unbind('click').click(function(){
+                        playlistUtils.showAddResourceToPlaylist(anchor,'item','{{item.id}}',gettrans('item added to the selected playlist'));
+                        return false;
+                    });
+                }
             });
-        }
-    });
-
-    //initializing the visualizers to be passed to the player
-    var visualizers = {};
-    {% for v in visualizers %}
-    visualizers["{{v.name}}"] = "{% url telemeta-item-visualize item.public_id,v.id,"WIDTH","HEIGHT" %}";
-    {% endfor %}
-    
-
- // loadPlayer(analizerUrl, soundUrl, itemId, visualizers, currentUserName, isStaffOrSuperuser)
- // django before was: if user.is_staff or user.is_superuser 
-
-   {% if public_access or perms.telemeta.can_play_all_items %}
-    var superuser = true;
-   {% else %}
-    var superuser = false;
-   {% endif %}
-    loadPlayer('{% url telemeta-item-analyze-xml item.public_id %}',
-    "{% url telemeta-item-export item.public_id,"mp3" %}", undefined, '{{item.id}}', visualizers, CURRENT_USER_NAME, superuser);
-
+    {% endif %}
 </script>
 {% endif %}
 {% endblock %}