[IMP] Improved the code to use css direct from lib on xml by data-role.

bzr revid: jra@tinyerp.com-20110831061816-xqgbt9uo601o5yx1

1 files changed, 66 insertions, 76 deletions

diff --git a/addons/web_mobile/static/src/xml/web_mobile.xml b/addons/web_mobile/static/src/xml/web_mobile.xml
index a3af2e39b90..aca6ed04c9e 100644
--- a/addons/web_mobile/static/src/xml/web_mobile.xml
+++ b/addons/web_mobile/static/src/xml/web_mobile.xml
@@ -4,10 +4,12 @@
 <templates id="template" xml:space="preserve">
 
 <t t-name="WebClient">
-    <div data-role="page">
-        <div id="oe_header"></div>
-        <div id="oe_app"></div>
-    </div>
+    <div data-role="page" id="oe_login"></div>
+    <div data-role="page" id="oe_home"></div>
+    <div data-role="page" id="oe_sec_menu"></div>
+    <div data-role="page" id="oe_sec_menu_new"></div>
+    <div data-role="page" id="oe_list"></div>
+    <div data-role="page" id="oe_form"></div>
 </t>
 
 <t t-name="Login">
@@ -39,29 +41,32 @@
 </t>
 
 <t t-name="HomePage">
-    <div role="main" class="ui-content" data-role="content">
-        <div id="oe_shortcuts" class="shortcuts"></div>
-        <div id="oe_menu" class="menu"></div>
-        <div id="oe_options" class="options"></div>
+    <div id="oe_header"></div>
+    <div data-role="content">
+        <div id="oe_shortcuts"></div>
+        <div id="oe_menu"></div>
+        <div id="oe_options"></div>
     </div>
+    <div id="oe_footer"></div>
 </t>
 
 <t t-name="Header">
-    <div role="banner" class="ui-bar-b ui-header" data-role="header" data-theme="b">
-        <h1 aria-level="1" role="heading" tabindex="0" class="ui-title">OpenERP</h1>
-        <a id="home" class="ui-btn-right jqm-home ui-btn ui-btn-icon-notext ui-btn-corner-all ui-shadow ui-btn-up-b" data-direction="reverse" data-iconpos="notext" data-icon="home" href="#" title="Home" data-theme="b">
-            <span class="ui-btn-inner ui-btn-corner-all">
-                <span class="ui-btn-text">Home</span>
-                <span class="ui-icon ui-icon-home ui-icon-shadow"></span>
-            </span>
-        </a>
+    <div data-role="header" data-theme="b">
+        <h1>OpenERP</h1>
+        <a id="home" class="ui-btn-right" data-iconpos="notext" data-icon="home" href="#oe_home" title="Home" data-theme="b"></a>
+    </div>
+</t>
+
+<t t-name="Footer">
+    <div data-role="footer" data-theme="b">
+        <h1>Footer</h1>
     </div>
 </t>
 
 <t t-name="Shortcuts">
     <ul data-dividertheme="b" data-theme="c" data-inset="true" data-role="listview" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">
         <li data-role="list-divider" role="heading" class="ui-li ui-li-divider ui-btn ui-bar-b ui-corner-top ui-btn-up-undefined">
-            Shortcuts
+                Shortcuts
         </li>
         <li data-theme="c" class="ui-btn ui-btn-icon-right ui-li ui-btn-up-c" t-foreach="sc" t-as="opt">
             <div class="ui-btn-inner ui-li">
@@ -73,7 +78,7 @@
                 <span class="ui-icon ui-icon-arrow-r"></span>
             </div>
         </li>
-    </ul>
+   </ul>
 </t>
 
 <t t-name="Menu">
@@ -95,67 +100,47 @@
 </t>
 
 <t t-name="Menu.secondary">
-    <div role="main" class="ui-content" data-role="content">
-        <ul data-role="listview" class="ui-listview">
-            <li data-theme="c" class="ui-btn ui-btn-icon-right ui-li ui-btn-up-c" t-foreach="menu.children" t-as="menu">
-                <div class="ui-btn-inner ui-li">
-                    <div class="ui-btn-text">
-                        <a href="#" class="ui-link-inherit" t-attf-id="menu_#{menu.id}" t-att-data-menu="menu.id" t-att-data-name="menu.name">
-                            <span><t t-esc="menu.name"/></span>
-                        </a>
-                    </div>
-                        <span class="ui-icon ui-icon-arrow-r"></span>
-                </div>
+    <div id="oe_header"></div>
+     <div data-role="header" data-theme="b">
+        <h1>OpenERP</h1>
+        <a id="home" class="ui-btn-right" data-iconpos="notext" data-icon="home" href="#" title="Home" data-theme="b"></a>
+    </div>
+    <div data-role="content">
+        <ul data-role="listview">
+            <li data-theme="c" t-foreach="menu.children" t-as="menu">
+                <a href="#" t-attf-id="menu_#{menu.id}" t-att-data-menu="menu.id" t-att-data-name="menu.name">
+                    <t t-esc="menu.name"/>
+                </a>
             </li>
         </ul>
     </div>
 </t>
 
 <t t-name="Options">
-    <ul data-dividertheme="b" data-theme="c" data-inset="true" data-role="listview" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">
-        <li data-role="list-divider" role="heading" class="ui-li ui-li-divider ui-btn ui-bar-b ui-corner-top ui-btn-up-undefined">
+    <ul data-dividertheme="b" data-theme="c" data-inset="true" data-role="listview">
+        <li data-role="list-divider">
             Options
         </li>
