Merge lp:~openerp-dev/openerp-web/trunk-improve-shortcutkeys-bth into lp:openerp-web

[Bhumi Thakkar (Open ERP)]

Hello,

    Highlight shortcut keys by underline when press alt key.
Added shortcut keys for following:

1. Switch view (k - kanban, l - list, f - form, r - calendar, g - graph, n - gantt)
2. Formview Buttons, Listview header buttons, Kanbanview header buttons, Gantt header buttons
3. Pager on Formview ('<' - previous record & '>' - next record)
4. Sidebar buttons (p - Print, m - more, a - attachments)

Thanks.

[lp:~openerp-dev/openerp-web/trunk-improve-shortcutkeys-bth]

3794. By Bhumi Thakkar (Open ERP) on 2013-08-02

[IMP]If index is less than button's text's length then add accesskey into element.

Unmerged revisions

3794. By Bhumi Thakkar (Open ERP) on 2013-08-02

[IMP]If index is less than button's text's length then add accesskey into element.

3793. By Bhumi Thakkar (Open ERP) on 2013-08-02

[IMP]Improved code because on presskey event first-letter not working with firefox browser.

3792. By Bhumi Thakkar (Open ERP) on 2013-08-02

[MERGE]Merge lp:openerp-web.

3791. By Bhumi Thakkar (Open ERP) on 2013-08-02

[IMP]Improved code and add shortcuts for sidebar buttons.

3790. By Bhumi Thakkar (Open ERP) on 2013-07-31

[IMP]Add shortcut keys for throughout.

=== modified file 'addons/web/static/src/css/base.css'
--- addons/web/static/src/css/base.css	2013-07-02 14:53:52 +0000
+++ addons/web/static/src/css/base.css	2013-08-02 11:28:27 +0000
@@ -3210,7 +3210,9 @@
   float: right;
   color: #333333;
 }
