[WIP] website: snippets: work
bzr revid: chm@openerp.com-20130909144940-f08v6egk5pijz29b
This commit is contained in:
@@ -197,6 +197,10 @@
|
||||
box-sizing: border-box;
|
||||
pointer-events: none;
|
||||
}
|
||||
.oe_snippet_manipulator .oe_boxsize, .oe_snippet_manipulator .oe_margin {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
.oe_snippet_manipulator .oe_handle {
|
||||
display: none;
|
||||
}
|
||||
@@ -204,13 +208,13 @@
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
.oe_snippet_manipulator.oe_selected, .oe_snippet_manipulator.oe_active {
|
||||
.oe_snippet_manipulator.oe_selected, .oe_snippet_manipulator.oe_active, .oe_snippet_manipulator .oe_boxsize, .oe_snippet_manipulator .oe_margin {
|
||||
opacity: 1;
|
||||
background: transparent;
|
||||
border: dashed 1px rgba(153, 0, 255, 0.5);
|
||||
box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.3), 0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset;
|
||||
}
|
||||
.oe_snippet_manipulator.oe_selected > *, .oe_snippet_manipulator.oe_active > * {
|
||||
.oe_snippet_manipulator.oe_selected .oe_handle, .oe_snippet_manipulator.oe_active .oe_handle, .oe_snippet_manipulator .oe_boxsize .oe_handle, .oe_snippet_manipulator .oe_margin .oe_handle {
|
||||
pointer-events: auto;
|
||||
}
|
||||
.oe_snippet_manipulator .oe_buttons {
|
||||
|
||||
@@ -177,17 +177,20 @@
|
||||
transition: opacity 100ms linear
|
||||
box-sizing: border-box
|
||||
pointer-events: none
|
||||
.oe_boxsize, .oe_margin
|
||||
position: absolute
|
||||
pointer-events: none
|
||||
.oe_handle
|
||||
display: none
|
||||
&.oe_hover
|
||||
opacity: 1
|
||||
cursor: pointer
|
||||
&.oe_selected, &.oe_active
|
||||
&.oe_selected, &.oe_active, .oe_boxsize, .oe_margin
|
||||
opacity: 1
|
||||
background: transparent
|
||||
border: dashed 1px rgba(153, 0, 255, 0.5)
|
||||
box-shadow: 0px 0px 0px 1px rgba(255,255,255,0.3), 0px 0px 0px 1px rgba(255,255,255,0.3) inset
|
||||
& > *
|
||||
.oe_handle
|
||||
pointer-events: auto
|
||||
.oe_buttons
|
||||
display: none
|
||||
|
||||
@@ -482,11 +482,35 @@
|
||||
|
||||
website.snippet.editorRegistry.box = website.snippet.Editor.extend({
|
||||
onFocus : function () {
|
||||
this._super();
|
||||
var self = this;
|
||||
this.$target.data('manipulator')
|
||||
.append($(openerp.qweb.render("website.snippets.box")).find(".oe_handles").html())
|
||||
.addClass('oe_active');
|
||||
var $box = $(openerp.qweb.render("website.snippets.box"));
|
||||
|
||||
$box.find(".oe_snippet_editorbar").prependTo(this.parent.$('#website-top-edit .nav.pull-right'));
|
||||
|
||||
this.$target.data('manipulator').append($box.find(".oe_handles").html()).addClass('oe_active');
|
||||
|
||||
function padding_margin_cover ($manipulator, $snippet) {
|
||||
var height = parseInt($snippet.height() || 0);
|
||||
var width = parseInt($snippet.width() || 0);
|
||||
|
||||
var $padding = $manipulator.find(".oe_boxsize").css({
|
||||
top: parseInt($snippet.css('padding-top')) + 'px',
|
||||
bottom: parseInt($snippet.css('padding-bottom')) + 'px',
|
||||
//height: (height - (parseInt($snippet.css('padding-top')) || 0) - (parseInt($snippet.css('padding-bottom')) || 0)) + 'px',
|
||||
left: parseInt($snippet.css('padding-left')) + 'px',
|
||||
right: parseInt($snippet.css('padding-right')) + 'px',
|
||||
//width: (width - (parseInt($snippet.css('padding-left')) || 0) - (parseInt($snippet.css('padding-right')) || 0)) + 'px',
|
||||
});
|
||||
var $margin = $manipulator.find(".oe_margin").css({
|
||||
top: -parseInt($snippet.css('margin-top')) + 'px',
|
||||
bottom: -parseInt($snippet.css('margin-bottom')) + 'px',
|
||||
//height: (height + (parseInt($snippet.css('margin-top')) || 0) + (parseInt($snippet.css('margin-bottom')) || 0)) + 'px',
|
||||
left: -parseInt($snippet.css('margin-left')) + 'px',
|
||||
right: -parseInt($snippet.css('margin-right')) + 'px',
|
||||
//width: (width + (parseInt($snippet.css('margin-left')) || 0) + (parseInt($snippet.css('margin-right')) || 0)) + 'px',
|
||||
});
|
||||
}
|
||||
padding_margin_cover( this.$target.data('manipulator'), this.$target);
|
||||
|
||||
this.$target.data('manipulator').find(".oe_handle").on('mousedown', function (event){
|
||||
event.preventDefault();
|
||||
@@ -537,6 +561,7 @@
|
||||
//$snippet.css('width', (size[1]+dx)+'px');
|
||||
}
|
||||
website.snippet.cover_target($manipulator, $snippet);
|
||||
padding_margin_cover($manipulator, $snippet);
|
||||
};
|
||||
$('body').mousemove(body_mousemove);
|
||||
|
||||
@@ -549,13 +574,15 @@
|
||||
};
|
||||
$('body').mouseup(body_mouseup);
|
||||
});
|
||||
this._super();
|
||||
},
|
||||
onBlur : function () {
|
||||
this._super();
|
||||
this.$target.data('manipulator')
|
||||
.removeClass('oe_active')
|
||||
.empty();
|
||||
},
|
||||
this.parent.$('#website-top-edit .nav.pull-right > .box_resize').remove();
|
||||
},
|
||||
});
|
||||
|
||||
website.snippet.editorRegistry.carousel = website.snippet.editorRegistry.box.extend({
|
||||
|
||||
@@ -17,13 +17,15 @@
|
||||
<div t-name="website.snippets.box" data-snippet-id='box'>
|
||||
|
||||
<!-- editor bar to display inside the top edit bar -->
|
||||
<li class='oe_snippet_editorbar'>
|
||||
<i class='icon-move oe_icon js_move'></i>
|
||||
<i class='icon-remove oe_icon js_remove'></i>
|
||||
<li class='oe_snippet_editorbar box_resize'>
|
||||
<a href="#" class="button js_box_move"><i class='icon icon-move'></i></a>
|
||||
<a href="#" class="button js_box_remove"><i class="icon icon-remove"></i></a>
|
||||
</li>
|
||||
|
||||
<!-- custom data for the widget -->
|
||||
<div class='oe_handles'>
|
||||
<div class='oe_boxsize'></div>
|
||||
<div class='oe_margin'></div>
|
||||
<div class='oe_handle n'></div>
|
||||
<div class='oe_handle ne'></div>
|
||||
<div class='oe_handle e'></div>
|
||||
|
||||
Reference in New Issue
Block a user