[MERGE] from trunk

bzr revid: chm@openerp.com-20140311154616-tb35jfweo3xuzqws

14 files changed, 343 insertions, 126 deletions

diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css
index 4fb4496e692..da0fad43caf 100644
--- a/addons/website/static/src/css/editor.css
+++ b/addons/website/static/src/css/editor.css
@@ -26,6 +26,7 @@
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   box-shadow: none;
+  -ms-filter: "alpha(opacity=50)";
 }
 
 /* ---- OpenERP Style ---- {{{ */
@@ -250,6 +251,26 @@ ul.oe_menu_editor .disclose {
 .existing-attachments .pager .disabled {
   display: none;
 }
+.existing-attachments .existing-attachment-cell {
+  position: relative;
+}
+.existing-attachments .existing-attachment-cell .img {
+  border: 1px solid #848490;
+}
+.existing-attachments .existing-attachment-cell .existing-attachment-remove {
+  position: absolute;
+  top: 0;
+  left: 15px;
+  cursor: pointer;
+  background: white;
+  padding: 2px;
+  border: 1px solid #848490;
+  border-top: none;
+  border-left: none;
+  -moz-border-radius-bottomright: 8px;
+  -webkit-border-bottom-right-radius: 8px;
+  border-bottom-right-radius: 8px;
+}
 
 .cke_widget_wrapper {
   position: static !important;
diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass
index 2e6513f7c1d..4571dcd257e 100644
--- a/addons/website/static/src/css/editor.sass
+++ b/addons/website/static/src/css/editor.sass
@@ -23,6 +23,7 @@
     background: transparent
     border: none
     +box-shadow(none)
+    -ms-filter: "alpha(opacity=50)"
 
 // }}}
  
@@ -210,9 +211,27 @@ ul.oe_menu_editor
         .font-icons-selected
             background-color: #ddd
 
+$attachment-border-color: #848490
+.existing-attachments
+    .pager .disabled
+        display: none
 
-.existing-attachments .pager .disabled
-    display: none
+    .existing-attachment-cell
+        position: relative
+        .img
+            border: 1px solid $attachment-border-color
+        .existing-attachment-remove
+            position: absolute
+            top: 0
+            left: 15px // padding-left on col-*
+
+            cursor: pointer
+            background: white
+            padding: 2px
+            border: 1px solid $attachment-border-color
+            border-top: none
+            border-left: none
+            +border-bottom-right-radius(8px)
 
 // wrapper positioned relatively for drag&drop widget which is disabled below.
 // Breaks completely horribly crazy products listing page, so take it out.
diff --git a/addons/website/static/src/css/snippets.css b/addons/website/static/src/css/snippets.css
index 4baa2b06f2d..1416f2f899f 100644
--- a/addons/website/static/src/css/snippets.css
+++ b/addons/website/static/src/css/snippets.css
@@ -80,10 +80,8 @@
   -moz-user-select: none;
   user-select: none;
   cursor: move;
-  pointer-events: none;
 }
 .oe_snippet .oe_snippet_thumbnail {
-  pointer-events: auto;
   text-align: center;
   height: 100%;
   background: transparent;
@@ -200,6 +198,7 @@
 
 .oe_overlay {
   display: none;
+  height: 0;
   position: absolute;
   background: transparent;
   -webkit-border-radius: 3px;
@@ -214,20 +213,12 @@
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
-  pointer-events: none;
 }
 .oe_overlay.oe_active {
   display: block;
-  border-style: dashed;
-  border-width: 1px;
-  -webkit-box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.3), 0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset;
-  -moz-box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.3), 0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset;
-  box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.3), 0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset;
-  border-color: rgba(0, 0, 0, 0.3);
 }
 .oe_overlay .oe_handle {
   display: block !important;
-  pointer-events: auto;
   position: absolute;
   top: 50%;
   left: 50%;
@@ -238,7 +229,18 @@
   height: 16px;
   margin: -2px;
 }