-
+.accesshighlight:first-letter, .highlight {
+  text-decoration: underline;
+}
 @-moz-document url-prefix() {
   .openerp .oe_view_manager .oe_view_manager_switch li {
     line-height: 21px;

=== modified file 'addons/web/static/src/css/base.sass'
--- addons/web/static/src/css/base.sass	2013-07-02 14:53:52 +0000
+++ addons/web/static/src/css/base.sass	2013-08-02 11:28:27 +0000
@@ -2531,6 +2531,10 @@
         float: right
         color: #333
     // }}}
+    
+.accesshighlight:first-letter, .highlight
+    text-decoration: underline
+
 @-moz-document url-prefix()
     .openerp
         .oe_view_manager .oe_view_manager_switch li

=== modified file 'addons/web/static/src/js/chrome.js'
--- addons/web/static/src/js/chrome.js	2013-07-25 10:33:01 +0000
+++ addons/web/static/src/js/chrome.js	2013-08-02 11:28:27 +0000
@@ -5,6 +5,130 @@
 var QWeb = instance.web.qweb,
     _t = instance.web._t;
 
+$(document).keydown(function(e) {
+    if (e.keyCode === 18 || e.keycode === 16 && e.altkey || e.keyCode == 18 && e.shiftKey) {
+        highlightAccessKeys();
+    }
+}).keyup(function() {
+    unhighlightAccessKeys();
+});
+/* replace character with span tag into exist element */
+function replaceHtml(key, el) {
+    $(el).html($(el).text().replace(key, '<span class ="highlight">' + key + '</span>'))
+}
+/* 
+ * find accesskey is assigned to anyother element. if assigned then find nextone character else assign. 
+ * */
+function addkey(key, el, index, flag) {
+    if ($.inArray(key,this.keys) == -1) {
+        $(el).attr('accesskey', key);
+        if (index == 0) {
+            replaceHtml($(el).attr('accesskey').toUpperCase(), el);
+        } else {
+            if (flag) keyval = key;
+            else keyval = key.toLowerCase();
+            replaceHtml(keyval, el);
+        }
+        this.keys.push(key);
+    } else {
+        index++;
+        val = $(el).text().replace(/\s/g, '').charAt(index);
+        conval = $(el).text().replace(/\s/g, '').charAt(index).toUpperCase();
+        key = $(el).text().replace(/\s/g, '').charAt(index).toUpperCase();
+        if(index < ($.trim($(el).text()).length + 1)){
+            addkey(key, el, index, val == conval);
+        }
+    }
+}
+/* 
+ * highlightAccesskeys() - find element which has accesskey attribute and also element which has to assign accesskey attribute
+ * */
+function highlightAccessKeys() {
+    var keys = [];
+    // accesskey for switch view
+    _.each($('.oe_view_manager_current > table').find('ul.oe_view_manager_switch li'), function (el) {
+        if ($(el).find('a').data('view-type') == 'kanban') {
+            $(el).find('a').attr('accesskey', 'k');
+            $(el).addClass('highlight');
+            keys.push('K');
+        } else if ($(el).find('a').data('view-type') == 'list') {
+            $(el).find('a').attr('accesskey', 'l');
+            $(el).addClass('highlight');
+            keys.push('L');
+        } else if ($(el).find('a').data('view-type') == 'form') {
+            $(el).find('a').attr('accesskey', 'f');
+            $(el).addClass('highlight');
+            keys.push('F');
+        } else if ($(el).find('a').data('view-type') == 'calendar') {
+            $(el).find('a').attr('accesskey', 'r');
+            $(el).addClass('highlight');
+            keys.push('R');
+        } else if ($(el).find('a').data('view-type') == 'graph') {
+            $(el).find('a').attr('accesskey', 'g');
+            $(el).addClass('highlight');
+            keys.push('G');
+        } else if ($(el).find('a').data('view-type') == 'gantt') {
+            $(el).find('a').attr('accesskey', 'n');
+            $(el).addClass('highlight');
+            keys.push('N');
+        }
+    });
+    // accesskey for pager 
+    _.each($('ul.oe_pager_group:visible li'), function (el) {
+        if ($(el).find('a').data('pager-action') == 'previous'){
+            $(el).find('a').attr('accesskey','<');
+        }else {
+            $(el).find('a').attr('accesskey','>');
+        }
+    });
+
+    // accesskey for header
+    $hedaer = $('.oe_view_manager_current > table');
+
+    _.each($($hedaer).find('.oe_view_manager_buttons > div'), function(el) {
+        if ($(el).css('display') == 'block') {
+            if ($('a.oe_kanban_add_column:visible').length == 0){
+                $('a.oe_kanban_add_column').removeAttr('accesskey')
+            } else {
+                $('a.oe_kanban_add_column:visible').attr('accesskey','a');
+            }
+            _.each($(el).find('button[accesskey]'), function (btn) {
+                replaceHtml($(btn).attr('accesskey').toUpperCase(), btn);
+                keys.push($(btn).attr('accesskey').toUpperCase())
+            });
+            _.each($(el).find('a[accesskey]:visible'), function ($a) {
+                replaceHtml($($a).attr('accesskey').toUpperCase(), $a);
+                keys.push($($a).attr('accesskey').toUpperCase())
+            });
+        }
+    });
+
+    // sidebar menu
+    _.each($hedaer.find('.oe_view_manager_sidebar').find('button[accesskey]'), function (el) {
+        replaceHtml($(el).attr('accesskey').toUpperCase(), el);
+        keys.push($(el).attr('accesskey'));
+    });
+
+    this.keys = keys;
+
+    // accesskey for body
+    _.each ($('.oe_view_manager_body > div:not(.oe_view_manager_view_kanban)'), function(el) {
+        if ($(el).css('display') == 'block') {
+            _.each($(el).find('button:not(.oe_form_invisible):visible'), function (el) {
+                var index = 0;
+                if (!$(el).hasClass('oe_follower') && !$(el).hasClass('oe_link') && !$(el).hasClass('oe_i')) {
+                    key = $(el).text().replace(/\s/g, '').charAt(0).toUpperCase();
+                    if (key)
+                        addkey(key, el, index);
+                }
+            });
+        }
+    });
+}
+function unhighlightAccessKeys() {
+    $('span.highlight').removeClass('highlight');
+    $('li.highlight').removeClass('highlight');
+}
 instance.web.Notification =  instance.web.Widget.extend({
     template: 'Notification',
     init: function() {

=== modified file 'addons/web/static/src/xml/base.xml'
--- addons/web/static/src/xml/base.xml	2013-07-25 15:31:14 +0000
+++ addons/web/static/src/xml/base.xml	2013-08-02 11:28:27 +0000
@@ -621,7 +621,7 @@
     <div class="oe_sidebar">
         <t t-foreach="widget.sections" t-as="section">
             <div class="oe_form_dropdown_section">
-                <button class="oe_dropdown_toggle oe_dropdown_arrow">
+                <button class="oe_dropdown_toggle oe_dropdown_arrow" t-att-accesskey="section.label[0]">
                     <t t-if="section.name == 'files'" t-raw="widget.items[section.name].length || ''"/>
                     <t t-esc="section.label"/>
                 </button>
@@ -747,7 +747,7 @@
 <t t-name="ListView.buttons">
     <div class="oe_list_buttons">
     <t t-if="!widget.no_leaf and widget.options.action_buttons !== false and widget.options.addable and widget.is_action_enabled('create')">
-        <button type="button" class="oe_button oe_list_add oe_highlight">
+        <button type="button" class="oe_button oe_list_add oe_highlight" accesskey="c">
             <t t-esc="widget.options.addable"/>
         </button>
     </t>
@@ -828,15 +828,15 @@
         <span class="oe_form_buttons_view">
             <!-- required for the bounce effect on button -->
             <div t-if="widget.is_action_enabled('edit')" style="display: inline-block;">
-                <button type="button" class="oe_button oe_form_button_edit" accesskey="E">Edit</button>
+                <button type="button" class="oe_button oe_form_button_edit" accesskey="e">Edit</button>
             </div>
             <button t-if="widget.is_action_enabled('create')"
-                type="button" class="oe_button oe_form_button_create" accesskey="C">Create</button>
+                type="button" class="oe_button oe_form_button_create" accesskey="c">Create</button>
         </span>
         <span class="oe_form_buttons_edit">
-            <button type="button" class="oe_button oe_form_button_save oe_highlight" accesskey="S">Save</button>
+            <button type="button" class="oe_button oe_form_button_save oe_highlight" accesskey="s">Save</button>
             <span class="oe_fade">or</span>
-            <a href="#" class="oe_bold oe_form_button_cancel" accesskey="D">Discard</a>
+            <a href="#" class="oe_bold oe_form_button_cancel" accesskey="d">Discard</a>
         </span>
     </t>
 </div>

=== modified file 'addons/web_kanban/static/src/xml/web_kanban.xml'
--- addons/web_kanban/static/src/xml/web_kanban.xml	2013-03-20 13:09:31 +0000
+++ addons/web_kanban/static/src/xml/web_kanban.xml	2013-08-02 11:28:27 +0000
@@ -15,13 +15,13 @@
 <div t-name="KanbanView.buttons" class="oe_kanban_buttons">
     <t t-if="widget.options.action_buttons !== false">
         <t t-if="widget.is_action_enabled('create')">
-            <button type="button" class="oe_kanban_button_new oe_highlight">
+            <button type="button" class="oe_kanban_button_new oe_highlight" accesskey="c">
                 <t t-esc="widget.options.create_text || _t('Create')"/>
             </button>
             <span class="oe_alternative" style="display: none">
                 <span class="oe_fade">or</span>
                 <div class="oe_bounce_container">
-                    <a href="#" class="oe_bold oe_kanban_add_column">Add a new column</a>
+                    <a href="#" class="oe_bold oe_kanban_add_column" accesskey="a">Add a new column</a>
                 </div>
             </span>
         </t>