changed the position of the search textfield.
--- a/src/css/LdtPlayer.css Mon Jan 02 15:46:42 2012 +0100
+++ b/src/css/LdtPlayer.css Mon Jan 02 16:41:12 2012 +0100
@@ -192,6 +192,15 @@
background-position: 0 -50px;
}
+.LdtSearch {
+ display: none;
+ width: 165px;
+ height: 25px;
+ border: 1px;
+ border-color: #CFCFCF;
+ float: left;
+ text-align: center;
+}
.Ldt-Time {
position: inherit;
--- a/src/js/widgets/playerWidget.js Mon Jan 02 15:46:42 2012 +0100
+++ b/src/js/widgets/playerWidget.js Mon Jan 02 16:41:12 2012 +0100
@@ -13,8 +13,8 @@
var height = this.height;
var heightS = this.height-20;
- var Player_templ = Mustache.to_html(IriSP.player_template, {"share_template" : IriSP.share_template});
- this.selector.append(Player_templ);
+ var playerTempl = IriSP.templToHTML(IriSP.player_template, {"share_template" : IriSP.share_template});
+ this.selector.append(playerTempl);
this.selector.children(".Ldt-controler").show();
@@ -41,9 +41,11 @@
this.selector.find(".Ldt-CtrlPlay").attr( "style", "background-color:#CD21C24;" );
+ /*
var searchButtonPos = this.selector.find(".Ldt-CtrlSearch").position();
var searchBox = Mustache.to_html(IriSP.search_template, {margin_left : searchButtonPos.left + "px"});
- this.selector.append(searchBox);
+ this.selector.find(".Ldt-CtrlSearch").after(searchBox);
+ */
// trigger an IriSP.PlayerWidget.MouseOver to the widgets that are interested (i.e : sliderWidget)
this.selector.hover(function() { self._Popcorn.trigger("IriSP.PlayerWidget.MouseOver"); },
@@ -150,7 +152,7 @@
/* show the search field if it is not shown */
if ( this._searchBlockOpen == false ) {
- this.selector.find(".LdtSearch").show(100);
+ this.selector.find(".LdtSearch").show("blind", { direction: "horizontal"}, 100);
this.selector.find(".LdtSearchInput").css('background-color','#fff');
this.selector.find(".LdtSearchInput").focus();
@@ -172,7 +174,7 @@
} else {
this._searchLastValue = this.selector.find(".LdtSearchInput").attr('value');
this.selector.find(".LdtSearchInput").attr('value','');
- this.selector.find(".LdtSearch").hide(100);
+ this.selector.find(".LdtSearch").hide("blind", { direction: "horizontal"}, 75);
// unbind the watcher event.
this.selector.find(".LdtSearchInput").unbind('keypress set');
--- a/src/templates/player.html Mon Jan 02 15:46:42 2012 +0100
+++ b/src/templates/player.html Mon Jan 02 16:41:12 2012 +0100
@@ -1,16 +1,20 @@
{{! template for the radio player }}
<div class='Ldt-controler demo'>
<div class='Ldt-LeftPlayerControls'>
- <div class='Ldt-button Ldt-CtrlPlay'></div>
- <div class='Ldt-button Ldt-CtrlAnnotate'></div>
- <div class='Ldt-button Ldt-CtrlSearch'></div>
- </div>
+ <div class='Ldt-button Ldt-CtrlPlay' title='Play/Pause'></div>
+ <div class='Ldt-button Ldt-CtrlAnnotate' title='Annotate'></div>
+ <div class='Ldt-button Ldt-CtrlSearch' title='Search'></div>
+ <div class='LdtSearch'>
+ <input class='LdtSearchInput' style='margin-top: 2px; margin-bottom: 2px;'></input>
+ </div>
+
+ </div>
<div class='Ldt-RightPlayerControls'>
<div class='Ldt-Time'>
- <div class='Ldt-ElapsedTime'>00:00</div>
+ <div class='Ldt-ElapsedTime' title='Elapsed time'>00:00</div>
<div class='Ldt-TimeSeparator'>/</div>
- <div class='Ldt-TotalTime'>00:00</div>
+ <div class='Ldt-TotalTime' title='Total time'>00:00</div>
</div>
- <div class='Ldt-button Ldt-CtrlSound'></div>
+ <div class='Ldt-button Ldt-CtrlSound' title='Mute/Unmute'></div>
</div>
</div>