added a basic layout manager. popcorn-port
authorhamidouk
Fri, 21 Oct 2011 11:21:35 +0200
branchpopcorn-port
changeset 111 df08c7f9535c
parent 110 048125f1a167
child 112 12b37d456341
added a basic layout manager.
src/js/layout.js
unittests/index.html
unittests/tests/layout.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/js/layout.js	Fri Oct 21 11:21:35 2011 +0200
@@ -0,0 +1,46 @@
+/* layout.js - very basic layout management */
+
+/*
+  a layout manager manages a div and the layout of objects
+  inside it.
+*/
+
+IriSP.LayoutManager = function(options) {
+    this._Popcorn = null;
+    this._widgets = [];
+    
+    this._div = "#LdtPlayer";
+    this._width = 640;
+    this._height = 480;
+    
+    if (options === undefined) {
+      options = {};
+      console.error("The options parameter is undefined.");
+    };
+    
+    if (options.hasOwnProperty('divId')) {
+      this._div = options.divId;
+    }
+
+    if (options.hasOwnProperty('width')) {
+      this._width = options.width;
+    }    
+    
+    if (options.hasOwnProperty('height')) {
+      this._height = options.height;
+    } 
+    
+    IriSP.jQuery(this._div).css("width", this._width);
+    IriSP.jQuery(this._div).css("height", this._height);
+};
+
+/* we need this special setter because of a chicken and egg problem :
+   we want the manager to use popcorn but the popcorn div will be managed
+   by the manager. So we need a way to set the instance the manager uses
+*/
+   
+IriSP.LayoutManager.prototype.setPopcornInstance = function(popcorn) {
+    this._Popcorn = popcorn;
+    /* FIXME - don't forget to add the popcorn messages handlers there */
+}
+
--- a/unittests/index.html	Fri Oct 21 11:21:14 2011 +0200
+++ b/unittests/index.html	Fri Oct 21 11:21:35 2011 +0200
@@ -24,6 +24,7 @@
 	<script src="tests/playerWidget.js" type="text/javascript"></script>
 	<script src="tests/annotationsWidget.js" type="text/javascript"></script>
 	<script src="tests/segmentsWidget.js" type="text/javascript"></script>
+	<script src="tests/layout.js" type="text/javascript"></script>
 </head>
 <script>
  $(document).ready(function(){ 
@@ -39,6 +40,7 @@
 		test_player_widget();
 		test_annotations_widget();
 		test_segments_widget();
+		test_layout();
 });
 </script>	
 <body>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/unittests/tests/layout.js	Fri Oct 21 11:21:35 2011 +0200
@@ -0,0 +1,30 @@
+/* tests for layout.js */
+function test_layout() {
+  module("layout manager", {setup: 
+    function() { 
+    IriSP.jQuery("#widget-div").append("<div id='LdtPlayer'></div>"); 
+    IriSP.jQuery("#widget-div").append("<div id='myDiv'></div>"); 
+    }});
+  
+  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._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");
+  });
+  
+  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");
+    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");
+  });
+  
+};