diff --git a/setup/website_snippet_country_phone_code_dropdown/odoo/addons/website_snippet_country_phone_code_dropdown b/setup/website_snippet_country_phone_code_dropdown/odoo/addons/website_snippet_country_phone_code_dropdown new file mode 120000 index 0000000000..67329741f0 --- /dev/null +++ b/setup/website_snippet_country_phone_code_dropdown/odoo/addons/website_snippet_country_phone_code_dropdown @@ -0,0 +1 @@ +../../../../website_snippet_country_phone_code_dropdown \ No newline at end of file diff --git a/setup/website_snippet_country_phone_code_dropdown/setup.py b/setup/website_snippet_country_phone_code_dropdown/setup.py new file mode 100644 index 0000000000..28c57bb640 --- /dev/null +++ b/setup/website_snippet_country_phone_code_dropdown/setup.py @@ -0,0 +1,6 @@ +import setuptools + +setuptools.setup( + setup_requires=['setuptools-odoo'], + odoo_addon=True, +) diff --git a/website_snippet_country_phone_code_dropdown/README.rst b/website_snippet_country_phone_code_dropdown/README.rst new file mode 100644 index 0000000000..f5222c569e --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/README.rst @@ -0,0 +1,126 @@ +=========================================== +Website Snippet Country Phone Code Dropdown +=========================================== + +.. + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! This file is generated by oca-gen-addon-readme !! + !! changes will be overwritten. !! + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! source digest: sha256:af3a26574c6f70e54f7e2131a4c5c429db1d6619b81eb4724517a212f0e0a7af + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + +.. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png + :target: https://odoo-community.org/page/development-status + :alt: Beta +.. |badge2| image:: https://img.shields.io/badge/licence-LGPL--3-blue.png + :target: http://www.gnu.org/licenses/lgpl-3.0-standalone.html + :alt: License: LGPL-3 +.. |badge3| image:: https://img.shields.io/badge/github-OCA%2Fwebsite-lightgray.png?logo=github + :target: https://github.com/OCA/website/tree/16.0/website_snippet_country_phone_code_dropdown + :alt: OCA/website +.. |badge4| image:: https://img.shields.io/badge/weblate-Translate%20me-F47D42.png + :target: https://translation.odoo-community.org/projects/website-16-0/website-16-0-website_snippet_country_phone_code_dropdown + :alt: Translate me on Weblate +.. |badge5| image:: https://img.shields.io/badge/runboat-Try%20me-875A7B.png + :target: https://runboat.odoo-community.org/builds?repo=OCA/website&target_branch=16.0 + :alt: Try me on Runboat + +|badge1| |badge2| |badge3| |badge4| |badge5| + +This module enhances the features of the `website_snippet_country_dropdown` +module, and its implementation and functionality are very similar. It offers a +snippet with a dropdown for selecting a country as well as an input text field +that auto-populates with the corresponding phone code. This module is intended +to serve as a base for other modules to inherit and integrate into HTML forms. + +**Table of contents** + +.. contents:: + :local: + +Usage +===== + +To extend this template, you should inherit the `country_dropdown` template and +add your custom code. This template includes three input text fields, which are +the following: + +#. ``no_country_field``: Field without code country. +#. ``country_phone_code_field``: Field with only country code (read only) +#. ``complete_field``: Field with the previous two joined (hidden) + +The name of the complete field is customizable when user insert the snippet +into a form element with the website editor. + +Development +~~~~~~~~~~~ + +In order to use this element, you can call the reusable Qweb template +`website_snippet_country_phone_code_dropdown.country_dropdown` in your views or +forms to add a sensible country-combined field, which could be a useful element +for the registration of international phone numbers. + +**Default Country Selection** + +The default country will be determined by the first match among: + +#. Extracted from the `default_country` variable. +#. Extracted from the `default_value_prefix` variable, searching by phone code. +#. The current user's country. +#. The current website's company's country. +#. The first country in the list. + +**Variables** + +All variables you can use to modify its behavior: + +#. ``complete_field``: To give the form information a name. Habitually it will + match the field name. +#. ``default_value_prefix``: The phone prefix to be used in the complete_field. +#. ``default_value_number``: The phone number to be used in the complete_field. +#. ``countries``: A recordset of res.country containing all the available + countries. +#. ``default_country``: A res.country record representing the default country. +#. ``no_country_placeholder``: A placeholder text for the phone number input + field. + +Bug Tracker +=========== + +Bugs are tracked on `GitHub Issues `_. +In case of trouble, please check there if your issue has already been reported. +If you spotted it first, help us to smash it by providing a detailed and welcomed +`feedback `_. + +Do not contact contributors directly about support or help with technical issues. + +Credits +======= + +Authors +~~~~~~~ + +* ForgeFlow + +Contributors +~~~~~~~~~~~~ + +* Laura Cazorla + +Maintainers +~~~~~~~~~~~ + +This module is maintained by the OCA. + +.. image:: https://odoo-community.org/logo.png + :alt: Odoo Community Association + :target: https://odoo-community.org + +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. + +This module is part of the `OCA/website `_ project on GitHub. + +You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute. diff --git a/website_snippet_country_phone_code_dropdown/__init__.py b/website_snippet_country_phone_code_dropdown/__init__.py new file mode 100644 index 0000000000..b9a9d2d72f --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/__init__.py @@ -0,0 +1 @@ +# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). diff --git a/website_snippet_country_phone_code_dropdown/__manifest__.py b/website_snippet_country_phone_code_dropdown/__manifest__.py new file mode 100644 index 0000000000..6409c26ef8 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/__manifest__.py @@ -0,0 +1,27 @@ +# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). + +{ + "name": "Website Snippet Country Phone Code Dropdown", + "summary": "Allow to select country in a dropdown, and fill with phone code", + "version": "16.0.1.0.0", + "category": "Website", + "website": "https://github.com/OCA/website", + "author": "ForgeFlow, Odoo Community Association (OCA)", + "license": "LGPL-3", + "application": False, + "installable": True, + "depends": ["website_snippet_country_dropdown"], + "data": ["views/snippets.xml"], + "demo": ["demo/pages.xml"], + "assets": { + "web.assets_tests": [ + "/website_snippet_country_phone_code_dropdown/static/src/js/" + "web_tour_country_phone_code_dropdown.js" + ], + "web.assets_frontend": [ + "/website_snippet_country_phone_code_dropdown/static/src/css/style.scss", + "/website_snippet_country_phone_code_dropdown/static/src/js/" + "website_snippet_country_phone_code_dropdown.js", + ], + }, +} diff --git a/website_snippet_country_phone_code_dropdown/demo/pages.xml b/website_snippet_country_phone_code_dropdown/demo/pages.xml new file mode 100644 index 0000000000..661ec23589 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/demo/pages.xml @@ -0,0 +1,100 @@ + + + + + + + True + /website_snippet_country_phone_code_dropdown.demo_page + + + + Country Phone Code Dropdown Demo + /website_snippet_country_phone_code_dropdown.demo_page + + 50 + + + diff --git a/website_snippet_country_phone_code_dropdown/readme/CONTRIBUTORS.rst b/website_snippet_country_phone_code_dropdown/readme/CONTRIBUTORS.rst new file mode 100644 index 0000000000..6d1dbddb92 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/readme/CONTRIBUTORS.rst @@ -0,0 +1 @@ +* Laura Cazorla diff --git a/website_snippet_country_phone_code_dropdown/readme/DESCRIPTION.rst b/website_snippet_country_phone_code_dropdown/readme/DESCRIPTION.rst new file mode 100644 index 0000000000..324fadd0cf --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/readme/DESCRIPTION.rst @@ -0,0 +1,5 @@ +This module enhances the features of the `website_snippet_country_dropdown` +module, and its implementation and functionality are very similar. It offers a +snippet with a dropdown for selecting a country as well as an input text field +that auto-populates with the corresponding phone code. This module is intended +to serve as a base for other modules to inherit and integrate into HTML forms. diff --git a/website_snippet_country_phone_code_dropdown/readme/USAGE.rst b/website_snippet_country_phone_code_dropdown/readme/USAGE.rst new file mode 100644 index 0000000000..20feda9f19 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/readme/USAGE.rst @@ -0,0 +1,42 @@ +To extend this template, you should inherit the `country_dropdown` template and +add your custom code. This template includes three input text fields, which are +the following: + +#. ``no_country_field``: Field without code country. +#. ``country_phone_code_field``: Field with only country code (read only) +#. ``complete_field``: Field with the previous two joined (hidden) + +The name of the complete field is customizable when user insert the snippet +into a form element with the website editor. + +Development +~~~~~~~~~~~ + +In order to use this element, you can call the reusable Qweb template +`website_snippet_country_phone_code_dropdown.country_dropdown` in your views or +forms to add a sensible country-combined field, which could be a useful element +for the registration of international phone numbers. + +**Default Country Selection** + +The default country will be determined by the first match among: + +#. Extracted from the `default_country` variable. +#. Extracted from the `default_value_prefix` variable, searching by phone code. +#. The current user's country. +#. The current website's company's country. +#. The first country in the list. + +**Variables** + +All variables you can use to modify its behavior: + +#. ``complete_field``: To give the form information a name. Habitually it will + match the field name. +#. ``default_value_prefix``: The phone prefix to be used in the complete_field. +#. ``default_value_number``: The phone number to be used in the complete_field. +#. ``countries``: A recordset of res.country containing all the available + countries. +#. ``default_country``: A res.country record representing the default country. +#. ``no_country_placeholder``: A placeholder text for the phone number input + field. diff --git a/website_snippet_country_phone_code_dropdown/static/description/index.html b/website_snippet_country_phone_code_dropdown/static/description/index.html new file mode 100644 index 0000000000..895b955e86 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/static/description/index.html @@ -0,0 +1,473 @@ + + + + + +Website Snippet Country Phone Code Dropdown + + + +
+

