Skip to content
Permalink
Browse files

[IMP] website, web_editor: Improvement in code

  • Loading branch information...
var-odoo committed Apr 15, 2019
1 parent b5065c3 commit 8f861d27e785e35cb3792007e624b408e0627e91
@@ -841,7 +841,7 @@ var VideoWidget = MediaWidget.extend({
var container = $media.data('container') || '';
this.$('textarea#o_video_text').val(src);

if(src){
if (src) {
this.$('input#o_video_autoplay').prop('checked', src.indexOf('autoplay=1') >= 0);
this.$('input#o_video_hide_controls').prop('checked', src.indexOf('controls=0') >= 0);
this.$('input#o_video_loop').prop('checked', src.indexOf('loop=1') >= 0);
@@ -857,23 +857,19 @@ registry.background = SnippetOption.extend({
firstFilters: ['background'],
res_model: $editable.data('oe-model'),
res_id: $editable.data('oe-id'),
o_yt_option: true,
o_dm_option: true,
o_vim_option: true,
background_video_options: true,
}, $image[0]).open();

_editor.on('save', this, function (data) {
if (_editor.$el.find('.tab-pane.active').attr('id') === 'editor-media-image') {
if (this.$target.find(".yt_video_container").length) {
this.$target.find(".yt_video_container").remove();
this.$target.removeAttr('src opacity background iframefit muted loop');
this.$target.removeClass('oe_video_background oe_video');
$(this.$target.children().first()).removeClass("oe_video_bg");
}
$image.remove();
if (_editor.$('.tab-pane.active').attr('id') === 'editor-media-image') {
this._setCustomBackground($image.attr('src'));
this.$target.trigger('content_changed');
} else {
$image.remove();
if ($('textarea#o_video_text').val() == "") {
this._removeVideo();
return;
}
var src = $(data).attr('data-oe-expression');
if (src.indexOf('loop=1') >= 0) {
var video_id = $(data).attr('data-oe-expression').split('/')[4].split('?')[0];
@@ -885,15 +881,13 @@ registry.background = SnippetOption.extend({
this.$target.attr({'src': src, 'opacity': opacity, 'background': background, 'iframefit': container});
this.$target.addClass('oe_video_background oe_video');
$(this.$target.children().first()).addClass("oe_video_bg");
var param = $.deparam(src);
var param = $.deparam(src.split('?')[1]);
this.$target.attr({'muted': param.mute, 'loop': param.loop, 'controls': param.controls, 'autoplay': param.autoplay});
this._refreshPublicWidgets();
}
});
_editor.on('closed', this, function () {
if (_editor.$el.find('.tab-pane.active').attr('id') === 'editor-media-image') {
$image.remove();
}
$image.remove();
});
},

@@ -948,6 +942,18 @@ registry.background = SnippetOption.extend({
var srcValueWrapper = /url\(['"]*|['"]*\)|^none$/g;
return value && value.replace(srcValueWrapper, '') || '';
},
/**
* Removes all background video related classes and iframe from the target element.
*
* @private
*/
_removeVideo: function () {
this.$(".yt_video_container").remove();
this.$("iframe.o_player").remove();
this.$target.removeAttr('src opacity background iframefit autoplay controls loop muted');
this.$target.removeClass('oe_video_background oe_video');
this.$target.children().first().removeClass("oe_video_bg");
},
/**
* @override
*/
@@ -275,7 +275,7 @@
<div class="o_dm_option">
<label class="o_switch mb0"><input id="o_video_hide_dm_share" type="checkbox" checked="checked"/><span/>Hide sharing button</label>
</div>
<div t-attf-class="#{widget.options.o_dm_option ? 'o_dm_option' : ''} #{widget.options.o_yt_option ? 'o_yt_option' : ''} #{widget.options.o_vim_option ? 'o_vim_option' : ''} row mt-2">
<div t-attf-class="#{widget.options.background_video_options ? 'o_dm_option o_yt_option o_vim_option' : ''} row mt-2">
<label class="col-md-4 pre_label">Video background</label>
<label class="col-md-8">
<select name="background" id="o_video_background" class="form-control background">
@@ -285,18 +285,18 @@
</select>
</label>
</div>
<div t-attf-class="#{widget.options.o_dm_option ? 'o_dm_option' : ''} #{widget.options.o_yt_option ? 'o_yt_option' : ''} #{widget.options.o_vim_option ? 'o_vim_option' : ''} row" style="overflow:hidden">
<div t-attf-class="#{widget.options.background_video_options ? 'o_dm_option o_yt_option o_vim_option' : ''} row" style="overflow:hidden">
<label class="col-md-4 pre_label col-form-label">Opacity</label>
<label class="col-md-8">
<input class="my-2" name="opacity" id="o_video_opacity" type="range" step="0.1" min="0" max="1" value="1" placeholder="1"/>
</label>
</div>
<div t-attf-class="#{widget.options.o_dm_option ? 'o_dm_option' : ''} #{widget.options.o_yt_option ? 'o_yt_option' : ''} #{widget.options.o_vim_option ? 'o_vim_option' : ''}">
<div t-attf-class="#{widget.options.o_dm_option ? 'o_dm_option' : ''} #{widget.options.o_yt_option ? 'o_yt_option' : ''} #{widget.options.o_vim_option ? 'o_vim_option' : ''} custom-control custom-radio col-md-6">
<div t-attf-class="#{widget.options.background_video_options ? 'o_dm_option o_yt_option o_vim_option' : ''}">
<div t-attf-class="#{widget.options.background_video_options ? 'o_dm_option o_yt_option o_vim_option' : ''} custom-control custom-radio col-md-6">
<input type="radio" id="fitCont" name="iframefit" class="custom-control-input" value="fitCont" checked="checked"/>
<label for="fitCont" class="small custom-control-label">Fill container with video</label>
</div>
<div t-attf-class="#{widget.options.o_dm_option ? 'o_dm_option' : ''} #{widget.options.o_yt_option ? 'o_yt_option' : ''} #{widget.options.o_vim_option ? 'o_vim_option' : ''} custom-control custom-radio col-md-6">
<div t-attf-class="#{widget.options.background_video_options ? 'o_dm_option o_yt_option o_vim_option' : ''} custom-control custom-radio col-md-6">
<input type="radio" id="fitIframe" name="iframefit" class="custom-control-input" value="fitIframe"/>
<label for="fitIframe" class="small custom-control-label">Put video in container</label>
</div>
@@ -500,8 +500,11 @@ registry.slider = publicWidget.Widget.extend({
});

registry.backgroundVideo = Animation.extend({
selector : ".oe_video_background",
disabledInEditableMode : false,
selector: ".oe_video_background",
jsLibs: [
'/website/static/lib/YTPlayer/jquery.mb.YTPlayer.js',
],
disabledInEditableMode: false,

//--------------------------------------------------------------------------
// Public
@@ -613,7 +616,7 @@ registry.backgroundVideo = Animation.extend({

whenPlayerReady.then(function ($player) {
$player.fadeTo(0, 0);
$player.addClass('o_player');
$player.addClass('o_player oe_iframe_position');
self.ratio = ($player.width() / $player.height());
if (self.$target.attr('iframefit') === 'fitCont') {

@@ -625,7 +628,6 @@ registry.backgroundVideo = Animation.extend({
$player.css({width: '100%', height: 'auto'});
}
} else if (self.$target.attr('iframefit') === 'fitIframe') {
$player.addClass('oe_create_video_iframe');
$player.parentsUntil(self.$target).addBack().css({width: '100%', height: '100%'});
}

@@ -667,7 +669,7 @@ registry.backgroundVideo = Animation.extend({
frameborder: "0",
class: "playerBox",
allowfullscreen: "allowfullscreen",
src: videoUrl + '?' + $.param(params),
src: videoUrl,
});
} else {
$iframe = $('<div/>').html(this.src).find('iframe:first').css({
@@ -698,6 +700,7 @@ registry.backgroundVideo = Animation.extend({
* @param {object} _params
*/
_ytPlayerVideo: function ($container, videoUrl, _params) {
$container.find('iframe.o_player').remove();
var videoId = this.$target.attr('src').split('/')[4].split('?')[0];
var params = _.mapObject(_params, function (v) { return !!v; });
params.autoplay = true;
@@ -260,7 +260,7 @@ font[class*='bg-'] {
.oe_video_bg {
z-index : -1;
}
.oe_create_video_iframe{
.oe_iframe_position {
position: absolute;
top: 0;
right: 0;
@@ -309,10 +309,6 @@ font[class*='bg-'] {
}
}

@-webkit-keyframes o-anim_movingBG { @include o-anim-movingBG; }
@-moz-keyframes o-anim_movingBG { @include o-anim-movingBG; }
@-ms-keyframes o-anim_movingBG { @include o-anim-movingBG; }
@-o-keyframes o-anim_movingBG { @include o-anim-movingBG; }
@keyframes o-anim_movingBG { @include o-anim-movingBG; }

section {
@@ -77,7 +77,6 @@

<!-- Custom empty file for user javascript -->
<script type="text/javascript" src="/website/static/src/js/user_custom_javascript.js"/>
<script type="text/javascript" src="/website/static/lib/YTPlayer/jquery.mb.YTPlayer.js"/>
</xpath>
</template>

0 comments on commit 8f861d2

Please sign in to comment.
You can’t perform that action at this time.