+.oe_overlay .oe_handle > div {
+  z-index: 1;
+  position: absolute;
+  border-style: dashed;
+  border-width: 1px;
+  border-color: #666666;
+  -webkit-box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.5), 0px 0px 0px 1px rgba(255, 255, 255, 0.5) inset;
+  -moz-box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.5), 0px 0px 0px 1px rgba(255, 255, 255, 0.5) inset;
+  box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.5), 0px 0px 0px 1px rgba(255, 255, 255, 0.5) inset;
+}
 .oe_overlay .oe_handle.e:before, .oe_overlay .oe_handle.w:before, .oe_overlay .oe_handle.s:before, .oe_overlay .oe_handle.n:before, .oe_overlay .oe_handle.size .oe_handle_button {
+  z-index: 2;
   position: relative;
   top: 50%;
   left: 50%;
@@ -270,56 +272,70 @@
   -moz-box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.7);
   box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.7);
 }
+.oe_overlay .oe_handle.e, .oe_overlay .oe_handle.w {
+  top: 4px;
+  height: 100%;
+}
 .oe_overlay .oe_handle.e:before, .oe_overlay .oe_handle.w:before {
   content: "\f0d9-\f0da";
   line-height: 16px;
 }
+.oe_overlay .oe_handle.e > div, .oe_overlay .oe_handle.w > div {
+  width: 0;
+  height: 100%;
+  top: 2px;
+  left: 8px;
+}
 .oe_overlay .oe_handle.e {
   left: auto;
-  top: 2px;
-  height: 100%;
   right: -6px;
   cursor: w-resize;
 }
 .oe_overlay .oe_handle.w {
-  top: 2px;
-  height: 100%;
   left: -6px;
   cursor: e-resize;
 }
+.oe_overlay .oe_handle.s, .oe_overlay .oe_handle.n {
+  left: 2px;
+  width: 100%;
+}
 .oe_overlay .oe_handle.s:before, .oe_overlay .oe_handle.n:before {
-  z-index: 0;
   content: "\f07d";
   text-align: center;
   padding: 1px;
 }
+.oe_overlay .oe_handle.s > div, .oe_overlay .oe_handle.n > div {
+  width: 100%;
+  height: 0;
+  top: 7px;
+  left: 1px;
+}
 .oe_overlay .oe_handle.s {
   top: auto;
-  left: 2px;
-  width: 100%;
-  bottom: -6px;
   cursor: n-resize;
 }
 .oe_overlay .oe_handle.n {
-  left: 2px;
-  width: 100%;
-  top: -6px;
   cursor: s-resize;
 }
+.oe_overlay .oe_handle.n > div {
+  top: 5px;
+}
 .oe_overlay .oe_handle.size {
+  z-index: 3;
   top: auto;
-  left: 2px;
-  width: 100%;
+  left: 50%;
   bottom: -6px;
 }
 .oe_overlay .oe_handle.size .oe_handle_button {
-  z-index: 1;
+  z-index: 3;
   content: "Resize";
   width: 64px;
   text-align: center;
   margin-left: -32px;
   margin-top: -10px;
   cursor: row-resize;
+  left: 0px;
+  top: 9px;
 }
 .oe_overlay .oe_handle.size .oe_handle_button:hover {
   background: rgba(30, 30, 30, 0.8);
@@ -328,25 +344,20 @@
   -moz-box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.7);
   box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.7);
 }
-.oe_overlay .oe_handle.size div {
-  border-style: dashed;
-  border-width: 0 0 1px 0;
-  border-color: rgba(0, 0, 0, 0.5);
-  position: relative;
-  top: 8px;
-}
 .oe_overlay .icon.btn {
   display: inline-block;
 }
 .oe_overlay .oe_overlay_options {
   position: absolute;
-  width: 100%;
+  left: 50% !important;
   text-align: center;
   top: -20px;
   z-index: 1002;
 }
