--- a/src/ldt/ldt/ldt_utils/templates/ldt/ldt_utils/partial/embed_player.html	Thu Apr 26 12:10:28 2012 +0200
+++ b/src/ldt/ldt/ldt_utils/templates/ldt/ldt_utils/partial/embed_player.html	Fri Apr 27 12:07:28 2012 +0200
@@ -102,7 +102,9 @@
             },
             {
                 type: "SlideShareWidget",
-                container: "slides_container"
+                container: "slides_container",
+                embed_width: 400,
+                embed_height: 334
             }
         ]
     },

--- a/src/ldt/ldt/static/ldt/css/LdtPlayer.css	Thu Apr 26 12:10:28 2012 +0200
+++ b/src/ldt/ldt/static/ldt/css/LdtPlayer.css	Fri Apr 27 12:07:28 2012 +0200
@@ -977,6 +977,39 @@
 .Ldt-SlideShare {
     font-size: 14px;
 }
-.Ldt-SlideShare .sync_links{
-    text-align: right;
+.Ldt-SlideShare .SlideShareButtons{
+    background: url("./imgs/slideshare_btn_bg.png") repeat-x scroll 0 0 #F8F6F7;
+    height: 25px;
+    margin-top: -4px;
+    border-bottom: 1px solid #bababa;
+    border-left: 1px solid #bababa;
+    border-right: 1px solid #bababa;
+}
+.Ldt-SlideShare .SlideShareButtons ul{
+    margin-top: 2px;
+    padding-left: 0px;
+}
+.Ldt-SlideShare .SlideShareButtons ul, .Ldt-SlideShare .SlideShareButtons ul li{
+    float: left;
+    list-style: none;
 }
+.SlideShareButtons .ss_sync_on, .SlideShareButtons .ss_sync_off, .SlideShareButtons .ss_link, .SlideShareButtons .ss_tooltip{
+    width: 30px;
+    height: 20px;
+}
+.Ldt-SlideShare .SlideShareButtons .ss_sync_on{
+    background: url("./imgs/slideshare_btn_sync_violet.png") center no-repeat;
+    border-right: 1px solid #BABABA;
+}
+.Ldt-SlideShare .SlideShareButtons .ss_sync_off{
+    background: url("./imgs/slideshare_btn_sync_grey.png") center no-repeat;
+    border-right: 1px solid #BABABA;
+}
+.Ldt-SlideShare .SlideShareButtons .ss_link{
+    background: url("./imgs/slideshare_btn_link.png") center no-repeat;
+    border-right: 1px solid #BABABA;
+}
+.Ldt-SlideShare .SlideShareButtons .ss_tooltip{
+    background: url("./imgs/slideshare_btn_info.png") center no-repeat;
+    border-left: 1px solid #BABABA;
+}

Binary file src/ldt/ldt/static/ldt/css/imgs/slideshare_btn_bg.png has changed

Binary file src/ldt/ldt/static/ldt/css/imgs/slideshare_btn_info.png has changed

Binary file src/ldt/ldt/static/ldt/css/imgs/slideshare_btn_link.png has changed

Binary file src/ldt/ldt/static/ldt/css/imgs/slideshare_btn_sync_grey.png has changed

Binary file src/ldt/ldt/static/ldt/css/imgs/slideshare_btn_sync_violet.png has changed

--- a/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js	Thu Apr 26 12:10:28 2012 +0200
+++ b/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js	Fri Apr 27 12:07:28 2012 +0200
@@ -1115,7 +1115,7 @@
 IriSP.search_template = "{{! template for the search container }}<div class='LdtSearchContainer'	style='margin-left: {{margin_left}}; position: absolute; margin-top: -60px;'>	<div class='LdtSearch'		style='display: none; background-color: #EEE; width: 165px; border-color: #CFCFCF; position: absolute; text-align: center;'>		<input class='LdtSearchInput'			style='margin-top: 1px; margin-bottom: 2px;' />	</div></div><div class='cleaner'></div>";
 IriSP.share_template = "{{! social network sharing template }}<a onclick='__IriSP.MyApiPlayer.share(\'delicious\');' title='{{l10n.share_on}} delicious'><span class='share shareDelicious'>&nbsp;</span></a>		<a onclick='__IriSP.MyApiPlayer.share(\'facebook\');' title='{{l10n.share_on}} facebook'> <span class='share shareFacebook'>&nbsp;</span></a><a onclick='__IriSP.MyApiPlayer.share(\'twitter\');' title='{{l10n.share_on}} twitter'>  <span class='share shareTwitter'>&nbsp;</span></a><a onclick='__IriSP.MyApiPlayer.share(\'myspace\');' title='{{l10n.share_on}} Myspace'>  <span class='share shareMySpace'>&nbsp;</span></a>";
 IriSP.sliceWidget_template = "{{! template for the slice widget }}<div class='Ldt-sliceWidget'>  {{! the whole bar }}  <div class='Ldt-sliceBackground'></div>    <div class='Ldt-sliceLeftHandle'></div>  {{! the zone which represents our slice }}  <div class='Ldt-sliceZone'></div>     <div class='Ldt-sliceRightHandle'></div></div>";
-IriSP.slideShareWidget_template = "{{! template for the slideShare widget of the other }}<div class='Ldt-SlideShare'><!--p> class='sync_links'><a class='sync_on'>Synchronise</a> - <a class='sync_off'>Ne synchronise pas</a></p--><div class='SlideShareContainer'></div></div>";
+IriSP.slideShareWidget_template = "{{! template for the slideShare widget of the other }}<div class='Ldt-SlideShare'><!--p> class='sync_links'><a class='sync_on'>Synchronise</a> - <a class='sync_off'>Ne synchronise pas</a></p--><div class='SlideShareContainer'></div>  <div class='SlideShareButtons'><ul><li><div class='ss_sync_on'></div><div class='ss_sync_off'></div></li><li><div class='ss_link'></div></li><li class='left_icon'><div class='ss_tooltip'></div></li></ul></div></div>";
 IriSP.sliderWidget_template = "{{! template for the slider widget - it's composed of two divs we one overlayed on top    of the other }}<div class='Ldt-sliderBackground'></div><div class='Ldt-sliderForeground'></div><div class='Ldt-sliderPositionMarker Ldt-TraceMe'></div>";
 IriSP.tooltip_template = "{{! template used by the jquery ui tooltip }}<div class='Ldt-tooltip'>  <div class='title'>{{title}}</div>  <div class='time'>{{begin}} : {{end}} </div>  <div class='description'>{{description}}</div></div>";
 IriSP.tooltipWidget_template = "{{! template for the tooltip widget }}<div class='tip'>	<div class='tipcolor' style='height:10px;width:10px'></div>	<div class='tiptext'></div>";
@@ -4892,6 +4892,15 @@
 /** A widget to display slide show from embed slide share */
 IriSP.SlideShareWidget = function(Popcorn, config, Serializer) {
   IriSP.Widget.call(this, Popcorn, config, Serializer);
+  // Default flash embed size
+  this.embed_width = 425;
+  this.embed_height = 355;
+  if(this._config.embed_width){
+	  this.embed_width = this._config.embed_width;
+  }
+  if(this._config.embed_height){
+	  this.embed_height = this._config.embed_height;
+  }
 };
 
 IriSP.SlideShareWidget.prototype = new IriSP.Widget();
@@ -4907,11 +4916,6 @@
   var templ = Mustache.to_html(IriSP.slideShareWidget_template);
   this.selector.append(templ);
   
-  // Synchro management
-  this._disableUpdate = false;
-  this.selector.find('.sync_on').click(function(event) { self.syncHandler.call(self, event); });
-  this.selector.find('.sync_off').click(function(event) { self.unSyncHandler.call(self, event); });
-  
   // global variables used to keep the position and width of the zone.  
   this.zoneLeft = 0;
   this.zoneWidth = 0;
@@ -4921,6 +4925,16 @@
   this.lastSSId = "";
   this.containerDiv = this.selector.find('.SlideShareContainer');
   
+  // Synchro management
+  this._disableUpdate = false;
+  this.buttonsDiv = this.selector.find('.SlideShareButtons');
+  this.buttonsDiv.width(this.embed_width - 2); // -2 because of css borders 328 -> 235px
+  this.buttonsDiv.find('.left_icon').css("margin-left",(this.embed_width-96)+"px");
+  this.buttonsDiv.find('.ss_sync_on').click(function(event) { self.unSyncHandler.call(self, event); });
+  this.buttonsDiv.find('.ss_sync_off').click(function(event) { self.syncHandler.call(self, event); });
+  this.buttonsDiv.find('.ss_sync_off').hide();
+  this.buttonsDiv.hide();
+  
   // Update the slide from timeupdate event
   this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.slideShareUpdater));
   
