[MERGE] [IMP] 'Stage Bar Manu' Task. This task improves the statusbar widget. Folded columns are

not hidden anymore, but available in a side menu accessible after other stages. The 
purpose is to be able to have access to all stages using this widget. This way we will be 
able to remove some action buttons in form views in a future task.

This web branch updates the statusbar widget (JS and CSS).

bzr revid: tde@openerp.com-20130517090626-n1g1k1o4r8wk9l4v

4 files changed, 222 insertions, 85 deletions

diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index 9cd567c21ef..5d586bc41d3 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -2185,6 +2185,7 @@
 }
 .openerp .oe_form header {
   position: relative;
+  z-index: 1;
   border-bottom: 1px solid #cacaca;
   padding-left: 2px;
   background-color: #ededed;
@@ -2659,20 +2660,20 @@
   background-image: -o-linear-gradient(top, #fcfcfc, #dedede);
   background-image: linear-gradient(to bottom, #fcfcfc, #dedede);
 }
-.openerp ul.oe_form_status li:first-child .label, .openerp ul.oe_form_status_clickable li:first-child .label {
+.openerp ul.oe_form_status li:first-child > .label, .openerp ul.oe_form_status_clickable li:first-child > .label {
   border-left: 1px solid #cacaca;
   padding-left: 14px;
 }
 .openerp ul.oe_form_status li:last-child, .openerp ul.oe_form_status_clickable li:last-child {
   border-right: 1px solid #cacaca;
 }
-.openerp ul.oe_form_status li:last-child .label, .openerp ul.oe_form_status_clickable li:last-child .label {
+.openerp ul.oe_form_status li:last-child > .label, .openerp ul.oe_form_status_clickable li:last-child > .label {
   padding-right: 14px;
 }
-.openerp ul.oe_form_status li:last-child .arrow, .openerp ul.oe_form_status_clickable li:last-child .arrow {
+.openerp ul.oe_form_status li:last-child > .arrow, .openerp ul.oe_form_status_clickable li:last-child > .arrow {
   display: none;
 }
-.openerp ul.oe_form_status li .label, .openerp ul.oe_form_status_clickable li .label {
+.openerp ul.oe_form_status li > .label, .openerp ul.oe_form_status_clickable li > .label {
   color: #4c4c4c;
   text-shadow: 0 1px 1px #fcfcfc, 0 -1px 1px #dedede;
   padding: 7px;
@@ -2681,14 +2682,14 @@
   margin: 0;
   position: relative;
 }
-.openerp ul.oe_form_status li .arrow, .openerp ul.oe_form_status_clickable li .arrow {
+.openerp ul.oe_form_status li > .arrow, .openerp ul.oe_form_status_clickable li > .arrow {
   width: 17px;
   display: inline-block;
   vertical-align: top;
   overflow: hidden;
   margin-left: -5px;
 }
-.openerp ul.oe_form_status li .arrow span, .openerp ul.oe_form_status_clickable li .arrow span {
+.openerp ul.oe_form_status li > .arrow span, .openerp ul.oe_form_status_clickable li > .arrow span {
   position: relative;
   width: 24px;
   height: 24px;
@@ -2710,6 +2711,32 @@
   -o-transform: rotate(45deg);
   transform: rotate(45deg);
 }
+.openerp ul.oe_form_status .oe_folded .label, .openerp ul.oe_form_status_clickable .oe_folded .label {
+  padding-bottom: 8px;
+}
+.openerp ul.oe_form_status .oe_folded ul, .openerp ul.oe_form_status_clickable .oe_folded ul {
+  position: absolute;
+  border-top: 1px solid #cacaca;
+  float: none;
+  top: 30px;
+  right: 0;
+  display: none;
+}
+.openerp ul.oe_form_status .oe_folded ul li, .openerp ul.oe_form_status_clickable .oe_folded ul li {
+  margin: 0;
+  border-left: 1px solid #cacaca;
+  display: block;
+}
+.openerp ul.oe_form_status .oe_folded ul li.label, .openerp ul.oe_form_status_clickable .oe_folded ul li.label {
+  border: 0;
+  padding-left: 24px;
+}
+.openerp ul.oe_form_status .oe_folded ul li:last-child, .openerp ul.oe_form_status_clickable .oe_folded ul li:last-child {
+  border-bottom: 1px solid #cacaca;
+}
+.openerp ul.oe_form_status .oe_folded:hover ul, .openerp ul.oe_form_status_clickable .oe_folded:hover ul {
+  display: block;
+}
 .openerp ul.oe_form_status li.oe_active, .openerp ul.oe_form_status_clickable li.oe_active {
   background-color: #5382b9;
   background-image: -webkit-gradient(linear, left top, left bottom, from(#729fcf), to(#3465a4));
@@ -2719,14 +2746,14 @@
   background-image: -o-linear-gradient(top, #729fcf, #3465a4);
   background-image: linear-gradient(to bottom, #729fcf, #3465a4);
 }
-.openerp ul.oe_form_status li.oe_active .arrow span, .openerp ul.oe_form_status_clickable li.oe_active .arrow span {
+.openerp ul.oe_form_status li.oe_active > .arrow span, .openerp ul.oe_form_status_clickable li.oe_active > .arrow span {
   background-color: #3465a4;
   background: -moz-linear-gradient(135deg, #3465a4, #729fcf);
   background: -o-linear-gradient(135deg, #729fcf, #3465a4);
   background: -webkit-gradient(linear, left top, right bottom, from(#729fcf), to(#3465a4));
   background: -ms-linear-gradient(top, #729fcf, #3465a4);
 }
-.openerp ul.oe_form_status li.oe_active .label, .openerp ul.oe_form_status_clickable li.oe_active .label {
+.openerp ul.oe_form_status li.oe_active > .label, .openerp ul.oe_form_status_clickable li.oe_active > .label {
   color: white;
   text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4;
 }
@@ -2742,10 +2769,10 @@
   background-image: -o-linear-gradient(top, #e8e8e8, #cacaca);
   background-image: linear-gradient(to bottom, #e8e8e8, #cacaca);
 }
-.openerp ul.oe_form_status_clickable li:hover .label {
+.openerp ul.oe_form_status_clickable li:hover > .label {
   text-shadow: 0 -1px 1px #fcfcfc, 0 1px 1px #dedede;
 }
-.openerp ul.oe_form_status_clickable li:hover .arrow span {
+.openerp ul.oe_form_status_clickable li:hover > .arrow span {
   background-color: #d9d9d9;
   background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#cacaca));
   background-image: -webkit-linear-gradient(top, #e8e8e8, #cacaca);
@@ -2754,7 +2781,7 @@
   background-image: -o-linear-gradient(top, #e8e8e8, #cacaca);
   background-image: linear-gradient(to bottom, #e8e8e8, #cacaca);
 }
-.openerp ul.oe_form_status_clickable li .label {
+.openerp ul.oe_form_status_clickable li > .label {
   color: #7c7bad;
 }
 .openerp ul.oe_form_status_clickable li.oe_active:hover {
@@ -2766,10 +2793,10 @@
   background-image: -o-linear-gradient(top, #4c85c2, #284d7d);
   background-image: linear-gradient(to bottom, #4c85c2, #284d7d);
 }
-.openerp ul.oe_form_status_clickable li.oe_active:hover .label {
+.openerp ul.oe_form_status_clickable li.oe_active:hover > .label {
   text-shadow: 0 -1px 1px #729fcf, 0 1px 1px #3465a4;
 }
-.openerp ul.oe_form_status_clickable li.oe_active:hover .arrow span {
+.openerp ul.oe_form_status_clickable li.oe_active:hover > .arrow span {
   background-color: #284d7d;
   background: -moz-linear-gradient(135deg, #284d7d, #4c85c2);
   background: -o-linear-gradient(135deg, #4c85c2, #284d7d);
@@ -3348,11 +3375,11 @@ div.ui-widget-overlay {
   overflow: hidden;
   border-right: 1px solid #cacaca;
 }
-.openerp_ie ul.oe_form_status li:last-child .label, .openerp_ie ul.oe_form_status_clickable li:last-child .label {
+.openerp_ie ul.oe_form_status li:last-child > .label, .openerp_ie ul.oe_form_status_clickable li:last-child > .label {
   padding-right: 14px;
   border-right: none;
 }
-.openerp_ie ul.oe_form_status li:last-child .arrow, .openerp_ie ul.oe_form_status_clickable li:last-child .arrow {
+.openerp_ie ul.oe_form_status li:last-child > .arrow, .openerp_ie ul.oe_form_status_clickable li:last-child > .arrow {
   display: inline-block;
   opacity: 0;
   filter: alpha(opacity=0);
@@ -3360,17 +3387,17 @@ div.ui-widget-overlay {
   width: 0;
   border-right: none;
 }
-.openerp_ie ul.oe_form_status .label, .openerp_ie ul.oe_form_status_clickable .label {
+.openerp_ie ul.oe_form_status li > .label, .openerp_ie ul.oe_form_status_clickable li > .label {
   border-bottom: 1px solid #cacaca;
   background: transparent;
 }
-.openerp_ie ul.oe_form_status .arrow span, .openerp_ie ul.oe_form_status_clickable .arrow span {
+.openerp_ie ul.oe_form_status li > .arrow span, .openerp_ie ul.oe_form_status_clickable li > .arrow span {
   background-color: #fefefe !important;
 }
-.openerp_ie ul.oe_form_status li.oe_active .label, .openerp_ie ul.oe_form_status_clickable li.oe_active .label {
+.openerp_ie ul.oe_form_status li.oe_active > .label, .openerp_ie ul.oe_form_status_clickable li.oe_active > .label {
   border-bottom: 1px solid #729fcf;
 }
-.openerp_ie ul.oe_form_status li.oe_active .arrow span, .openerp_ie ul.oe_form_status_clickable li.oe_active .arrow span {
+.openerp_ie ul.oe_form_status li.oe_active > .arrow span, .openerp_ie ul.oe_form_status_clickable li.oe_active > .arrow span {
   background-color: #729fcf !important;
 }
 .openerp_ie .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button {
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index 072fda44357..86664a86414 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -123,6 +123,7 @@ $sheet-padding: 16px
     font-size: 1px
     letter-spacing: -1px
     color: transparent
+    text-shadow: none
     font-weight: normal
     &:before
         font: 21px "mnmliconsRegular"
@@ -133,6 +134,7 @@ $sheet-padding: 16px
     font-size: 1px
     letter-spacing: -1px
     color: transparent
+    text-shadow: none
     font-weight: normal
     &:before
         font: $size "entypoRegular"
@@ -1731,6 +1733,7 @@ $sheet-padding: 16px
     // FormView.header {{{
     .oe_form header
         position: relative
+        z-index: 1
         border-bottom: 1px solid #cacaca
         padding-left: 2px
         @include vertical-gradient(#fcfcfc, #dedede)
@@ -1979,9 +1982,9 @@ $sheet-padding: 16px
             .oe_form_field_float input
                 width: 7em
             .oe_form_field_date input
-                width: 7.5em
+                width: 100px
             .oe_form_field_datetime input
-                width: 11.5em
+                width: 150px
     // }}}
     // FormView.fields_binary {{{
     /* http://www.quirksmode.org/dom/inputfile.html
@@ -2118,16 +2121,16 @@ $sheet-padding: 16px
             margin: 0 -18px 0 0
             padding: 0
             @include vertical-gradient(#fcfcfc, #dedede)
-            &:first-child .label
+            &:first-child > .label
                 border-left: 1px solid #cacaca
                 padding-left: 14px
             &:last-child
                 border-right: 1px solid #cacaca
-                .label
+                > .label
                     padding-right: 14px
-                .arrow
+                > .arrow
                     display: none
-            .label
+            > .label
                 color: #4c4c4c
                 text-shadow: 0 1px 1px #fcfcfc, 0 -1px 1px #dedede
                 padding: 7px
@@ -2135,7 +2138,7 @@ $sheet-padding: 16px
                 padding-left: 24px
                 margin: 0
                 position: relative
-            .arrow
+            > .arrow
                 width: 17px
                 display: inline-block
                 vertical-align: top
@@ -2152,11 +2155,32 @@ $sheet-padding: 16px
                     @include skew-gradient(#fcfcfc, #dedede)
                     @include radius(3px)
                     @include transform(rotate(45deg))
+        .oe_folded
+            .label
+                padding-bottom: 8px
+            ul
+                position: absolute
+                border-top: 1px solid #cacaca
+                float: none
+                top: 30px
+                right: 0
+                display: none
+                li
+                    margin: 0
+                    border-left: 1px solid #cacaca
+                    display: block
+                li.label
+                    border: 0
+                    padding-left: 24px
+                li:last-child
+                    border-bottom: 1px solid #cacaca
+            &:hover ul
+                display: block
         li.oe_active
             @include vertical-gradient(#729fcf, #3465a4)
-            .arrow span
+            > .arrow span
                 @include skew-gradient(#729fcf, #3465a4)
-            .label
+            > .label
                 color: white
                 text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4
     ul.oe_form_status_clickable
@@ -2164,18 +2188,18 @@ $sheet-padding: 16px
             cursor: pointer
             &:hover
                 @include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
-                .label
+                > .label
                     text-shadow: 0 -1px 1px #fcfcfc, 0 1px 1px #dedede
-                .arrow span
+                > .arrow span
                     @include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
-            .label
+            > .label
                 color: $link-color
         li.oe_active
             &:hover
                 @include vertical-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
-                .label
+                > .label
                     text-shadow: 0 -1px 1px #729fcf, 0 1px 1px #3465a4
-                .arrow span
+                > .arrow span
                     @include skew-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
     // }}}
     // FormView.one2many {{{
@@ -2558,6 +2582,8 @@ div.ui-widget-overlay
     .placeholder
         color: $tag-border !important
         font-style: italic !important
+    .oe_form_binary_file
+        width: 80px
     .oe_form_field_boolean input
         background: #fff
     .db_option_table .oe_form_field_selection
@@ -2638,26 +2664,26 @@ div.ui-widget-overlay
             &:last-child
                 overflow: hidden
                 border-right: 1px solid #cacaca
-                .label
+                > .label
                     padding-right: 14px
                     border-right: none
-                .arrow
+                > .arrow
                     display: inline-block
                     opacity: 0
                     filter: alpha(opacity = 0)
                     border: none
                     width: 0
                     border-right: none 
-        .label
-            border-bottom: 1px solid #cacaca
-            background: transparent
-        .arrow
-            span
-                background-color: #fefefe !important
+            > .label
+                border-bottom: 1px solid #cacaca
+                background: transparent
+            > .arrow
+                span
+                    background-color: #fefefe !important
         li.oe_active
-            .label
+            > .label
                 border-bottom: 1px solid #729fcf
-            .arrow span
+            > .arrow span
                 background-color: #729fcf !important
 
     // jquery ui for ie
diff --git a/addons/web/static/src/js/view_form.js b/addons/web/static/src/js/view_form.js
index 53a7425c036..454f20ddcd5 100644
--- a/addons/web/static/src/js/view_form.js
+++ b/addons/web/static/src/js/view_form.js
@@ -765,7 +765,11 @@ instance.web.FormView = instance.web.View.extend(instance.web.form.FieldManagerM
         this.has_been_loaded.done(function() {
             if (self.datarecord.id && confirm(_t("Do you really want to delete this record?"))) {
                 self.dataset.unlink([self.datarecord.id]).done(function() {
-                    self.execute_pager_action('next');
+                    if (self.dataset.size()) {
+                        self.execute_pager_action('next');
+                    } else {
+                        self.do_action('history_back');
+                    }
                     def.resolve();
                 });
             } else {
@@ -802,6 +806,8 @@ instance.web.FormView = instance.web.View.extend(instance.web.form.FieldManagerM
             if (save_obj.error)
                 return $.Deferred().reject();
             return $.when.apply($, save_obj.ret);
+        }).done(function() {
+            self.$el.removeClass('oe_form_dirty');
         });
     },
     _process_save: function(save_obj) {
@@ -1021,7 +1027,7 @@ instance.web.FormView = instance.web.View.extend(instance.web.form.FieldManagerM
             return value;
         }
         var fields = _.chain(this.fields)
-            .map(function (field, name) {
+            .map(function (field) {
                 var value = field.get_value();
                 // ignore fields which are empty, invisible, readonly, o2m
                 // or m2m
@@ -1036,7 +1042,7 @@ instance.web.FormView = instance.web.View.extend(instance.web.form.FieldManagerM
                 }
 
                 return {
-                    name: name,
+                    name: field.name,
                     string: field.string,
                     value: value,
                     displayed: display(field, value),
@@ -1047,10 +1053,10 @@ instance.web.FormView = instance.web.View.extend(instance.web.form.FieldManagerM
             .value();
         var conditions = _.chain(self.fields)
             .filter(function (field) { return field.field.change_default; })
-            .map(function (field, name) {
+            .map(function (field) {
                 var value = field.get_value();
                 return {
-                    name: name,
+                    name: field.name,
                     string: field.string,
                     value: value,
                     displayed: display(field, value),
@@ -1444,6 +1450,9 @@ instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInt
             $(this).children().each(function() {
                 var $td = $(this),
                     $child = $td.children(':first');
+                if ($child.attr('cell-class')) {
+                    $td.addClass($child.attr('cell-class'));
+                }
                 switch ($child[0].tagName.toLowerCase()) {
                     case 'separator':
                         break;
@@ -1520,7 +1529,7 @@ instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInt
             if (! page.__ic)
                 return;
             page.__ic.on("change:effective_invisible", null, function() {
-                if (!page.__ic.get('effective_invisible')) {
+                if (!page.__ic.get('effective_invisible') && page.autofocus) {
                     $new_notebook.tabs('select', i);
                     return;
                 }
@@ -2126,7 +2135,7 @@ instance.web.form.AbstractField = instance.web.form.FormWidget.extend(instance.w
         value without triggering a re-rendering.
     */
     internal_set_value: function(value_) {
-        var tmp = this.no_render;
+        var tmp = this.no_rerender;
         this.no_rerender = true;
         this.set({'value': value_});
         this.no_rerender = tmp;
@@ -2296,7 +2305,8 @@ instance.web.form.FieldChar = instance.web.form.AbstractField.extend(instance.we
         return this.get('value') === '' || this._super();
     },
     focus: function() {
-        this.$('input:first')[0].focus();
+        var input = this.$('input:first')[0];
+        return input ? input.focus() : false;
     },
     set_dimensions: function (height, width) {
         this._super(height, width);
@@ -2393,7 +2403,8 @@ instance.web.form.FieldFloat = instance.web.form.FieldChar.extend({
         this._super.apply(this, [value_]);
     },
     focus: function () {
-        this.$('input:first').select();
+        var $input = this.$('input:first');
+        return $input.length ? $input.select() : false;
     }
 });
 
@@ -2413,6 +2424,42 @@ instance.web.DateTimeWidget = instance.web.Widget.extend({
         this.$input = this.$el.find('input.oe_datepicker_master');
         this.$input_picker = this.$el.find('input.oe_datepicker_container');
 
+        $.datepicker.setDefaults({
+            clearText: _t('Clear'),
+            clearStatus: _t('Erase the current date'),
+            closeText: _t('Done'),
+            closeStatus: _t('Close without change'),
+            prevText: _t('<Prev'),
+            prevStatus: _t('Show the previous month'),
+            nextText: _t('Next>'),
+            nextStatus: _t('Show the next month'),
+            currentText: _t('Today'),
+            currentStatus: _t('Show the current month'),
+            monthNames: Date.CultureInfo.monthNames,
+            monthNamesShort: Date.CultureInfo.abbreviatedMonthNames,
+            monthStatus: _t('Show a different month'),
+            yearStatus: _t('Show a different year'),
+            weekHeader: _t('Wk'),
+            weekStatus: _t('Week of the year'),
+            dayNames: Date.CultureInfo.dayNames,
+            dayNamesShort: Date.CultureInfo.abbreviatedDayNames,
+            dayNamesMin: Date.CultureInfo.shortestDayNames,
+            dayStatus: _t('Set DD as first week day'),
+            dateStatus: _t('Select D, M d'),
+            firstDay: Date.CultureInfo.firstDayOfWeek,
+            initStatus: _t('Select a date'),
+            isRTL: false
+        });
+        $.timepicker.setDefaults({
+            timeOnlyTitle: _t('Choose Time'),
+            timeText: _t('Time'),
+            hourText: _t('Hour'),
+            minuteText: _t('Minute'),
+            secondText: _t('Second'),
+            currentText: _t('Now'),
+            closeText: _t('Done')
+        });
+
         this.picker({
             onClose: this.on_picker_select,
             onSelect: this.on_picker_select,
@@ -2539,9 +2586,8 @@ instance.web.form.FieldDatetime = instance.web.form.AbstractField.extend(instanc
         return this.get('value') === '' || this._super();
     },
     focus: function() {
-        if (this.datewidget && this.datewidget.$input) {
-            this.datewidget.$input[0].focus();
-        }
+        var input = this.datewidget && this.datewidget.$input[0];
+        return input ? input.focus() : false;
     },
     set_dimensions: function (height, width) {
         this._super(height, width);
@@ -2622,9 +2668,8 @@ instance.web.form.FieldText = instance.web.form.AbstractField.extend(instance.we
         return this.get('value') === '' || this._super();
     },
     focus: function($el) {
-        if (!this.get("effective_readonly") && this.$textarea) {
-            this.$textarea[0].focus();
-        }
+        var input = !this.get("effective_readonly") && this.$textarea && this.$textarea[0];
+        return input ? input.focus() : false;
     },
     set_dimensions: function (height, width) {
         this._super(height, width);
@@ -2707,7 +2752,8 @@ instance.web.form.FieldBoolean = instance.web.form.AbstractField.extend({
         this.$checkbox[0].checked = this.get('value');
     },
     focus: function() {
-        this.$checkbox[0].focus();
+        var input = this.$checkbox && this.$checkbox[0];
+        return input ? input.focus() : false;
     }
 });
 
@@ -2793,7 +2839,8 @@ instance.web.form.FieldSelection = instance.web.form.AbstractField.extend(instan
         }
     },
     focus: function() {
-        this.$('select:first')[0].focus();
+        var input = this.$('select:first')[0];
+        return input ? input.focus() : false;
     },
     set_dimensions: function (height, width) {
         this._super(height, width);
@@ -3336,7 +3383,7 @@ instance.web.form.FieldMany2One = instance.web.form.AbstractField.extend(instanc
         }
         if (! no_recurse) {
             var dataset = new instance.web.DataSetStatic(this, this.field.relation, self.build_context());
-            dataset.name_get([self.get("value")]).done(function(data) {
+            this.alive(dataset.name_get([self.get("value")])).done(function(data) {
                 self.display_value["" + self.get("value")] = data[0][1];
                 self.render_value(true);
             });
@@ -3401,9 +3448,8 @@ instance.web.form.FieldMany2One = instance.web.form.AbstractField.extend(instanc
         return ! this.get("value");
     },
     focus: function () {
-        if (!this.get('effective_readonly')) {
-            this.$input && this.$input[0].focus();
-        }
+        var input = !this.get('effective_readonly') && this.$input && this.$input[0];
+        return input ? input.focus() : false;
     },
     _quick_create: function() {
         this.no_ed = true;
@@ -4263,7 +4309,8 @@ instance.web.form.FieldMany2ManyTags = instance.web.form.AbstractField.extend(in
         this.set({'value': _.uniq(this.get('value').concat([id]))});
     },
     focus: function () {
-        this.$text[0].focus();
+        var input = this.$text && this.$text[0];
+        return input ? input.focus() : false;
     },
     set_dimensions: function (height, width) {
         this._super(height, width);        
@@ -5356,14 +5403,14 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
         this.options.clickable = this.options.clickable || (this.node.attrs || {}).clickable || false;
         this.options.visible = this.options.visible || (this.node.attrs || {}).statusbar_visible || false;
         this.set({value: false});
-        this.selection = [];
-        this.set("selection", []);
+        this.selection = {'unfolded': [], 'folded': []};
+        this.set("selection", {'unfolded': [], 'folded': []});
         this.selection_dm = new instance.web.DropMisordered();
+        this.dataset = new instance.web.DataSetStatic(this, this.field.relation, this.build_context());
     },
     start: function() {
         this.field_manager.on("view_content_has_changed", this, this.calc_domain);
         this.calc_domain();
-        this.on("change:value", this, this.get_selection);
         this.on("change:evaluated_selection_domain", this, this.get_selection);
         this.on("change:selection", this, function() {
             this.selection = this.get("selection");
@@ -5371,7 +5418,7 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
         });
         this.get_selection();
         if (this.options.clickable) {
-            this.$el.on('click','li',this.on_click_stage);
+            this.$el.on('click','li:not(.oe_folded)',this.on_click_stage);
         }
         if (this.$el.parent().is('header')) {
             this.$el.after('<div class="oe_clear"/>');
@@ -5386,17 +5433,20 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
     },
     render_value: function() {
         var self = this;
-        var content = QWeb.render("FieldStatus.content", {widget: self});
+        var content = QWeb.render("FieldStatus.content", {
+            'widget': self, 
+            'value_folded': _.find(self.selection.folded, function(i){return i[0] === self.get('value')})
+        });
         self.$el.html(content);
     },
     calc_domain: function() {
         var d = instance.web.pyeval.eval('domain', this.build_domain());
         var domain = []; //if there is no domain defined, fetch all the records
-        
+
         if (d.length) {
             domain = ['|',['id', '=', this.get('value')]].concat(d);
         }
-        
+
         if (! _.isEqual(domain, this.get("evaluated_selection_domain"))) {
             this.set("evaluated_selection_domain", domain);
         }
@@ -5408,17 +5458,27 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
      */
     get_selection: function() {
         var self = this;
-        var selection = [];
+        var selection_unfolded = [];
+        var selection_folded = [];
 
         var calculation = _.bind(function() {
             if (this.field.type == "many2one") {
-                var domain = [];
-                var ds = new instance.web.DataSetSearch(this, this.field.relation,
-                    self.build_context(), this.get("evaluated_selection_domain"));
-                return ds.read_slice(['name'], {}).then(function (records) {
-                    for(var i = 0; i < records.length; i++) {
-                        selection.push([records[i].id, records[i].name]);
-                    }
+                return self.get_distant_fields().then(function(fields) {
+                    return new instance.web.DataSetSearch(self, self.field.relation, self.build_context(), self.get("evaluated_selection_domain"))
+                        .read_slice(fields.fold ? ['fold'] : ['id'], {}).then(function (records) {
+
+                            var ids = _.map(records, function (val) {return val.id});
+                            return self.dataset.name_get(ids).then(function (records_name) {
+                                _.each(records, function (record) {
+                                    var name = _.find(records_name, function (val) {return val[0] == record.id;})[1];
+                                    if (record.fold && record.id != self.get('value')) {
+                                        selection_folded.push([record.id, name]);
+                                    } else {
+                                        selection_unfolded.push([record.id, name]);
+                                    }
+                                });
+                            })
+                        });
                 });
             } else {
                 // For field type selection filter values according to
@@ -5428,18 +5488,29 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
                 for(var i=0; i < select.length; i++) {
                     var key = select[i][0];
                     if(key == this.get('value') || !this.options.visible || this.options.visible.indexOf(key) != -1) {
-                        selection.push(select[i]);
+                        selection_unfolded.push(select[i]);
                     }
                 }
                 return $.when();
             }
         }, this);
         this.selection_dm.add(calculation()).then(function () {
+            var selection = {'unfolded': selection_unfolded, 'folded': selection_folded};
             if (! _.isEqual(selection, self.get("selection"))) {
                 self.set("selection", selection);
             }
         });
     },
+    get_distant_fields: function() {
+        var self = this;
+        if (this.distant_fields) {
+            return $.when(this.distant_fields);
+        }
+        return new instance.web.Model(self.field.relation).call("fields_get", [["fold"]]).then(function(fields) {
+            self.distant_fields = fields;
+            return fields;
+        })
+    },
     on_click_stage: function (ev) {
         var self = this;
         var $li = $(ev.currentTarget);
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index 943326f5011..14c7f722ec2 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -650,7 +650,7 @@
                     <li t-if="section.name == 'files'" class="oe_sidebar_add_attachment">
                         <t t-call="HiddenInputFile">
                             <t t-set="fileupload_id" t-value="widget.fileupload_id"/>
-                            <t t-set="fileupload_action">/web/binary/upload_attachment</t>
+                            <t t-set="fileupload_action" t-translation="off">/web/binary/upload_attachment</t>
                             <input type="hidden" name="model" t-att-value="widget.dataset and widget.dataset.model"/>
                             <input type="hidden" name="id" t-att-value="widget.model_id"/>
                             <input type="hidden" name="session_id" t-att-value="widget.session.session_id"/>
@@ -1218,13 +1218,25 @@
     <ul t-att-class="'oe_form_field_status ' + (widget.options.clickable ? 'oe_form_status_clickable' : 'oe_form_status')" t-att-style="widget.node.attrs.style"/>
 </t>
 <t t-name="FieldStatus.content">
-    <t t-foreach="widget.selection" t-as="i">
+    <t t-foreach="widget.selection.unfolded" t-as="i">
         <li t-att-class="i[0] === widget.get('value') ? 'oe_active' : ''" t-att-data-id="i[0]">
             <span class="label"><t t-esc="i[1]"/></span>
             <!-- are you mit ? -->
             <span class="arrow"><span></span></span>
         </li>
     </t>
+    <t t-if="widget.selection.folded.length">
+        <li t-att-class="value_folded ? 'oe_active oe_folded' : 'oe_folded'">
+            <span class="label"> ... </span>
+            <ul>
+                <t t-foreach="widget.selection.folded" t-as="i">
+                    <li t-att-class="i[0] === widget.get('value') ? 'oe_active' : ''" t-att-data-id="i[0]">
+                        <span class="label"><t t-esc="i[1]"/></span>
+                    </li>
+                </t>
+            </ul>
+        </li>
+    </t>
 </t>
 <t t-name="FieldBinaryImage">
     <span class="oe_form_field oe_form_field_image" t-att-style="widget.node.attrs.style">
@@ -1552,8 +1564,9 @@
     <t t-esc="attrs.string"/>
 </button>
 <ul t-name="SearchView.filters">
-    <li t-foreach="widget.filters" t-as="filter" t-if="filter.visible()"
-            t-att-title="filter.attrs.string ? filter.attrs.help : undefined">
+    <li t-foreach="widget.filters" t-as="filter" t-if="!filter.visible || filter.visible()"
+            t-att-title="filter.attrs.string ? filter.attrs.help : undefined"
+            t-att-data-index="filter_index">
         <t t-esc="filter.attrs.string or filter.attrs.help or filter.attrs.name or 'Ω'"/>
     </li>
 </ul>