Merge pull request #881 from modoolar/web_widget_image_url

[ADD][11.0] Adding module web_widget_image_url

web_widget_image_url/README.rst

@@ -0,0 +1,56 @@
+.. image:: https://www.gnu.org/graphics/lgplv3-147x51.png
+   :target: https://www.gnu.org/licenses/lgpl-3.0.en.html
+   :alt: License: LGPL-v3
+
+=============
+Web Image URL
+=============
+
+This module provides web widget for displaying image from URL on form and tree views.
+
+Usage
+=====
+
+To use this module, you need to decorate xml field with widget ``image_url``.
+
+
+.. code-block:: xml
+
+    <field name="avatar" widget="image_url" class="oe_image_small" width="100px" height="100px"/>
+
+Here's an examples of how images looks like on a form
+
+.. figure:: static/description/image.png
+
+Bug Tracker
+===========
+
+Bugs are tracked on `GitHub Issues
+<https://github.com/OCA/web/issues>`_. In case of trouble, please
+check there if your issue has already been reported. If you spotted it first,
+help us smash it by providing detailed and welcomed feedback.
+
+Credits
+=======
+
+Contributors
+------------
+
+* Petar Najman <petar.najman@modoolar.com>
+* Sladjan Kantar <sladjan.kantar@modoolar.com>
+
+
+Maintainer
+----------
+
+.. image:: https://odoo-community.org/logo.png
+   :alt: Odoo Community Association
+   :target: https://odoo-community.org
+
+This module is maintained by the OCA.
+
+OCA, or the Odoo Community Association, is a nonprofit organization whose
+mission is to support the collaborative development of Odoo features and
+promote its widespread use.
+
+To contribute to this module, please visit https://odoo-community.org.

web_widget_image_url/__manifest__.py

@@ -0,0 +1,17 @@
+# Copyright 2017 - 2018 Modoolar <info@modoolar.com>
+# License LGPLv3.0 or later (https://www.gnu.org/licenses/lgpl-3.0.en.html).
+{
+    "name": "Web Image URL",
+    "summary": "This module provides web widget for displaying image from URL",
+    "category": "Web",
+    "version": "11.0.1.0.0",
+    "license": "LGPL-3",
+    "author": "Modoolar, Odoo Community Association (OCA)",
+    "website": "https://github.com/OCA/web/",
+    "depends": ["web"],
+    "data": [
+        "views/web_widget_image_url.xml",
+    ],
+    "qweb": ["static/src/xml/*.xml"],
+    "installable": True,
+}

web_widget_image_url/static/src/js/web_widget_image_url.js

@@ -0,0 +1,36 @@
+// Copyright 2017 - 2018 Modoolar <info@modoolar.com>
+// License LGPLv3.0 or later (https://www.gnu.org/licenses/lgpl-3.0.en.html).
+
+odoo.define('web_widget_image_url.FieldImageURL', function (require) {
+"use strict";
+
+    var AbstractField = require('web.AbstractField');
+    var core = require('web.core');
+    var registry = require('web.field_registry');
+    var QWeb = core.qweb;
+    var _t = core._t;
+
+    var UrlImage = AbstractField.extend({
+        className: 'o_attachment_image',
+        template: 'FieldImageURL',
+        placeholder: "/web/static/src/img/placeholder.png",
+        supportedFieldTypes: ['char'],
+
+        url(){
+            return this.value ? this.value : this.placeholder;
+        },
+
+        _render() {
+            this._super(arguments);
+
+            var self = this;
+            var $img = this.$("img:first");
+            $img.on('error', function() {
+                $img.attr('src', self.placeholder);
+                self.do_warn(_t("Image"), _t("Could not display the selected image."));
+            });
+        }
+    });
+
+    registry.add('image_url', UrlImage);
+});

web_widget_image_url/static/src/xml/web_widget_image_url.xml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+# Copyright 2017 - 2018 Modoolar <info@modoolar.com>
+# License LGPLv3.0 or later (https://www.gnu.org/licenses/lgpl-3.0.en.html).
+-->
+<templates xml:space="preserve">
+<t t-name="FieldImageURL">
+    <span class="oe_form_field oe_form_field_image" t-att-style="widget.attrs.style">
+        <img t-att-src="widget.url()"
+        t-att-border="widget.readonly ? 0 : 1"
+        t-att-name="widget.name"
+        t-att-width="widget.attrs.img_width || widget.attrs.width"
+        t-att-height="widget.attrs.img_height || widget.attrs.height"
+    />
+    </span>
+</t>
+</templates>

web_widget_image_url/views/web_widget_image_url.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+# Copyright 2017 - 2018 Modoolar <info@modoolar.com>
+# License LGPLv3.0 or later (https://www.gnu.org/licenses/lgpl-3.0.en.html).
+-->
+<odoo>
+    <template id="assets_backend" name="web_widget_image_url assets" inherit_id="web.assets_backend">
+        <xpath expr="." position="inside">
+            <script type="text/javascript" src="/web_widget_image_url/static/src/js/web_widget_image_url.js" />
+        </xpath>
+    </template>
+</odoo>