-        <li data-theme="c" class="ui-btn ui-btn-icon-right ui-li ui-btn-up-c">
-            <div class="ui-btn-inner ui-li">
-                <div class="ui-btn-text">
-                    <a id="logout" href="#" class="ui-link-inherit">
-                        Logout
-                    </a>
-                </div>
-                    <span class="ui-icon ui-icon-arrow-r"></span>
-            </div>
+        <li data-theme="c">
+            <a id="logout" href="#oe_login">Logout</a>
         </li>
-        <li data-theme="c" class="ui-btn ui-btn-icon-right ui-li ui-btn-up-c">
-            <div class="ui-btn-inner ui-li">
-                <div class="ui-btn-text">
-                    <a id="pref" href="#" class="ui-link-inherit">
-                        Preferences
-                    </a>
-                </div>
-                    <span class="ui-icon ui-icon-arrow-r"></span>
-            </div>
+        <li data-theme="c">
+            <a id="pref" href="#">Preferences</a>
         </li>
     </ul>
 </t>
 
 <t t-name="ListView">
-    <div role="main" class="ui-content" data-role="content">
-        <form class="ui-listview-filter ui-bar-c" role="search">
-            <div id="search-data" class="ui-input-search ui-shadow-inset ui-btn-corner-all ui-btn-shadow ui-icon-searchfield ui-body-c">
-                <input id="searchid" placeholder="Filter items..." data-type="search" class="ui-input-text ui-body-null" autosearch="true" setTimeDefault="700"/>
-            </div>
-        </form>
-        <ul role="listbox" data-role="listview" class="ui-listview">
-            <li data-theme="c" class="ui-btn ui-btn-icon-right ui-li ui-btn-up-c" t-foreach="records" t-as="record">
-                <div class="ui-btn-inner ui-li">
-                    <div class="ui-btn-text">
-                        <a id="list-id" t-att-data-id="record[0]" href="#" class="ui-link-inherit">
-                            <span><t t-esc="record[1]"/></span>
-                        </a>
-                    </div>
-                        <span class="ui-icon ui-icon-arrow-r"></span>
-                </div>
+     <div data-role="header" data-theme="b">
+        <h1>OpenERP</h1>
+        <a id="home" class="ui-btn-right" data-iconpos="notext" data-icon="home" href="#oe_home" title="Home" data-theme="b"></a>
+    </div>
+    <div data-role="content">
+        <ul data-role="listview" data-inset="true" data-theme="d" data-filter="true">
+            <li data-theme="c" t-foreach="records" t-as="record">
+                <a id="list-id" t-att-data-id="record[0]" href="#">
+                    <t t-esc="record[1]"/>
+                </a>
             </li>
         </ul>
     </div>
@@ -242,7 +227,6 @@
                     </div>
                 </t>
                  <t t-if="fields[field.attrs.name].type == 'many2one'">
-
                     <div class="ui-select">
                         <div data-theme="c" class="ui-btn ui-btn-icon-right ui-btn-corner-all ui-shadow ui-btn-up-c">
                             <span class="ui-btn-inner ui-btn-corner-all">
@@ -270,27 +254,34 @@
                     </div>
                 </t>
                 <t t-if="fields[field.attrs.name].type == 'one2many'">
-                    <div class="info ui-collapsible-contain" data-collapsed="true" data-role="collapsible">
+                    <ul role="listbox" data-role="listview" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">
+                        <li tabindex="0" data-theme="d" role="option" class="ui-btn ui-btn-icon-right ui-li ui-corner-top ui-corner-bottom ui-btn-up-d">
+                            <div class="ui-btn-inner">
+                                <div class="ui-btn-text">
+                                    <a href="#" class="ui-link-inherit">
+                                        <span><t t-esc="til"/></span>
+                                    </a>
+                                </div>
+                                <span class="ui-icon ui-icon-arrow-r"></span>
+                            </div>
+                        </li>
+                    </ul>
+                    <!--  <div class="info ui-collapsible-contain" data-collapsed="true" data-role="collapsible">
                         <h1 class="ui-collapsible-heading">
                             <a class="ui-collapsible-heading-toggle ui-btn ui-btn-icon-left ui-shadow ui-corner-all ui-btn-up-c" href="#" data-theme="c" t-id="page.attrs.string">
                                 <span class="ui-btn-inner ui-corner-all">
                                     <span class="ui-btn-text">
                                         <t t-esc="til"></t>
-                                        <!-- <span class="ui-collapsible-heading-status"></span> -->
-                                    </span>
-                                    <span data-theme="d" class="ui-btn ui-btn-icon-left ui-btn-corner-all ui-shadow ui-btn-up-d">
-                                        <span class="ui-btn-inner ui-btn-corner-all ui-corner-all">
-                                            <span class="ui-btn-text"></span>
-                                            <span class="ui-icon ui-icon-shadow ui-icon-plus"></span>
-                                        </span>
+                                        <span class="ui-collapsible-heading-status"></span>
                                     </span>
                                 </span>
                             </a>
+                            <span class="ui-icon ui-icon-arrow-r"></span>
                             <div class="ui-collapsible-content ui-collapsible-content-collapsed" aria-hidden="true">
                                 <div class="detail"></div>
                             </div>
                         </h1>
-                    </div>
+                    </div>-->
                 </t>
             </div>
             </t>
@@ -322,5 +313,4 @@
         </form>
     </div>
 </t>
-
 </templates>