Website Snippet Country Phone Code Dropdown

+ + +

Beta License: LGPL-3 OCA/website Translate me on Weblate Try me on Runboat

+

This module enhances the features of the website_snippet_country_dropdown +module, and its implementation and functionality are very similar. It offers a +snippet with a dropdown for selecting a country as well as an input text field +that auto-populates with the corresponding phone code. This module is intended +to serve as a base for other modules to inherit and integrate into HTML forms.

+

Table of contents

+ +
+

Usage

+

To extend this template, you should inherit the country_dropdown template and +add your custom code. This template includes three input text fields, which are +the following:

+
    +
  1. no_country_field: Field without code country.
    2. +
  2. country_phone_code_field: Field with only country code (read only)
    3. +
  3. complete_field: Field with the previous two joined (hidden)
    4. +
+

The name of the complete field is customizable when user insert the snippet +into a form element with the website editor.

+
+

Development

+

In order to use this element, you can call the reusable Qweb template +website_snippet_country_phone_code_dropdown.country_dropdown in your views or +forms to add a sensible country-combined field, which could be a useful element +for the registration of international phone numbers.

+

Default Country Selection

+

The default country will be determined by the first match among:

+
    +
  1. Extracted from the default_country variable.
    2. +
  2. Extracted from the default_value_prefix variable, searching by phone code.
    3. +
  3. The current user’s country.
    4. +
  4. The current website’s company’s country.
    5. +
  5. The first country in the list.
    6. +
