From ba0778922cf141336c456e3d00e6a0f9de3a41a4 Mon Sep 17 00:00:00 2001 From: "RGA(OpenERP)" <> Date: Fri, 18 Oct 2013 15:01:35 +0530 Subject: [PATCH 1/3] [IMP] parallax snippet add size option like banner has bzr revid: rgaopenerp-20131018093135-4ux25wdnd73wlah2 --- addons/website/static/src/css/website.css | 13 +++++++-- addons/website/static/src/css/website.sass | 9 ++++-- .../website/static/src/js/website.snippets.js | 29 +++++++++++++++++++ addons/website/views/snippets.xml | 18 +++++++++++- 4 files changed, 63 insertions(+), 6 deletions(-) diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css index ce87e592136..b17249dce64 100644 --- a/addons/website/static/src/css/website.css +++ b/addons/website/static/src/css/website.css @@ -1,4 +1,3 @@ -@charset "utf-8"; /* THIS CSS FILE IS FOR WEBSITE THEMING CUSTOMIZATION ONLY * * css for editor buttons, openerp widget included in the website and other @@ -361,11 +360,19 @@ footer { } .parallax_full { - background: #eeeeee bottom center repeat fixed; - min-height: 650px; + background: #eeeeee no-repeat top center; width: 100%; background-size: 100%; } +.parallax_full.oe_small .container { + height: 200px; +} +.parallax_full.oe_medium .container { + height: 300px; +} +.parallax_full.oe_big .container { + height: 450px; +} /* -- Hack for removing double scrollbar from mobile preview -- */ div#mobile-preview.modal { diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass index 5197653429c..136e039bc1c 100644 --- a/addons/website/static/src/css/website.sass +++ b/addons/website/static/src/css/website.sass @@ -276,10 +276,15 @@ footer background-color: grey .parallax_full - background: #eee bottom center repeat fixed - min-height: 650px + background: #eee no-repeat top center width: 100% background-size: 100% + &.oe_small .container + height: 200px + &.oe_medium .container + height: 300px + &.oe_big .container + height: 450px /* -- Hack for removing double scrollbar from mobile preview -- */ div#mobile-preview.modal diff --git a/addons/website/static/src/js/website.snippets.js b/addons/website/static/src/js/website.snippets.js index 35568e8336e..2732c397619 100644 --- a/addons/website/static/src/js/website.snippets.js +++ b/addons/website/static/src/js/website.snippets.js @@ -1198,7 +1198,36 @@ start : function () { this._super(); this.change_background(this.$target, 'ul[name="parallax-background"]'); + this.change_size(); }, + change_size: function () { + var self = this; + var $el = this.$target; + + var size = 'oe_big'; + if (this.$target.hasClass('oe_small')) + size = 'oe_small'; + else if (this.$target.hasClass('oe_medium')) + size = 'oe_medium'; + + var $ul = this.$editor.find('ul[name="parallax-size"]'); + var $li = $ul.find("li"); + + $ul.find('[data-value="' + size + '"]').addClass('active'); + + $li.on('click', function (event) { + $li.removeClass("active"); + $(this).addClass("active"); + }) + .on('mouseover', function (event) { + $el.removeClass('oe_big oe_small oe_medium'); + $el.addClass($(event.currentTarget).data("value")); + }) + .on('mouseout', function (event) { + $el.removeClass('oe_big oe_small oe_medium'); + $el.addClass($ul.find('li.active').data("value")); + }); + } }); /* diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index a351e07d4fd..6651e899762 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -677,6 +677,22 @@ Parallax + + - +
From 8cd32883a39ddf11baf97659c85a8c7b45f3a94d Mon Sep 17 00:00:00 2001 From: "RGA(OpenERP)" <> Date: Fri, 18 Oct 2013 20:23:13 +0530 Subject: [PATCH 3/3] [IMP] add scroll speed options in parallax snippet bzr revid: rgaopenerp-20131018145313-4li3mwyte19n0cf9 --- addons/website/static/src/css/website.css | 2 +- addons/website/static/src/css/website.sass | 2 +- addons/website/static/src/js/website.js | 14 ++++++++++++++ .../website/static/src/js/website.snippets.js | 17 +++++++++++++++++ addons/website/views/snippets.xml | 10 +++++----- 5 files changed, 38 insertions(+), 7 deletions(-) diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css index b17249dce64..44ccdfbafd4 100644 --- a/addons/website/static/src/css/website.css +++ b/addons/website/static/src/css/website.css @@ -360,7 +360,7 @@ footer { } .parallax_full { - background: #eeeeee no-repeat top center; + background: #eeeeee no-repeat top center fixed; width: 100%; background-size: 100%; } diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass index 136e039bc1c..ec5bb1a1e1a 100644 --- a/addons/website/static/src/css/website.sass +++ b/addons/website/static/src/css/website.sass @@ -276,7 +276,7 @@ footer background-color: grey .parallax_full - background: #eee no-repeat top center + background: #eee no-repeat top center fixed width: 100% background-size: 100% &.oe_small .container diff --git a/addons/website/static/src/js/website.js b/addons/website/static/src/js/website.js index 963a0b1664d..86cc9d31f57 100644 --- a/addons/website/static/src/js/website.js +++ b/addons/website/static/src/js/website.js @@ -150,6 +150,20 @@ $data.attr("data-publish", +result ? 'on' : 'off'); }); }); + + $('[data-snippet-id="parallax"]').each(function(){ + var $el = $(this); + var $window = $(window); + $window.scroll(function() { + var yPos = -( ($window.scrollTop() - $el.offset().top) / $el.data('speed')); + + var yPos = -($window.scrollTop() / 2); + // Put together our final background position + var coords = '50% '+ yPos + 'px'; + // Move the background + $el.css({ backgroundPosition: coords }); + }) + }); $(document).on('click', '.js_publish_management .js_publish_btn', function (e) { var $data = $(this).parents(".js_publish_management:first"); diff --git a/addons/website/static/src/js/website.snippets.js b/addons/website/static/src/js/website.snippets.js index 2732c397619..a033639b47a 100644 --- a/addons/website/static/src/js/website.snippets.js +++ b/addons/website/static/src/js/website.snippets.js @@ -1198,8 +1198,25 @@ start : function () { this._super(); this.change_background(this.$target, 'ul[name="parallax-background"]'); + this.scroll(); this.change_size(); }, + scroll: function(){ + var self = this; + var $ul = this.$editor.find('ul[name="parallax-scroll"]'); + var $li = $ul.find("li"); + var $parallax = this.$el.find('.parallax_full'); + var speed = $parallax.data('speed') || 1 ; + + $ul.find('[data-value="' + speed + '"]').addClass('active'); + $li.on('click', function (event) { + $li.removeClass("active"); + $(this).addClass("active"); + var speed = $(this).data('value') + $parallax.data('speed', speed); + }); + + }, change_size: function () { var self = this; var $el = this.$target; diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml index f0261a47e32..55349cc6f80 100644 --- a/addons/website/views/snippets.xml +++ b/addons/website/views/snippets.xml @@ -709,13 +709,13 @@ -
+