+.oe_overlay .oe_overlay_options > .btn-group {
+  left: -50%;
+}
 .oe_overlay .oe_overlay_options .btn, .oe_overlay .oe_overlay_options a {
-  pointer-events: auto;
   cursor: pointer;
 }
 .oe_overlay .oe_overlay_options .dropdown {
@@ -505,7 +516,6 @@
   box-shadow: 0px 3px 17px rgba(99, 53, 150, 0.59);
 }
 .oe_snippet_editor .oe_snippet > * {
-  pointer-events: none;
   margin-top: 16px;
   line-height: 1em;
   zoom: 0.6;
diff --git a/addons/website/static/src/css/snippets.sass b/addons/website/static/src/css/snippets.sass
index 1be99e27f19..8d337aadf3c 100644
--- a/addons/website/static/src/css/snippets.sass
+++ b/addons/website/static/src/css/snippets.sass
@@ -64,9 +64,7 @@
     overflow: hidden
     +user-select(none)
     cursor: move
-    pointer-events: none
     .oe_snippet_thumbnail
-        pointer-events: auto
         text-align: center
         height: 100%
         background: transparent
@@ -150,22 +148,17 @@
 
 .oe_overlay
     display: none
+    height: 0
     position: absolute
     background: transparent
     //@include background-image( repeating-linear-gradient(45deg, rgba(255,255,255,.02) ,rgba(255,255,255,.02) 35px, rgba(0,0,0,.02) 35px, rgba(0,0,0,.02) 75px))
     +border-radius(3px)
     @include transition(opacity 100ms linear)
     +box-sizing(border-box)
-    pointer-events: none
     &.oe_active
         display: block
-        border-style: dashed
-        border-width: 1px
-        +box-shadow(0px 0px 0px 1px rgba(255,255,255,0.3), 0px 0px 0px 1px rgba(255,255,255,0.3) inset)
-        border-color: rgba(0, 0, 0, 0.3)
     .oe_handle
         display: block !important
-        pointer-events: auto
         position: absolute
         top: 50%
         left: 50%
@@ -173,7 +166,15 @@
         width: 16px
         height: 16px
         margin: -2px
+        > div
+            z-index: 1
+            position: absolute
+            border-style: dashed
+            border-width: 1px
+            border-color: #666666
+            +box-shadow(0px 0px 0px 1px rgba(255,255,255,0.5), 0px 0px 0px 1px rgba(255,255,255,0.5) inset)
         &.e:before, &.w:before, &.s:before, &.n:before, &.size .oe_handle_button
+            z-index: 2
             position: relative
             top: 50%
             left: 50%
@@ -196,72 +197,74 @@
                 color: #fff
                 +box-shadow(0 0 5px 3px rgba(255,255,255,.7))
         &.e, &.w
+            top: 4px
+            height: 100%
             &:before
                 content: "\f0d9-\f0da"
                 line-height: 16px
+            > div
+                width: 0
+                height: 100%
+                top: 2px
+                left: 8px
         &.e
             left: auto
-            top: 2px
-            height: 100%
             right: -6px
             cursor: w-resize
         &.w
-            top: 2px
-            height: 100%
             left: -6px
             cursor: e-resize
         &.s, &.n
+            left: 2px
+            width: 100%
             &:before
-                z-index: 0
                 content: "\f07d"
                 text-align: center
                 padding: 1px
+            > div
+                width: 100%
+                height: 0
+                top: 7px
+                left: 1px
         &.s
             top: auto
-            left: 2px
-            width: 100%
-            bottom: -6px
             cursor: n-resize
         &.n
-            left: 2px
-            width: 100%
-            top: -6px
             cursor: s-resize
+            > div
+                top: 5px
         &.size
+            z-index: 3
             top: auto
-            left: 2px
-            width: 100%
+            left: 50%
             bottom: -6px
             .oe_handle_button
-                z-index: 1
+                z-index: 3
                 content: "Resize"
                 width: 64px
                 text-align: center
                 margin-left: -32px
                 margin-top: -10px
                 cursor: row-resize
+                left: 0px
+                top: 9px
                 &:hover
                     background: rgba(30, 30, 30, .8)
                     color: #fff
                     +box-shadow(0 0 5px 3px rgba(255,255,255,.7))
-            div
-                border-style: dashed
-                border-width: 0 0 1px 0
-                border-color: rgba(0, 0, 0, 0.5)
-                position: relative
-                top: 8px
 
     .icon.btn
         display: inline-block
 
     .oe_overlay_options
         position: absolute
-        width: 100%
+        left: 50% !important
         text-align: center
         top: -20px
         z-index: 1002
+        > .btn-group
+            left: -50%
         .btn, a
-            pointer-events: auto
             cursor: pointer
         .dropdown
             display: inline-block
@@ -392,7 +395,6 @@
             border: 2px solid rgb(151, 137, 255)
             box-shadow: 0px 3px 17px rgba(99, 53, 150, 0.59)
         & > *
-            pointer-events: none
             margin-top: 16px
             line-height: 1em
             zoom: 0.6
diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css
index fb6dd4552b1..310f6b8156e 100644
--- a/addons/website/static/src/css/website.css
+++ b/addons/website/static/src/css/website.css
@@ -390,22 +390,15 @@ div.carousel .carousel-indicators .active {
 }
 
 .parallax {
-  position: relative;
   background-size: cover;
+}
+.parallax > div {
+  position: relative;
   display: table;
   width: 100%;
-  min-height: 100px;
-}
-.parallax.oe_small {
   min-height: 200px;
 }
-.parallax.oe_medium {
-  min-height: 300px;
-}
-.parallax.oe_big {
-  min-height: 450px;
-}
-.parallax > div {
+.parallax > div > div {
   display: table-cell;
   vertical-align: middle;
   padding: 32px 0;
diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass
index 787dca1257f..563dcae95ec 100644
--- a/addons/website/static/src/css/website.sass
+++ b/addons/website/static/src/css/website.sass
@@ -322,21 +322,16 @@ div.carousel
             background-color: grey
 
 .parallax
-    position: relative
     background-size: cover
-    display: table
-    width: 100%
-    min-height: 100px
-    &.oe_small
-        min-height: 200px
-    &.oe_medium
-        min-height: 300px
-    &.oe_big
-        min-height: 450px
     > div
-        display: table-cell
-        vertical-align: middle
-        padding: 32px 0
+        position: relative
+        display: table
+        width: 100%
+        min-height: 200px
+        > div
+            display: table-cell
+            vertical-align: middle
+            padding: 32px 0
 
 /* Background */
 
diff --git a/addons/website/static/src/js/website.ace.js b/addons/website/static/src/js/website.ace.js
index ed7037e903c..a8af74bb52d 100644
--- a/addons/website/static/src/js/website.ace.js
+++ b/addons/website/static/src/js/website.ace.js
@@ -39,12 +39,17 @@
             this.xml = text;
         },
         isWellFormed: function () {
+            var error;
             if (document.implementation.createDocument) {
-                var dom = new DOMParser().parseFromString(this.xml, "text/xml");
-                var error = dom.getElementsByTagName("parsererror");
-                return error.length === 0 || error;
-            } else if (window.ActiveXObject) {
-                // TODO test in IE
+                // use try catch for ie
+                try {
+                    var dom = new DOMParser().parseFromString(this.xml, "text/xml");
+                    error = dom.getElementsByTagName("parsererror");
+                    return error.length === 0 || $(error).text();
+                } catch (e) {}
+            }
+            if (window.ActiveXObject) {
+                // IE
                 var msDom = new ActiveXObject("Microsoft.XMLDOM");
                 msDom.async = false;
                 msDom.loadXML(this.xml);
@@ -284,7 +289,7 @@
                     def.reject("server", session, error);
                 });
             } else {
-                def.reject(null, session, $(isWellFormed).text());
+                def.reject(null, session, isWellFormed);
             }
             return def;
         },
diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js
index dc82c0c17b9..a5cf89b3a4e 100644
--- a/addons/website/static/src/js/website.editor.js
+++ b/addons/website/static/src/js/website.editor.js
@@ -20,6 +20,10 @@
             website.form(this.pathname, 'POST');
         });
 
+        $(document).on('click', '.cke_editable label', function (ev) {
+            ev.preventDefault();
+        });
+
         $(document).on('submit', '.cke_editable form', function (ev) {
             // Disable form submition in editable mode
             ev.preventDefault();
@@ -66,8 +70,10 @@
     // only enable editors manually
     CKEDITOR.disableAutoInline = true;
     // EDIT ALL THE THINGS
-    CKEDITOR.dtd.$editable = $.extend(
-        {}, CKEDITOR.dtd.$block, CKEDITOR.dtd.$inline);
+    CKEDITOR.dtd.$editable = _.omit(
+        $.extend({}, CKEDITOR.dtd.$block, CKEDITOR.dtd.$inline),
+        // well maybe not *all* the things
+        'ul', 'ol', 'li', 'table', 'tr', 'th', 'td');
     // Disable removal of empty elements on CKEDITOR activation. Empty
     // elements are used for e.g. support of FontAwesome icons
     CKEDITOR.dtd.$removeEmpty = {};
@@ -377,8 +383,7 @@
                         });
                     },
                     upcast: function (el) {
-                        return el.attributes['class']
-                            && (/\bfa\b/.test(el.attributes['class']));
+                        return el.hasClass('fa');
                     }
                 });
             }
