Progress towards conversion to using Ext JS 3.0 (RC 2 for the moment).
authorBrandon King <kingb@caltech.edu>
Fri, 12 Jun 2009 23:06:38 +0000 (23:06 +0000)
committerBrandon King <kingb@caltech.edu>
Fri, 12 Jun 2009 23:06:38 +0000 (23:06 +0000)
templates/app.html
www/css/app.css
www/images/layout-browser-hd-bg.gif [new file with mode: 0644]
www/js/htsw.js [new file with mode: 0644]
www/js/menu.js

index 41190aa07fbff640e9c41ebfa92d4cece72a8964..7dad3a07804ba58d7dd23dd13d422fca590dc705 100644 (file)
@@ -2,12 +2,20 @@
 <html lang="en">
 <head>
     <title>{% block title %}{{ app_name }} - {{ page_name }}{% endblock %}</title>
-    <link type="text/css" rel="stylesheet" href="/static/theme/ui.all.css" />
+    <!--<link type="text/css" rel="stylesheet" href="/static/theme/ui.all.css" />-->
     <link type="text/css" rel="stylesheet" href="/static/css/app.css" />
+    <!--
     <script type="text/javascript" src="/static/js/jquery-1.3.2.js"></script>
     <script type="text/javascript" src="/static/js/jquery-ui-personalized-1.6rc6.js"></script>
     <script type="text/javascript" src="/static/js/menu.js"></script>
-    {{ media }}
+    -->
+    <link rel="stylesheet" type="text/css" href="/static/js/ext-3.0-rc2/resources/css/ext-all.css" />
+    <script type="text/javascript" src="/static/js/jquery-1.3.2.js"></script>
+    <script type="text/javascript" src="/static/js/ext-3.0-rc2/adapter/jquery/ext-jquery-adapter.js"></script>
+    <script type="text/javascript" src="/static/js/ext-3.0-rc2/ext-all.js"></script>
+    <script type="text/javascript" src="/static/js/menu.js"></script>
+    <script type="text/javascript" src="/static/js/htsw.js"></script>
+    <!--{{ media }}-->
     {% if select %}
         <script type="text/javascript">
         $(document).ready(function(){
     {{ bcmagic.media }}
 </head>
 <body>
-    <div id="left_bar" class="left_bar">
-        <div id="accordion">
-            <div>
-                <h3><a href="#">Freezers</a></h3>
-                <div>
-                    <a href="{% url samplebc.samples.views.freezer_index %}">Index</a><br />
-                    <a href="{% url samplebc.samples.views.freezer_add %}">Add</a><br />
-                </div>
-            </div>
-            <div>
-                <h3><a href="#">Containers</a></h3>
-                <div>
-                    <a href="{% url samplebc.samples.views.container_index %}">Index</a><br />
-                    <a href="{% url samplebc.samples.views.container_add %}">Add</a><br />
-                </div>
-            </div>
-            <div>
-                <h3><a href="#">Samples</a></h3>
-                <div>
-                    <a href="{% url samplebc.samples.views.sample_index %}">Index</a>
-                    <a href="{% url samplebc.samples.views.sample_homeless %}">Homeless</a>
-                    <a href="{% url samplebc.samples.views.sample_add %}">Add</a>
-                </div>
-            </div>
-            <div>
-                <h3><a href="#">Settings</a></h3>
-                <div>
-                    {% if user.is_staff %}<a href="/admin/">Admin</a>{% endif %}
-                    <a href="{% url samplebc.samples.views.user_profile %}">Profile</a>
-                    <a href="{% url django.contrib.auth.views.password_change %}">Change_PW</a>
-                </div>
-            </div>
+    <div id="header">
+        <h1>HTSWorkflow - Sample Tracker</h1>
+    </div>
+    <div id="freezer_menu">
+        <div>
+            <a href="{% url samplebc.samples.views.freezer_index %}">Index</a><br />
+            <a href="{% url samplebc.samples.views.freezer_add %}">Add</a><br />
         </div>
-        {% if user.is_authenticated %}
-        Logged in as <b>{{ user.username }}</b>.<br />
-        <a href="{% url django.contrib.auth.views.logout_then_login %}">Logout</a>
-        {% else %}
-        <center>Not logged in</center>
-        {% endif %}
-        <br />
-        <br />
-        {% include "magic.html" %}
     </div>
-    <div id="main" class="main">
-    {% block msg %}
-    <div class="msg">{{ msg }}</div>
-    {% endblock %}
+    <div id="container_menu">
+        <div>
+            <a href="{% url samplebc.samples.views.container_index %}">Index</a><br />
+            <a href="{% url samplebc.samples.views.container_add %}">Add</a><br />
+        </div>
+    </div>
+    <div id="sample_menu">
+        <div>
+            <a href="{% url samplebc.samples.views.sample_index %}">Index</a><br />
+            <a href="{% url samplebc.samples.views.sample_homeless %}">Homeless</a><br />
+            <a href="{% url samplebc.samples.views.sample_add %}">Add</a><br />
+        </div>
+    </div>
+    <div id="settings_menu">
+        <div>
+            {% if user.is_staff %}<a href="/admin/">Admin</a><br />{% endif %}
+            <a href="{% url samplebc.samples.views.user_profile %}">Profile</a><br />
+            <a href="{% url django.contrib.auth.views.password_change %}">Change_PW</a><br />
+        </div>
+    </div>
+    <div id="bcmagic_div">
+    {% if user.is_authenticated %}
+    Logged in as <b>{{ user.username }}</b>.<br />
+    <a href="{% url django.contrib.auth.views.logout_then_login %}">Logout</a>
+    {% else %}
+    <center>Not logged in</center>
+    {% endif %}
+    <br />
+    <br />
+    {% include "magic.html" %}
+    </div>
+    
+    <div id="body_content">
+        {% block msg %}
+        <div class="msg">{{ msg }}</div>
+        {% endblock %}
     {% block content %}
         {{ body }}
     {% endblock %}
index 63e86e15a13975c2558e3b42906222367ce22925..81568b569fc4db4a3afd49da31312ba089b1cfc6 100644 (file)
@@ -1,3 +1,13 @@
+#header {
+    background: #7F99BE url(/static/images/layout-browser-hd-bg.gif) repeat-x center;
+}
+#header h1 {
+    font-size: 16px;
+    color: #fff;
+    font-weight: normal;
+    padding: 5px 10px;
+}
+
 #left_bar {
     position: absolute;
     top: 5px;
