--- a/src/js/layout.js	Fri Oct 21 11:21:56 2011 +0200
+++ b/src/js/layout.js	Fri Oct 21 14:05:59 2011 +0200
@@ -9,7 +9,7 @@
     this._Popcorn = null;
     this._widgets = [];
     
-    this._div = "#LdtPlayer";
+    this._div = "LdtPlayer";
     this._width = 640;
     this._height = 480;
     
@@ -30,8 +30,11 @@
       this._height = options.height;
     } 
     
-    IriSP.jQuery(this._div).css("width", this._width);
-    IriSP.jQuery(this._div).css("height", this._height);
+    /* this is a shortcut */
+    this.selector = IriSP.jQuery("#" + this._div);
+    
+    this.selector.css("width", this._width);
+    this.selector.css("height", this._height);
 };
 
 /* we need this special setter because of a chicken and egg problem :
@@ -44,3 +47,10 @@
     /* FIXME - don't forget to add the popcorn messages handlers there */
 }
 
+IriSP.LayoutManager.prototype.createDiv = function() {
+    var newDiv = Popcorn.guid(this._div + "_widget_");
+    this._widgets.push(newDiv);    
+    this.selector.append("<div id='" + newDiv + "'></div");
+    
+    return newDiv;
+};

--- a/unittests/tests/layout.js	Fri Oct 21 11:21:56 2011 +0200
+++ b/unittests/tests/layout.js	Fri Oct 21 14:05:59 2011 +0200
@@ -8,23 +8,30 @@
   
   test("test the default initialization of layout manager", function() {
       var lay = new IriSP.LayoutManager();
-      equal(lay._div, "#LdtPlayer", "the default div is set correctly");
+      equal(lay._div, "LdtPlayer", "the default div is set correctly");
       equal(lay._width, 640, "the default width is set correctly");
       equal(lay._height, 480, "the default height is set correctly");
       
-      console.log(IriSP.jQuery(lay._div).css("width"));
-      equal(IriSP.jQuery(lay._div).css("width"), lay._width + "px", "div width is set correctly");
-      equal(IriSP.jQuery(lay._div).css("height"), lay._height + "px", "div height is set correctly");
+      equal(IriSP.jQuery("#" + lay._div).css("width"), lay._width + "px", "div width is set correctly");
+      equal(IriSP.jQuery("#" + lay._div).css("height"), lay._height + "px", "div height is set correctly");
   });
   
   test("test custom init of layout manager", function() {
-    var lay = new IriSP.LayoutManager({divId: "#myDiv", width: 327, height: 542});
-    equal(lay._div, "#myDiv", "the default div is set correctly");
+    var lay = new IriSP.LayoutManager({divId: "myDiv", width: 327, height: 542});
+    equal(lay._div, "myDiv", "the default div is set correctly");
     equal(lay._width, 327, "the default width is set correctly");
     equal(lay._height, 542, "the default height is set correctly");
     
-    equal(IriSP.jQuery(lay._div).css("width"), lay._width + "px", "div width is set correctly");
-    equal(IriSP.jQuery(lay._div).css("height"), lay._height + "px", "div height is set correctly");
+    equal(IriSP.jQuery("#" + lay._div).css("width"), lay._width + "px", "div width is set correctly");
+    equal(IriSP.jQuery("#" + lay._div).css("height"), lay._height + "px", "div height is set correctly");
+  });
+  
+  test("test widget div creation", function() {
+    var lay = new IriSP.LayoutManager({});
+    var divId = lay.createDiv();
+    
+    equal(lay.selector.children("#" + divId).length, 1, "check that a subdiv is created");
+    
   });
   
 };