@@ -625,11 +630,11 @@
             var $link_button = this.make_hover_button(_t("Change"), function () {
                 var sel = new CKEDITOR.dom.element(previous);
                 editor.getSelection().selectElement(sel);
-                if (previous.tagName.toUpperCase() === 'A') {
-                    link_dialog(editor);
-                } else if(sel.hasClass('fa')) {
+                if(sel.hasClass('fa')) {
                     new website.editor.FontIconsDialog(editor, previous)
                         .appendTo(document.body);
+                } else if (previous.tagName.toUpperCase() === 'A') {
+                    link_dialog(editor);
                 }
                 $link_button.hide();
                 previous = null;
@@ -650,6 +655,7 @@
                 if (previous && previous === this) { return; }
 
                 var selected = new CKEDITOR.dom.element(this);
+                // FIXME: fa nodes may not be editable widgets (?)
                 if (!is_editable_node(selected) && !selected.hasClass('fa')) {
                     return;
                 }
@@ -837,7 +843,6 @@
                     document.execCommand("enableInlineTableEditing", false, "false");
                 } catch (e) {}
 
-
                 // detect & setup any CKEDITOR widget within a newly dropped
                 // snippet. There does not seem to be a simple way to do it for
                 // HTML not inserted via ckeditor APIs:
@@ -1436,6 +1441,7 @@
                 this.page += $target.hasClass('previous') ? -1 : 1;
                 this.display_attachments();
             },
+            'click .existing-attachment-remove': 'try_remove',
         }),
         init: function (parent) {
             this.image = null;
@@ -1458,7 +1464,7 @@
                 kwargs: {
                     fields: ['name', 'website_url'],
                     domain: [['res_model', '=', 'ir.ui.view']],
-                    order: 'name',
+                    order: 'id desc',
                     context: website.get_context(),
                 }
             });
@@ -1468,6 +1474,7 @@
             this.display_attachments();
         },
         display_attachments: function () {
+            this.$('.help-block').empty();
             var per_screen = IMAGES_PER_ROW * IMAGES_ROWS;
 
             var from = this.page * per_screen;
@@ -1495,6 +1502,34 @@
             }
             this.close()
         },
+
+        try_remove: function (e) {
+            var $help_block = this.$('.help-block').empty();
+            var self = this;
+            var id = parseInt($(e.target).data('id'), 10);
+            var attachment = _.findWhere(this.records, {id: id});
+
+            return openerp.jsonRpc('/web/dataset/call_kw', 'call', {
+                model: 'ir.attachment',
+                method: 'try_remove',
+                args: [],
+                kwargs: {
+                    ids: [id],
+                    context: website.get_context()
+                }
+            }).then(function (prevented) {
+                if (_.isEmpty(prevented)) {
+                    self.records = _.without(self.records, attachment);
+                    self.display_attachments();
+                    return;
+                }
+                $help_block.replaceWith(openerp.qweb.render(
+                    'website.editor.dialog.image.existing.error', {
+                        views: prevented[id]
+                    }
+                ));
+            });
+        },
     });
 
     function get_selected_link(editor) {
@@ -1684,6 +1719,9 @@
                     // ignore mutation if the *only* change is .cke_focus
                     return change.length !== 1 || change[0] === 'cke_focus';
                 case 'childList':
+                    setTimeout(function () {
+                        fixup_browser_crap(m.addedNodes);
+                    }, 0);
                     // Remove ignorable nodes from addedNodes or removedNodes,
                     // if either set remains non-empty it's considered to be an
                     // impactful change. Otherwise it's ignored.
@@ -1721,4 +1759,69 @@
         }
         return output;
     }
