odoo
/
odoo
2
0
Fork 0
Code Pull Requests Releases Activity

[IMP] website snippet option: rename data-class into data-value 

bzr revid: chm@openerp.com-20140317144254-18cscu2yx5thmb89
This commit is contained in:
chm@openerp.com 2014-03-17 15:42:54 +01:00
parent b8071f8bc7
commit d87bc392ce
2 changed files with 58 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
addons/website/static/src/js/website.snippets.editor.js
View File

@ -623,7 +623,7 @@
this.required = this.$el.data("required");
this.set_active();
this.$el.find('li[data-class] a').on('mouseover mouseout click', _.bind(this._mouse, this));
this.$el.find('li[data-value] a').on('mouseover mouseout click', _.bind(this._mouse, this));
this.$target.on('snippet-style-reset', _.bind(this.set_active, this));
this.start();
@ -643,9 +643,9 @@
var $prev, $next;
if (event.type === 'mouseout') {
$prev = $(event.currentTarget).parent();
$next = this.$el.find("li[data-class].active");
$next = this.$el.find("li[data-value].active");
} else {
$prev = this.$el.find("li[data-class].active");
$prev = this.$el.find("li[data-value].active");
$next = $(event.currentTarget).parent();
}
if (!$prev.length) {
@ -709,6 +709,7 @@
},
/* select
* called when a user select an item
* li must have data-value attribute
* variables: np = {$next, $prev}
* $next is false if they are no next item selected
* $prev is false if they are no previous item selected
@ -717,10 +718,10 @@
var self = this;
// add or remove html class
if (np.$prev) {
this.$target.removeClass(np.$prev.data('class' || ""));
this.$target.removeClass(np.$prev.data('value' || ""));
}
if (np.$next) {
this.$target.addClass(np.$next.data('class') || "");
this.$target.addClass(np.$next.data('value') || "");
}
},
/* preview
@ -734,10 +735,10 @@
// add or remove html class
if (np.$prev) {
this.$target.removeClass(np.$prev.data('class') || "");
this.$target.removeClass(np.$prev.data('value') || "");
}
if (np.$next) {
this.$target.addClass(np.$next.data('class') || "");
this.$target.addClass(np.$next.data('value') || "");
}
},
/* set_active
@ -747,14 +748,14 @@
set_active: function () {
var self = this;
this.$el.find('li').removeClass("active");
var $active = this.$el.find('li[data-class]')
var $active = this.$el.find('li[data-value]')
.filter(function () {
var $li = $(this);
return ($li.data('class') && self.$target.hasClass($li.data('class')));
return ($li.data('value') && self.$target.hasClass($li.data('value')));
})
.first()
.addClass("active");
this.$el.find('li:has(li[data-class].active)').addClass("active");
this.$el.find('li:has(li[data-value].active)').addClass("active");
},
/* clean_for_save
* function called just before save vue
@ -773,7 +774,7 @@
start: function () {
this._super();
var src = this._get_bg();
this.$el.find("li[data-class].active.oe_custom_bg").data("src", src);
this.$el.find("li[data-value].active.oe_custom_bg").data("src", src);
},
select: function(event, np) {
var self = this;
@ -789,7 +790,7 @@
});
editor.on('cancel', self, function () {
if (!np.$prev || np.$prev.data("src") === "") {
self.$target.removeClass(np.$next.data("class"));
self.$target.removeClass(np.$next.data("value"));
self.$target.trigger("snippet-style-change", [self, np]);
}
});
@ -799,7 +800,7 @@
}
} else {
this._set_bg(false);
this.$target.removeClass(np.$prev.data("class"));
this.$target.removeClass(np.$prev.data("value"));
}
},
preview: function (event, np) {
@ -812,20 +813,20 @@
var self = this;
var bg = self.$target.css("background-image");
this.$el.find('li').removeClass("active");
var $active = this.$el.find('li[data-class]')
var $active = this.$el.find('li[data-value]')
.filter(function () {
var $li = $(this);
return ($li.data('src') && bg.indexOf($li.data('src')) >= 0) ||
(!$li.data('src') && self.$target.hasClass($li.data('class')));
(!$li.data('src') && self.$target.hasClass($li.data('value')));
})
.first();
if (!$active.length) {
$active = this.$target.css("background-image") !== 'none' ?
this.$el.find('li[data-class].oe_custom_bg') :
this.$el.find('li[data-class=""]');
this.$el.find('li[data-value].oe_custom_bg') :
this.$el.find('li[data-value=""]');
}
$active.addClass("active");
this.$el.find('li:has(li[data-class].active)').addClass("active");
this.$el.find('li:has(li[data-value].active)').addClass("active");
}
});
@ -942,7 +943,7 @@
},
load_style_options : function () {
this._super();
$(".snippet-style-size li[data-class='']").remove();
$(".snippet-style-size li[data-value='']").remove();
},
start : function () {
var self = this;
@ -960,11 +961,11 @@
$active.css("background-image", self.$target.css("background-image"));
}
if (np.$prev) {
$active.removeClass(np.$prev.data("class"));
$active.removeClass(np.$prev.data("value"));
}
if (np.$next) {
$active.addClass(np.$next.data("class"));
add_class(np.$next.data("class"));
$active.addClass(np.$next.data("value"));
add_class(np.$next.data("value"));
}
});
this.$target.on('slid', function () { // slide.bs.carousel
@ -986,11 +987,13 @@
var bg = this.$target.data("snippet-option-ids").background;
if (!bg) return $clone;
var $styles = bg.$el.find("li[data-class]:not(.oe_custom_bg)");
var $styles = bg.$el.find("li[data-value]:not(.oe_custom_bg)");
var styles_index = $styles.index($styles.filter(".active")[0]);
$styles.removeClass("active");
var $select = $($styles[styles_index >= $styles.length-1 ? 0 : styles_index+1]);
$select.addClass("active");
$clone.css("background-image", $select.data("src") ? "url('"+ $select.data("src") +"')" : "");
$clone.addClass($select.data("class") || "");
$clone.addClass($select.data("value") || "");
return $clone;
},

62
addons/website/views/snippets.xml
View File

@ -860,7 +860,7 @@
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Style</a>
<ul class="dropdown-menu">
<li data-class="readable"><a>Narrow</a></li>
<li data-value="readable"><a>Narrow</a></li>
</ul>
</li>
</div>
@ -873,51 +873,51 @@
<li class="dropdown-submenu">
<a tabindex="-2" href="#">Uniform Color</a>
<ul class="dropdown-menu">
<li data-class='oe_dark'><a>Darken</a></li>
<li data-class='oe_green'><a>Green</a></li>
<li data-class='oe_red'><a>Red</a></li>
<li data-class='oe_blue_light'><a>Turquoise</a></li>
<li data-class='oe_blue'><a>Dark Blue</a></li>
<li data-class='oe_orange'><a>Orange</a></li>
<li data-class='oe_purple'><a>Purple</a></li>
<li data-class='oe_black'><a>Black</a></li>
<li data-value='oe_dark'><a>Darken</a></li>
<li data-value='oe_green'><a>Green</a></li>
<li data-value='oe_red'><a>Red</a></li>
<li data-value='oe_blue_light'><a>Turquoise</a></li>
<li data-value='oe_blue'><a>Dark Blue</a></li>
<li data-value='oe_orange'><a>Orange</a></li>
<li data-value='oe_purple'><a>Purple</a></li>
<li data-value='oe_black'><a>Black</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a tabindex="-2" href="#">People</a>
<ul class="dropdown-menu">
<li data-class="oe_img_bg" data-src="/website/static/src/img/parallax/parallax_bg.jpg"><a>Sunflower</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/business_guy.jpg"><a>Business Guy</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/parallax/parallax_bg.jpg"><a>Sunflower</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/business_guy.jpg"><a>Business Guy</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a tabindex="-2" href="#">Landscape</a>
<ul class="dropdown-menu">
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/flower_field.jpg"><a>Flowers Field</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/landscape.jpg"><a>Landscape</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/mountains.jpg"><a>Mountains</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/greenfields.jpg"><a>Greenfields</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/flower_field.jpg"><a>Flowers Field</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/landscape.jpg"><a>Landscape</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/mountains.jpg"><a>Mountains</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/greenfields.jpg"><a>Greenfields</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a tabindex="-2" href="#">Various</a>
<ul class="dropdown-menu">
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/aqua.jpg"><a>Aqua</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/baby_blue.jpg"><a>Baby Blue</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/black.jpg"><a>Black</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/color_splash.jpg"><a>Color Splash</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/mango.jpg"><a>Mango</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/orange_red.jpg"><a>Orange Red</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/flower.jpg"><a>Purple</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/velour.jpg"><a>Velour</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/wood.jpg"><a>Wood</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/banner/yellow_green.jpg"><a>Yellow Green</a></li>
<li data-class="oe_img_bg" data-src="/website/static/src/img/parallax/quote.png"><a>Quote</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/aqua.jpg"><a>Aqua</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/baby_blue.jpg"><a>Baby Blue</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/black.jpg"><a>Black</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/color_splash.jpg"><a>Color Splash</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/mango.jpg"><a>Mango</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/orange_red.jpg"><a>Orange Red</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/flower.jpg"><a>Purple</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/velour.jpg"><a>Velour</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/wood.jpg"><a>Wood</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/banner/yellow_green.jpg"><a>Yellow Green</a></li>
<li data-value="oe_img_bg" data-src="/website/static/src/img/parallax/quote.png"><a>Quote</a></li>
</ul>
</li>
<li data-class=""><a>None</a></li>
<li data-value=""><a>None</a></li>
<li><a style="background: none; padding: 5px; border-top: 1px solid #ddd;"></a></li>
<li class="oe_custom_bg" data-class="oe_img_bg"><a><b>Choose an image...</b></a></li>
<li class="oe_custom_bg" data-value="oe_img_bg"><a><b>Choose an image...</b></a></li>
</ul>
</li>
</div>
@ -927,9 +927,9 @@
<li class="dropdown-submenu" data-required="true">
<a tabindex="-1" href="#">Layout</a>
<ul class="dropdown-menu">
<li data-class="text_only"><a>Text Only</a></li>
<li data-class="image_text"><a>Image - Text</a></li>
<li data-class="text_image"><a>Text - Image</a></li>
<li data-value="text_only"><a>Text Only</a></li>
<li data-value="image_text"><a>Image - Text</a></li>
<li data-value="text_image"><a>Text - Image</a></li>
</ul>
</li>
</div>