diff --git a/www/images/layout-browser-hd-bg.gif b/www/images/layout-browser-hd-bg.gif
new file mode 100644 (file)
index 0000000..29bf23f
Binary files /dev/null and b/www/images/layout-browser-hd-bg.gif differ
diff --git a/www/js/htsw.js b/www/js/htsw.js
new file mode 100644 (file)
index 0000000..9e3c7ef
--- /dev/null
@@ -0,0 +1,91 @@
+
+$(document).ready(function(){
+    /*var menuAccordionPanel = new Ext.Panel({
+    
+    });*/
+    
+    var mainBorderPanel = new Ext.Viewport({
+       layout: 'border',
+       items: [{
+            region: 'north',
+            layout: 'vBox',
+            layoutConfig: {
+                align: 'stretch',
+                pack: 'start'
+            },
+            items: [{
+                    xtype: 'box',
+                    applyTo: 'header',
+                    id: 'header-panel',
+                    height: 30
+                },{
+                    xtype: 'toolbar',
+                    //height: 100,
+                    items: [{
+                        text: "Button"  
+                    }],
+                    margins: '2 0 0 0'
+            }],
+            height: 60 
+       },{
+            title: 'Menu',
+            region: 'west',
+            margins: '2 0 0 0',
+            width: 200,
+            collapsible: true,
+            cmargins: '2 2 0 2',
+            id: 'menu-panel',
+            layout: 'vBox',
+            layoutConfig: {
+                align: 'stretch',
+                pack: 'start'
+            },
+            items: [
+                {
+                    flex: 1,
+                    id: 'menu_accordion',
+                    layout: 'accordion',
+                    layoutConfig: {
+                        animate: true,
+                        fill: false
+                    },
+                    items: [{
+                        title: 'Freezers',
+                        id: 'freezers_menu_panel',
+                        contentEl: 'freezer_menu'
+                    },{
+                        title: 'Containers',
+                        id: 'containers_menu_panel',
+                        contentEl: 'container_menu'
+                    },{
+                        title: 'Samples',
+                        id: 'samples_menu_panel',
+                        contentEl: 'sample_menu'
+                    },{
+                        title: 'Settings',
+                        id: 'settings_menu_panel',
+                        contentEl: 'settings_menu'
+                    }]
+                },{
+                    xtype: 'box',
+                    applyTo: 'bcmagic_div',
+                    height: 200
+                }]
+            
+            //unstyled: true
+       },{
+            title: 'Body',
+            region: 'center',
+            xtype: 'container',
+            layout: 'fit',
+            margins: '2 2 2 2',
+            items: {
+                //title: 'Inner Panel',
+                contentEl: 'body_content',
+                border: true
+            }
+       }]
+    });
+    
+    
+});
\ No newline at end of file
index acfc5fd1f2fee2ced4a78675ea9fb01fe5450499..a298bdb3fb3e55fb699710161333d11478006808 100644 (file)
@@ -1,16 +1,9 @@
 
 
 var select_menu = function(item){
-    var choices = {'freezer': 0,
-        'container': 1,
-        'samples': 2,
-        'settings': 3};
-    $('#accordion').accordion('activate', choices[item]);
+    var choices = {'freezer': 'freezers_menu_panel',
+        'container': 'containers_menu_panel',
+        'samples': 'freezers_menu_panel',
+        'settings': 'settings_menu_panel'};
+    $('#menu_accordion').setActiveItem(choices[item]);
 }
-
-$(document).ready(function(){
-    $('#accordion').accordion({
-        header: "h3"
-        //fillSpace: true
-    });
-});
\ No newline at end of file