@@ -4972,6 +4986,7 @@
     			forceEmpty = true;
     		}
     		else{
+    			this.buttonsDiv.show();
 	    		var description_ar = this.lastSSFullUrl.split("#id=");
 	    		var slideNb = 1;
 	    		if(description_ar[1]){
@@ -4992,6 +5007,11 @@
 							if(slideNb){
 								embed_code = embed_code.replace(new RegExp("ssplayer2.swf\\?","g"), "ssplayer2.swf?startSlide=" + slideNb + "&");
 							}
+							// The embed always send the default width and height, so we can easily change them.
+							embed_code = embed_code.replace(new RegExp("425","g"), self.embed_width);
+							embed_code = embed_code.replace(new RegExp("355","g"), self.embed_height);
+							// We hide the title upon the slides.
+							embed_code = embed_code.replace(new RegExp("block"), "none");
 							self.containerDiv.html(embed_code);
 						},
 						error: function(jqXHR, textStatus, errorThrown){
@@ -5003,8 +5023,8 @@
 	    			this.lastSSUrl = description_ar[0];
 	    			this.lastSSId = "";
 		    		// In this case, we only have an id that is meant to build the flash embed
-					embed_code = '<div style="width:425px"><embed src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=' + this.lastSSUrl + '&startSlide=' + slideNb + '" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" wmode="transparent" width="425" height="355"></embed></div>';
-					self.containerDiv.html(embed_code);
+					embed_code = '<div style="width:425px"><embed src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=' + this.lastSSUrl + '&startSlide=' + slideNb + '" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" wmode="transparent" width="'+this.embed_width+'" height="'+this.embed_height+'"></embed></div>';
+					this.containerDiv.html(embed_code);
 	    		}
 	    		else{
 	    			// If the presentation was already loaded, we only use the ss js api to load the wanted slide number
@@ -5031,18 +5051,23 @@
 	this.lastSSUrl = "";
 	this.lastSSId = "";
   	this.containerDiv.html("");
+  	this.buttonsDiv.hide();
   }
 
 };
 
 // Functions to stop or trigger sync between timeupdate event and slides        
-IriSP.SlideShareWidget.prototype.unSyncHandler = function(params) {
+IriSP.SlideShareWidget.prototype.unSyncHandler = function() {
 	//console.log("slideShare NO SYNC !");
 	this._disableUpdate = true;
-};
-IriSP.SlideShareWidget.prototype.syncHandler = function(params) {
+	this.buttonsDiv.find('.ss_sync_on').hide();
+	this.buttonsDiv.find('.ss_sync_off').show();
+};
+IriSP.SlideShareWidget.prototype.syncHandler = function() {
 	//console.log("slideShare SYNC PLEASE !");
 	this._disableUpdate = false;
+	this.buttonsDiv.find('.ss_sync_on').show();
+	this.buttonsDiv.find('.ss_sync_off').hide();
 };