+

Variables

+

All variables you can use to modify its behavior:

+
    +
  1. complete_field: To give the form information a name. Habitually it will +match the field name.
    2. +
  2. default_value_prefix: The phone prefix to be used in the complete_field.
    3. +
  3. default_value_number: The phone number to be used in the complete_field.
    4. +
  4. countries: A recordset of res.country containing all the available +countries.
    5. +
  5. default_country: A res.country record representing the default country.
    6. +
  6. no_country_placeholder: A placeholder text for the phone number input +field.
    7. +
+
+
+
+

Bug Tracker

+

Bugs are tracked on GitHub Issues. +In case of trouble, please check there if your issue has already been reported. +If you spotted it first, help us to smash it by providing a detailed and welcomed +feedback.

+

Do not contact contributors directly about support or help with technical issues.

+
+
+

Credits

+
+

Authors

+
    +
  • ForgeFlow
    • +
+
+
+

Contributors

+ +
+
+

Maintainers

+

This module is maintained by the OCA.

+ +Odoo Community Association + +

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.

+

This module is part of the OCA/website project on GitHub.

+

You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute.

+
+
+
+ + diff --git a/website_snippet_country_phone_code_dropdown/static/src/css/style.scss b/website_snippet_country_phone_code_dropdown/static/src/css/style.scss new file mode 100644 index 0000000000..f609a4f4c8 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/static/src/css/style.scss @@ -0,0 +1,6 @@ +/* Copyright 2015-2016 Jairo Llopis + License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl.html).*/ + +.js_country_phone_code_dropdown { + @extend .js_country_dropdown; +} diff --git a/website_snippet_country_phone_code_dropdown/static/src/js/web_tour_country_phone_code_dropdown.js b/website_snippet_country_phone_code_dropdown/static/src/js/web_tour_country_phone_code_dropdown.js new file mode 100644 index 0000000000..1d3e2ce43e --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/static/src/js/web_tour_country_phone_code_dropdown.js @@ -0,0 +1,72 @@ +odoo.define( + "website_snippet_country_phone_code_dropdown.tour_demo_page", + function (require) { + "use strict"; + + const tour = require("web_tour.tour"); + const country_phone_code_test = "34"; + const number_test = "111 22 33 44"; + + tour.register( + "website_snippet_country_phone_code_dropdown_tour_demo_page", + { + url: "/website_snippet_country_phone_code_dropdown.demo_page", + }, + [ + { + content: "Click Button", + trigger: ".js_enabled .js_btn_country_phone_code", + run: "click", + }, + { + content: "Select Country", + trigger: _.str.sprintf( + ".js_enabled [data-country_phone_code=%s]", + country_phone_code_test + ), + run: "click", + }, + { + content: "Insert text", + trigger: ".js_enabled .js_no_country_field", + extra_trigger: + ".js_enabled .js_btn_country_phone_code[data-country_phone_code=34]", + run: "text " + number_test, + }, + { + trigger: ".btn[type=submit]", + run: "click", + }, + { + trigger: + ".js_enabled .js_btn_country_phone_code[data-country_phone_code=1]", + run: function () { + const checks = { + country_phone_code_field: "+34", + complete_field: "+34 111 22 33 44", + no_country_field: "111 22 33 44", + disabled_complete_field: "+33 6 00 11 22 33", + disabled_country_phone_code_field: "+33", + disabled_no_country_field: "6 00 11 22 33", + }; + const query = new URLSearchParams(location.search); + for (const field_name in checks) { + const real = query.get(field_name), + expected = checks[field_name]; + if (real !== expected) { + console.error( + "Tour error: param", + field_name, + "is", + real, + "but should be", + expected + ); + } + } + }, + }, + ] + ); + } +); diff --git a/website_snippet_country_phone_code_dropdown/static/src/js/website_snippet_country_phone_code_dropdown.js b/website_snippet_country_phone_code_dropdown/static/src/js/website_snippet_country_phone_code_dropdown.js new file mode 100644 index 0000000000..d1b009d391 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/static/src/js/website_snippet_country_phone_code_dropdown.js @@ -0,0 +1,75 @@ +/* License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl.html). */ + +odoo.define("website_snippet_country_phone_code_dropdown.dropdown", function (require) { + "use strict"; + const animation = require("website.content.snippets.animation"); + const countryCodeDropdown = animation.registry.website_snippet_country_dropdown; + + const CountryPhoneCodeDropdown = animation.Class.extend({ + selector: ".js_country_phone_code_dropdown", + start: function () { + this._super.apply(this, arguments); + this.prototype = countryCodeDropdown.prototype; + this.$flag_selector = this.$target.find(".js_select_country_phone_code"); + this.$img_code = this.$target.find(".js_img_country_code"); + this.$btn_country_phone_code = this.$target.find( + ".js_btn_country_phone_code" + ); + this.$dropdown_list = this.$target.find("#dropdown-countries"); + this.$country_phone_code_field = this.$target.find( + ".js_country_phone_code_field" + ); + this.$no_country_field = this.$target.find(".js_no_country_field"); + this.$complete_field_post = this.$target.find(".js_complete_field_post"); + this.$flag_selector.on("click", $.proxy(this.set_value, this)); + this.$no_country_field.on( + "change", + $.proxy(this.on_change_no_country_field, this) + ); + this.$dropdown_list.on( + "scroll", + _.debounce(this.lazy_image_load.bind(this), 35) + ); + this.$target.on("shown.bs.dropdown", this.lazy_image_load.bind(this)); + }, + + set_value: function (event) { + this.country_phone_code = event.currentTarget.dataset.country_phone_code; + this.$flag_selector.val(event.currentTarget.id); + this.$img_code.attr("src", event.currentTarget.dataset.country_image_url); + this.$btn_country_phone_code.attr( + "data-country_phone_code", + event.currentTarget.dataset.country_phone_code + ); + this.$country_phone_code_field.val( + "+" + event.currentTarget.dataset.country_phone_code + ); + $(this.country_phone_code) + .children() + .text("+" + String(event.currentTarget.dataset.country_phone_code)); + this.join_value( + event.currentTarget.dataset.country_phone_code, + this.$no_country_field.val() + ); + }, + join_value: function (country_phone_code, value) { + this.$complete_field_post.val(country_phone_code.concat(" " + value)); + }, + on_change_no_country_field: function () { + return this.join_value( + this.$country_phone_code_field.val(), + this.$no_country_field.val() + ); + }, + + is_option_visible: function (elm) { + return this.prototype.is_option_visible.call(this, elm); + }, + lazy_image_load: function () { + return this.prototype.lazy_image_load.call(this); + }, + }); + + animation.registry.website_snippet_country_phone_code_dropdown = + CountryPhoneCodeDropdown; +}); diff --git a/website_snippet_country_phone_code_dropdown/tests/__init__.py b/website_snippet_country_phone_code_dropdown/tests/__init__.py new file mode 100644 index 0000000000..6a51f633ba --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/tests/__init__.py @@ -0,0 +1,3 @@ +# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). + +from . import test_snippet_country_phone_code_dropdown diff --git a/website_snippet_country_phone_code_dropdown/tests/test_snippet_country_phone_code_dropdown.py b/website_snippet_country_phone_code_dropdown/tests/test_snippet_country_phone_code_dropdown.py new file mode 100644 index 0000000000..a05b55d4ad --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/tests/test_snippet_country_phone_code_dropdown.py @@ -0,0 +1,11 @@ +# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). +import odoo.tests + + +class TestUi(odoo.tests.HttpCase): + def test_01_demo_country_phone_code_dropdown_tour(self): + self.start_tour( + "/", + "website_snippet_country_phone_code_dropdown_tour_demo_page", + login="admin", + ) diff --git a/website_snippet_country_phone_code_dropdown/views/snippets.xml b/website_snippet_country_phone_code_dropdown/views/snippets.xml new file mode 100644 index 0000000000..30d921b5c7 --- /dev/null +++ b/website_snippet_country_phone_code_dropdown/views/snippets.xml @@ -0,0 +1,119 @@ + + + + + + +