+
+    var programmatic_styles = {
+        float: 1,
+        display: 1,
+        position: 1,
+        top: 1,
+        left: 1,
+        right: 1,
+        bottom: 1,
+    };
+    function fixup_browser_crap(nodes) {
+        if (!nodes || !nodes.length) { return; }
+        /**
+         * Checks that the node only has a @style, not e.g. @class or whatever
+         */
+        function has_only_style(node) {
+            for (var i = 0; i < node.attributes.length; i++) {
+                var attr = node.attributes[i];
+                if (attr.attributeName !== 'style') {
+                    return false;
+                }
+            }
+            return true;
+        }
+        function has_programmatic_style(node) {
+            for (var i = 0; i < node.style.length; i++) {
+              var style = node.style[i];
+              if (programmatic_styles[style]) {
+                  return true;
+              }
+            }
+            return false;
+        }
+
+        for (var i=0; i<nodes.length; ++i) {
+            var node = nodes[i];
+            if (node.nodeType !== document.ELEMENT_NODE) { continue; }
+
+            if (node.nodeName === 'SPAN'
+                    && has_only_style(node)
+                    && !has_programmatic_style(node)) {
+                // On backspace, webkit browsers create a <span> with a bunch of
+                // inline styles "remembering" where they come from. Refs:
+                //    http://www.neotericdesign.com/blog/2013/3/working-around-chrome-s-contenteditable-span-bug
+                //    https://code.google.com/p/chromium/issues/detail?id=226941
+                //    https://bugs.webkit.org/show_bug.cgi?id=114791
+                //    http://dev.ckeditor.com/ticket/9998
+                var child, parent = node.parentNode;
+                while (child = node.firstChild) {
+                    parent.insertBefore(child, node);
+                }
+                parent.removeChild(node);
+                // chances are we had e.g.
+                //  <p>foo</p>
+                //  <p>bar</p>
+                // merged the lines getting this in webkit
+                //  <p>foo<span>bar</span></p>
+                // after unwrapping the span, we have 2 text nodes
+                //  <p>[foo][bar]</p>
+                // where we probably want only one. Normalize will merge
+                // adjacent text nodes. However, does not merge text and cdata
+                parent.normalize();
+            }
+        }
+    }
 })();
diff --git a/addons/website/static/src/js/website.js b/addons/website/static/src/js/website.js
index b99004243a2..249058d91fb 100644
--- a/addons/website/static/src/js/website.js
+++ b/addons/website/static/src/js/website.js
@@ -69,6 +69,8 @@
         website.is_editable = website.is_editable || $('html').data('editable');
         website.is_editable_button= website.is_editable_button || $('html').data('editable');
         dom_ready.resolve();
+        // fix for ie
+        if($.fn.placeholder) $('input, textarea').placeholder();
     });
 
     website.init_kanban = function ($kanban) {
diff --git a/addons/website/static/src/js/website.mobile.js b/addons/website/static/src/js/website.mobile.js
index 4acf2d78db8..59c2328e09b 100644
--- a/addons/website/static/src/js/website.mobile.js
+++ b/addons/website/static/src/js/website.mobile.js
@@ -17,6 +17,9 @@
             'hidden.bs.modal': 'destroy'
         },
         start: function () {
+            if (!window.location.origin) { // fix for ie9
+                window.location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '') + '/';
+            }
             document.getElementById("mobile-viewport").src = window.location.origin + window.location.pathname + "#mobile-preview";
             this.$el.modal();
         },
diff --git a/addons/website/static/src/js/website.snippets.animation.js b/addons/website/static/src/js/website.snippets.animation.js
index 8d7b634e177..55da2b9df66 100644
--- a/addons/website/static/src/js/website.snippets.animation.js
+++ b/addons/website/static/src/js/website.snippets.animation.js
@@ -72,6 +72,10 @@
         start: function () {
             this.$target.carousel({interval: 10000});
         },
