From 26692117b6daedf69559c5f183f1e76682623ce7 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Wed, 26 Mar 2014 11:53:45 +0100 Subject: [PATCH 01/39] [ADD] website: add jQuery.transfo.js to transform dom (rotation, scale, translate) bzr revid: chm@openerp.com-20140326105345-rq58x39zl6wi6a7s --- .../website/static/src/js/jQuery.transfo.js | 321 ++++++++++++++++++ addons/website/views/website_templates.xml | 2 + 2 files changed, 323 insertions(+) create mode 100644 addons/website/static/src/js/jQuery.transfo.js diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js new file mode 100644 index 00000000000..84a32b3d046 --- /dev/null +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -0,0 +1,321 @@ +/* +Copyright (c) 2014 Christophe Matthieu, + +Permission is hereby granted, free of charge, to any person +obtaining a copy of this software and associated documentation +files (the "Software"), to deal in the Software without +restriction, including without limitation the rights to use, +copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the +Software is furnished to do so, subject to the following +conditions: + +The above copyright notice and this permission notice shall be +included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES +OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND +NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT +HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR +OTHER DEALINGS IN THE SOFTWARE. +*/ + +(function($){ + 'use strict'; + var rad = Math.PI/180; + + // public methods + var methods = { + init : function(settings) { + return this.each(function() { + var $this = $(this), transfo = $this.data('transfo'); + if (!transfo) { + _init($this, settings); + } else { + _overwriteOptions($this, transfo, settings); + } + }); + }, + + destroy : function() { + return this.each(function() { + var $this = $(this); + if ($this.data('transfo')) { + _destroy($this); + } + }); + }, + + settings : function() { + if(this.length > 1) { + this.map(function () { + var $this = $(this); + return $this.data('transfo') && $this.data('transfo').settings; + }); + } + return $this.data('transfo') && $this.data('transfo').settings; + } + }; + + $.fn.transfo = function( method ) { + if ( methods[method] ) { + return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 )); + } else if ( typeof method === 'object' || ! method ) { + return methods.init.apply( this, arguments ); + } else { + $.error( 'Method ' + method + ' does not exist on jQuery.transfo' ); + } + return false; + }; + + function _init ($this, settings) { + var transfo = {}; + $this.data('transfo', transfo); + + + // generate all the controls markup + var css = "box-sizing: border-box; position: absolute; background-color: #fff; border: 1px solid #ccc; width: 8px; height: 8px; margin-left: -4px; margin-top: -4px;"; + transfo.$markup = $('' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
'); + transfo.$center = transfo.$markup.find(".transfo-scaler-mc"); + + // init setting and get css to set wrap + _setOptions($this, transfo); + _overwriteOptions ($this, transfo, settings); + + // set transfo container and markup + _targetCss($this, transfo); + + // append controls to container + $("body").append(transfo.$markup); + + _bind($this, transfo); + } + + function _overwriteOptions ($this, transfo, settings) { + transfo.settings = $.extend(transfo.settings, settings || {}); + } + + function _setOptions ($this, transfo) { + var style = $this.attr("style"); + var transform = (style||"").match(/transform\s*:([^;]+)/) ? style.match(/transform\s*:([^;]+)/)[1] : ""; + + transfo.settings = {}; + + transfo.settings.angle= transform.indexOf('rotate') != -1 ? parseFloat(transform.match(/rotate\(([^)]+)deg\)/)[1]) : 0; + transfo.settings.translatex= transform.indexOf('translateX') != -1 ? parseFloat(transform.match(/translateX\(([^)]+)\)/)[1]) : 0; + transfo.settings.translatey= transform.indexOf('translateY') != -1 ? parseFloat(transform.match(/translateY\(([^)]+)\)/)[1]) : 0; + transfo.settings.scalex= transform.indexOf('scaleX') != -1 ? parseFloat(transform.match(/scaleX\(([^)]+)\)/)[1]) : 1; + transfo.settings.scaley= transform.indexOf('scaleY') != -1 ? parseFloat(transform.match(/scaleY\(([^)]+)\)/)[1]) : 1; + + transfo.settings.style = ($this.attr("style")||"").replace(/[^;]+transform[^;]+/g, ''); + $this.attr("style", transfo.settings.style); + + transfo.settings.height = $this.innerHeight(); + transfo.settings.width = $this.innerWidth(); + transfo.settings.css = window.getComputedStyle($this[0], null); + transfo.settings.pos = $this.offset(); + } + + function _bind ($this, transfo) { + function mousedown (event) { + _mouseDown($this, transfo, event); + $(document).on("mousemove", mousemove).on("mouseup", mouseup); + } + function mousemove (event) { + _mouseMove($this, transfo, event); + } + function mouseup (event) { + _mouseUp($this, transfo, event); + $(document).off("mousemove", mousemove).off("mouseup", mouseup); + } + + transfo.$markup.off().on("mousedown", mousedown); + transfo.$markup.find(".transfo-rotator, .transfo-scaler").off().on("mousedown", mousedown); + } + + function _mouseDown($this, transfo, event) { + event.preventDefault(); + if (transfo.active || event.which !== 1) return; + + var type = "position", + $e = $(event.srcElement); + if ($e.hasClass("transfo-rotator")) type = "rotator"; + else if ($e.hasClass("transfo-scaler-tl")) type = "tl"; + else if ($e.hasClass("transfo-scaler-tr")) type = "tr"; + else if ($e.hasClass("transfo-scaler-br")) type = "br"; + else if ($e.hasClass("transfo-scaler-bl")) type = "bl"; + else if ($e.hasClass("transfo-scaler-tc")) type = "tc"; + else if ($e.hasClass("transfo-scaler-bc")) type = "bc"; + else if ($e.hasClass("transfo-scaler-ml")) type = "ml"; + else if ($e.hasClass("transfo-scaler-mr")) type = "mr"; + + transfo.active = { + "type": type, + "pageX": event.pageX, + "pageY": event.pageY, + }; + } + function _mouseUp($this, transfo, event) { + transfo.active = null; + } + + function _mouseMove($this, transfo, event) { + event.preventDefault(); + if (!transfo.active) return; + var settings = transfo.settings; + var center = transfo.$center.offset(); + var cdx = center.left - event.pageX; + var cdy = center.top - event.pageY; + + if (transfo.active.type == "rotator") { + var ang; + if (center.top != event.pageY) ang = Math.atan(- cdx / cdy) / rad; + else ang = 0; + if (event.pageY >= center.top && event.pageX >= center.left) ang += 180; + else if (event.pageY >= center.top && event.pageX < center.left) ang += 180; + else if (event.pageY < center.top && event.pageX < center.left) ang += 360; + + settings.angle = ang; + + // reset position : don't move center + _targetCss($this, transfo); + var new_center = transfo.$center.offset(); + var x = center.left - new_center.left; + var y = center.top - new_center.top; + var angle = ang * rad; + settings.translatex += x*Math.cos(angle) - y*Math.sin(-angle); + settings.translatey += - x*Math.sin(angle) + y*Math.cos(-angle); + } + else if (transfo.active.type == "position") { + var angle = settings.angle * rad; + var x = event.pageX - transfo.active.pageX; + var y = event.pageY - transfo.active.pageY; + transfo.active.pageX = event.pageX; + transfo.active.pageY = event.pageY; + var dx = x*Math.cos(angle) - y*Math.sin(-angle); + var dy = - x*Math.sin(angle) + y*Math.cos(-angle); + + settings.translatex += dx; + settings.translatey += dy; + } + else if (transfo.active.type.length === 2) { + var angle = settings.angle * rad; + var dx = cdx*Math.cos(angle) - cdy*Math.sin(-angle); + var dy = - cdx*Math.sin(angle) + cdy*Math.cos(-angle); + if (transfo.active.type.indexOf("t") != -1) { + settings.scaley = dy / (settings.height/2); + } + if (transfo.active.type.indexOf("b") != -1) { + settings.scaley = - dy / (settings.height/2); + } + if (transfo.active.type.indexOf("l") != -1) { + settings.scalex = dx / (settings.width/2); + } + if (transfo.active.type.indexOf("r") != -1) { + settings.scalex = - dx / (settings.width/2); + } + if (settings.scaley < 0.05) settings.scaley = 0.05; + if (settings.scalex < 0.05) settings.scalex = 0.05; + if (event.shiftKey && + (transfo.active.type === "tl" || transfo.active.type === "bl" || + transfo.active.type === "tr" || transfo.active.type === "br")) { + settings.scaley = settings.scalex; + } + } + + _targetCss($this, transfo); + return false; + } + + function _setCss($this, css, settings) { + var transform = ""; + var trans = false; + if (settings.angle !== 0) { + trans = true; + transform += " rotate("+settings.angle+"deg) "; + } + if (settings.translatex) { + trans = true; + transform += " translateX("+settings.translatex+"px) "; + } + if (settings.translatey) { + trans = true; + transform += " translateY("+settings.translatey+"px) "; + } + if (settings.scalex != 1 && settings.scalex > 0) { + trans = true; + transform += " scaleX("+settings.scalex+") "; + } + if (settings.scaley != 1 && settings.scaley > 0){ + trans = true; + transform += " scaleY("+settings.scaley+") "; + } + + if (trans) { + css += ";" + /* Safari */ + css += "-webkit-transform:" + transform + ";" + /* Firefox */ + + "-moz-transform:" + transform + ";" + /* IE */ + + "-ms-transform:" + transform + ";" + /* Opera */ + + "-o-transform:" + transform + ";" + /* Other */ + + "transform:" + transform + ";"; + } + + css = css.replace(/;+/g, ';').replace(/^;+|;+$/g, ''); + + $this.attr("style", css); + } + + function _targetCss ($this, transfo) { + _setCss($this, transfo.settings.style, transfo.settings); + + var pos = $this.position(); + var settings = Object.create(transfo.settings); + var w = parseFloat(transfo.settings.css.width); + var h = parseFloat(transfo.settings.css.height); + var width = settings.scalex * w; + var height = settings.scaley * h; + var top = settings.pos.top + (1-settings.scaley) * h / 2; + var left = settings.pos.left + (1-settings.scalex) * w / 2; + + settings.scalex = settings.scaley = 1; + + _setCss(transfo.$markup, + "position: absolute;" + + "top:" + top + "px;" + + "left:" + left + "px;" + + "width:" + width + "px;" + + "height:" + height + "px;" + + "z-index: 1000;" + + "cursor: move;", + settings); + } + + function _destroy ($this) { + var transfo = $this.data('transfo'); + _setCss($this, transfo.settings.style, transfo.settings); + $this.insertAfter(transfo.$wrap); + transfo.$markup.remove(); + $this.removeData('transfo'); + } + +})(jQuery); \ No newline at end of file diff --git a/addons/website/views/website_templates.xml b/addons/website/views/website_templates.xml index 3df96cb65f2..a55f152a270 100644 --- a/addons/website/views/website_templates.xml +++ b/addons/website/views/website_templates.xml @@ -284,6 +284,8 @@ + + From b39be63a8b8e20ae30ed62ecce4f4f677e7e8e01 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Wed, 26 Mar 2014 13:43:39 +0100 Subject: [PATCH 02/39] [IMP] website: fix and add rotationStep option for jsuery transfo bzr revid: chm@openerp.com-20140326124339-ll12dxd2qyo3gpi3 --- .../website/static/src/js/jQuery.transfo.js | 20 ++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index 84a32b3d046..d8e15ce4010 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -122,13 +122,17 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings.scalex= transform.indexOf('scaleX') != -1 ? parseFloat(transform.match(/scaleX\(([^)]+)\)/)[1]) : 1; transfo.settings.scaley= transform.indexOf('scaleY') != -1 ? parseFloat(transform.match(/scaleY\(([^)]+)\)/)[1]) : 1; - transfo.settings.style = ($this.attr("style")||"").replace(/[^;]+transform[^;]+/g, ''); + transfo.settings.style = ($this.attr("style")||"").replace(/[^;]*transform[^;]+/g, ''); $this.attr("style", transfo.settings.style); transfo.settings.height = $this.innerHeight(); transfo.settings.width = $this.innerWidth(); transfo.settings.css = window.getComputedStyle($this[0], null); transfo.settings.pos = $this.offset(); + + transfo.settings.rotationStep = 5; + + console.log(transfo.settings); } function _bind ($this, transfo) { @@ -190,7 +194,11 @@ OTHER DEALINGS IN THE SOFTWARE. else if (event.pageY >= center.top && event.pageX < center.left) ang += 180; else if (event.pageY < center.top && event.pageX < center.left) ang += 360; - settings.angle = ang; + if (!event.ctrlKey) { + settings.angle = Math.round(ang / transfo.settings.rotationStep) * transfo.settings.rotationStep; + } else { + settings.angle = ang; + } // reset position : don't move center _targetCss($this, transfo); @@ -198,7 +206,7 @@ OTHER DEALINGS IN THE SOFTWARE. var x = center.left - new_center.left; var y = center.top - new_center.top; var angle = ang * rad; - settings.translatex += x*Math.cos(angle) - y*Math.sin(-angle); + settings.translatex += x*Math.cos(angle) - y*Math.sin(-angle); settings.translatey += - x*Math.sin(angle) + y*Math.cos(-angle); } else if (transfo.active.type == "position") { @@ -238,6 +246,12 @@ OTHER DEALINGS IN THE SOFTWARE. } } + settings.angle = Math.round(settings.angle); + settings.translatex = Math.round(settings.translatex); + settings.translatey = Math.round(settings.translatey); + settings.scalex = Math.round(settings.scalex*100)/100; + settings.scaley = Math.round(settings.scaley*100)/100; + _targetCss($this, transfo); return false; } From aa63c564629e6f3ecb72f1d8039e353158a1754d Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Wed, 26 Mar 2014 15:16:29 +0100 Subject: [PATCH 03/39] [IMP] website editor: add style button on image bzr revid: chm@openerp.com-20140326141629-diz4rk0789no7yyl --- addons/website/static/src/css/editor.css | 5 +-- addons/website/static/src/css/editor.sass | 3 +- .../website/static/src/js/jQuery.transfo.js | 16 +++++++-- .../website/static/src/js/website.editor.js | 34 ++++++++++++++++--- .../website/static/src/xml/website.editor.xml | 8 ++--- 5 files changed, 51 insertions(+), 15 deletions(-) diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css index da0fad43caf..8192a6e1111 100644 --- a/addons/website/static/src/css/editor.css +++ b/addons/website/static/src/css/editor.css @@ -296,11 +296,12 @@ ul.oe_menu_editor .disclose { background-color: #ffd9dd !important; } -.hover-edition-button { +.hover-edition { + display: inline-block; position: absolute; top: 0; left: 0; - z-index: 1000; + z-index: 1001; } .cke_editable .fa { diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass index 4571dcd257e..c0f946e0f6f 100644 --- a/addons/website/static/src/css/editor.sass +++ b/addons/website/static/src/css/editor.sass @@ -259,7 +259,8 @@ $attachment-border-color: #848490 outline: 1px solid red !important background-color: #ffd9dd !important -.hover-edition-button +.hover-edition + display: inline-block position: absolute top: 0 left: 0 diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index d8e15ce4010..df30fdccbb9 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -56,7 +56,16 @@ OTHER DEALINGS IN THE SOFTWARE. return $this.data('transfo') && $this.data('transfo').settings; }); } - return $this.data('transfo') && $this.data('transfo').settings; + return this.data('transfo') && $this.data('transfo').settings; + }, + center : function() { + if(this.length > 1) { + this.map(function () { + var $this = $(this); + return $this.data('transfo') && $this.data('transfo').$center.offset(); + }); + } + return this.data('transfo') && this.data('transfo').$center.offset(); } }; @@ -131,8 +140,7 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings.pos = $this.offset(); transfo.settings.rotationStep = 5; - - console.log(transfo.settings); + transfo.settings.callback = function () {}; } function _bind ($this, transfo) { @@ -322,6 +330,8 @@ OTHER DEALINGS IN THE SOFTWARE. "z-index: 1000;" + "cursor: move;", settings); + + transfo.settings.callback.call($this[0], $this); } function _destroy ($this) { diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index ae126ad16ab..96cc53546b0 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -636,15 +636,26 @@ * @param {String} [classes] additional classes to set on the button * @returns {jQuery} */ - make_hover_button: function (label, editfn, classes) { - return $(openerp.qweb.render('website.editor.hoverbutton', { + make_hover_button: function (label, editfn, classes, styleButton) { + var $div = $(openerp.qweb.render('website.editor.hoverbutton', { label: label, classes: classes, - })).hide().appendTo(document.body).click(function (e) { + styleButton: styleButton + })).hide().appendTo(document.body); + + $div.find("button.hover-edition-button").click(function (e) { e.preventDefault(); e.stopPropagation(); editfn.call(this, e); }); + if (styleButton) { + $div.find("button.hover-style-button").click(function (e) { + e.preventDefault(); + e.stopPropagation(); + styleButton.call(this, e); + }); + } + return $div; }, /** * For UI clarity, during RTE edition when the user hovers links and @@ -665,11 +676,23 @@ $link_button.hide(); previous = null; }, 'btn-xs'); + var $image_button = this.make_hover_button(_t("Change"), function () { image_dialog(editor, new CKEDITOR.dom.element(previous)); $image_button.hide(); previous = null; - }, 'btn-sm'); + }, 'btn-sm', function () { + var prev = previous; + var sel = new CKEDITOR.dom.element(prev); + var $sel = $(sel.$); + if ($sel.data('transfo')) { + $sel.transfo("destroy"); + $(this).addClass("btn-primary").removeClass("btn-default"); + } else { + $sel.transfo(); + $(this).removeClass("btn-primary").addClass("btn-default"); + } + }); function is_icons_widget(element) { var w = editor.widgets.getByElement(element); @@ -724,7 +747,8 @@ } }).on('mouseleave', 'a, img, .fa', function (e) { var current = document.elementFromPoint(e.clientX, e.clientY); - if (current === $link_button[0] || current === $image_button[0]) { + if (current === $link_button[0] || $(current).parent()[0] === $link_button[0] || + current === $image_button[0] || $(current).parent()[0] === $image_button[0]) { return; } $image_button.add($link_button).hide(); diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 6edf553b7cb..617a2cf59df 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -218,10 +218,10 @@ - +
+ + +
From 368bf4dff634fb1097d264f9d5c877ba7958f732 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Wed, 26 Mar 2014 15:36:55 +0100 Subject: [PATCH 04/39] [FIX] website editor: color of style button bzr revid: chm@openerp.com-20140326143655-33sm4i67zjn03o2c --- addons/website/static/src/js/website.editor.js | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 96cc53546b0..57d18cac873 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -685,12 +685,20 @@ var prev = previous; var sel = new CKEDITOR.dom.element(prev); var $sel = $(sel.$); + var $button = $(this); + if ($sel.data('transfo')) { $sel.transfo("destroy"); - $(this).addClass("btn-primary").removeClass("btn-default"); + $button.addClass("btn-primary").removeClass("btn-default"); } else { $sel.transfo(); - $(this).removeClass("btn-primary").addClass("btn-default"); + $sel.data('transfo').$markup + .on("mouseover", function () { + $sel.trigger("mouseover"); + $button.removeClass("btn-primary").addClass("btn-default"); + $image_button.show(); + }); + $sel.data('transfo').$markup.mouseover(); } }); @@ -745,6 +753,8 @@ - $link_button.outerWidth() / 2 }) } + + $image_button.find("button.hover-style-button").addClass("btn-primary").removeClass("btn-default"); }).on('mouseleave', 'a, img, .fa', function (e) { var current = document.elementFromPoint(e.clientX, e.clientY); if (current === $link_button[0] || $(current).parent()[0] === $link_button[0] || From a7dc05bf6e14fdaf2657e4c3e8c0600e663cc62f Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Wed, 26 Mar 2014 16:58:22 +0100 Subject: [PATCH 05/39] [WIP] website: add media editor template bzr revid: chm@openerp.com-20140326155822-f4wascgyrm7ffeg8 --- .../website/static/src/js/website.editor.js | 46 ++++- .../website/static/src/xml/website.editor.xml | 175 +++++++++++------- 2 files changed, 141 insertions(+), 80 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 57d18cac873..e7e7a44e31e 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -64,7 +64,7 @@ return new website.editor.RTELinkDialog(editor).appendTo(document.body); } function image_dialog(editor, image) { - return new website.editor.RTEImageDialog(editor, image).appendTo(document.body); + return new website.editor.MediaDialog(editor, image).appendTo(document.body); } // only enable editors manually @@ -80,7 +80,7 @@ website.init_editor = function () { CKEDITOR.plugins.add('customdialogs', { -// requires: 'link,image', + // requires: 'link,image', init: function (editor) { editor.on('doubleclick', function (evt) { var element = evt.data.element; @@ -754,7 +754,11 @@ }) } - $image_button.find("button.hover-style-button").addClass("btn-primary").removeClass("btn-default"); + if ($selected.parents('[data-oe-field="image"]').length) { + $image_button.find("button.hover-style-button").hide(); + } else { + $image_button.find("button.hover-style-button").show().addClass("btn-primary").removeClass("btn-default"); + } }).on('mouseleave', 'a, img, .fa', function (e) { var current = document.elementFromPoint(e.clientX, e.clientY); if (current === $link_button[0] || $(current).parent()[0] === $link_button[0] || @@ -1324,6 +1328,31 @@ }, }); + website.editor.Media = openerp.Widget.extend({ + init: function (editor) { + this._super(); + this.editor = editor; + }, + }); + website.editor.MediaDialog = website.editor.Dialog.extend({ + template: 'website.editor.dialog.media', + init: function (editor, media) { + this.media = media; + this.editor = editor; + this._super(editor); + }, + start: function (editor, media) { + this.imageDialog = new website.editor.RTEImageDialog(this.editor, this.media); + this.imageDialog.appendTo(this.$("#editor-media-image")); + console.log(this.imageDialog.$el[0]); + this.iconDialog = new website.editor.FontIconsDialog(this.editor, this.media); + this.iconDialog.appendTo(this.$("#editor-media-icon")); + this.videoDialog = null; + //this.videoDialog.appendTo(this.$("#editor-media-video")); + return this._super(); + } + }); + /** * ImageDialog widget. Lets users change an image, including uploading a * new image in OpenERP or selecting the image style (if supported by @@ -1341,7 +1370,7 @@ * selected by the users (or possibly the ones * originally passed in) */ - website.editor.ImageDialog = website.editor.Dialog.extend({ + website.editor.ImageDialog = website.editor.Media.extend({ template: 'website.editor.dialog.image', events: _.extend({}, website.editor.Dialog.prototype.events, { 'change .url-source': function (e) { this.changed($(e.target)); }, @@ -1447,6 +1476,7 @@ new website.editor.ExistingImageDialog(this).appendTo(document.body); }, }); + website.editor.RTEImageDialog = website.editor.ImageDialog.extend({ init: function (editor, image) { this._super(editor); @@ -1614,7 +1644,7 @@ range.shrink(CKEDITOR.SHRINK_TEXT); var commonAncestor = range.getCommonAncestor(); var viewRoot = editor.elementPath(commonAncestor).contains(function (element) { - return element.data('oe-model') === 'ir.ui.view' + return element.data('oe-model') === 'ir.ui.view'; }); if (!viewRoot) { return null; } // if viewRoot is the first link, don't edit it. @@ -1622,7 +1652,7 @@ .contains('a', true); } - website.editor.FontIconsDialog = website.editor.Dialog.extend({ + website.editor.FontIconsDialog = website.editor.Media.extend({ template: 'website.editor.dialog.font-icons', events : _.extend({}, website.editor.Dialog.prototype.events, { change: 'update_preview', @@ -1679,7 +1709,7 @@ * all the new ones if necessary. */ save: function () { - var classes = this.element.className.split(/\s+/); + var classes = (this.element.className||"").split(/\s+/); var non_fa_classes = _.reject(classes, function (cls) { return cls === 'fa' || /^fa-/.test(cls); }); @@ -1695,7 +1725,7 @@ * which may not match the visual look of the element. */ load_data: function () { - var classes = this.element.className.split(/\s+/); + var classes = (this.element.className||"").split(/\s+/); for (var i = 0; i < classes.length; i++) { var cls = classes[i]; switch(cls) { diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 617a2cf59df..343e7070014 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -88,49 +88,83 @@ - - - Image: -
-
-
- - - + +
-
- Browse existing images -

Image URL

- +
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
- -
- -
- - -
- '+ + '
'); + this._super(); + }, + }); + website.Observer = window.MutationObserver || window.WebkitMutationObserver || window.JsMutationObserver; var OBSERVER_CONFIG = { childList: true, diff --git a/addons/website/static/src/js/website.snippets.animation.js b/addons/website/static/src/js/website.snippets.animation.js index 56ad596d71a..e300d4d5338 100644 --- a/addons/website/static/src/js/website.snippets.animation.js +++ b/addons/website/static/src/js/website.snippets.animation.js @@ -148,4 +148,11 @@ }); }, }); + + website.snippet.animationRegistry.media_video = website.snippet.Animation.extend({ + selector: ".media_iframe_video", + start: function () { + this.$target.html(''); + }, + }); })(); diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 607e603e724..b703ab633ee 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -101,13 +101,13 @@
  • Image
  • Pictogram
  • Video
    • -
  • +
    • -
  • +
  • @@ -274,9 +274,9 @@ - - - + + +
    @@ -295,4 +295,42 @@ + + +
    +
    + + + + Youtube, Vimeo, Dailymotion + +
    +
    + +
    +
    + +
    +
    + + + + +
    +
    + +
    +
    + +     + From 31269ba52fafb2238b027b3c42e81acbaacfd9d4 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Fri, 28 Mar 2014 15:16:19 +0100 Subject: [PATCH 11/39] [IMP] website: media editor doubleclick for video and begin to use snippet builder bzr revid: chm@openerp.com-20140328141619-x9okgixai2v5dekr --- addons/website/static/src/css/editor.css | 4 + addons/website/static/src/css/editor.sass | 3 + addons/website/static/src/css/website.css | 6 ++ addons/website/static/src/css/website.sass | 7 +- .../website/static/src/js/website.editor.js | 91 ++++++------------- .../src/js/website.snippets.animation.js | 2 +- .../static/src/js/website.snippets.editor.js | 64 ++++++++++++- .../website/static/src/xml/website.editor.xml | 2 +- addons/website/views/snippets.xml | 16 ++++ 9 files changed, 126 insertions(+), 69 deletions(-) diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css index 208cde08b45..36de51db096 100644 --- a/addons/website/static/src/css/editor.css +++ b/addons/website/static/src/css/editor.css @@ -94,6 +94,10 @@ display: none; } +.cke_editable .css_editable_mode_display { + display: block !important; +} + .oe_structure.oe_empty:empty, [data-oe-type=html]:empty, .oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child { background-image: url("/website/static/src/img/edit_here.png") !important; } diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass index f3aeb492883..7a9c59d8167 100644 --- a/addons/website/static/src/css/editor.sass +++ b/addons/website/static/src/css/editor.sass @@ -77,6 +77,9 @@ .cke_editable .css_editable_mode_hidden display: none +.cke_editable .css_editable_mode_display + display: block !important + .oe_structure.oe_empty:empty, [data-oe-type=html]:empty, .oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child background-image: url('/website/static/src/img/edit_here.png') !important diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css index 29d4e06eaff..90dddb9caf3 100644 --- a/addons/website/static/src/css/website.css +++ b/addons/website/static/src/css/website.css @@ -544,3 +544,9 @@ div.media_iframe_video iframe { width: 100%; height: 100%; } +div.media_iframe_video div { + position: absolute; + width: 100%; + height: 100%; + display: none; +} diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass index 0d545e4362d..5923f619d86 100644 --- a/addons/website/static/src/css/website.sass +++ b/addons/website/static/src/css/website.sass @@ -444,4 +444,9 @@ div.media_iframe_video padding-bottom: 66.5% iframe width: 100% - height: 100% \ No newline at end of file + height: 100% + div + position: absolute + width: 100% + height: 100% + display: none \ No newline at end of file diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 9ced9905bd8..3e49c1286a9 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -84,10 +84,15 @@ init: function (editor) { editor.on('doubleclick', function (evt) { var element = evt.data.element; - if (element.is('img') && is_editable_node(element)) { + if ((element.is('img') || element.$.className.indexOf(' fa-') != -1) && is_editable_node(element)) { image_dialog(editor, element); return; } + var parent = new CKEDITOR.dom.element(element.$.parentNode); + if (parent.$.className.indexOf('media_iframe_video') != -1 && is_editable_node(parent)) { + image_dialog(editor, parent); + return; + } element = get_selected_link(editor) || evt.data.element; if (!(element.is('a') && is_editable_node(element))) { @@ -692,31 +697,6 @@ previous = null; }); - var $image_button = this.make_hover_button_image(function () { - image_dialog(editor, new CKEDITOR.dom.element(previous)); - $image_button.hide(); - previous = null; - }, function () { - var prev = previous; - var sel = new CKEDITOR.dom.element(prev); - var $sel = $(sel.$); - var $button = $(this); - - if ($sel.data('transfo')) { - $sel.transfo("destroy"); - $button.addClass("btn-primary").removeClass("btn-default"); - } else { - $sel.transfo(); - $sel.data('transfo').$markup - .on("mouseover", function () { - $sel.trigger("mouseover"); - $button.removeClass("btn-primary").addClass("btn-default"); - $image_button.show(); - }); - $sel.data('transfo').$markup.mouseover(); - } - }); - function is_icons_widget(element) { var w = editor.widgets.getByElement(element); return w && w.name === 'icons'; @@ -727,7 +707,7 @@ // -ish, because when moving to the button itself ``previous`` is // still set to the element having triggered showing the button. var previous; - $(editor.element.$).on('mouseover', 'a, img, .fa, .media_iframe_video', function () { + $(editor.element.$).on('mouseover', 'a', function () { // Back from edit button -> ignore if (previous && previous === this) { return; } @@ -746,41 +726,18 @@ previous = this; var $selected = $(this); var position = $selected.offset(); - if ($selected.is('img') || $selected.is('.fa') || $selected.is('.media_iframe_video')) { - $link_button.hide(); - // center button on image - $image_button.show().offset({ - top: $selected.outerHeight() / 2 - + position.top - - $image_button.outerHeight() / 2, - left: $selected.outerWidth() / 2 - + position.left - - $image_button.outerWidth() / 2, - }); - } else { - $image_button.hide(); - // put button below link, horizontally centered - $link_button.show().offset({ - top: $selected.outerHeight() - + position.top, - left: $selected.outerWidth() / 2 - + position.left - - $link_button.outerWidth() / 2 - }) - } - - if ($selected.parents('[data-oe-field="image"]').length) { - $image_button.find("button.hover-style-button").hide(); - } else { - $image_button.find("button.hover-style-button").show().addClass("btn-primary").removeClass("btn-default"); - } + $link_button.show().offset({ + top: $selected.outerHeight() + + position.top, + left: $selected.outerWidth() / 2 + + position.left + - $link_button.outerWidth() / 2 + }) }).on('mouseleave', 'a, img, .fa', function (e) { var current = document.elementFromPoint(e.clientX, e.clientY); - if (current === $link_button[0] || $(current).parent()[0] === $link_button[0] || - current === $image_button[0] || $(current).parent()[0] === $image_button[0]) { + if (current === $link_button[0] || $(current).parent()[0] === $link_button[0]) { return; } - $image_button.add($link_button).hide(); previous = null; }); } @@ -1412,11 +1369,11 @@ save: function () { this.active.save(); if (this.active === this.imageDialog) { - this.media.$.className = this.media.$.className.replace(/(^|\s)fa[^\s]+/g, ''); + this.media.$.className = this.media.$.className.replace(/(^|\s)(fa|media_iframe_video)[^\s]+/g, ''); $(this.media.$).addClass("img img-responsive"); } if (this.active === this.iconDialog) { - this.media.$.className = this.media.$.className.replace(/(^|\s)img[^\s]+/g, ''); + this.media.$.className = this.media.$.className.replace(/(^|\s)(img|media_iframe_video)[^\s]+/g, ''); } if (this.active === this.videoDialog) { this.media.$.className = this.media.$.className.replace(/(^|\s)(img|fa)[^\s]+/g, ''); @@ -1828,7 +1785,7 @@ website.editor.VideoDialog = website.editor.Media.extend({ template: 'website.editor.dialog.video', events : _.extend({}, website.editor.Dialog.prototype.events, { - 'input input#urlvideo': 'get_video', + 'blur input#urlvideo': 'get_video', }), start: function () { this.$iframe = this.$("iframe"); @@ -1866,7 +1823,8 @@ video_id = needle.match(/youtube\.[a-z]+\/([^\/?&]+)/i)[1]; } else if (needle.indexOf("player.vimeo.") != -1 || needle.indexOf("//vimeo.") != -1) { video_type = "vimeo"; - video_id = needle.match(/vimeo\.[a-z]+\/([^\/?&]+)/i)[1]; + video_id = needle.match(/vimeo\.[a-z]+\/(video\/)?([^?&]+)/i)[2]; + console.log(video_id); } else if (needle.indexOf(".dailymotion.") != -1) { video_type = "dailymotion"; video_id = needle.match(/dailymotion\.[a-z]+\/(embed\/)?(video\/)?([^\/?&]+)/i)[3]; @@ -1878,10 +1836,15 @@ this.$iframe.attr("src", this.get_url()); }, save: function () { - $(this.media.$).replaceWith( - '
    '+ + var video_id = this.$("#video_id").val(); + var video_type = this.$("#video_type").val(); + var $iframe = $( + '
    '+ + '
     
    '+ ''+ '
    '); + $iframe.attr("style", this.$(this.media.$).attr("style")); + $(this.media.$).replaceWith($iframe); this._super(); }, }); diff --git a/addons/website/static/src/js/website.snippets.animation.js b/addons/website/static/src/js/website.snippets.animation.js index e300d4d5338..1b8dfc0b320 100644 --- a/addons/website/static/src/js/website.snippets.animation.js +++ b/addons/website/static/src/js/website.snippets.animation.js @@ -152,7 +152,7 @@ website.snippet.animationRegistry.media_video = website.snippet.Animation.extend({ selector: ".media_iframe_video", start: function () { - this.$target.html(''); + this.$target.html('
     
    '); }, }); })(); diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 52deeabf5e6..2b7c001b7b6 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -154,6 +154,7 @@ this.on('rte:ready', this, function () { self.snippets.$button.removeClass("hidden"); website.snippet.stop_animation(); + website.snippet.start_animation(true, $(".media_iframe_video")); }); return this._super.apply(this, arguments); @@ -265,7 +266,8 @@ '$el': $style, 'selector-siblings': $style.data('selector-siblings'), 'selector-children': $style.data('selector-children'), - 'selector-vertical-children': $style.data('selector-vertical-children') + 'selector-vertical-children': $style.data('selector-vertical-children'), + 'data': $style.data() }; selector.push($style.data('selector')); }); @@ -332,6 +334,7 @@ if (!$target.is(website.snippet.globalSelector)) { $target = $target.parents(website.snippet.globalSelector).first(); } + if (!self.dom_filter($target).length) { $target = false; } @@ -732,7 +735,9 @@ this.$target.data("snippet-option-ids", styles); this.$overlay = this.$target.data('overlay'); this['snippet-option-id'] = snippet_id; - this.$el = website.snippet.templateOptions[snippet_id].$el.find(">li").clone(); + var $option = website.snippet.templateOptions[snippet_id].$el; + this.$el = $option.find(">li").clone(); + this.data = $option.data(); this.required = this.$el.data("required"); @@ -1425,6 +1430,43 @@ } }); + website.snippet.options.media = website.snippet.Option.extend({ + start: function () { + var self = this; + this._super(); + website.snippet.start_animation(true, this.$target); + + this.$el.find('[data-toggle="dropdown"]').dropdown(); + this.$el.find(".hover-edition-button").click(function (event) { + event.preventDefault(); + event.stopPropagation(); + self.element = new CKEDITOR.dom.element(self.$target[0]); + new website.editor.MediaDialog(self, self.element).appendTo(document.body); + }); + this.$el.find(".hover-style-button").click(function (event) { + self.transfo(event); + }); + }, + transfo: function (event) { + var self = this; + var sel = new CKEDITOR.dom.element(this.$target[0]); + var $button = $(event.target); + event.preventDefault(); + event.stopPropagation(); + + if (this.$target.data('transfo')) { + this.$target.transfo("destroy"); + $button.addClass("btn-primary").removeClass("btn-default"); + } else { + this.$target.transfo(); + this.$target.data('transfo').$markup + .on("mouseover", function () { self.$target.trigger("mouseover"); }) + .mouseover() + .click(function () { self.$target.transfo("destroy"); }); + } + } + }); + website.snippet.Editor = openerp.Class.extend({ init: function (BuildingBlock, dom) { @@ -1434,6 +1476,7 @@ this.snippet_id = this.$target.data("snippet-id"); this._readXMLData(); this.load_style_options(); + this.get_phantom(); this.get_parent_block(); this.start(); }, @@ -1571,6 +1614,23 @@ this.$overlay.find('[data-toggle="dropdown"]').dropdown(); }, + get_phantom: function () { + var self = this; + var phantom = false; + for (var i in this.styles){ + if (this.styles[i].data.phantom) { + phantom = true; + break; + } + } + if (false && phantom) { + var $parent = this.$target.parents(website.snippet.globalSelector).first(); + setTimeout(function () { + self.BuildingBlock.make_active($parent); + }, 0); + } + }, + get_parent_block: function () { var self = this; var $button = this.$overlay.find('.oe_snippet_parent'); diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index b703ab633ee..89b184a2c4e 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -299,7 +299,7 @@
    - +
    + + From 1a33fb64d50c6dbf6e43c873666b3f383e684f9b Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Fri, 28 Mar 2014 16:47:15 +0100 Subject: [PATCH 12/39] [WIP] website: media editor bzr revid: chm@openerp.com-20140328154715-alyj4kh33w6v8pgm --- .../website/static/src/js/website.editor.js | 37 +++++++++++++------ .../static/src/js/website.snippets.editor.js | 30 +++++++++------ addons/website/views/snippets.xml | 8 ++-- 3 files changed, 49 insertions(+), 26 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 3e49c1286a9..fb8b5366a54 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1315,6 +1315,8 @@ }, save: function () { }, + clear: function () { + }, cancel: function () { }, close: function () { @@ -1367,17 +1369,20 @@ return this._super(); }, save: function () { + this.media.$.innerHTML = ""; + if (this.active !== this.imageDialog) { + this.imageDialog.clear(); + } + if (this.active !== this.iconDialog) { + this.iconDialog.clear(); + } + if (this.active !== this.videoDialog) { + this.videoDialog.clear(); + } this.active.save(); - if (this.active === this.imageDialog) { - this.media.$.className = this.media.$.className.replace(/(^|\s)(fa|media_iframe_video)[^\s]+/g, ''); - $(this.media.$).addClass("img img-responsive"); - } - if (this.active === this.iconDialog) { - this.media.$.className = this.media.$.className.replace(/(^|\s)(img|media_iframe_video)[^\s]+/g, ''); - } - if (this.active === this.videoDialog) { - this.media.$.className = this.media.$.className.replace(/(^|\s)(img|fa)[^\s]+/g, ''); - } + + this.media.$.className = this.media.$.className.replace(/\s+/g, ' '); + return this._super(); }, search: function () { @@ -1458,6 +1463,9 @@ this.media.$.attributes.src = this.$('input.url').val(); return this._super(); }, + clear: function () { + this.media.$.className = this.media.$.className.replace(/(^|\s)(img(\s|$)|img-[^\s]*)/g, ' '); + }, cancel: function () { this.trigger('cancel'); }, @@ -1779,7 +1787,10 @@ } $preview.prepend($p); } - } + }, + clear: function () { + this.media.$.className = this.media.$.className.replace(/(^|\s)(fa(\s|$)|fa-[^\s]*)/g, ' '); + }, }); website.editor.VideoDialog = website.editor.Media.extend({ @@ -1847,6 +1858,10 @@ $(this.media.$).replaceWith($iframe); this._super(); }, + clear: function () { + delete this.media.$.dataset.src; + this.media.$.className = this.media.$.className.replace(/(^|\s)media_iframe_video(\s|$)/g, ' '); + }, }); website.Observer = window.MutationObserver || window.WebkitMutationObserver || window.JsMutationObserver; diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 2b7c001b7b6..cd52ff33684 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -742,7 +742,7 @@ this.required = this.$el.data("required"); this.set_active(); - this.$el.find('li[data-value] a').on('mouseover mouseout click', _.bind(this._mouse, this)); + this.$el.find('li[data-value] a').on('mouseenter mouseleave click', _.bind(this._mouse, this)); this.$target.on('snippet-style-reset', _.bind(this.set_active, this)); this.start(); @@ -750,7 +750,7 @@ _mouse: function (event) { var self = this; - if (event.type === 'mouseout') { + if (event.type === 'mouseleave') { if (!this.over) return; this.over = false; } else if (event.type === 'click') { @@ -760,7 +760,7 @@ } var $prev, $next; - if (event.type === 'mouseout') { + if (event.type === 'mouseleave') { $prev = $(event.currentTarget).parent(); $next = this.$el.find("li[data-value].active"); } else { @@ -842,7 +842,7 @@ var self = this; // add or remove html class - if (np.$prev && this.required) { + if (np.$prev) { this.$target.removeClass(np.$prev.data('value') || ""); } if (np.$next) { @@ -1437,15 +1437,18 @@ website.snippet.start_animation(true, this.$target); this.$el.find('[data-toggle="dropdown"]').dropdown(); - this.$el.find(".hover-edition-button").click(function (event) { + this.$el.find(".edition").click(function (event) { event.preventDefault(); event.stopPropagation(); self.element = new CKEDITOR.dom.element(self.$target[0]); new website.editor.MediaDialog(self, self.element).appendTo(document.body); }); - this.$el.find(".hover-style-button").click(function (event) { + this.$el.find(".style").click(function (event) { self.transfo(event); }); + this.$el.find(".clear-style").click(function (event) { + self.$target.removeClass("fa-spin").attr("style", null); + }); }, transfo: function (event) { var self = this; @@ -1607,6 +1610,10 @@ if (this.selector_vertical_children === "") this.selector_vertical_children = false; + if (!this.selector_siblings && !this.selector_children && !this.selector_vertical_children) { + this.$overlay.find(".oe_snippet_move").addClass('hidden'); + } + if ($ul.find("li").length) { $styles.removeClass("hidden"); @@ -1623,11 +1630,12 @@ break; } } - if (false && phantom) { - var $parent = this.$target.parents(website.snippet.globalSelector).first(); - setTimeout(function () { - self.BuildingBlock.make_active($parent); - }, 0); + if (phantom) { + // var $parent = this.$target.parents(website.snippet.globalSelector).first(); + // setTimeout(function () { + // self.BuildingBlock.make_active($parent); + // }, 0); + this.$overlay.find('.oe_snippet_clone, .oe_snippet_remove, .oe_handles').addClass('hidden'); } }, diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index 4cbe5bd58f3..163a61f6876 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -983,17 +983,17 @@ From e94c9eea4e61f3cfdfde0197eea7835cf64db347 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 10:10:27 +0200 Subject: [PATCH 13/39] [WIP] website: media editor bzr revid: chm@openerp.com-20140331081027-v1eikz3ei78xjjqz --- addons/website/static/src/css/snippets.css | 1 + addons/website/static/src/css/snippets.sass | 1 + .../website/static/src/js/jQuery.transfo.js | 27 +++++--- .../static/src/js/website.snippets.editor.js | 62 ++++++++++++------- addons/website/views/snippets.xml | 4 +- 5 files changed, 61 insertions(+), 34 deletions(-) diff --git a/addons/website/static/src/css/snippets.css b/addons/website/static/src/css/snippets.css index 726855f311b..f5217660e29 100644 --- a/addons/website/static/src/css/snippets.css +++ b/addons/website/static/src/css/snippets.css @@ -201,6 +201,7 @@ height: 0; position: absolute; background: transparent; + z-index: 1001; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; diff --git a/addons/website/static/src/css/snippets.sass b/addons/website/static/src/css/snippets.sass index 9b12e9df246..69afbb14f2d 100644 --- a/addons/website/static/src/css/snippets.sass +++ b/addons/website/static/src/css/snippets.sass @@ -151,6 +151,7 @@ height: 0 position: absolute background: transparent + z-index: 1001 //@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) diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index df30fdccbb9..19fb85d0b1b 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -36,6 +36,7 @@ OTHER DEALINGS IN THE SOFTWARE. _init($this, settings); } else { _overwriteOptions($this, transfo, settings); + _targetCss($this, transfo); } }); }, @@ -106,12 +107,14 @@ OTHER DEALINGS IN THE SOFTWARE. _setOptions($this, transfo); _overwriteOptions ($this, transfo, settings); - // set transfo container and markup - _targetCss($this, transfo); - // append controls to container $("body").append(transfo.$markup); + // set transfo container and markup + setTimeout(function () { + _targetCss($this, transfo); + },0); + _bind($this, transfo); } @@ -120,8 +123,8 @@ OTHER DEALINGS IN THE SOFTWARE. } function _setOptions ($this, transfo) { - var style = $this.attr("style"); - var transform = (style||"").match(/transform\s*:([^;]+)/) ? style.match(/transform\s*:([^;]+)/)[1] : ""; + var style = $this.attr("style") || ""; + var transform = style.match(/transform\s*:([^;]+)/) ? style.match(/transform\s*:([^;]+)/)[1] : ""; transfo.settings = {}; @@ -131,7 +134,7 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings.scalex= transform.indexOf('scaleX') != -1 ? parseFloat(transform.match(/scaleX\(([^)]+)\)/)[1]) : 1; transfo.settings.scaley= transform.indexOf('scaleY') != -1 ? parseFloat(transform.match(/scaleY\(([^)]+)\)/)[1]) : 1; - transfo.settings.style = ($this.attr("style")||"").replace(/[^;]*transform[^;]+/g, ''); + transfo.settings.style = style.replace(/[^;]*transform[^;]+/g, '').replace(/;+/g, ';'); $this.attr("style", transfo.settings.style); transfo.settings.height = $this.innerHeight(); @@ -140,6 +143,7 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings.pos = $this.offset(); transfo.settings.rotationStep = 5; + transfo.settings.hide = false; transfo.settings.callback = function () {}; } @@ -327,10 +331,17 @@ OTHER DEALINGS IN THE SOFTWARE. "left:" + left + "px;" + "width:" + width + "px;" + "height:" + height + "px;" + - "z-index: 1000;" + + "z-index:" + (transfo.settings.hide ? "-1" : "1000") + ";" + "cursor: move;", settings); + if (transfo.settings.hide) { + transfo.$markup.find(">").hide(); + transfo.$markup.find(".transfo-scaler-mc").show(); + } else { + transfo.$markup.find(">").show(); + } + transfo.settings.callback.call($this[0], $this); } @@ -342,4 +353,4 @@ OTHER DEALINGS IN THE SOFTWARE. $this.removeData('transfo'); } -})(jQuery); \ No newline at end of file +})(jQuery); diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index cd52ff33684..dc66e04bd0b 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1443,31 +1443,45 @@ self.element = new CKEDITOR.dom.element(self.$target[0]); new website.editor.MediaDialog(self, self.element).appendTo(document.body); }); - this.$el.find(".style").click(function (event) { - self.transfo(event); - }); this.$el.find(".clear-style").click(function (event) { self.$target.removeClass("fa-spin").attr("style", null); }); - }, - transfo: function (event) { - var self = this; - var sel = new CKEDITOR.dom.element(this.$target[0]); - var $button = $(event.target); - event.preventDefault(); - event.stopPropagation(); - if (this.$target.data('transfo')) { - this.$target.transfo("destroy"); - $button.addClass("btn-primary").removeClass("btn-default"); - } else { - this.$target.transfo(); - this.$target.data('transfo').$markup - .on("mouseover", function () { self.$target.trigger("mouseover"); }) - .mouseover() - .click(function () { self.$target.transfo("destroy"); }); - } - } + this.$target.transfo({ + hide: true, + callback: function () { + var pos = $(this).data("transfo").$center.offset(); + self.$overlay.css({ + 'top': pos.top, + 'left': pos.left, + 'position': 'absolute', + 'height': '20px', + 'width': '160px' + }); + self.$overlay.find('.oe_overlay_options').css({ + 'position': 'static' + }); + }}); + this.$target.data('transfo').$markup + .on("mouseover", function () { + self.$target.trigger("mouseover"); + }) + .mouseover() + .click(function () { + self.$target.transfo({ hide: false }); + }); + + this.$el.find(".style").click(function (event) { + var settings = self.$target.data("transfo").settings; + self.$target.transfo({ hide: (settings.hide = !settings.hide) }); + }); + }, + onFocus : function () { + this.$target.transfo({ hide: true }); + }, + onBlur : function () { + this.$target.transfo({ hide: true }); + }, }); @@ -1479,7 +1493,7 @@ this.snippet_id = this.$target.data("snippet-id"); this._readXMLData(); this.load_style_options(); - this.get_phantom(); + this.get_transform(); this.get_parent_block(); this.start(); }, @@ -1621,7 +1635,7 @@ this.$overlay.find('[data-toggle="dropdown"]').dropdown(); }, - get_phantom: function () { + get_transform: function () { var self = this; var phantom = false; for (var i in this.styles){ @@ -1635,7 +1649,7 @@ // setTimeout(function () { // self.BuildingBlock.make_active($parent); // }, 0); - this.$overlay.find('.oe_snippet_clone, .oe_snippet_remove, .oe_handles').addClass('hidden'); + this.$overlay.find('.oe_snippet_clone, .oe_handles').addClass('hidden'); } }, diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index 163a61f6876..387e87b8e0f 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -981,10 +981,10 @@
  • Change Media
    • -
  • Style
    • +
  • Transform
  • Rotation
      From f97a237b4becb4302ffa04d7a79e0ad53aa2bc05 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 11:52:53 +0200 Subject: [PATCH 14/39] [WIP] website: media editor bzr revid: chm@openerp.com-20140331095253-zftyl4uvd56mpovj --- .../website/static/src/js/jQuery.transfo.js | 52 +++++++++++-------- .../static/src/js/website.snippets.editor.js | 44 ++++------------ addons/website/views/snippets.xml | 5 +- 3 files changed, 45 insertions(+), 56 deletions(-) diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index 19fb85d0b1b..5d0c8dc32b7 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -85,21 +85,25 @@ OTHER DEALINGS IN THE SOFTWARE. var transfo = {}; $this.data('transfo', transfo); - // generate all the controls markup var css = "box-sizing: border-box; position: absolute; background-color: #fff; border: 1px solid #ccc; width: 8px; height: 8px; margin-left: -4px; margin-top: -4px;"; transfo.$markup = $('' + '
      ' - + '
      ' - + '
      ' - + '
      ' - + '
      ' - + '
      ' - + '
      ' - + '
      ' - + '
      ' - + '
      ' - + '
      ' + + '
      ' + + '' + + '' + + '' + + '' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + '
      '); transfo.$center = transfo.$markup.find(".transfo-scaler-mc"); @@ -149,27 +153,28 @@ OTHER DEALINGS IN THE SOFTWARE. function _bind ($this, transfo) { function mousedown (event) { - _mouseDown($this, transfo, event); + _mouseDown($this, this, transfo, event); $(document).on("mousemove", mousemove).on("mouseup", mouseup); } function mousemove (event) { - _mouseMove($this, transfo, event); + _mouseMove($this, this, transfo, event); } function mouseup (event) { - _mouseUp($this, transfo, event); + _mouseUp($this, this, transfo, event); $(document).off("mousemove", mousemove).off("mouseup", mouseup); } transfo.$markup.off().on("mousedown", mousedown); - transfo.$markup.find(".transfo-rotator, .transfo-scaler").off().on("mousedown", mousedown); + transfo.$markup.find(">:not(.transfo-scaler-mc)").off().on("mousedown", mousedown); } - function _mouseDown($this, transfo, event) { + function _mouseDown($this, div, transfo, event) { event.preventDefault(); if (transfo.active || event.which !== 1) return; - var type = "position", - $e = $(event.srcElement); + console.log(div); + + var type = "position", $e = $(div); if ($e.hasClass("transfo-rotator")) type = "rotator"; else if ($e.hasClass("transfo-scaler-tl")) type = "tl"; else if ($e.hasClass("transfo-scaler-tr")) type = "tr"; @@ -186,11 +191,11 @@ OTHER DEALINGS IN THE SOFTWARE. "pageY": event.pageY, }; } - function _mouseUp($this, transfo, event) { + function _mouseUp($this, div, transfo, event) { transfo.active = null; } - function _mouseMove($this, transfo, event) { + function _mouseMove($this, div, transfo, event) { event.preventDefault(); if (!transfo.active) return; var settings = transfo.settings; @@ -199,12 +204,15 @@ OTHER DEALINGS IN THE SOFTWARE. var cdy = center.top - event.pageY; if (transfo.active.type == "rotator") { - var ang; - if (center.top != event.pageY) ang = Math.atan(- cdx / cdy) / rad; + var ang, dang = Math.atan((settings.width * settings.scalex) / (settings.height * settings.scaley)) / rad; + + if (cdy) ang = Math.atan(- cdx / cdy) / rad; else ang = 0; if (event.pageY >= center.top && event.pageX >= center.left) ang += 180; else if (event.pageY >= center.top && event.pageX < center.left) ang += 180; else if (event.pageY < center.top && event.pageX < center.left) ang += 360; + + ang -= dang; if (!event.ctrlKey) { settings.angle = Math.round(ang / transfo.settings.rotationStep) * transfo.settings.rotationStep; diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index dc66e04bd0b..0e0290b825c 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1430,13 +1430,12 @@ } }); - website.snippet.options.media = website.snippet.Option.extend({ + website.snippet.options.transform = website.snippet.Option.extend({ start: function () { var self = this; this._super(); website.snippet.start_animation(true, this.$target); - this.$el.find('[data-toggle="dropdown"]').dropdown(); this.$el.find(".edition").click(function (event) { event.preventDefault(); event.stopPropagation(); @@ -1455,29 +1454,27 @@ 'top': pos.top, 'left': pos.left, 'position': 'absolute', - 'height': '20px', - 'width': '160px' - }); - self.$overlay.find('.oe_overlay_options').css({ - 'position': 'static' }); + self.$overlay.find(".oe_overlay_options").attr("style", "width:0; left:0!important; top:0;"); + self.$overlay.find(".oe_overlay_options > .btn-group").attr("style", "width:160px; left:-80px;"); }}); this.$target.data('transfo').$markup .on("mouseover", function () { self.$target.trigger("mouseover"); }) - .mouseover() - .click(function () { - self.$target.transfo({ hide: false }); - }); + .mouseover(); this.$el.find(".style").click(function (event) { var settings = self.$target.data("transfo").settings; self.$target.transfo({ hide: (settings.hide = !settings.hide) }); }); - }, - onFocus : function () { - this.$target.transfo({ hide: true }); + + this.$overlay.find('.oe_snippet_clone, .oe_handles').addClass('hidden'); + + this.$overlay.find('[data-toggle="dropdown"]') + .on("mousedown", function () { + self.$target.transfo({ hide: true }); + }); }, onBlur : function () { this.$target.transfo({ hide: true }); @@ -1493,7 +1490,6 @@ this.snippet_id = this.$target.data("snippet-id"); this._readXMLData(); this.load_style_options(); - this.get_transform(); this.get_parent_block(); this.start(); }, @@ -1635,24 +1631,6 @@ this.$overlay.find('[data-toggle="dropdown"]').dropdown(); }, - get_transform: function () { - var self = this; - var phantom = false; - for (var i in this.styles){ - if (this.styles[i].data.phantom) { - phantom = true; - break; - } - } - if (phantom) { - // var $parent = this.$target.parents(website.snippet.globalSelector).first(); - // setTimeout(function () { - // self.BuildingBlock.make_active($parent); - // }, 0); - this.$overlay.find('.oe_snippet_clone, .oe_handles').addClass('hidden'); - } - }, - get_parent_block: function () { var self = this; var $button = this.$overlay.find('.oe_snippet_parent'); diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index 387e87b8e0f..b7c978ad359 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -981,9 +981,12 @@
    • + +
  • Transform
  • Rotation From fa6cb6d6a2276613bc8e0b3a38d685c0bcd79ffb Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 12:01:10 +0200 Subject: [PATCH 15/39] [FIX] website media editor button position bzr revid: chm@openerp.com-20140331100110-ue68pnnzaxusfu1u --- addons/website/static/src/js/website.snippets.editor.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 0e0290b825c..4d1d9c62d22 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1476,6 +1476,9 @@ self.$target.transfo({ hide: true }); }); }, + onFocus : function () { + this.$target.transfo({ hide: true }); + }, onBlur : function () { this.$target.transfo({ hide: true }); }, From 4281a3f89ff0a2710e63f60b5b702d958844500f Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 12:10:43 +0200 Subject: [PATCH 16/39] [FIX] website: snippet typo of resize button bzr revid: chm@openerp.com-20140331101043-0mf3c6pndz133huy --- addons/website/static/src/css/snippets.css | 3 ++- addons/website/static/src/css/snippets.sass | 3 ++- addons/website/static/src/js/website.snippets.editor.js | 2 ++ addons/website/static/src/xml/website.snippets.xml | 2 +- 4 files changed, 7 insertions(+), 3 deletions(-) diff --git a/addons/website/static/src/css/snippets.css b/addons/website/static/src/css/snippets.css index f5217660e29..5d93edce80e 100644 --- a/addons/website/static/src/css/snippets.css +++ b/addons/website/static/src/css/snippets.css @@ -326,6 +326,7 @@ top: auto; left: 50%; bottom: -6px; + margin-left: -50px; } .oe_overlay .oe_handle.size .oe_handle_button { z-index: 3; @@ -347,7 +348,7 @@ top: 9px; } .oe_overlay .oe_handle.size .auto_size { - width: 20px; + width: 100px; padding: 0 5px; top: 1px; margin-left: 36px; diff --git a/addons/website/static/src/css/snippets.sass b/addons/website/static/src/css/snippets.sass index 69afbb14f2d..3f57ca4464d 100644 --- a/addons/website/static/src/css/snippets.sass +++ b/addons/website/static/src/css/snippets.sass @@ -239,6 +239,7 @@ top: auto left: 50% bottom: -6px + margin-left: -50px .oe_handle_button z-index: 3 text-align: center @@ -254,7 +255,7 @@ cursor: row-resize top: 9px .auto_size - width: 20px + width: 100px padding: 0 5px top: 1px margin-left: 36px diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 4d1d9c62d22..36510d3521f 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1176,6 +1176,7 @@ dy = dy - dy%resize; if (dy <= 0) dy = resize; self.$target.css("height", dy+"px"); + self.$target.css("overflow", "hidden"); self.on_resize(compass, null, dy); self.BuildingBlock.cover_target(self.$overlay, self.$target); return; @@ -1216,6 +1217,7 @@ }); this.$overlay.find(".oe_handle.size .auto_size").on('click', function (event){ self.$target.css("height", ""); + self.$target.css("overflow", ""); self.BuildingBlock.cover_target(self.$overlay, self.$target); return false; }); diff --git a/addons/website/static/src/xml/website.snippets.xml b/addons/website/static/src/xml/website.snippets.xml index c5cf94d4791..ea4ef3751fe 100644 --- a/addons/website/static/src/xml/website.snippets.xml +++ b/addons/website/static/src/xml/website.snippets.xml @@ -40,7 +40,7 @@
    Resize
    -
    x
    +
    Auto Resize
    • From 1c4b7e9f6fe774b669c47292e8d2e50538990bc1 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 13:51:39 +0200 Subject: [PATCH 17/39] [FIX] website: snippet slider slide button bzr revid: chm@openerp.com-20140331115139-oa8va3ceikgc5b8w --- addons/website/static/src/js/website.snippets.editor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 36510d3521f..eb2d2c29654 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -932,7 +932,7 @@ drop_and_build_snippet: function() { this.id = this.unique_id(); this.$target.attr("id", this.id); - this.$target.find("[data-slide]").attr("href", "#" + this.id); + this.$target.find("[data-slide]").attr("href", "#" + this.id).attr("data-cke-saved-href", "#" + this.id); this.$target.find("[data-slide-to]").attr("data-target", "#" + this.id); this.rebind_event(); From 655142b04b32d48d29540552a7ebd9f20ef38856 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 14:09:06 +0200 Subject: [PATCH 18/39] [IMP] website: media editor: add search result for images bzr revid: chm@openerp.com-20140331120906-0qqa40xbvek27z4j --- .../website/static/src/js/website.editor.js | 25 ++++++++++++++----- .../static/src/js/website.snippets.editor.js | 24 ++++++++++++------ .../website/static/src/xml/website.editor.xml | 2 +- 3 files changed, 37 insertions(+), 14 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index fb8b5366a54..d4444eb8852 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1385,9 +1385,14 @@ return this._super(); }, + searchTimer: null, search: function () { + var self = this; var needle = this.$("input#icon-search").val(); - this.active.search(needle || ""); + clearTimeout(this.searchTimer); + this.searchTimer = setTimeout(function () { + self.active.search(needle || ""); + },250); } }); @@ -1470,6 +1475,13 @@ this.trigger('cancel'); }, + search: function (needle) { + var self = this; + this.fetch_existing(needle).then(function () { + self.selected_existing(self.$('input.url').val()); + }); + }, + set_image: function (url, error) { var self = this; this.$('input.url').val(error ? null : url || ''); @@ -1483,7 +1495,6 @@ var $form = this.$('form[action="/website/attach"]'); if (!$form.find('input[name="upload"]').val().length) { var url = $form.find('input[name="url"]').val(); - console.log(url); if (this.selected_existing(url).size()) { event.preventDefault(); return false; @@ -1515,14 +1526,18 @@ this.set_image(url, error); }, - fetch_existing: function () { + fetch_existing: function (needle) { + var domain = [['res_model', '=', 'ir.ui.view']]; + if (needle && needle.length) { + domain.push('|', ['datas_fname', 'ilike', needle], ['name', 'ilike', needle]); + } return openerp.jsonRpc('/web/dataset/call_kw', 'call', { model: 'ir.attachment', method: 'search_read', args: [], kwargs: { fields: ['name', 'website_url'], - domain: [['res_model', '=', 'ir.ui.view']], + domain: domain, order: 'id desc', context: website.get_context(), } @@ -1552,7 +1567,6 @@ this.$('.pager') .find('li.previous').toggleClass('disabled', (from === 0)).end() .find('li.next').toggleClass('disabled', (from + per_screen >= records.length)); - }, select_existing: function (e) { var link = $(e.currentTarget).attr('src'); @@ -1835,7 +1849,6 @@ } else if (needle.indexOf("player.vimeo.") != -1 || needle.indexOf("//vimeo.") != -1) { video_type = "vimeo"; video_id = needle.match(/vimeo\.[a-z]+\/(video\/)?([^?&]+)/i)[2]; - console.log(video_id); } else if (needle.indexOf(".dailymotion.") != -1) { video_type = "dailymotion"; video_id = needle.match(/dailymotion\.[a-z]+\/(embed\/)?(video\/)?([^\/?&]+)/i)[3]; diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index eb2d2c29654..c52a7b6fb04 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1436,16 +1436,10 @@ start: function () { var self = this; this._super(); - website.snippet.start_animation(true, this.$target); - this.$el.find(".edition").click(function (event) { - event.preventDefault(); - event.stopPropagation(); - self.element = new CKEDITOR.dom.element(self.$target[0]); - new website.editor.MediaDialog(self, self.element).appendTo(document.body); - }); this.$el.find(".clear-style").click(function (event) { self.$target.removeClass("fa-spin").attr("style", null); + self.$target.transfo({ hide: true }); }); this.$target.transfo({ @@ -1486,6 +1480,22 @@ }, }); + website.snippet.options.media = website.snippet.Option.extend({ + start: function () { + var self = this; + this._super(); + + website.snippet.start_animation(true, this.$target); + + this.$el.find(".edition").click(function (event) { + event.preventDefault(); + event.stopPropagation(); + self.element = new CKEDITOR.dom.element(self.$target[0]); + new website.editor.MediaDialog(self, self.element).appendTo(document.body); + }); + }, + }); + website.snippet.Editor = openerp.Class.extend({ init: function (BuildingBlock, dom) { diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 89b184a2c4e..8e6f9766ecf 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -194,7 +194,7 @@
    - +
    From e81c205b188c8223b42250f4bba4b6da880021e0 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 15:03:04 +0200 Subject: [PATCH 19/39] [FIX] website: snippet: link carousel-control bzr revid: chm@openerp.com-20140331130304-v1winnhp41agb030 --- addons/website/static/src/css/website.css | 20 +++++++++++++++---- addons/website/static/src/css/website.sass | 18 +++++++++++++---- .../static/src/js/website.snippets.editor.js | 2 +- addons/website/views/snippets.xml | 6 +++--- 4 files changed, 34 insertions(+), 12 deletions(-) diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css index 73bd1b0d55f..853afc26362 100644 --- a/addons/website/static/src/css/website.css +++ b/addons/website/static/src/css/website.css @@ -377,11 +377,23 @@ section, .carousel, .parallax, .row, .hr, .blockquote { position: absolute; margin-top: -8px; } -.carousel .carousel-control.left span { - left: 10px; +.carousel .carousel-control.left { + left: -10px; } -.carousel .carousel-control.right span { - right: 10px; +.carousel .carousel-control.left * { + position: absolute; + top: 50%; + z-index: 5; + right: 50%; +} +.carousel .carousel-control.right { + right: -10px; +} +.carousel .carousel-control.right * { + position: absolute; + top: 50%; + z-index: 5; + left: 50%; } .quotecarousel { diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass index c8eed32b15e..f19472c99da 100644 --- a/addons/website/static/src/css/website.sass +++ b/addons/website/static/src/css/website.sass @@ -308,10 +308,20 @@ section, .carousel, .parallax, .row, .hr, .blockquote top: 50% position: absolute margin-top: -8px - &.left span - left: 10px - &.right span - right: 10px + &.left + left: -10px + * + position: absolute + top: 50% + z-index: 5 + right: 50% + &.right + right: -10px + * + position: absolute + top: 50% + z-index: 5 + left: 50% .quotecarousel padding-bottom: 16px diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index c52a7b6fb04..59e624ce435 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -932,7 +932,7 @@ drop_and_build_snippet: function() { this.id = this.unique_id(); this.$target.attr("id", this.id); - this.$target.find("[data-slide]").attr("href", "#" + this.id).attr("data-cke-saved-href", "#" + this.id); + this.$target.find("[data-slide]").attr("data-target", "#" + this.id); this.$target.find("[data-slide-to]").attr("data-target", "#" + this.id); this.rebind_event(); diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index 5ff15116a37..30474fd660c 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -39,8 +39,8 @@
    • - - + + @@ -958,7 +958,7 @@
    + data-selector="img:not(.cke_iframe), .media_iframe_video, span.fa, i.fa, .glyphicon">
  • Change Media
    • From e0d33ad3c56cf627a0dc0d86f689fd4ec1eb3519 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 15:33:40 +0200 Subject: [PATCH 20/39] [FIX] website editor: shop tour and media editor for field image bzr revid: chm@openerp.com-20140331133340-vj67s9hlptum0h19 --- .../website/static/src/js/website.editor.js | 4 +++ .../static/src/js/website.snippets.editor.js | 9 ++++++ .../static/src/js/website.tour.shop.js | 30 +++++-------------- 3 files changed, 20 insertions(+), 23 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index ffbc5ee41e8..2de0e92b8db 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1366,6 +1366,10 @@ this.$('[href="#editor-media-icon"]').tab('show'); } + if ($(this.media.$).parent().data("oe-field") === "image") { + this.$('[href="#editor-media-video"], [href="#editor-media-icon"]').addClass('hidden'); + } + return this._super(); }, save: function () { diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 59e624ce435..0febdb2bedd 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1494,6 +1494,15 @@ new website.editor.MediaDialog(self, self.element).appendTo(document.body); }); }, + onFocus : function () { + var self = this; + if (this.$target.parent().data("oe-field") === "image") { + this.$overlay.addClass("hidden"); + self.element = new CKEDITOR.dom.element(self.$target[0]); + new website.editor.MediaDialog(self, self.element).appendTo(document.body); + self.BuildingBlock.make_active(false); + } + }, }); diff --git a/addons/website_sale/static/src/js/website.tour.shop.js b/addons/website_sale/static/src/js/website.tour.shop.js index adb4a9e556c..6291f2fc54e 100644 --- a/addons/website_sale/static/src/js/website.tour.shop.js +++ b/addons/website_sale/static/src/js/website.tour.shop.js @@ -66,39 +66,23 @@ }, { waitNot: '.product_price .oe_currency_value:containsExact(1.00)', - element: '#wrap img.img:first', + element: '#wrap img.product_detail_img', placement: 'top', title: _t("Update image"), content: _t("Click here to set an image describing your product."), }, { - element: 'button.hover-edition-button:visible', + element: 'img[alt=ipad]', placement: 'top', - title: _t("Update image"), - content: _t("Click here to set an image describing your product."), - }, - { - wait: 500, - element: '.well a.pull-right', - placement: 'bottom', title: _t("Select an Image"), - content: _t("Let's select an existing image."), - popover: { fixed: true }, + content: _t("Let's select an ipad image."), }, { - element: 'img[alt=imac]', - placement: 'bottom', - title: _t("Select an Image"), - content: _t("Let's select an imac image."), - popover: { fixed: true }, - }, - { - waitNot: 'img[alt=imac]', + waitFor: '.media_selected img[alt=ipad]', element: '.modal-content button.save', - placement: 'bottom', - title: _t("Select this Image"), - content: _t("Click to add the image to the product decsription."), - popover: { fixed: true }, + placement: 'top', + title: _t("Save this Image"), + content: _t("Click on save to add the image to the product decsription."), }, { waitNot: '.modal-content:visible', From 583a47b7b9bf51acb36bea3600f3745668e0dd57 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 31 Mar 2014 15:55:58 +0200 Subject: [PATCH 21/39] [IMP] website: media editor: add embed video bzr revid: chm@openerp.com-20140331135558-ulr1nzhwwvcnwswm --- addons/website/static/src/js/website.editor.js | 11 +++++++++++ addons/website/static/src/xml/website.editor.xml | 13 +++++++++++-- 2 files changed, 22 insertions(+), 2 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 2de0e92b8db..5ef53590345 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1816,6 +1816,7 @@ template: 'website.editor.dialog.video', events : _.extend({}, website.editor.Dialog.prototype.events, { 'blur input#urlvideo': 'get_video', + 'blur input#embedvideo': 'get_embed_video', }), start: function () { this.$iframe = this.$("iframe"); @@ -1838,8 +1839,15 @@ return "//player.vimeo.com/video/" + video_id + "?autoplay=" + (this.$("#autoplay").is(":checked") ? 1 : 0); case "dailymotion": return "//www.dailymotion.com/embed/video/" + video_id + "?autoplay=" + (this.$("#autoplay").is(":checked") ? 1 : 0); + default: + return video_id; } }, + get_embed_video: function () { + var embedvideo = this.$("input#embedvideo").val().match(/src=["']?([^"']+)["' ]?/); + this.$("input#urlvideo").val(embedvideo ? embedvideo[1] : ""); + this.get_video(); + }, get_video: function () { var needle = this.$("input#urlvideo").val(); var video_id; @@ -1857,6 +1865,9 @@ } else if (needle.indexOf(".dailymotion.") != -1) { video_type = "dailymotion"; video_id = needle.match(/dailymotion\.[a-z]+\/(embed\/)?(video\/)?([^\/?&]+)/i)[3]; + } else { + video_type = ""; + video_id = needle; } this.$("#video_id").val(video_id); diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 8e6f9766ecf..ca8a264ae6f 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -299,7 +299,7 @@
    - + - Youtube, Vimeo, Dailymotion + (Youtube, Vimeo, Dailymotion)
    +
    + + +
    From 26d62c4e55961799733e466d628c3f75a3afb92d Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 09:32:47 +0200 Subject: [PATCH 22/39] [IMP] website: media editor: add feedback when the user try to remove a picture bzr revid: chm@openerp.com-20140407073247-davv0udxz5n5qx35 --- addons/website/static/src/js/website.editor.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 5ef53590345..bd17584c08b 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1590,8 +1590,12 @@ try_remove: function (e) { var $help_block = this.$('.help-block').empty(); var self = this; - var id = parseInt($(e.target).data('id'), 10); + var $a = $(e.target); + var id = parseInt($a.data('id'), 10); var attachment = _.findWhere(this.records, {id: id}); + var $both = $a.parent().children(); + + $both.css({borderWidth: "5px", borderColor: "#f00"}); return openerp.jsonRpc('/web/dataset/call_kw', 'call', { model: 'ir.attachment', @@ -1607,6 +1611,7 @@ self.display_attachments(); return; } + $both.css({borderWidth: "", borderColor: ""}); $help_block.replaceWith(openerp.qweb.render( 'website.editor.dialog.image.existing.error', { views: prevented[id] From ee4b8795361b693d209817d85004b715bdd24d52 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 09:49:22 +0200 Subject: [PATCH 23/39] [IMP] website: media editor: insert add button for image loader and fix try_remove don't remove image bzr revid: chm@openerp.com-20140407074922-zri6j4u9sw52nkkw --- addons/website/models/website.py | 2 +- addons/website/static/src/js/website.editor.js | 3 --- addons/website/static/src/xml/website.editor.xml | 9 +++++---- 3 files changed, 6 insertions(+), 8 deletions(-) diff --git a/addons/website/models/website.py b/addons/website/models/website.py index a516f5cb96f..a0a6d1fb28b 100644 --- a/addons/website/models/website.py +++ b/addons/website/models/website.py @@ -638,7 +638,7 @@ class ir_attachment(osv.osv): # in-document URLs are html-escaped, a straight search will not # find them url = werkzeug.utils.escape(attachment.website_url) - ids = Views.search(cr, uid, [('arch', 'like', url)], context=context) + ids = Views.search(cr, uid, ["|", ('arch', 'like', '"%s"' % url), ('arch', 'like', "'%s'" % url)], context=context) if ids: removal_blocked_by[attachment.id] = Views.read( diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index bd17584c08b..bb24ad0bf74 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1429,9 +1429,6 @@ this.$('input[type=file]').click(); }, 'change input[type=file]': 'file_selection', - 'change input[type=text]': function () { - this.$('form').submit(); - }, 'submit form': 'form_submit', //'change input.url': 'preview_image', //'change select.image-style': 'preview_image', diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index ca8a264ae6f..0f57dea33fe 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -153,14 +153,15 @@
    — or — -
    - - + +
    + +
    -
    +
    '+ '
    '); - $iframe.attr("style", this.$(this.media.$).attr("style")); $(this.media.$).replaceWith($iframe); this._super(); }, diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 0febdb2bedd..12c8d438a15 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1438,10 +1438,25 @@ this._super(); this.$el.find(".clear-style").click(function (event) { - self.$target.removeClass("fa-spin").attr("style", null); - self.$target.transfo({ hide: true }); + self.$target.removeClass("fa-spin").attr("style", ""); + self.resetTransfo(); }); + this.$el.find(".style").click(function (event) { + var settings = self.$target.data("transfo").settings; + self.$target.transfo({ hide: (settings.hide = !settings.hide) }); + }); + + this.$overlay.find('.oe_snippet_clone, .oe_handles').addClass('hidden'); + + this.$overlay.find('[data-toggle="dropdown"]') + .on("mousedown", function () { + self.$target.transfo({ hide: true }); + }); + }, + resetTransfo: function () { + var self = this; + this.$target.transfo("destroy"); this.$target.transfo({ hide: true, callback: function () { @@ -1459,21 +1474,9 @@ self.$target.trigger("mouseover"); }) .mouseover(); - - this.$el.find(".style").click(function (event) { - var settings = self.$target.data("transfo").settings; - self.$target.transfo({ hide: (settings.hide = !settings.hide) }); - }); - - this.$overlay.find('.oe_snippet_clone, .oe_handles').addClass('hidden'); - - this.$overlay.find('[data-toggle="dropdown"]') - .on("mousedown", function () { - self.$target.transfo({ hide: true }); - }); }, onFocus : function () { - this.$target.transfo({ hide: true }); + this.resetTransfo(); }, onBlur : function () { this.$target.transfo({ hide: true }); @@ -1487,6 +1490,10 @@ website.snippet.start_animation(true, this.$target); + this.$target.on("saved", self, function (event, item) { + self.BuildingBlock.make_active($(item)); + }); + this.$el.find(".edition").click(function (event) { event.preventDefault(); event.stopPropagation(); diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index b8d8739f28d..b3012e5aa78 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -153,7 +153,7 @@
    — or — - +
    @@ -301,7 +301,7 @@
    (Youtube, Vimeo, Dailymotion) - + Add
    - +
  • Transform
    • -
  • - Rotation - -
    • +
  • Spin
  • Clear Style
    • From 618a52116ceba58a70f117670cccf7df974d5de4 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 12:56:04 +0200 Subject: [PATCH 27/39] [FIX] website: media transform: don't move center when rotation bzr revid: chm@openerp.com-20140407105604-t43kg143vqny8l5s --- addons/website/static/src/js/jQuery.transfo.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index 30580d84f78..074f7a5653a 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -199,6 +199,7 @@ OTHER DEALINGS IN THE SOFTWARE. "type": type, "pageX": event.pageX, "pageY": event.pageY, + "center": transfo.$center.offset(), }; } function _mouseUp($this, div, transfo, event) { @@ -209,7 +210,7 @@ OTHER DEALINGS IN THE SOFTWARE. event.preventDefault(); if (!transfo.active) return; var settings = transfo.settings; - var center = transfo.$center.offset(); + var center = transfo.active.center; var cdx = center.left - event.pageX; var cdy = center.top - event.pageY; From ad93089bc2ab73f681bbdc0a2033d83e8f38b3b2 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 13:15:06 +0200 Subject: [PATCH 28/39] [FIX] website: snippet editor add class from li[data-value] bzr revid: chm@openerp.com-20140407111506-jemffxbanul2yqbk --- addons/website/static/src/js/jQuery.transfo.js | 14 ++++++++++---- .../static/src/js/website.snippets.editor.js | 1 + 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index 074f7a5653a..6c82bfdb285 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -197,6 +197,8 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.active = { "type": type, + "scalex": transfo.settings.scalex, + "scaley": transfo.settings.scaley, "pageX": event.pageX, "pageY": event.pageY, "center": transfo.$center.offset(), @@ -257,16 +259,20 @@ OTHER DEALINGS IN THE SOFTWARE. var angle = settings.angle * rad; var dx = cdx*Math.cos(angle) - cdy*Math.sin(-angle); var dy = - cdx*Math.sin(angle) + cdy*Math.cos(-angle); - if (transfo.active.type.indexOf("t") != -1) { + if (transfo.active.type.indexOf("t") != -1 && transfo.active.scaley > 0 || + transfo.active.type.indexOf("b") != -1 && transfo.active.scaley < 0) { settings.scaley = dy / (settings.height/2); } - if (transfo.active.type.indexOf("b") != -1) { + if (transfo.active.type.indexOf("b") != -1 && transfo.active.scaley > 0 || + transfo.active.type.indexOf("t") != -1 && transfo.active.scaley < 0) { settings.scaley = - dy / (settings.height/2); } - if (transfo.active.type.indexOf("l") != -1) { + if (transfo.active.type.indexOf("l") != -1 && transfo.active.scalex > 0 || + transfo.active.type.indexOf("r") != -1 && transfo.active.scalex < 0) { settings.scalex = dx / (settings.width/2); } - if (transfo.active.type.indexOf("r") != -1) { + if (transfo.active.type.indexOf("r") != -1 && transfo.active.scalex > 0 || + transfo.active.type.indexOf("l") != -1 && transfo.active.scalex < 0) { settings.scalex = - dx / (settings.width/2); } if (settings.scaley > 0 && settings.scaley < 0.05) settings.scaley = 0.05; diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 12c8d438a15..a6c387c73a0 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -743,6 +743,7 @@ this.set_active(); this.$el.find('li[data-value] a').on('mouseenter mouseleave click', _.bind(this._mouse, this)); + this.$el.not(':not([data-value])').find("a").on('mouseenter mouseleave click', _.bind(this._mouse, this)); this.$target.on('snippet-style-reset', _.bind(this.set_active, this)); this.start(); From d65b2cff231ecc426946d576b9ee10dbbbf7f98c Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 13:23:30 +0200 Subject: [PATCH 29/39] [IMP] website: snippet editor, move resize button bzr revid: chm@openerp.com-20140407112330-6cj02vlmcs9gwxst --- addons/website/static/src/css/editor.css | 2 +- addons/website/static/src/css/snippets.css | 11 +++++++---- addons/website/static/src/css/snippets.sass | 13 ++++++++----- addons/website/static/src/xml/website.snippets.xml | 2 +- 4 files changed, 17 insertions(+), 11 deletions(-) diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css index 36de51db096..eb4c5b2851c 100644 --- a/addons/website/static/src/css/editor.css +++ b/addons/website/static/src/css/editor.css @@ -216,7 +216,7 @@ ul.oe_menu_editor .disclose { .modal .font-icons-icons { font-size: 2em; - max-height: 6em; + max-height: 9em; overflow: auto; } .modal .font-icons-icons .font-icons-icon { diff --git a/addons/website/static/src/css/snippets.css b/addons/website/static/src/css/snippets.css index 5d93edce80e..cbfca8be131 100644 --- a/addons/website/static/src/css/snippets.css +++ b/addons/website/static/src/css/snippets.css @@ -329,9 +329,10 @@ margin-left: -50px; } .oe_overlay .oe_handle.size .oe_handle_button { + position: relative; z-index: 3; text-align: center; - margin-left: -32px; + margin-left: -52px; margin-top: -10px; left: 0px; } @@ -343,15 +344,17 @@ box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.7); } .oe_overlay .oe_handle.size .size { + position: absolute; width: 64px; cursor: row-resize; top: 9px; + margin-left: 52px; + padding: 0 5px; } .oe_overlay .oe_handle.size .auto_size { + position: absolute; width: 100px; - padding: 0 5px; - top: 1px; - margin-left: 36px; + top: 9px; cursor: pointer; } .oe_overlay .oe_handle.readonly { diff --git a/addons/website/static/src/css/snippets.sass b/addons/website/static/src/css/snippets.sass index 3f57ca4464d..40467897e26 100644 --- a/addons/website/static/src/css/snippets.sass +++ b/addons/website/static/src/css/snippets.sass @@ -241,9 +241,10 @@ bottom: -6px margin-left: -50px .oe_handle_button + position: relative z-index: 3 text-align: center - margin-left: -32px + margin-left: -52px margin-top: -10px left: 0px &:hover @@ -251,14 +252,16 @@ color: #fff +box-shadow(0 0 5px 3px rgba(255,255,255,.7)) .size + position: absolute width: 64px cursor: row-resize top: 9px - .auto_size - width: 100px + margin-left: 52px padding: 0 5px - top: 1px - margin-left: 36px + .auto_size + position: absolute + width: 100px + top: 9px cursor: pointer &.readonly cursor: auto !important diff --git a/addons/website/static/src/xml/website.snippets.xml b/addons/website/static/src/xml/website.snippets.xml index ea4ef3751fe..b1853f366b0 100644 --- a/addons/website/static/src/xml/website.snippets.xml +++ b/addons/website/static/src/xml/website.snippets.xml @@ -39,8 +39,8 @@
    -
    Resize
    Auto Resize
    +
    Resize
    From ae2a609390fbac4e3b5784c3c21ba6c9ff43f561 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 15:02:29 +0200 Subject: [PATCH 30/39] [IMP] website: change translate px in % for snippet transform bzr revid: chm@openerp.com-20140407130229-rcoziy0gbwzl0are --- .../website/static/src/js/jQuery.transfo.js | 66 +++++++++---------- 1 file changed, 33 insertions(+), 33 deletions(-) diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index 6c82bfdb285..d2479017be0 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -143,8 +143,8 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings = {}; transfo.settings.angle= transform.indexOf('rotate') != -1 ? parseFloat(transform.match(/rotate\(([^)]+)deg\)/)[1]) : 0; - transfo.settings.translatex= transform.indexOf('translateX') != -1 ? parseFloat(transform.match(/translateX\(([^)]+)\)/)[1]) : 0; - transfo.settings.translatey= transform.indexOf('translateY') != -1 ? parseFloat(transform.match(/translateY\(([^)]+)\)/)[1]) : 0; + var translatex = transform.match(/translateX\(([0-9.-]+)(%|px)\)/); + var translatey = transform.match(/translateY\(([0-9.-]+)(%|px)\)/); transfo.settings.scalex= transform.indexOf('scaleX') != -1 ? parseFloat(transform.match(/scaleX\(([^)]+)\)/)[1]) : 1; transfo.settings.scaley= transform.indexOf('scaleY') != -1 ? parseFloat(transform.match(/scaleY\(([^)]+)\)/)[1]) : 1; @@ -153,6 +153,22 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings.height = $this.innerHeight(); transfo.settings.width = $this.innerWidth(); + + transfo.settings.translate = "%"; + + if (translatex && translatex[2] === "%") { + transfo.settings.translatexp = parseFloat(translatex[1]); + transfo.settings.translatex = transfo.settings.translatexp / 100 * transfo.settings.width; + } else { + transfo.settings.translatex = translatex ? parseFloat(translatex[1]) : 0; + } + if (translatey && translatey[2] === "%") { + transfo.settings.translateyp = parseFloat(translatey[1]); + transfo.settings.translatey = transfo.settings.translateyp / 100 * transfo.settings.height; + } else { + transfo.settings.translatey = translatey ? parseFloat(translatey[1]) : 0; + } + transfo.settings.css = window.getComputedStyle($this[0], null); transfo.settings.pos = $this.offset(); @@ -182,8 +198,6 @@ OTHER DEALINGS IN THE SOFTWARE. event.preventDefault(); if (transfo.active || event.which !== 1) return; - console.log(div); - var type = "position", $e = $(div); if ($e.hasClass("transfo-rotator")) type = "rotator"; else if ($e.hasClass("transfo-scaler-tl")) type = "tl"; @@ -259,20 +273,16 @@ OTHER DEALINGS IN THE SOFTWARE. var angle = settings.angle * rad; var dx = cdx*Math.cos(angle) - cdy*Math.sin(-angle); var dy = - cdx*Math.sin(angle) + cdy*Math.cos(-angle); - if (transfo.active.type.indexOf("t") != -1 && transfo.active.scaley > 0 || - transfo.active.type.indexOf("b") != -1 && transfo.active.scaley < 0) { + if (transfo.active.type.indexOf("t") != -1) { settings.scaley = dy / (settings.height/2); } - if (transfo.active.type.indexOf("b") != -1 && transfo.active.scaley > 0 || - transfo.active.type.indexOf("t") != -1 && transfo.active.scaley < 0) { + if (transfo.active.type.indexOf("b") != -1) { settings.scaley = - dy / (settings.height/2); } - if (transfo.active.type.indexOf("l") != -1 && transfo.active.scalex > 0 || - transfo.active.type.indexOf("r") != -1 && transfo.active.scalex < 0) { + if (transfo.active.type.indexOf("l") != -1) { settings.scalex = dx / (settings.width/2); } - if (transfo.active.type.indexOf("r") != -1 && transfo.active.scalex > 0 || - transfo.active.type.indexOf("l") != -1 && transfo.active.scalex < 0) { + if (transfo.active.type.indexOf("r") != -1) { settings.scalex = - dx / (settings.width/2); } if (settings.scaley > 0 && settings.scaley < 0.05) settings.scaley = 0.05; @@ -306,11 +316,11 @@ OTHER DEALINGS IN THE SOFTWARE. } if (settings.translatex) { trans = true; - transform += " translateX("+settings.translatex+"px) "; + transform += " translateX("+(settings.translate === "%" ? settings.translatexp+"%" : settings.translatex+"px")+") "; } if (settings.translatey) { trans = true; - transform += " translateY("+settings.translatey+"px) "; + transform += " translateY("+(settings.translate === "%" ? settings.translateyp+"%" : settings.translatey+"px")+"%) "; } if (settings.scalex != 1) { trans = true; @@ -341,34 +351,24 @@ OTHER DEALINGS IN THE SOFTWARE. } function _targetCss ($this, transfo) { - _setCss($this, transfo.settings.style, transfo.settings); + var settings = transfo.settings; + var width = parseFloat(settings.css.width); + var height = parseFloat(settings.css.height); + settings.translatexp = Math.round(settings.translatex/width*1000)/10; + settings.translateyp = Math.round(settings.translatey/height*1000)/10; - var pos = $this.position(); - var settings = Object.create(transfo.settings); - var w = parseFloat(transfo.settings.css.width); - var h = parseFloat(transfo.settings.css.height); - var width = Math.abs(settings.scalex) * w; - var height = Math.abs(settings.scaley) * h; - var top = settings.pos.top + (1-Math.abs(settings.scaley)) * h / 2; - var left = settings.pos.left + (1-Math.abs(settings.scalex)) * w / 2; - - var $rot = transfo.$markup.find(".transfo-rotator"); - if (settings.scalex > 0) $rot.css({"right": "0px", "left": "auto"}); - else $rot.css({"right": "auto", "left": "0px"}); - if (settings.scaley > 0) $rot.css({"top": "0px", "bottom": "auto"}); - else $rot.css({"top": "auto", "bottom": "0px"}); - - settings.scalex = settings.scaley = 1; + _setCss($this, settings.style, settings); _setCss(transfo.$markup, "position: absolute;" + - "top:" + top + "px;" + - "left:" + left + "px;" + + "top:" + settings.pos.top + "px;" + + "left:" + settings.pos.left + "px;" + "width:" + width + "px;" + "height:" + height + "px;" + "z-index:" + (transfo.settings.hide ? "-1" : "1000") + ";" + "cursor: move;", settings); + transfo.$markup.find(">").css("transform", "scaleX("+(1/settings.scalex)+") scaleY("+(1/settings.scaley)+")"); if (transfo.settings.hide) { transfo.$markup.find(">").hide(); From 078914371c0ad1b4174c44a1aabe0427b25a0711 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 15:37:50 +0200 Subject: [PATCH 31/39] [FIX] website: save jquery transform style bzr revid: chm@openerp.com-20140407133750-he0iaor008hvzfim --- .../website/static/src/js/jQuery.transfo.js | 53 ++++++++++++++++--- .../static/src/js/website.snippets.editor.js | 4 +- 2 files changed, 48 insertions(+), 9 deletions(-) diff --git a/addons/website/static/src/js/jQuery.transfo.js b/addons/website/static/src/js/jQuery.transfo.js index d2479017be0..725e5a02216 100644 --- a/addons/website/static/src/js/jQuery.transfo.js +++ b/addons/website/static/src/js/jQuery.transfo.js @@ -59,6 +59,39 @@ OTHER DEALINGS IN THE SOFTWARE. }); }, + toggle : function() { + return this.each(function() { + var $this = $(this); + var transfo = $this.data('transfo'); + if (transfo) { + transfo.settings.hide = !transfo.settings.hide; + _showHide($this, transfo); + } + }); + }, + + hide : function() { + return this.each(function() { + var $this = $(this); + var transfo = $this.data('transfo'); + if (transfo) { + transfo.settings.hide = true; + _showHide($this, transfo); + } + }); + }, + + show : function() { + return this.each(function() { + var $this = $(this); + var transfo = $this.data('transfo'); + if (transfo) { + transfo.settings.hide = false; + _showHide($this, transfo); + } + }); + }, + settings : function() { if(this.length > 1) { this.map(function () { @@ -130,6 +163,8 @@ OTHER DEALINGS IN THE SOFTWARE. },0); _bind($this, transfo); + + _targetCss($this, transfo); } function _overwriteOptions ($this, transfo, settings) { @@ -143,8 +178,6 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings = {}; transfo.settings.angle= transform.indexOf('rotate') != -1 ? parseFloat(transform.match(/rotate\(([^)]+)deg\)/)[1]) : 0; - var translatex = transform.match(/translateX\(([0-9.-]+)(%|px)\)/); - var translatey = transform.match(/translateY\(([0-9.-]+)(%|px)\)/); transfo.settings.scalex= transform.indexOf('scaleX') != -1 ? parseFloat(transform.match(/scaleX\(([^)]+)\)/)[1]) : 1; transfo.settings.scaley= transform.indexOf('scaleY') != -1 ? parseFloat(transform.match(/scaleY\(([^)]+)\)/)[1]) : 1; @@ -154,6 +187,8 @@ OTHER DEALINGS IN THE SOFTWARE. transfo.settings.height = $this.innerHeight(); transfo.settings.width = $this.innerWidth(); + var translatex = transform.match(/translateX\(([0-9.-]+)(%|px)\)/); + var translatey = transform.match(/translateY\(([0-9.-]+)(%|px)\)/); transfo.settings.translate = "%"; if (translatex && translatex[2] === "%") { @@ -320,7 +355,7 @@ OTHER DEALINGS IN THE SOFTWARE. } if (settings.translatey) { trans = true; - transform += " translateY("+(settings.translate === "%" ? settings.translateyp+"%" : settings.translatey+"px")+"%) "; + transform += " translateY("+(settings.translate === "%" ? settings.translateyp+"%" : settings.translatey+"px")+") "; } if (settings.scalex != 1) { trans = true; @@ -345,7 +380,7 @@ OTHER DEALINGS IN THE SOFTWARE. + "transform:" + transform + ";"; } - css = css.replace(/;+/g, ';').replace(/^;+|;+$/g, ''); + css = css.replace(/(\s*;)+/g, ';').replace(/^\s*;|;\s*$/g, ''); $this.attr("style", css); } @@ -365,19 +400,23 @@ OTHER DEALINGS IN THE SOFTWARE. "left:" + settings.pos.left + "px;" + "width:" + width + "px;" + "height:" + height + "px;" + - "z-index:" + (transfo.settings.hide ? "-1" : "1000") + ";" + "cursor: move;", settings); transfo.$markup.find(">").css("transform", "scaleX("+(1/settings.scalex)+") scaleY("+(1/settings.scaley)+")"); + _showHide($this, transfo); + + transfo.settings.callback.call($this[0], $this); + } + + function _showHide ($this, transfo) { + transfo.$markup.css("z-index", transfo.settings.hide ? -1 : 1000); if (transfo.settings.hide) { transfo.$markup.find(">").hide(); transfo.$markup.find(".transfo-scaler-mc").show(); } else { transfo.$markup.find(">").show(); } - - transfo.settings.callback.call($this[0], $this); } function _destroy ($this) { diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index a6c387c73a0..ad06f5740c8 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1452,7 +1452,7 @@ this.$overlay.find('[data-toggle="dropdown"]') .on("mousedown", function () { - self.$target.transfo({ hide: true }); + self.$target.transfo("hide"); }); }, resetTransfo: function () { @@ -1480,7 +1480,7 @@ this.resetTransfo(); }, onBlur : function () { - this.$target.transfo({ hide: true }); + this.$target.transfo("hide"); }, }); From 153e31d754fa254613c3da9da90b66eea9bb7aaa Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Mon, 7 Apr 2014 16:49:14 +0200 Subject: [PATCH 32/39] [FIX] website: media editor: add image with topbar bzr revid: chm@openerp.com-20140407144914-50wblp9teywr8wk2 --- .../website/static/src/js/website.editor.js | 64 +++++++++++-------- .../website/static/src/xml/website.editor.xml | 4 +- 2 files changed, 40 insertions(+), 28 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 2c7abd040bc..6f5dc682442 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -114,7 +114,7 @@ context: 'a', }); //noinspection JSValidateTypes - editor.addCommand('image', { + editor.addCommand('cimage', { exec: function (editor) { image_dialog(editor); return true; @@ -131,7 +131,7 @@ }); editor.ui.addButton('Image', { label: 'Image', - command: 'image', + command: 'cimage', toolbar: 'insert,10', }); @@ -1338,6 +1338,7 @@ }, start: function () { var self = this; + this.imageDialog = new website.editor.RTEImageDialog(this, this.editor, this.media); this.imageDialog.appendTo(this.$("#editor-media-image")); this.iconDialog = new website.editor.FontIconsDialog(this, this.editor, this.media); @@ -1361,38 +1362,49 @@ } }); - if (this.media.$.nodeName === "IMG") { - this.$('[href="#editor-media-image"]').tab('show'); - } else if (this.media.$.className.match(/(^|\s)media_iframe_video($|\s)/)) { - this.$('[href="#editor-media-video"]').tab('show'); - } else if (this.media.$.className.match(/(^|\s)fa($|\s)/)) { - this.$('[href="#editor-media-icon"]').tab('show'); - } + if (this.media) { + if (this.media.$.nodeName === "IMG") { + this.$('[href="#editor-media-image"]').tab('show'); + } else if (this.media.$.className.match(/(^|\s)media_iframe_video($|\s)/)) { + this.$('[href="#editor-media-video"]').tab('show'); + } else if (this.media.$.className.match(/(^|\s)fa($|\s)/)) { + this.$('[href="#editor-media-icon"]').tab('show'); + } - if ($(this.media.$).parent().data("oe-field") === "image") { - this.$('[href="#editor-media-video"], [href="#editor-media-icon"]').addClass('hidden'); + if ($(this.media.$).parent().data("oe-field") === "image") { + this.$('[href="#editor-media-video"], [href="#editor-media-icon"]').addClass('hidden'); + } } return this._super(); }, save: function () { var self = this; + if (self.media) { + this.media.$.innerHTML = ""; + if (this.active !== this.imageDialog) { + this.imageDialog.clear(); + } + if (this.active !== this.iconDialog) { + this.iconDialog.clear(); + } + if (this.active !== this.videoDialog) { + this.videoDialog.clear(); + } + } else { + var selection = this.editor.getSelection(); + var range = selection.getRanges(true)[0]; + this.media = new CKEDITOR.dom.element("img"); + range.insertNode(this.media); + range.selectNodeContents(this.media); + this.active.media = this.media; + } + var $el = $(self.media.$); setTimeout(function () { $el.trigger("saved", self.media.$); },0); - this.media.$.innerHTML = ""; - if (this.active !== this.imageDialog) { - this.imageDialog.clear(); - } - if (this.active !== this.iconDialog) { - this.iconDialog.clear(); - } - if (this.active !== this.videoDialog) { - this.videoDialog.clear(); - } - this.active.save(); this.media.$.className = this.media.$.className.replace(/\s+/g, ' '); @@ -1760,7 +1772,7 @@ * which may not match the visual look of the element. */ load_data: function () { - var classes = (this.media.$.className||"").split(/\s+/); + var classes = (this.media&&this.media.$.className||"").split(/\s+/); for (var i = 0; i < classes.length; i++) { var cls = classes[i]; switch(cls) { @@ -1813,7 +1825,7 @@ .attr('data-size', size) .addClass(size) .addClass(no_sizes); - if ((size && _.contains(classes, size)) || !selected) { + if ((size && _.contains(classes, size)) || (classes[2] === "" && !selected)) { this.$preview.append($p.clone()); this.$('#fa-size').val(size); $p.addClass('font-icons-selected'); @@ -1835,7 +1847,7 @@ }), start: function () { this.$iframe = this.$("iframe"); - var $media = $(this.media.$); + var $media = $(this.media && this.media.$); if ($media.hasClass("media_iframe_video")) { var src = $media.data('src'); this.$("input#urlvideo").val(src); @@ -1868,7 +1880,7 @@ return false; }, get_video: function (event) { - event.preventDefault(); + if (event) event.preventDefault(); var needle = this.$("input#urlvideo").val(); var video_id; var video_type; diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index b3012e5aa78..f0602691515 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -301,7 +301,7 @@
    (Youtube, Vimeo, Dailymotion) - + Add
    - + Date: Mon, 7 Apr 2014 18:33:37 +0200 Subject: [PATCH 33/39] [FIX] website: media editor fix saved trigger bzr revid: chm@openerp.com-20140407163337-3a3d3kt5l2nmm3gn --- addons/website/static/src/js/website.editor.js | 11 +++++++---- .../website/static/src/js/website.snippets.editor.js | 3 ++- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 6f5dc682442..7c2ed281a04 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1400,15 +1400,17 @@ this.active.media = this.media; } - var $el = $(self.media.$); - setTimeout(function () { - $el.trigger("saved", self.media.$); - },0); + var $el = $(self.active.media.$); this.active.save(); this.media.$.className = this.media.$.className.replace(/\s+/g, ' '); + setTimeout(function () { + $el.trigger("saved", self.active.media.$); + $(document.body).trigger("media-saved", [$el[0], self.active.media.$]); + },0); + this._super(); }, searchTimer: null, @@ -1918,6 +1920,7 @@ ''+ '
    '); $(this.media.$).replaceWith($iframe); + this.media.$ = $iframe[0]; this._super(); }, clear: function () { diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index ad06f5740c8..03016905bf2 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1491,7 +1491,8 @@ website.snippet.start_animation(true, this.$target); - this.$target.on("saved", self, function (event, item) { + $(document.body).on("media-saved", self, function (event, prev , item) { + self.editor.onBlur(); self.BuildingBlock.make_active($(item)); }); From 781e8fbbf09867e1e9b6f29839902ded6f6ba6a8 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Tue, 8 Apr 2014 10:26:49 +0200 Subject: [PATCH 34/39] [IMP] website: add Rounded Border, Box, Circle, Shadow to transform snippet bzr revid: chm@openerp.com-20140408082649-1z79gagload02ol0 --- addons/website/views/snippets.xml | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index 28cc755d87d..c999d8011db 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -965,7 +965,16 @@ From df9225295208a30fb994f81215cf8e8fecc5c760 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Tue, 8 Apr 2014 10:42:37 +0200 Subject: [PATCH 35/39] [FIX] website media editor: next previous bzr revid: chm@openerp.com-20140408084237-y8yh8cb1gsv94gbo --- .../website/static/src/js/website.editor.js | 22 ++++++++++--------- .../website/static/src/xml/website.editor.xml | 4 ---- addons/website/views/snippets.xml | 4 ++-- 3 files changed, 14 insertions(+), 16 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index 7c2ed281a04..c09f9a6b02f 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1457,15 +1457,6 @@ //'change input.url': 'preview_image', //'change select.image-style': 'preview_image', 'click .existing-attachments img': 'select_existing', - 'click .pager > li': function (e) { - e.preventDefault(); - var $target = $(e.currentTarget); - if ($target.hasClass('disabled')) { - return; - } - this.page += $target.hasClass('previous') ? -1 : 1; - this.display_attachments(); - }, 'click .existing-attachment-remove': 'try_remove', }), @@ -1474,6 +1465,7 @@ this._super(parent, editor, media); }, start: function () { + var self = this; var res = this._super(); var o = { url: null }; @@ -1481,6 +1473,16 @@ Object.preventExtensions(o); this.trigger('start', o); + this.parent.$(".pager > li").click(function (e) { + e.preventDefault(); + var $target = $(e.currentTarget); + if ($target.hasClass('disabled')) { + return; + } + self.page += $target.hasClass('previous') ? -1 : 1; + self.display_attachments(); + }); + this.set_image(o.url); return res; @@ -1590,7 +1592,7 @@ this.$('.existing-attachments').replaceWith( openerp.qweb.render( 'website.editor.dialog.image.existing.content', {rows: rows})); - this.$('.pager') + this.parent.$('.pager') .find('li.previous').toggleClass('disabled', (from === 0)).end() .find('li.next').toggleClass('disabled', (from + per_screen >= records.length)); }, diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index f0602691515..99ffe3f6820 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -187,10 +187,6 @@
    -
    diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index c999d8011db..b6debf6b4ec 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -959,7 +959,7 @@ From d15ba59a23384bcebbbcf3c369a4fb6b287e7a23 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Tue, 8 Apr 2014 11:36:48 +0200 Subject: [PATCH 36/39] [IMP] website: media editor: placeholder and preview bzr revid: chm@openerp.com-20140408093648-zcx3nj5k068ejrb4 --- .../website/static/src/js/website.editor.js | 39 ++++++++++++++++--- .../static/src/js/website.snippets.editor.js | 1 + .../website/static/src/xml/website.editor.xml | 26 ++++++------- 3 files changed, 47 insertions(+), 19 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index c09f9a6b02f..b27fd94c091 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1442,7 +1442,7 @@ * originally passed in) */ var IMAGES_PER_ROW = 6; - var IMAGES_ROWS = 4; + var IMAGES_ROWS = 2; website.editor.ImageDialog = website.editor.Media.extend({ template: 'website.editor.dialog.image', events: _.extend({}, website.editor.Dialog.prototype.events, { @@ -1454,7 +1454,13 @@ }, 'change input[type=file]': 'file_selection', 'submit form': 'form_submit', - //'change input.url': 'preview_image', + 'change input.url': function (e) { + if ($(e.target).val() === "") { + this.$("button").addClass("btn-default").removeClass("btn-primary"); + } else { + this.$("button").removeClass("btn-default").addClass("btn-primary"); + } + }, //'change select.image-style': 'preview_image', 'click .existing-attachments img': 'select_existing', 'click .existing-attachment-remove': 'try_remove', @@ -1488,11 +1494,14 @@ return res; }, save: function () { + if (!this.link) { + this.link = this.$(".existing-attachments img:first").attr('src'); + } this.trigger('save', { - url: this.$('input.url').val() + url: this.link }); this.media.renameNode("img"); - this.media.$.attributes.src = this.$('input.url').val(); + this.media.$.attributes.src = this.link; return this._super(); }, clear: function () { @@ -1511,7 +1520,8 @@ set_image: function (url, error) { var self = this; - this.$('input.url').val(error ? null : url || ''); + if (url) this.link = url; + this.$('input.url').val(''); this.fetch_existing().then(function () { self.selected_existing(url); }); @@ -1551,6 +1561,8 @@ $button.addClass('btn-danger'); } this.set_image(url, error); + // auto save and close popup + this.parent.save(); }, fetch_existing: function (needle) { @@ -1598,10 +1610,10 @@ }, select_existing: function (e) { var link = $(e.currentTarget).attr('src'); + this.link = link; this.selected_existing(link); }, selected_existing: function (link) { - this.$('input.url').val(link); this.$('.existing-attachment-cell.media_selected').removeClass("media_selected"); var $select = this.$('.existing-attachment-cell img').filter(function () { return $(this).attr("src") == link; @@ -1848,6 +1860,8 @@ events : _.extend({}, website.editor.Dialog.prototype.events, { 'click input#urlvideo ~ button': 'get_video', 'click input#embedvideo ~ button': 'get_embed_video', + 'change input#urlvideo': 'change_input', + 'change input#embedvideo': 'change_input' }), start: function () { this.$iframe = this.$("iframe"); @@ -1860,6 +1874,15 @@ } return this._super(); }, + change_input: function (e) { + var $input = $(e.target); + var $button = $input.parent().find("button"); + if ($input.val() === "") { + $button.addClass("btn-default").removeClass("btn-primary"); + } else { + $button.removeClass("btn-default").addClass("btn-primary"); + } + }, get_url: function () { var video_id = this.$("#video_id").val(); var video_type = this.$("#video_type").val(); @@ -1914,6 +1937,10 @@ }, save: function () { var video_id = this.$("#video_id").val(); + if (!video_id) { + this.$("button.btn-primary").click(); + video_id = this.$("#video_id").val(); + } var video_type = this.$("#video_type").val(); var style = this.media.$.attributes.style ? this.media.$.attributes.style.textContent : ''; var $iframe = $( diff --git a/addons/website/static/src/js/website.snippets.editor.js b/addons/website/static/src/js/website.snippets.editor.js index 03016905bf2..fac4f9ab357 100644 --- a/addons/website/static/src/js/website.snippets.editor.js +++ b/addons/website/static/src/js/website.snippets.editor.js @@ -1493,6 +1493,7 @@ $(document.body).on("media-saved", self, function (event, prev , item) { self.editor.onBlur(); + self.BuildingBlock.make_active(false); self.BuildingBlock.make_active($(item)); }); diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 99ffe3f6820..0fcbc585ae5 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -147,17 +147,18 @@ target="fileframe" class="form-inline">
    +
    + +
    + + +
    +
    - — or — - -
    - - -
    @@ -303,9 +304,8 @@ class="form-control url pull-left" style="width: 400px;" id="urlvideo" - placeholder="http://openerp.com" - value="//www.youtube.com/embed/yws1tbgNV7k"/> - + placeholder="//www.youtube.com/embed/yws1tbgNV7k"/> +
    @@ -315,21 +315,21 @@ style="width: 400px;" id="embedvideo" placeholder='<iframe src="//www.youtube.com/embed/yws1tbgNV7k"></iframe>'/> - +
    - - + +
    From 81f2c983e5e901a7c832b7213595f1bd6443a347 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Tue, 8 Apr 2014 11:47:03 +0200 Subject: [PATCH 37/39] [IMP] website: media editor: change button on keyup bzr revid: chm@openerp.com-20140408094703-7qayghtm88qku3jz --- .../website/static/src/js/website.editor.js | 23 ++++++++++++------- .../website/static/src/xml/website.editor.xml | 15 ++++++------ 2 files changed, 23 insertions(+), 15 deletions(-) diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js index b27fd94c091..365b8cf46ea 100644 --- a/addons/website/static/src/js/website.editor.js +++ b/addons/website/static/src/js/website.editor.js @@ -1454,13 +1454,8 @@ }, 'change input[type=file]': 'file_selection', 'submit form': 'form_submit', - 'change input.url': function (e) { - if ($(e.target).val() === "") { - this.$("button").addClass("btn-default").removeClass("btn-primary"); - } else { - this.$("button").removeClass("btn-default").addClass("btn-primary"); - } - }, + 'change input.url': "change_input", + 'keyup input.url': "change_input", //'change select.image-style': 'preview_image', 'click .existing-attachments img': 'select_existing', 'click .existing-attachment-remove': 'try_remove', @@ -1511,6 +1506,16 @@ this.trigger('cancel'); }, + change_input: function (e) { + var $input = $(e.target); + var $button = $input.parent().find("button"); + if ($input.val() === "") { + $button.addClass("btn-default").removeClass("btn-primary"); + } else { + $button.removeClass("btn-default").addClass("btn-primary"); + } + }, + search: function (needle) { var self = this; this.fetch_existing(needle).then(function () { @@ -1861,7 +1866,9 @@ 'click input#urlvideo ~ button': 'get_video', 'click input#embedvideo ~ button': 'get_embed_video', 'change input#urlvideo': 'change_input', - 'change input#embedvideo': 'change_input' + 'keyup input#urlvideo': 'change_input', + 'change input#embedvideo': 'change_input', + 'keyup input#embedvideo': 'change_input' }), start: function () { this.$iframe = this.$("iframe"); diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 0fcbc585ae5..879da3011f6 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -147,18 +147,19 @@ target="fileframe" class="form-inline">
    -
    - +
    + + + +
    +
    + — or — +
    -
    - - - -
    From 7a905238f299816543ea99d7881f7da5d16eec85 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Tue, 8 Apr 2014 11:53:43 +0200 Subject: [PATCH 38/39] [IMP] website: media editor: don't display id in error message bzr revid: chm@openerp.com-20140408095343-bg9348ieabf3ayp8 --- addons/website/static/src/xml/website.editor.xml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml index 879da3011f6..669d5f42e2f 100644 --- a/addons/website/static/src/xml/website.editor.xml +++ b/addons/website/static/src/xml/website.editor.xml @@ -206,7 +206,7 @@
  • - (id ) +
    • From 88eaa5f26fb7a44250eefa3abeb5d14b23559289 Mon Sep 17 00:00:00 2001 From: "chm@openerp.com" <> Date: Wed, 9 Apr 2014 14:43:21 +0200 Subject: [PATCH 39/39] [IMP] website: remove transform in modile view and change order menu bzr revid: chm@openerp.com-20140409124321-cwu86whebzuwtz1e --- addons/website/static/src/css/website.css | 11 +++++++++++ addons/website/static/src/css/website.sass | 12 +++++++++++- addons/website/views/snippets.xml | 4 ++-- 3 files changed, 24 insertions(+), 3 deletions(-) diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css index 853afc26362..ad414f9e017 100644 --- a/addons/website/static/src/css/website.css +++ b/addons/website/static/src/css/website.css @@ -559,3 +559,14 @@ div.media_iframe_video div { height: 100%; display: none; } + +/* Mobile view */ +@media (max-width: 768px) { + img:not(.cke_iframe), .media_iframe_video, span.fa, i.fa { + -webkit-transform: none !important; + -moz-transform: none !important; + -ms-transform: none !important; + -o-transform: none !important; + transform: none !important; + } +} diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass index f19472c99da..43e21f1d20f 100644 --- a/addons/website/static/src/css/website.sass +++ b/addons/website/static/src/css/website.sass @@ -458,4 +458,14 @@ div.media_iframe_video position: absolute width: 100% height: 100% - display: none \ No newline at end of file + display: none + +/* Mobile view */ + +@media (max-width: 768px) + img:not(.cke_iframe), .media_iframe_video, span.fa, i.fa + -webkit-transform: none !important + -moz-transform: none !important + -ms-transform: none !important + -o-transform: none !important + transform: none !important diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index 7a68ca0a55d..0377b02b1ce 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -964,7 +964,6 @@