From: riccardo Date: Thu, 24 Feb 2011 17:31:29 +0000 (+0100) Subject: Markers div and tab fixed (analysis and markers tabs). Adding, removing, moving and... X-Git-Tag: 1.1~432 X-Git-Url: https://git.parisson.com/?a=commitdiff_plain;h=62a0de4b00e4058d501fababc564e7def34563b8;p=telemeta.git Markers div and tab fixed (analysis and markers tabs). Adding, removing, moving and editing of markers fixed. Added two icons (edited in order to have transparent background). Pointer changed to fixed text "+" instead of the current pointer position (which hides the markers). Keeping the dynamical label of the current pointer position in a different place (so that it doesnt hide the markers) is too hard, given the current code. --- diff --git a/telemeta/htdocs/css/telemeta.css b/telemeta/htdocs/css/telemeta.css index c4dbdd31..de5ae009 100644 --- a/telemeta/htdocs/css/telemeta.css +++ b/telemeta/htdocs/css/telemeta.css @@ -127,9 +127,8 @@ a img { border: none; } background-color: #fff; color: #555; border: 1px solid #adadad; - width: 301px; + /*width: 301px;height: 17px;*/ padding: 2px; - height: 17px; margin: 5px 0 0; font-size: 1em; } @@ -751,40 +750,17 @@ a.image-link { padding: 1em; } -/* -code for tabs. See link http://www.sohtanaka.com/web-design/simple-tabs-w-css-jquery/ -There is also a plugin jQuery UI, but is heavy, hard to understand (compared to implementing it on my own) -and heavy for the page (the re are tons of files to download and include in the page) -Example usage: - - -
-
- -
-
- -
-
-*/ - - - - - - .tab_unselected { - background-color: #999999; - color: #666666; - border: 1px solid #999999; + background-color: #cccccc; + font-weight: normal; + color: #333333; + border: 1px solid #cccccc; z-index: 0; } .tab_selected { background-color: #ffffff; color: #000000; + font-weight: bold; border-top: 1px solid #999999; border-right: 1px solid #999999; border-left: 1px solid #999999; diff --git a/telemeta/htdocs/images/download.png b/telemeta/htdocs/images/download.png index 7b969e9a..163ac879 100644 Binary files a/telemeta/htdocs/images/download.png and b/telemeta/htdocs/images/download.png differ diff --git a/telemeta/htdocs/images/plots.png b/telemeta/htdocs/images/plots.png index 8cbf0ca4..e8504dff 100644 Binary files a/telemeta/htdocs/images/plots.png and b/telemeta/htdocs/images/plots.png differ diff --git a/telemeta/htdocs/timeside/src/controller.js b/telemeta/htdocs/timeside/src/controller.js index 287aa75c..70e7b56d 100644 --- a/telemeta/htdocs/timeside/src/controller.js +++ b/telemeta/htdocs/timeside/src/controller.js @@ -47,14 +47,16 @@ TimeSide(function($N) { _onMarkerMove: function(e, data) { if (this.cfg.map) { + selectMarkerTab(); //defined in mediaitem|_detail.html this.cfg.map.move(this.cfg.map.byId(data.id), data.offset); } }, _onMarkerAdd: function(e, data) { if (this.cfg.map) { + selectMarkerTab(); //defined in mediaitem|_detail.html //this.refreshMarkersText(this.cfg.map); - this.cfg.map.addNew(data.offset, ''); + this.cfg.map.addNew(data.offset); //this.updateMarkersDiv(this.cfg.map, data.offset); } @@ -92,6 +94,11 @@ TimeSide(function($N) { }; map.add(marker); } + //We call mediaitem_detail.setUpTabs from controller once all markers have been loaded + //this because setLabelDescription, which sets the label text according to the div width, + //needs to have all elements visible. + setUpTabs(); //which hides the marker div. Call with argument 1 to set up marker div + //as visible as startup } } diff --git a/telemeta/htdocs/timeside/src/markermap.js b/telemeta/htdocs/timeside/src/markermap.js index e59671bf..6571e4e2 100644 --- a/telemeta/htdocs/timeside/src/markermap.js +++ b/telemeta/htdocs/timeside/src/markermap.js @@ -73,20 +73,20 @@ TimeSide(function($N, $J) { }, - addNew: function(offset, description){ + addNew: function(offset){ var id = this.uniqid(); var marker = { id: id, offset: offset, - desc: description, + desc: undefined, isNew: true }; this.add(marker, this.EDIT_MODE_EDIT_TEXT); }, - //editMode is optional, in case it defaults to - //EDIT_MODE_SAVED:0 - add: function(marker, editMode) { + //editMode is optional, in case it defaults to + //EDIT_MODE_SAVED:0 + add: function(marker, editMode) { var idx = this.insertionIndex(marker); //adding the div marker.div = this.createDiv(marker,idx); @@ -256,7 +256,7 @@ TimeSide(function($N, $J) { //description label descriptionLabel = $J('') .attr("name",this.MHE_DESCRIPTION_LABEL) - .attr('title',marker.desc) + .attr('title',marker.desc ? marker.desc : "") .css({ fontWeight:'bold', marginRight:margin @@ -287,6 +287,7 @@ TimeSide(function($N, $J) { })) .css({ float:'right', + marginRight:margin }); //add all elements to header: @@ -300,11 +301,10 @@ TimeSide(function($N, $J) { //description text descriptionText = $J('