+        stop: function () {
+            this.$target.carousel('pause');
+            this.$target.removeData("bs.carousel");
+        },
     });
 
     website.snippet.animationRegistry.parallax = website.snippet.Animation.extend({
diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js
index b615f8d60e5..ce24f7e7780 100644
--- a/addons/website/static/src/js/website.snippets.editor.js
+++ b/addons/website/static/src/js/website.snippets.editor.js
@@ -19,13 +19,23 @@
         edit: function () {
             var self = this;
             $("[data-oe-model] *, [data-oe-type=html] *").off('click');
+            website.snippet.stop_animation();
             window.snippets = this.snippets = new website.snippet.BuildingBlock(this);
             this.snippets.appendTo(this.$el);
-
             this.on('rte:ready', this, function () {
                 self.snippets.$button.removeClass("hidden");
-                website.snippet.stop_animation();
-                website.snippet.start_animation(true);
+                website.snippet.start_animation();
+                $(website.snippet.readyAnimation).each(function() {
+                    var animation = $(this).data("snippet-view");
+                    if (animation) {
+                        animation.$target.on('focus', '*', function(){
+                            animation.stop();
+                        });
+                        animation.$target.on('blur', '*', function(){
+                            animation.start();
+                        });
+                    }
+                });
             });
 
             return this._super.apply(this, arguments);
@@ -166,13 +176,14 @@
             var mt = parseInt($target.css("margin-top") || 0);
             var mb = parseInt($target.css("margin-bottom") || 0);
             $el.css({
-                'position': 'absolute',
                 'width': $target.outerWidth(),
-                'height': $target.outerHeight() + mt + mb+1,
-                'top': pos.top - mt,
+                'top': pos.top - mt - 5,
                 'left': pos.left
             });
-            $el.find(".oe_handle.size").css("bottom", (mb-7)+'px');
+            $el.find(">.e,>.w").css({'height': $target.outerHeight() + mt + mb+1});
+            $el.find(">.s").css({'top': $target.outerHeight() + mt + mb});
+            $el.find(">.size").css({'top': $target.outerHeight() + mt});
+            $el.find(">.s,>.n").css({'width': $target.outerWidth()-2});
         },
         show: function () {
             this.$el.removeClass("hidden");
@@ -189,7 +200,6 @@
 
         bind_snippet_click_editor: function () {
             var self = this;
-            var snipped_event_flag = false;
             $("#wrapwrap").on('click', function (event) {
                 if (snipped_event_flag) {
                     return;
@@ -197,7 +207,7 @@
                 snipped_event_flag = true;
 
                 setTimeout(function () {snipped_event_flag = false;}, 0);
-                var $target = $(event.srcElement);
+                var $target = $(event.srcElement || event.target);
 
                 if (!$target.is(website.snippet.globalSelector)) {
                     $target = $target.parents(website.snippet.globalSelector).first();
@@ -381,14 +391,13 @@
                         setTimeout(function () {
                             $("#oe_snippets").trigger('snippet-dropped', $target);
 
-                            // after rte
                             website.snippet.start_animation(true, $target);
 
+                            // drop_and_build_snippet
                             self.create_overlay($target);
                             if ($target.data("snippet-editor")) {
                                 $target.data("snippet-editor").drop_and_build_snippet($target);
                             }
-
                             for (var k in website.snippet.templateOptions) {
                                 $target.find(website.snippet.templateOptions[k].selector).each(function () {
                                     var $snippet = $(this);
@@ -399,6 +408,23 @@
                                 });
                             }
 
+                            // reset snippet for rte
+                            $target.removeData("snippet-editor");
+                            if ($target.data("overlay")) {
+                                $target.data("overlay").remove();
+                                $target.removeData("overlay");
+                            }
+                            $target.find("[data-snippet-id]").each(function () {
+                                var $snippet = $(this);
+                                $snippet.removeData("snippet-editor");
+                                if ($snippet.data("overlay")) {
+                                    $snippet.data("overlay").remove();
+                                    $snippet.removeData("overlay");
+                                }
+                            });
+                            self.create_overlay($target);
+                            // end
+
                             self.make_active($target);
                         },0);
                     } else {
@@ -543,6 +569,20 @@
                 var $target = $(this);
                 if (!$target.data('overlay')) {
                     var $zone = $(openerp.qweb.render('website.snippet_overlay'));
+
+                    // fix for pointer-events: none with ie9
+                    if (document.body && document.body.addEventListener) {
+                        $zone.on("click mousedown mousedown", function passThrough(event) {
+                            event.preventDefault();
+                            $target.each(function() {
+                               // check if clicked point (taken from event) is inside element
+                                event.srcElement = this;
+                                $(this).trigger(event.type);
+                            });
+                            return false;
+                        });
+                    }
+
                     $zone.appendTo('#oe_manipulators');
                     $zone.data('target',$target);
                     $target.data('overlay',$zone);
@@ -759,6 +799,7 @@
             this.$el.find('li:has(li[data-class].active)').addClass("active");
         }
     });
+
     website.snippet.options.slider = website.snippet.Option.extend({
         drop_and_build_snippet: function() {
             var id = $(".carousel").length;
@@ -1154,7 +1195,6 @@
         on_clone: function () {
             var $clone = this.$target.clone(false);
             var _class = $clone.attr("class").replace(/\s*(col-lg-offset-|col-md-offset-)([0-9-]+)/g, '');
-            _class += ' col-md-1';
             $clone.attr("class", _class);
             this.$target.after($clone);
             this.hide_remove_button();
@@ -1200,6 +1240,7 @@
             this._super(compass, beginClass, current);
         },
     });
+
     website.snippet.options["resize"] = website.snippet.options.marginAndResize.extend({
         getSize: function () {
             this.grid = this._super();
@@ -1234,7 +1275,10 @@
                 self.$target.data("snippet-view").set_values();
             });
             this.$target.attr('contentEditable', 'false');
-            this.$target.find('> div > .oe_structure').attr('contentEditable', 'true');
+
+            this.$target.find('> div > .oe_structure').attr('contentEditable', 'true'); // saas-3 retro-compatibility
+
+            this.$target.find('> div > div:not(.oe_structure) > .oe_structure').attr('contentEditable', 'true');
         },
         scroll: function () {
             var self = this;
diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml
index 8caac7c6683..09aa3783c3f 100644
--- a/addons/website/static/src/xml/website.editor.xml
+++ b/addons/website/static/src/xml/website.editor.xml
@@ -140,8 +140,9 @@
                         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                         <h3 class="modal-title">Select a Picture</h3>
                     </div>
-                    <div class="modal-body">
+                    <div class="modal-body has-error">
                         <div class="existing-attachments"/>
+                        <div class="help-block"/>
                     </div>
                     <div class="modal-footer">
                         <a href="#" data-dismiss="modal" aria-hidden="true">Discard</a>
@@ -157,12 +158,27 @@
                 <li class="next disabled"><a href="#">Next →</a></li>
             </ul>
             <div class="row mt16" t-foreach="rows" t-as="row">
-                <div class="col-sm-2" t-foreach="row" t-as="attachment">
+                <div class="col-sm-2 existing-attachment-cell"
+                     t-foreach="row" t-as="attachment">
+                    <i class="fa fa-times existing-attachment-remove" t-att-data-id="attachment.id"/>
                     <img t-att-src="attachment.website_url" t-att-alt="attachment.name" class="img img-responsive"/>
                 </div>
             </div>
         </div>
     </t>
+    <t t-name="website.editor.dialog.image.existing.error">
+        <div class="help-block">
+            <p>The image could not be deleted because it is used in the
+               following pages or views:</p>
+            <ul t-foreach="views" t-as="view">
+                <li>
+                    <a t-attf-href="/web#model=ir.ui.view&amp;id=#{view.id}">
+                        <t t-esc="view.name"/>
+                    </a> (id <t t-esc="view.id"/>)
+                </li>
+            </ul>
+        </div>
+    </t>
     <t t-name="website.editor.table.panel">
         <table class="editorbar-panel">
             <tr t-foreach="rows"><td t-foreach="cols">&#8203;</td></tr>
diff --git a/addons/website/static/src/xml/website.snippets.xml b/addons/website/static/src/xml/website.snippets.xml
index d73e0c3934a..ae109139e3c 100644
--- a/addons/website/static/src/xml/website.snippets.xml
+++ b/addons/website/static/src/xml/website.snippets.xml
@@ -46,11 +46,11 @@
     <div t-name="website.snippets.resize" data-snippet-id='resize'>
         <!-- custom data for the widget -->
         <div class='oe_handles'>
-            <div class='oe_handle n'></div>
-            <div class='oe_handle e'></div>
-            <div class='oe_handle w'></div>
-            <div class='oe_handle size'><div class="oe_handle_button size">Resize</div><div class="oe_border"/></div>
-            <div class='oe_handle s'></div>
+            <div class='oe_handle n'><div></div></div>
+            <div class='oe_handle e'><div></div></div>
+            <div class='oe_handle w'><div></div></div>
+            <div class='oe_handle size'><div class="oe_handle_button size">Resize</div></div>
+            <div class='oe_handle s'><div></div></div>
         </div>
         <div class='oe_snippet_thumbnail'>Margin resize</div>
     </div>