Editor foundation, UI panel system

thisismedium · Mar 19, 2010 · fec8f28 · fec8f28
1 parent a775011
commit fec8f28
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 9 deletions.
diff --git a/proj/index.html b/proj/index.html
@@ -100,6 +100,10 @@
 
     </script>
 
+    <script id='panel' type='haml'>
+      .panel{ id: 'panel-' + guid }= ''
+    </script>
+
     <script id='browser-row' type='haml'>
       %tr.list-item{ 'class': is_folder ? 'folder' : '' }
         %td.icon

diff --git a/proj/j/message.ui.browse.js b/proj/j/message.ui.browse.js
@@ -29,8 +29,9 @@
 
     init: function( args ){
       this.guid = M.guid();
+      this.panel = args[0];
 
-      var el = $( args[0] ),
+      var el = $( this.panel.elem ),
           loc = args[1],
           opts = args[2];
 
@@ -175,8 +176,8 @@
   bp.init.prototype = bp;
 
   $(function(){
-    var browse_con = $( "<div class='panel' />" ).appendTo( '#main' );
-    M.ui.browse = browse( browse_con, { icon_size: 120 } );
+    var browse_panel = M.ui.panel({ title:'Browse', kind:'Browser' });
+    M.ui.browse = browse( browse_panel, { icon_size: 120 } );
 
     M.history.listen( 'b', function( path ){
       M.ui.browse.open( path );

diff --git a/proj/j/message.ui.edit.js b/proj/j/message.ui.edit.js
@@ -18,7 +18,7 @@
 (function(){
 
   var edit = function( opts ){
-    return new bp.init( Array.prototype.slice.call( arguments ) );
+    return new ep.init( Array.prototype.slice.call( arguments ) );
   };
 
   var ep = edit.prototype = {
@@ -34,10 +34,11 @@
 
       if( typeof loc !== 'string' ){
         opts = loc;
-        loc = '';
-      }      
+        loc = '';  }
+
       this.opts = $.extend( {}, this.defaults, opts );
 
+      M.ui.show_panel( this.opts.panel );
       return this;
     }
   };
@@ -66,9 +67,12 @@
     else if( typeof item === 'object' ){
       var current = editing( item );
       if( current )
-        return; // Show editor instead of making a new one
+        M.ui.show_panel( current.panel );
       else
-        edit( )
+        edit({
+          panel: M.ui.panel({ title: item.title, kind: 'Editor' }),
+          item: item
+        });
     }
   }
 

diff --git a/proj/j/message.ui.js b/proj/j/message.ui.js
@@ -19,7 +19,8 @@
   M.ui = {
     widgets: {},
     toolbars: {},
-    buttons: {}
+    buttons: {},
+    panels: {}
   };
 
   function widget( kind, build, destroy ){
@@ -36,6 +37,31 @@
 
   }
 
+  function panel( arg ){
+    if( typeof arg === 'number' )
+      return M.ui.panels[ arg ];
+
+    else if( typeof arg === 'object' ){
+      var guid = M.guid();
+      return M.ui.panels[ guid ] = {
+        guid: guid,
+        elem: $( M.templates.panel({ guid: guid }) ).appendTo( '#main' ),
+        type: ( arg.kind || 'Panel' ),
+        title: ( arg.title || 'Panel' )
+      };
+    }
+  }
+
+  function show_panel( panel ){
+    if( typeof panel === 'number' )
+      panel = panels[ panel ];
+    if( ! panel ) return;
+
+    panel.elem.show().siblings().hide();
+  }
+
+  M.ui.panel = panel;
+  M.ui.show_panel = show_panel;
   M.ui.widget = widget;
   M.ui.toolbar = toolbar;
   M.ui.button = button;