]> git.parisson.com Git - telemeta.git/commitdiff
fixed username (now passed as variable)
authorriccardo <riccardo@parisson.com>
Wed, 11 May 2011 13:11:19 +0000 (15:11 +0200)
committerriccardo <riccardo@parisson.com>
Wed, 11 May 2011 13:11:19 +0000 (15:11 +0200)
telemeta/htdocs/js/playerUtils.js
telemeta/htdocs/timeside/src/divmarker.js
telemeta/htdocs/timeside/src/markermap.js
telemeta/htdocs/timeside/src/player.js
telemeta/htdocs/timeside/src/rulermarker.js
telemeta/templates/telemeta_default/mediaitem_detail.html

index 2d59a36d58de06dbf32ce4b685f1ef8c3c5d832e..0ebab94b1cbe5ea09af590baef2b74784fd7a90d 100644 (file)
@@ -54,7 +54,7 @@ function togglePlayerMaximization() {
 //    },600);
 //}
 
-function loadPlayer(analizerUrl, soundUrl, visualizers){
+function loadPlayer(analizerUrl, soundUrl, itemId, visualizers, currentUserName){
     
     if(!(analizerUrl) || !(soundUrl)){
         return;
@@ -91,7 +91,7 @@ function loadPlayer(analizerUrl, soundUrl, visualizers){
             var pfl = parseFloat;
             var timeInMSecs=pin(duration[0])*3600+pin(duration[1])*60+pfl(duration[2]);
             timeInMSecs = Math.round(timeInMSecs*1000);
-            load_player(soundUrl, timeInMSecs,visualizers);
+            load_player(soundUrl, timeInMSecs, itemId, visualizers, currentUserName);
         },
         error:function(){
             msgElm.parent().html("<img src='/images/dialog-error.png' style='vertical-align:middle'/><span class='login-error'>Error loading analyzer</span>");
@@ -101,7 +101,7 @@ function loadPlayer(analizerUrl, soundUrl, visualizers){
 
 
 //loads a player WAITING for the sound identified by soundUrl to be FULLY LOADED!!!!
-function load_player(soundUrl, durationInMsecs, visualizers) {
+function load_player(soundUrl, durationInMsecs, itemId, visualizers, currentUserName) {
     consolelog('PlayerUtils.load_player: '+soundUrl+' '+durationInMsecs);
     var load_player2 = this.load_player2;
 
@@ -120,7 +120,7 @@ function load_player(soundUrl, durationInMsecs, visualizers) {
             if(loadImmediately){
                 consolelog('entering while loading setting up---------------'+this.bytesLoaded+' of '+this.bytesTotal);
                 loadImmediately=false;
-                load_player2(this, this.duration,visualizers);
+                load_player2(this, this.duration, itemId, visualizers, currentUserName);
             }
         }
     });
@@ -128,13 +128,13 @@ function load_player(soundUrl, durationInMsecs, visualizers) {
         //TODO: remove this code is only temporary here!!!!!!!!!!!!!!!!!!!!1
         loadScripts('/timeside/src/',['rulermarker.js', //'markerlist.js',
             'markermap.js', 'player.js', 'ruler.js','divmarker.js'], function(){
-                load_player2(sound,durationInMsecs,visualizers);
+                load_player2(sound,durationInMsecs,itemId, visualizers, currentUserName);
             });
     }
 
 }
 //NOTE: the duration must be present. Loaded from xmlanalyzer (see above)
-function load_player2(sound, durationInMsec, visualizers) {
+function load_player2(sound, durationInMsec, itemId, visualizers, currentUserName) {
     
     if (!$('#player').length){
         return;
@@ -145,9 +145,9 @@ function load_player2(sound, durationInMsec, visualizers) {
     $('.ts-wave a img').insertAfter('.ts-wave a');
     $('.ts-wave a').remove();
 
-    var p = new Player(jQuery('#player'), sound, durationInMsec, visualizers);
+    var p = new Player(jQuery('#player'), sound, durationInMsec, itemId, visualizers, currentUserName);
     consolelog('initialized player');
-    p._setupInterface(CURRENT_USER_NAME ? true : false);
+    p._setupInterface();
     //p.loadMarkers();
 
     player = p;
index 54fcb3b94b61662228a6ca7624646787ef632c35..f9cfd0511135f955aba3bd7a2538bad5d5d40c62 100644 (file)
@@ -9,9 +9,12 @@
  * Class for showing/editing a marker on details. 
  */
 var MarkerMapDiv = TimesideArray.extend({
-    init:function(){
+    init:function(currentUserName){
         this._super();
         this.div = this.$J("#markers_div_id");
+        this.getCurrentUserName = function(){
+            return currentUserName;
+        }
     },
     //overridden
     add: function(marker, index,  isNew){
@@ -237,8 +240,9 @@ var MarkerMapDiv = TimesideArray.extend({
         e_descriptionText.attr('readonly','readonly').addClass('markersdivUneditable').unbind('focus');
         e_titleText.attr('readonly','readonly').addClass('markersdivUneditable').unbind('focus');
 
-        //add to playlist always visible, provided that it is saved on server
-        if(!marker.isSavedOnServer){
+        //add to playlist always visible, provided that it is saved on server AND current user is logged
+        //(getCurrentUserName evaluates to true)
+        if(!marker.isSavedOnServer || !this.getCurrentUserName()){
             e_addplaylistButton.hide();
         }else{
             e_addplaylistButton.unbind('click').bind('click',function(evtObj_){
@@ -256,7 +260,8 @@ var MarkerMapDiv = TimesideArray.extend({
                 return false;
             });
         }
-        if(!marker.isEditable){ //marker is editable means that author == CURRENT_USER_NAME. addToPlaylist always visible
+        if(!marker.isEditable){ //marker is editable means that 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
index 839a2a25e566866e908f6c29e5ea4728445ff792..2d3df74de110d818078cdcbcc1aad4dc92886784 100644 (file)
@@ -6,12 +6,18 @@
  */
 var MarkerMap = TimesideArray.extend({
 
-    init: function() {
+    init: function(itemId, currentUserName) {
         this._super();
         var ui = uniqid; //defined in application.js (global vars and functions)
         this.uniqid = function(){
             return  ui();
         };
+        this.getItemId = function(){
+            return itemId;
+        }
+        this.getCurrentUserName = function(){
+            return currentUserName;
+        }
     },
 
     //overridden
@@ -50,8 +56,9 @@ var MarkerMap = TimesideArray.extend({
         if(typeof argument == 'string'){ //to be sure, it might be that we pass an offset in string format
             argument = pFloat(argument);
         }
+        var currentUserName = this.getCurrentUserName();
         if(typeof argument == 'object'){
-            var editable = CURRENT_USER_NAME === argument.author;
+            var editable = currentUserName === argument.author;
             marker = {
                 id: argument.public_id,
                 offset: pFloat(argument.time), //IMPORTANT: IT IS A STRING!!!!!!
@@ -67,7 +74,7 @@ var MarkerMap = TimesideArray.extend({
                 offset: pFloat(argument),
                 desc: "",
                 title: "",
-                author: CURRENT_USER_NAME,
+                author: currentUserName,
                 isEditable: true,
                 isSavedOnServer: false
             };
@@ -132,7 +139,7 @@ var MarkerMap = TimesideArray.extend({
         }
         
         //TODO: item public id defined elsewhere up, not here inside
-        var itemid = ITEM_PUBLIC_ID;
+        var itemid = this.getItemId();
         var isSavedOnServer = marker.isSavedOnServer;
         var method = isSavedOnServer ? "telemeta.update_marker" : "telemeta.add_marker";
         var param = {
index 4803e8c794da253866063a162d1e731ce8b99c41..7e9470c038a42bcd808006fd883ffd4311af1ac7 100644 (file)
@@ -2,13 +2,18 @@ var Player = TimesideClass.extend({
     
     //sound duration is in milliseconds because the soundmanager has that unit,
     //player (according to timeside syntax) has durations in seconds
-    init: function(container, sound, soundDurationInMsec,visualizers) {
+    init: function(container, sound, soundDurationInMsec, itemId, visualizers, currentUserName) {
         this._super();
         var player = this;
-        
+
+
         if (!container){
             this.debug('ERROR: container is null in initializing the player')
         }
+        this.getItemId = function(){
+            return itemId;
+        }
+
         this.getContainer = function(){
             return container;
         }
@@ -152,26 +157,25 @@ var Player = TimesideClass.extend({
         };
 
         //initializing markermap and markerui
-        var map = new MarkerMap();
+        var map = new MarkerMap(this.getItemId(), currentUserName);
         this.getMarkerMap = function(){
             return map;
         }
-        var mapUI = new MarkerMapDiv();
+        var mapUI = new MarkerMapDiv(currentUserName);
         this.getMarkersUI = function(){
             return mapUI;
         }
+        this.getCurrentUserName = function(){
+            return currentUserName;
+        }
     //TODO: define setUpInterface here????
 
     },
 
   
 
-    _setupInterface: function(isInteractive) {
+    _setupInterface: function() {
         
-        this.isInteractive = function(){
-            return isInteractive;
-        }
-
         var sound = this.getSound();
         consolelog('player _setupInterface sound.readyState:'+sound.readyState); //handle also cases 0 and 2????
         
@@ -283,7 +287,7 @@ var Player = TimesideClass.extend({
         //TODO: why the line below does not work?!!!!!
         //var viewer = jQueryObjs.find('.ts-viewer');
         var viewer = this.getContainer().find('.ts-viewer');
-        var ruler = new Ruler(viewer, this.getSoundDuration(), isInteractive);
+        var ruler = new Ruler(viewer, this.getSoundDuration(), (this.getCurrentUserName() || false));
         this.getRuler = function(){
             return ruler;
         }
@@ -323,7 +327,7 @@ var Player = TimesideClass.extend({
         //finally, load markers and bind events for markers (see method below):
         //NOTE: loadMarkers ASYNCHRONOUSLY CALLS THE SERVER, SO METHODS WRITTEN AFTER IT MIGHT BE EXECUTED BEFORE
         //loadMarkers has finished its job
-        this.loadMarkers(isInteractive);
+        this.loadMarkers();
 
         //set the marker popup
         //functions to set the marker popup
@@ -610,11 +614,11 @@ var Player = TimesideClass.extend({
 
     },
         
-    loadMarkers: function(isInteractive_){
+    loadMarkers: function(){
         //ruler.bind('markermoved',this.markerMoved,this);
         var $J = this.$J; //reference to jQuery
-
-        var itemId = ITEM_PUBLIC_ID;
+        var isInteractive_ = this.getCurrentUserName() || false;
+        var itemId = this.getItemId();
 
         var player = this;
         //initialize the map.
index 1e3803b937db467c88854c494c88168b559d0f29..171e46743ebd3bac5f00a28ae413d2d04377b97c 100644 (file)
@@ -95,86 +95,86 @@ var RulerMarker = TimesideClass.extend({
         //CODE HERE BELOW IS EXECUTED ONLY IF THE MARKER HAS CAN MOVE IMPLEMENTED (see Ruler???).
         //Otherwise, no mouse event can call these methods
         //re-implement function move
-//        var position = 0;
-//        var relativePosition = 0; //position in percentage of container width, set it in move and use it in refreshPosition
-//
-//        var mRound = Math.round; //instantiate the functio once
+        //        var position = 0;
+        //        var relativePosition = 0; //position in percentage of container width, set it in move and use it in refreshPosition
+        //
+        //        var mRound = Math.round; //instantiate the functio once
 
-//        this.move = function(pixelOffset) {
-//            var width =  viewer.width();
-//            if (position != pixelOffset) {
-//                if (pixelOffset < 0) {
-//                    pixelOffset = 0;
-//                } else if (pixelOffset >= width) {
-//                    pixelOffset = width - 1;
-//                }
-//                nodes.each(function(i, node) {
-//                    $J(node).css('left', mRound(node.originalPosition + pixelOffset) + 'px');
-//                });
-//                position = pixelOffset;
-//                this.refreshLabelPosition(width);
-//                //store relative position (see refreshPosition below)
-//                relativePosition = pixelOffset == width-1 ? 1 : pixelOffset/width;
-//            }
-//            return this;
-//        };
-//
-//        this.refreshLabelPosition = function(optionalContainerWidth){
-//            if(!(optionalContainerWidth)){
-//                optionalContainerWidth = viewer.width();
-//            }
-//            var width = optionalContainerWidth;
-//            var pixelOffset = position;
-//            var labelWidth = label.outerWidth(); //consider margins and padding //label.width();
-//            var labelPixelOffset = pixelOffset - labelWidth / 2;
-//            if (labelPixelOffset < 0){
-//                labelPixelOffset = 0;
-//            }else if (labelPixelOffset + labelWidth > width){
-//                labelPixelOffset = width - labelWidth;
-//            }
-//            label.css({
-//                left: mRound(labelPixelOffset) + 'px'
-//            });
-//
-//        };
-//
-//        //function called on ruler.resize. Instead of recreating all markers, simply redraw them
-//        this.refreshPosition = function(){
-//            var width =  viewer.width();
-//            //store relativePosition:
-//            var rp = relativePosition;
-//            this.move(mRound(relativePosition*width));
-//            //reset relative position, which does not have to change
-//            //but in move might have been rounded:
-//            relativePosition = rp;
-//            //last thing: resize the vertical line.
-//            //Assumptions (having a look at the web page element with a debugger and the code above
-//            //which uses jsgraphics):
-//            //The line is the first item (see drawLine above)
-//            //not only the height, but also the height of the clip property must be set
-//            var h = viewer.height();
-//            $J(nodes[0]).css({
-//                'height':h+'px',
-//                'clip': 'rect(0px 1px '+h+'px 0px)'
-//            });
-//        }
-//
-//        this.remove = function() {
-//            painter.clear();
-//            $J(painter.cnv).remove();
-//            label.remove();
-//            return this;
-//        };
+        //        this.move = function(pixelOffset) {
+        //            var width =  viewer.width();
+        //            if (position != pixelOffset) {
+        //                if (pixelOffset < 0) {
+        //                    pixelOffset = 0;
+        //                } else if (pixelOffset >= width) {
+        //                    pixelOffset = width - 1;
+        //                }
+        //                nodes.each(function(i, node) {
+        //                    $J(node).css('left', mRound(node.originalPosition + pixelOffset) + 'px');
+        //                });
+        //                position = pixelOffset;
+        //                this.refreshLabelPosition(width);
+        //                //store relative position (see refreshPosition below)
+        //                relativePosition = pixelOffset == width-1 ? 1 : pixelOffset/width;
+        //            }
+        //            return this;
+        //        };
+        //
+        //        this.refreshLabelPosition = function(optionalContainerWidth){
+        //            if(!(optionalContainerWidth)){
+        //                optionalContainerWidth = viewer.width();
+        //            }
+        //            var width = optionalContainerWidth;
+        //            var pixelOffset = position;
+        //            var labelWidth = label.outerWidth(); //consider margins and padding //label.width();
+        //            var labelPixelOffset = pixelOffset - labelWidth / 2;
+        //            if (labelPixelOffset < 0){
+        //                labelPixelOffset = 0;
+        //            }else if (labelPixelOffset + labelWidth > width){
+        //                labelPixelOffset = width - labelWidth;
+        //            }
+        //            label.css({
+        //                left: mRound(labelPixelOffset) + 'px'
+        //            });
+        //
+        //        };
+        //
+        //        //function called on ruler.resize. Instead of recreating all markers, simply redraw them
+        //        this.refreshPosition = function(){
+        //            var width =  viewer.width();
+        //            //store relativePosition:
+        //            var rp = relativePosition;
+        //            this.move(mRound(relativePosition*width));
+        //            //reset relative position, which does not have to change
+        //            //but in move might have been rounded:
+        //            relativePosition = rp;
+        //            //last thing: resize the vertical line.
+        //            //Assumptions (having a look at the web page element with a debugger and the code above
+        //            //which uses jsgraphics):
+        //            //The line is the first item (see drawLine above)
+        //            //not only the height, but also the height of the clip property must be set
+        //            var h = viewer.height();
+        //            $J(nodes[0]).css({
+        //                'height':h+'px',
+        //                'clip': 'rect(0px 1px '+h+'px 0px)'
+        //            });
+        //        }
+        //
+        //        this.remove = function() {
+        //            painter.clear();
+        //            $J(painter.cnv).remove();
+        //            label.remove();
+        //            return this;
+        //        };
 
-         this.getViewer = function(){
-           return viewer;
-       }
-         this.getPainter = function(){
-           return painter;
-       }
+        this.getViewer = function(){
+            return viewer;
+        }
+        this.getPainter = function(){
+            return painter;
+        }
 
-       this.positionInPixels = 0;
-       this.positionAsViewerRatio = 0;
+        this.positionInPixels = 0;
+        this.positionAsViewerRatio = 0;
 
     },
 
@@ -207,79 +207,80 @@ var RulerMarker = TimesideClass.extend({
     //these methods are executed only if marker is movable (see Ruler.js)
 
     move : function(pixelOffset) {
-            var width =  this.getViewer().width();
-            if (this.positionInPixels != pixelOffset) {
-                if (pixelOffset < 0) {
-                    pixelOffset = 0;
-                } else if (pixelOffset >= width) {
-                    pixelOffset = width - 1;
-                }
-                var nodes = this.getNodes();
-                var $J = this.$J;
-                var mRound = this.mRound;
-                nodes.each(function(i, node) {
-                    $J(node).css('left', mRound(node.originalPosition + pixelOffset) + 'px');
-                });
-                this.positionInPixels = pixelOffset;
-                this.refreshLabelPosition(width);
-                //store relative position (see refreshPosition below)
-                this.positionAsViewerRatio = pixelOffset == width-1 ? 1 : pixelOffset/width;
+        var width =  this.getViewer().width();
+        if (this.positionInPixels != pixelOffset) {
+            if (pixelOffset < 0) {
+                pixelOffset = 0;
+            } else if (pixelOffset >= width) {
+                pixelOffset = width - 1;
             }
-            return this;
-        },
-
-        refreshLabelPosition : function(optionalContainerWidth){
-            if(!(optionalContainerWidth)){
-                optionalContainerWidth = this.getViewer().width();
-            }
-            var label = this.getLabel();
-            var width = optionalContainerWidth;
-            var pixelOffset = this.positionInPixels;
-            var labelWidth = label.outerWidth(); //consider margins and padding //label.width();
-            var labelPixelOffset = pixelOffset - labelWidth / 2;
-            if (labelPixelOffset < 0){
-                labelPixelOffset = 0;
-            }else if (labelPixelOffset + labelWidth > width){
-                labelPixelOffset = width - labelWidth;
-            }
-            label.css({
-                left: this.mRound(labelPixelOffset) + 'px'
-            });
-
-        },
-
-        //function called on ruler.resize. Instead of recreating all markers, simply redraw them
-        refreshPosition : function(){
-            var width =  this.getViewer().width();
-            //store relativePosition:
-            var rp = this.positionAsViewerRatio;
-            this.move(this.mRound(this.positionAsViewerRatio*width));
-            //reset relative position, which does not have to change
-            //but in move might have been rounded:
-            this.positionAsViewerRatio = rp;
-            //last thing: resize the vertical line.
-            //Assumptions (having a look at the web page element with a debugger and the code above
-            //which uses jsgraphics):
-            //The line is the first item (see drawLine above)
-            //not only the height, but also the height of the clip property must be set
-            var h = this.getViewer().height();
             var nodes = this.getNodes();
             var $J = this.$J;
-            $J(nodes[0]).css({
-                'height':h+'px',
-                'clip': 'rect(0px 1px '+h+'px 0px)'
+            var mRound = this.mRound;
+            nodes.each(function(i, node) {
+                $J(node).css('left', mRound(node.originalPosition + pixelOffset) + 'px');
             });
-        },
+            this.positionInPixels = pixelOffset;
+            this.refreshLabelPosition(width);
+            //store relative position (see refreshPosition below)
+            this.positionAsViewerRatio = pixelOffset == width-1 ? 1 : pixelOffset/width;
+        }
+        return this;
+    },
 
-        remove : function() {
-            var painter = this.getPainter();
-            var label = this.getLabel();
-            painter.clear();
-            $J(painter.cnv).remove();
-            label.remove();
-            return this;
-        },
+    refreshLabelPosition : function(optionalContainerWidth){
+        if(!(optionalContainerWidth)){
+            optionalContainerWidth = this.getViewer().width();
+        }
+        var label = this.getLabel();
+        var width = optionalContainerWidth;
+        var pixelOffset = this.positionInPixels;
+        var labelWidth = label.outerWidth(); //consider margins and padding //label.width();
+        var labelPixelOffset = pixelOffset - labelWidth / 2;
+        if (labelPixelOffset < 0){
+            labelPixelOffset = 0;
+        }else if (labelPixelOffset + labelWidth > width){
+            labelPixelOffset = width - labelWidth;
+        }
+        label.css({
+            left: this.mRound(labelPixelOffset) + 'px'
+        });
+
+    },
+
+    //function called on ruler.resize. Instead of recreating all markers, simply redraw them
+    refreshPosition : function(){
+        var width =  this.getViewer().width();
+        //store relativePosition:
+        var rp = this.positionAsViewerRatio;
+        this.move(this.mRound(this.positionAsViewerRatio*width));
+        //reset relative position, which does not have to change
+        //but in move might have been rounded:
+        this.positionAsViewerRatio = rp;
+        //last thing: resize the vertical line.
+        //Assumptions (having a look at the web page element with a debugger and the code above
+        //which uses jsgraphics):
+        //The line is the first item (see drawLine above)
+        //not only the height, but also the height of the clip property must be set
+        var h = this.getViewer().height();
+        var nodes = this.getNodes();
+        var $J = this.$J;
+        $J(nodes[0]).css({
+            'height':h+'px',
+            'clip': 'rect(0px 1px '+h+'px 0px)'
+        });
+    },
+
+    remove : function() {
+        var $J = this.$J;
+        var painter = this.getPainter();
+        var label = this.getLabel();
+        painter.clear();
+        $J(painter.cnv).remove();
+        label.remove();
+        return this;
+    },
 
-        mRound: Math.round
+    mRound: Math.round
 
 });
index 50ef1d3dc82f55f7edfa2ff1cccbf8d114e4542e..933217c32887201eec12b5793ffcd78c5166faa6 100644 (file)
@@ -13,7 +13,7 @@
 
 {% block extra_javascript %}
 {% if item.file %}
-    {% if public_access or user.is_staff %}
+
       <!--<script src="{% url telemeta-js "wz_jsgraphics.js" %}" type="text/javascript"></script>-->
 <script src="{% url telemeta-js "soundmanager2.js" %}" type="text/javascript"></script>
 <script src="{% url telemeta-timeside "src/playlist.js" %}" type="text/javascript"></script>
@@ -43,9 +43,9 @@
         {% endif %}
     };
 
-    {% if item %}
-    var ITEM_PUBLIC_ID = '{{item.public_id}}';
-    {% endif %}
+//    {% if item %}
+//    var ITEM_PUBLIC_ID = '{{item.public_id}}';
+//    {% endif %}
 
     var scripts = ["{% url telemeta-js "wz_jsgraphics.js" %}", "{% url telemeta-timeside "src/timeside.js" %}","{% url telemeta-js "playerUtils.js" %}"];
 
@@ -62,7 +62,7 @@
             alert(jQuery('.ts-wave a'));
             loadScripts(scripts, 
             function(){
-                loadPlayer('{% url telemeta-item-analyze-xml item.public_id %}',"{% url telemeta-item-export item.public_id,"mp3" %}",visualizers);
+                loadPlayer('{% url telemeta-item-analyze-xml item.public_id %}',"{% url telemeta-item-export item.public_id,"mp3" %}",'{{item.id}}', visualizers, CURRENT_USER_NAME);
                 setupPlaylist();
             });
         }
@@ -73,7 +73,7 @@
         if(_jQuery_loaded){
             loadScripts(scripts, 
             function(){
-                loadPlayer('{% url telemeta-item-analyze-xml item.public_id %}',"{% url telemeta-item-export item.public_id,"mp3" %}", visualizers);
+                loadPlayer('{% url telemeta-item-analyze-xml item.public_id %}',"{% url telemeta-item-export item.public_id,"mp3" %}", '{{item.id}}', visualizers, CURRENT_USER_NAME);
                 setupPlaylist();
             });
         }
@@ -81,7 +81,7 @@
 
 </script>
 <!--item.approx_duration-->
-{% endif %}
+
 {% endif %}
 {% endblock %}