diff --git a/snippet_video_bg/__init__.py b/snippet_video_bg/__init__.py new file mode 100644 index 000000000..b0f26a9a6 --- /dev/null +++ b/snippet_video_bg/__init__.py @@ -0,0 +1,3 @@ +# -*- coding: utf-8 -*- + +from . import controllers diff --git a/snippet_video_bg/__manifest__.py b/snippet_video_bg/__manifest__.py new file mode 100644 index 000000000..f75e6ae5f --- /dev/null +++ b/snippet_video_bg/__manifest__.py @@ -0,0 +1,47 @@ +# -*- coding: utf-8 -*- +############################################################################## +# +# Cybrosys Technologies Pvt. Ltd. +# Copyright (C) 2017-TODAY Cybrosys Technologies(). +# Author: Hilar AK() +# you can modify it under the terms of the GNU LESSER +# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. +# +# It is forbidden to publish, distribute, sublicense, or sell copies +# of the Software or modified copies of the Software. +# +# This program is distributed in the hope that it will be useful, +# but WITHOUT ANY WARRANTY; without even the implied warranty of +# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. +# +# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE +# GENERAL PUBLIC LICENSE (LGPL v3) along with this program. +# If not, see . +# +############################################################################## + +{ + 'name': "Website Video Background", + 'version': '10.0.1.0.2', + 'summary': """Make Website Background as Video""", + 'description': """ + Website page background as youtube video. + """, + 'author': 'Cybrosys Techno Solutions', + 'company': 'Cybrosys Techno Solutions', + 'website': "https://cybrosys.com/", + 'category': 'Website', + 'depends': ['base', 'website'], + 'data': [ + 'views/assets.xml', + 'views/conf_view.xml', + 'views/templates.xml', + ], + 'demo': [ + ], + 'images': ['static/description/banner.jpg'], + 'license': 'LGPL-3', + 'installable': True, + 'application': False +} diff --git a/snippet_video_bg/__manifest__.py~ b/snippet_video_bg/__manifest__.py~ new file mode 100644 index 000000000..31f126620 --- /dev/null +++ b/snippet_video_bg/__manifest__.py~ @@ -0,0 +1,47 @@ +# -*- coding: utf-8 -*- +############################################################################## +# +# Cybrosys Technologies Pvt. Ltd. +# Copyright (C) 2017-TODAY Cybrosys Technologies(). +# Author: Hilar AK() +# you can modify it under the terms of the GNU LESSER +# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. +# +# It is forbidden to publish, distribute, sublicense, or sell copies +# of the Software or modified copies of the Software. +# +# This program is distributed in the hope that it will be useful, +# but WITHOUT ANY WARRANTY; without even the implied warranty of +# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. +# +# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE +# GENERAL PUBLIC LICENSE (LGPL v3) along with this program. +# If not, see . +# +############################################################################## + +{ + 'name': "Website Video Background", + 'version': '10.0.1.0.1', + 'summary': """Make Website Background as Video""", + 'description': """ + Website page background as youtube video. + """, + 'author': 'Cybrosys Techno Solutions', + 'company': 'Cybrosys Techno Solutions', + 'website': "https://cybrosys.com/", + 'category': 'Website', + 'depends': ['base', 'website'], + 'data': [ + 'views/views.xml', + 'views/conf_view.xml', + 'views/templates.xml', + ], + 'demo': [ + ], + 'images': ['static/description/banner.jpg'], + 'license': 'LGPL-3', + 'installable': True, + 'application': False +} diff --git a/snippet_video_bg/controllers/__init__.py b/snippet_video_bg/controllers/__init__.py new file mode 100644 index 000000000..457bae27e --- /dev/null +++ b/snippet_video_bg/controllers/__init__.py @@ -0,0 +1,3 @@ +# -*- coding: utf-8 -*- + +from . import controllers \ No newline at end of file diff --git a/snippet_video_bg/controllers/controllers.py b/snippet_video_bg/controllers/controllers.py new file mode 100644 index 000000000..5365b14a1 --- /dev/null +++ b/snippet_video_bg/controllers/controllers.py @@ -0,0 +1,28 @@ +# -*- coding: utf-8 -*- +from odoo import http +from odoo.http import request + + +class SnippetVideoBg(http.Controller): + + @http.route('/set_video_id', type='json', auth="user", methods=['POST'], website=True) + def index(self, **kw): + """ + Here set the system param video id. + :param kw: + :return: + """ + video_id = kw.get('id') + request.env['ir.config_parameter'].set_param( + 'video_id', video_id) if video_id else '' + return '/' + + @http.route('/get_video_id', type='json', methods=['GET', 'POST'], auth="public", website=True) + def getVideoId(self, **kw): + """ + returns the saved video id. + :param kw: + :return: + """ + video_id = request.env['ir.config_parameter'].get_param('video_id') + return {'video_id': video_id} diff --git a/snippet_video_bg/demo/demo.xml b/snippet_video_bg/demo/demo.xml new file mode 100644 index 000000000..0b11d6107 --- /dev/null +++ b/snippet_video_bg/demo/demo.xml @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/snippet_video_bg/models/__init__.py b/snippet_video_bg/models/__init__.py new file mode 100644 index 000000000..cde864bae --- /dev/null +++ b/snippet_video_bg/models/__init__.py @@ -0,0 +1,3 @@ +# -*- coding: utf-8 -*- + +from . import models diff --git a/snippet_video_bg/models/models.py b/snippet_video_bg/models/models.py new file mode 100644 index 000000000..b79c93d8b --- /dev/null +++ b/snippet_video_bg/models/models.py @@ -0,0 +1,15 @@ +# -*- coding: utf-8 -*- +# +# from odoo import models, fields +# +# +# class WebsiteMapKey(models.Model): +# _inherit = 'website' +# video_id = fields.Char("Youtube Video Id") +# +# +# class WebsiteMapConfig(models.TransientModel): +# _inherit = 'website.config.settings' +# +# video_id = fields.Char(related='website_id.video_id', string="Youtube Video Id", +# help="Paste Youtube VideoId Here") diff --git a/snippet_video_bg/security/ir.model.access.csv b/snippet_video_bg/security/ir.model.access.csv new file mode 100644 index 000000000..e6a7f6914 --- /dev/null +++ b/snippet_video_bg/security/ir.model.access.csv @@ -0,0 +1,2 @@ +id,name,model_id:id,group_id:id,perm_read,perm_write,perm_create,perm_unlink +access_snippet_video_bg_snippet_video_bg,snippet_video_bg.snippet_video_bg,model_snippet_video_bg_snippet_video_bg,,1,0,0,0 \ No newline at end of file diff --git a/snippet_video_bg/static/description/add.png b/snippet_video_bg/static/description/add.png new file mode 100644 index 000000000..62d17c4ec Binary files /dev/null and b/snippet_video_bg/static/description/add.png differ diff --git a/snippet_video_bg/static/description/banner.jpg b/snippet_video_bg/static/description/banner.jpg new file mode 100644 index 000000000..cd7a1fa74 Binary files /dev/null and b/snippet_video_bg/static/description/banner.jpg differ diff --git a/snippet_video_bg/static/description/cybro_logo.png b/snippet_video_bg/static/description/cybro_logo.png new file mode 100644 index 000000000..bb309114c Binary files /dev/null and b/snippet_video_bg/static/description/cybro_logo.png differ diff --git a/snippet_video_bg/static/description/icon.png b/snippet_video_bg/static/description/icon.png new file mode 100644 index 000000000..133eeefac Binary files /dev/null and b/snippet_video_bg/static/description/icon.png differ diff --git a/snippet_video_bg/static/description/id_prompt.png b/snippet_video_bg/static/description/id_prompt.png new file mode 100644 index 000000000..9a45f60f4 Binary files /dev/null and b/snippet_video_bg/static/description/id_prompt.png differ diff --git a/snippet_video_bg/static/description/index.html b/snippet_video_bg/static/description/index.html new file mode 100644 index 000000000..189bcbc7c --- /dev/null +++ b/snippet_video_bg/static/description/index.html @@ -0,0 +1,161 @@ +
+
+

