diff --git a/web_widget_image_webcam/__manifest__.py b/web_widget_image_webcam/__manifest__.py index 9cfe13c72..5cebbea8b 100644 --- a/web_widget_image_webcam/__manifest__.py +++ b/web_widget_image_webcam/__manifest__.py @@ -4,15 +4,21 @@ { "name": "Web Widget - Image WebCam", "summary": "Allows to take image with WebCam", - "version": "14.0.1.0.1", + "version": "16.0.1.0.0", "category": "web", "website": "https://github.com/OCA/web", "author": "Tech Receptives, " "Kaushal Prajapati, " "Odoo Community Association (OCA)", "license": "LGPL-3", - "data": ["views/assets.xml"], "depends": ["web"], - "qweb": ["static/src/xml/web_widget_image_webcam.xml"], + "assets": { + "web.assets_backend": [ + "web_widget_image_webcam/static/src/lib/webcam.js", + "web_widget_image_webcam/static/src/js/webcam_widget.js", + "web_widget_image_webcam/static/src/css/web_widget_image_webcam.css", + "web_widget_image_webcam/static/src/xml/web_widget_image_webcam.xml", + ] + }, "installable": True, } diff --git a/web_widget_image_webcam/readme/CONFIGURE.rst b/web_widget_image_webcam/readme/CONFIGURE.rst index bfcfc6cf5..6b665b476 100644 --- a/web_widget_image_webcam/readme/CONFIGURE.rst +++ b/web_widget_image_webcam/readme/CONFIGURE.rst @@ -8,6 +8,6 @@ Visit this for `more info But, If you still want this module to work with websites without SSL / HTTPS. Here is the steps to do it easily (Always run in Adobe Flash fallback mode, but it is not desirable). -Set the configuration parameter ``web_widget_image_webcam.flash_fallback_mode`` to ``1`` +Set the configuration parameter ``web_widget_image_webcam.flash_fallback_mode`` to ``1`` (note that configuration will be applied after browser reload). Its done! Now this module also work with websites without SSL / HTTPS. diff --git a/web_widget_image_webcam/static/src/js/webcam_widget.js b/web_widget_image_webcam/static/src/js/webcam_widget.js index 4d10ad36a..eba2f3134 100644 --- a/web_widget_image_webcam/static/src/js/webcam_widget.js +++ b/web_widget_image_webcam/static/src/js/webcam_widget.js @@ -9,19 +9,19 @@ odoo.define("web_widget_image_webcam.webcam_widget", function (require) { var core = require("web.core"); var rpc = require("web.rpc"); var Dialog = require("web.Dialog"); - var FieldBinaryImage = require("web.basic_fields").FieldBinaryImage; + const {patch} = require("@web/core/utils/patch"); + const {ImageField} = require("@web/views/fields/image/image_field"); var _t = core._t; var QWeb = core.qweb; - FieldBinaryImage.include({ - _render: function () { - this._super(); - - var self = this, - WebCamDialog = $(QWeb.render("WebCamDialog")), - img_data = false; + const getWebcamFlashFallbackModeConfig = rpc.query({ + model: "ir.config_parameter", + method: "get_webcam_flash_fallback_mode_config", + }); + patch(ImageField.prototype, "web_widget_image_webcam", { + async _setWebcamParams() { // ::webcamjs:: < https://github.com/jhuckaby/webcamjs > // Webcam: Set Custom Parameters Webcam.set({ @@ -31,107 +31,94 @@ odoo.define("web_widget_image_webcam.webcam_widget", function (require) { dest_height: 240, image_format: "jpeg", jpeg_quality: 90, - force_flash: false, + force_flash: (await getWebcamFlashFallbackModeConfig) === "1", fps: 45, swfURL: "/web_widget_image_webcam/static/src/lib/webcam.swf", }); + }, - rpc.query({ - model: "ir.config_parameter", - method: "get_webcam_flash_fallback_mode_config", - }).then(function (default_flash_fallback_mode) { - if (default_flash_fallback_mode === 1) { - Webcam.set({ - /* - :: Important Note about Chrome 47+ :: < https://github.com/jhuckaby/webcamjs#important-note-for-chrome-47 > - Setting "force_flash" to "true" will always run in Adobe Flash fallback mode on Chrome, but it is not desirable. - */ - force_flash: true, - }); - } + onWebcamClicked() { + var self = this, + WebCamDialog = $(QWeb.render("WebCamDialog")), + img_data = false; + + self._setWebcamParams(); + + var dialog = new Dialog(self, { + size: "large", + dialogClass: "o_act_window", + title: _t("WebCam Booth"), + $content: WebCamDialog, + buttons: [ + { + text: _t("Take Snapshot"), + classes: "btn-primary take_snap_btn", + click: function () { + Webcam.snap(function (data) { + img_data = data; + // Display Snap besides Live WebCam Preview + WebCamDialog.find("#webcam_result").html( + '' + ); + }); + if (Webcam.live) { + // Remove "disabled" attr from "Save & Close" button + $(".save_close_btn").removeAttr("disabled"); + } + }, + }, + { + text: _t("Save & Close"), + classes: "btn-primary save_close_btn", + close: true, + click: function () { + var img_data_base64 = img_data.split(",")[1]; + + /* + Size in base64 is approx 33% overhead the original data size. + + Source: -> http://stackoverflow.com/questions/11402329/base64-encoded-image-size + -> http://stackoverflow.com/questions/6793575/estimating-the-size-of-binary-data-encoded-as-a-b64-string-in-python + + -> https://en.wikipedia.org/wiki/Base64 + [ The ratio of output bytes to input bytes is 4:3 (33% overhead). + Specifically, given an input of n bytes, the output will be "4[n/3]" bytes long in base64, + including padding characters. ] + */ + + // From the above info, we doing the opposite stuff to find the approx size of Image in bytes. + var approx_img_size = + 3 * (img_data_base64.length / 4) - + (img_data_base64.match(/[=]+$/g) || []).length; + // Like... "3[n/4]" + + // Upload image in Binary Field + self.onFileUploaded({ + size: approx_img_size, + name: "web-cam-preview.jpeg", + type: "image/jpeg", + data: img_data_base64, + }); + }, + }, + { + text: _t("Close"), + close: true, + }, + ], + }).open(); + + dialog.opened().then(function () { + Webcam.attach("#live_webcam"); + + // At time of Init "Save & Close" button is disabled + $(".save_close_btn").attr("disabled", "disabled"); + + // Placeholder Image in the div "webcam_result" + WebCamDialog.find("#webcam_result").html( + '' + ); }); - - self.$el - .find(".o_form_binary_file_web_cam") - .off() - .on("click", function () { - // Init Webcam - var dialog = new Dialog(self, { - size: "large", - dialogClass: "o_act_window", - title: _t("WebCam Booth"), - $content: WebCamDialog, - buttons: [ - { - text: _t("Take Snapshot"), - classes: "btn-primary take_snap_btn", - click: function () { - Webcam.snap(function (data) { - img_data = data; - // Display Snap besides Live WebCam Preview - WebCamDialog.find("#webcam_result").html( - '' - ); - }); - if (Webcam.live) { - // Remove "disabled" attr from "Save & Close" button - $(".save_close_btn").removeAttr("disabled"); - } - }, - }, - { - text: _t("Save & Close"), - classes: "btn-primary save_close_btn", - close: true, - click: function () { - var img_data_base64 = img_data.split(",")[1]; - - /* - Size in base64 is approx 33% overhead the original data size. - - Source: -> http://stackoverflow.com/questions/11402329/base64-encoded-image-size - -> http://stackoverflow.com/questions/6793575/estimating-the-size-of-binary-data-encoded-as-a-b64-string-in-python - - -> https://en.wikipedia.org/wiki/Base64 - [ The ratio of output bytes to input bytes is 4:3 (33% overhead). - Specifically, given an input of n bytes, the output will be "4[n/3]" bytes long in base64, - including padding characters. ] - */ - - // From the above info, we doing the opposite stuff to find the approx size of Image in bytes. - var approx_img_size = - 3 * (img_data_base64.length / 4) - - (img_data_base64.match(/[=]+$/g) || []).length; - // Like... "3[n/4]" - - // Upload image in Binary Field - self.on_file_uploaded( - approx_img_size, - "web-cam-preview.jpeg", - "image/jpeg", - img_data_base64 - ); - }, - }, - { - text: _t("Close"), - close: true, - }, - ], - }).open(); - - dialog.opened().then(function () { - Webcam.attach("#live_webcam"); - - // At time of Init "Save & Close" button is disabled - $(".save_close_btn").attr("disabled", "disabled"); - - // Placeholder Image in the div "webcam_result" - WebCamDialog.find("#webcam_result").html( - '' - ); - }); - }); }, }); diff --git a/web_widget_image_webcam/static/src/xml/web_widget_image_webcam.xml b/web_widget_image_webcam/static/src/xml/web_widget_image_webcam.xml index 05116942d..7240073f5 100644 --- a/web_widget_image_webcam/static/src/xml/web_widget_image_webcam.xml +++ b/web_widget_image_webcam/static/src/xml/web_widget_image_webcam.xml @@ -2,11 +2,22 @@ -