Website Video Background

+

Cybrosys Technologies

+
+
+
+
+

Make youtube Video as background on website pages

+

+ Get video id from youtube and add it on website. + Eg: https://www.youtube.com/watch?v=uNCr7NdOJgw here uNCr7NdOJgw is your video id. +

+
+ +
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+

Need Any Help?

+
+ +
+ +
+ + + + + +
+
+
+ diff --git a/snippet_video_bg/static/description/new.png b/snippet_video_bg/static/description/new.png new file mode 100644 index 000000000..4f97cc29c Binary files /dev/null and b/snippet_video_bg/static/description/new.png differ diff --git a/snippet_video_bg/static/description/prev1.png b/snippet_video_bg/static/description/prev1.png new file mode 100644 index 000000000..10c76832d Binary files /dev/null and b/snippet_video_bg/static/description/prev1.png differ diff --git a/snippet_video_bg/static/description/prev2.png b/snippet_video_bg/static/description/prev2.png new file mode 100644 index 000000000..9a2424812 Binary files /dev/null and b/snippet_video_bg/static/description/prev2.png differ diff --git a/snippet_video_bg/static/description/prompt.png b/snippet_video_bg/static/description/prompt.png new file mode 100644 index 000000000..53cfd96ed Binary files /dev/null and b/snippet_video_bg/static/description/prompt.png differ diff --git a/snippet_video_bg/static/description/system param.png b/snippet_video_bg/static/description/system param.png new file mode 100644 index 000000000..dd39710d7 Binary files /dev/null and b/snippet_video_bg/static/description/system param.png differ diff --git a/snippet_video_bg/static/description/youtube_id.png b/snippet_video_bg/static/description/youtube_id.png new file mode 100644 index 000000000..d0dd3cce3 Binary files /dev/null and b/snippet_video_bg/static/description/youtube_id.png differ diff --git a/snippet_video_bg/static/lib/jquery.tubular.1.0.js b/snippet_video_bg/static/lib/jquery.tubular.1.0.js new file mode 100644 index 000000000..0374d142d --- /dev/null +++ b/snippet_video_bg/static/lib/jquery.tubular.1.0.js @@ -0,0 +1,148 @@ +/* jQuery tubular plugin +|* by Sean McCambridge +|* http://www.seanmccambridge.com/tubular +|* version: 1.0 +|* updated: October 1, 2012 +|* since 2010 +|* licensed under the MIT License +|* Enjoy. +|* +|* Thanks, +|* Sean */ + +;(function ($, window) { + + // test for feature support and return if failure + + // defaults + var defaults = { + ratio: 16/9, // usually either 4/3 or 16/9 -- tweak as needed + videoId: 'ZCAnLxRvNNc', // toy robot in space is a good default, no? + mute: true, + repeat: true, + width: $(window).width(), + wrapperZIndex: 99, + playButtonClass: 'tubular-play', + pauseButtonClass: 'tubular-pause', + muteButtonClass: 'tubular-mute', + volumeUpClass: 'tubular-volume-up', + volumeDownClass: 'tubular-volume-down', + increaseVolumeBy: 10, + start: 0 + }; + + // methods + + var tubular = function(node, options) { // should be called on the wrapper div + var options = $.extend({}, defaults, options), + $body = $('body') // cache body node + $node = $(node); // cache wrapper node + + // build container + var tubularContainer = '
'; + + // set up css prereq's, inject tubular container and set up wrapper defaults + $('html,body').css({'width': '100%', 'height': '100%'}); + $body.prepend(tubularContainer); + $node.css({position: 'relative', 'z-index': options.wrapperZIndex}); + + // set up iframe player, use global scope so YT api can talk + window.player; + window.onYouTubeIframeAPIReady = function() { + player = new YT.Player('tubular-player', { + width: options.width, + height: Math.ceil(options.width / options.ratio), + videoId: options.videoId, + playerVars: { + controls: 0, + showinfo: 0, + modestbranding: 1, + wmode: 'transparent' + }, + events: { + 'onReady': onPlayerReady, + 'onStateChange': onPlayerStateChange + } + }); + } + + window.onPlayerReady = function(e) { + resize(); + if (options.mute) e.target.mute(); + e.target.seekTo(options.start); + e.target.playVideo(); + } + + window.onPlayerStateChange = function(state) { + if (state.data === 0 && options.repeat) { // video ended and repeat option is set true + player.seekTo(options.start); // restart + } + } + + // resize handler updates width, height and offset of player after resize/init + var resize = function() { + var width = $(window).width(), + pWidth, // player width, to be defined + height = $(window).height(), + pHeight, // player height, tbd + $tubularPlayer = $('#tubular-player'); + + // when screen aspect ratio differs from video, video must center and underlay one dimension + + if (width / options.ratio < height) { // if new video height < window height (gap underneath) + pWidth = Math.ceil(height * options.ratio); // get new player width + $tubularPlayer.width(pWidth).height(height).css({left: (width - pWidth) / 2, top: 0}); // player width is greater, offset left; reset top + } else { // new video width < window width (gap to right) + pHeight = Math.ceil(width / options.ratio); // get new player height + $tubularPlayer.width(width).height(pHeight).css({left: 0, top: (height - pHeight) / 2}); // player height is greater, offset top; reset left + } + + } + + // events + $(window).on('resize.tubular', function() { + resize(); + }) + + $('body').on('click','.' + options.playButtonClass, function(e) { // play button + e.preventDefault(); + player.playVideo(); + }).on('click', '.' + options.pauseButtonClass, function(e) { // pause button + e.preventDefault(); + player.pauseVideo(); + }).on('click', '.' + options.muteButtonClass, function(e) { // mute button + e.preventDefault(); + (player.isMuted()) ? player.unMute() : player.mute(); + }).on('click', '.' + options.volumeDownClass, function(e) { // volume down button + e.preventDefault(); + var currentVolume = player.getVolume(); + if (currentVolume < options.increaseVolumeBy) currentVolume = options.increaseVolumeBy; + player.setVolume(currentVolume - options.increaseVolumeBy); + }).on('click', '.' + options.volumeUpClass, function(e) { // volume up button + e.preventDefault(); + if (player.isMuted()) player.unMute(); // if mute is on, unmute + var currentVolume = player.getVolume(); + if (currentVolume > 100 - options.increaseVolumeBy) currentVolume = 100 - options.increaseVolumeBy; + player.setVolume(currentVolume + options.increaseVolumeBy); + }) + } + + // load yt iframe js api + + var tag = document.createElement('script'); + tag.src = "//www.youtube.com/iframe_api"; + var firstScriptTag = document.getElementsByTagName('script')[0]; + firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); + + // create plugin + + $.fn.tubular = function (options) { + return this.each(function () { + if (!$.data(this, 'tubular_instantiated')) { // let's only run one + $.data(this, 'tubular_instantiated', + tubular(this, options)); + } + }); + } + +})(jQuery, window); \ No newline at end of file diff --git a/snippet_video_bg/static/src/js/bg_video.js b/snippet_video_bg/static/src/js/bg_video.js new file mode 100644 index 000000000..a73b8e484 --- /dev/null +++ b/snippet_video_bg/static/src/js/bg_video.js @@ -0,0 +1,82 @@ +odoo.define('snippet_video_bg.wrapwrap_bg_video', function (require) { + 'use strict'; + + var Dialog = require("web.Dialog"); + var core = require('web.core'); + var Widget = require('web.Widget'); +// var session = require('web.session'); + var base = require('web_editor.base'); + var wUtils = require('website.utils'); + var WebsiteNewMenu = require('website.newMenu'); + var website = require('website.website'); + + var qweb = core.qweb; + var _t = core._t; + base.url_translations = '/website/translations'; + + WebsiteNewMenu.include({ + + actions: _.extend({}, WebsiteNewMenu.prototype.actions || {}, { + new_bg_video_id: '_NewBgVideo', + }), + + //---------------------------------------------------------------------- + // Actions + //---------------------------------------------------------------------- + + /** + * Asks the video url for new video background + * + * @private + */ + _NewBgVideo: function() { + var self = this; + wUtils.prompt({ + id: "bg_video_id", + window_title: _t("Add a YouTube Video Id here"), + input: "Video ID", + }).then(function (id) { +// website.form('/set_video_id', 'POST', { +// id: id +// }); + self._rpc({ + route: '/set_video_id', + params: { + id: id, + }, + }).then(function (url) { + window.location.href = url; + }); + }); + }, + }); +}); + +odoo.define('snippet_video_bg.wrapwrap_bg_video_load', function (require) { + 'use strict'; + var Dialog = require("web.Dialog"); + var core = require('web.core'); + var Widget = require('web.Widget'); + var session = require('web.session'); + var base = require('web_editor.base'); + var Model = require('web.Model'); + + var qweb = core.qweb; + var _t = core._t; + base.url_translations = '/website/translations'; + + $('document').ready(function() { + + session.rpc("/get_video_id", {}) + .done(function(res) { + var options = { + videoId: res.video_id || false, + start: 0, + mute: true, + }; + $('#wrapwrap').tubular(options); + }); + + }); + +}); diff --git a/snippet_video_bg/static/src/js/bg_video.js~ b/snippet_video_bg/static/src/js/bg_video.js~ new file mode 100644 index 000000000..01f950589 --- /dev/null +++ b/snippet_video_bg/static/src/js/bg_video.js~ @@ -0,0 +1,59 @@ +odoo.define('snippet_video_bg.wrapwrap_bg_video', function (require) { + 'use strict'; + + var ajax = require('web.ajax'); + var Dialog = require("web.Dialog"); + var core = require('web.core'); + var Widget = require('web.Widget'); +// var session = require('web.session'); + var base = require('web_editor.base'); + var contentMenu = require('website.contentMenu'); + + var qweb = core.qweb; + var _t = core._t; + base.url_translations = '/website/translations'; + + contentMenu.TopBar.include({ + new_bg_video_id: function() { + website.prompt({ + id: "bg_video_id", + window_title: _t("Add a YouTube Video Id here"), + input: "Video ID", + }).then(function (id) { + website.form('/set_video_id', 'POST', { + id: id + }); + }); + }, + }); +}); + +odoo.define('snippet_video_bg.wrapwrap_bg_video_load', function (require) { + 'use strict'; + var ajax = require('web.ajax'); + var Dialog = require("web.Dialog"); + var core = require('web.core'); + var Widget = require('web.Widget'); + var session = require('web.session'); + var base = require('web_editor.base'); + var Model = require('web.Model'); + + var qweb = core.qweb; + var _t = core._t; + base.url_translations = '/website/translations'; + + $('document').ready(function() { + + session.rpc("/get_video_id", {}) + .done(function(res) { + var options = { + videoId: res.video_id || false, + start: 0, + mute: true, + }; + $('#wrapwrap').tubular(options); + }); + + }); + +}); \ No newline at end of file diff --git a/snippet_video_bg/views/assets.xml b/snippet_video_bg/views/assets.xml new file mode 100644 index 000000000..a365b0727 --- /dev/null +++ b/snippet_video_bg/views/assets.xml @@ -0,0 +1,8 @@ + +