+
+
+
+
+
+ 
+
+
+
+
+
+
+ Community
+
+
+ Enterprise
+
+
+ Odoo.sh
+
+
+
+
+
+
+
+ 
+
+ + Website Pre-Loader
++ Add Custom Pre-Loader Style To Website. +
+ +
+
+
+
+ 
+
+
+ + Explore This + Module
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Overview +
+
+
+
+
+
+
+ This module allows users to customize the pre-loader
+ style for the website by selecting a preferred style in the
+ configuration settings. The selected style will be applied
+ to every loading screen.
+
+
+
+
+ 
+
+
+ + Features +
+
+
+
+
+
+
+
+
+ 
+ Enable Website pre-loader & choose loading styles
+
+
+ Enable Website pre-loader & choose loading styles
+
+
+ Lot of styles to display pre-loader.
+
+
+
+ Lot of styles to display pre-loader.
+
+
+
+ Easy to use
+
+
+ Easy to use
+
+
+
+
+
+ Compatible with Community, Enterprise, and Odoo.sh.
+
+
+ Compatible with Community, Enterprise, and Odoo.sh.
+
+
+
+ 
+
+
+ + Screenshots +
+
+
+
+
+
+
+
+
+ 
+
+ + Enable Website pre-loader +
++ Enable 'Website pre-loader' in website configuration. Then you + can choose the loader style.
+
+
+ 
+
+ + Lot of Style Options. +
++ We have multiple options to choose the website pre-loader + style.
+
+
+ 
+
+ + Attractive Styles. +
++ On Loading the website we can see the loading style.
+
+
+ 
+
+ + On changing the loader style we can see the style is + changing.
+
+
+ 
+
+ + On changing the loader style we can see the style is + changing
+
+
+ 
+
+ + On Payment Confirmation +
++ On website sale by confirming the payment,
+
+
+ 
+
+ + The loader will run.
+
+
+
+
+ 
+
+
+ + Related + Products +
+
+
+
+
+
+
+
+ 
+ 
+ 
+ 
+ 
+
+
+
+ 
+
+
+ + Our Services +
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Odoo + Customization
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+ 
+
+
+ + Odoo + Support
+
+
+
+ 
+
+
+ + Hire + Odoo + Developer
+
+
+
+ 
+
+
+ + Odoo + Integration
+
+
+
+ 
+
+
+ + Odoo + Migration
+
+
+
+ 
+
+
+ + Odoo + Consultancy
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+ 
+
+
+ + Odoo + Licensing Consultancy
+
+
+
+ 
+
+
+ + Our + Industries +
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Trading +
++ Easily procure + and + sell your products
+
+
+
+ 
+
+
+ + POS +
++ Easy + configuration + and convivial experience
+
+
+
+ 
+
+
+ + Education +
++ A platform for + educational management
+
+
+
+ 
+
+
+ + Manufacturing +
++ Plan, track and + schedule your operations
+
+
+
+ 
+
+
+ + E-commerce & Website +
++ Mobile + friendly, + awe-inspiring product pages
+
+
+
+ 
+
+
+ + Service Management +
++ Keep track of + services and invoice
+
+
+
+ 
+
+
+ + Restaurant +
++ Run your bar or + restaurant methodically
+
+
+
+ 
+
+
+ + Hotel Management +
++ An + all-inclusive + hotel management application
+
+
+
+ 
+
+
+ + Support +
+
+
+
\ No newline at end of file
diff --git a/website_pre_loader_style/static/src/img/bean eater.png b/website_pre_loader_style/static/src/img/bean eater.png
new file mode 100644
index 000000000..d4d42422c
Binary files /dev/null and b/website_pre_loader_style/static/src/img/bean eater.png differ
diff --git a/website_pre_loader_style/static/src/img/cube.png b/website_pre_loader_style/static/src/img/cube.png
new file mode 100644
index 000000000..af8759dbe
Binary files /dev/null and b/website_pre_loader_style/static/src/img/cube.png differ
diff --git a/website_pre_loader_style/static/src/img/disk.png b/website_pre_loader_style/static/src/img/disk.png
new file mode 100644
index 000000000..88c891261
Binary files /dev/null and b/website_pre_loader_style/static/src/img/disk.png differ
diff --git a/website_pre_loader_style/static/src/img/dual.png b/website_pre_loader_style/static/src/img/dual.png
new file mode 100644
index 000000000..53c9c6810
Binary files /dev/null and b/website_pre_loader_style/static/src/img/dual.png differ
diff --git a/website_pre_loader_style/static/src/img/gear.png b/website_pre_loader_style/static/src/img/gear.png
new file mode 100644
index 000000000..c88aa5eb2
Binary files /dev/null and b/website_pre_loader_style/static/src/img/gear.png differ
diff --git a/website_pre_loader_style/static/src/img/infinity.png b/website_pre_loader_style/static/src/img/infinity.png
new file mode 100644
index 000000000..4a772a29f
Binary files /dev/null and b/website_pre_loader_style/static/src/img/infinity.png differ
diff --git a/website_pre_loader_style/static/src/img/pulse.png b/website_pre_loader_style/static/src/img/pulse.png
new file mode 100644
index 000000000..41c62c0c8
Binary files /dev/null and b/website_pre_loader_style/static/src/img/pulse.png differ
diff --git a/website_pre_loader_style/static/src/img/ripple.png b/website_pre_loader_style/static/src/img/ripple.png
new file mode 100644
index 000000000..7e7b179a5
Binary files /dev/null and b/website_pre_loader_style/static/src/img/ripple.png differ
diff --git a/website_pre_loader_style/static/src/img/spinner.png b/website_pre_loader_style/static/src/img/spinner.png
new file mode 100644
index 000000000..a52de1d16
Binary files /dev/null and b/website_pre_loader_style/static/src/img/spinner.png differ
diff --git a/website_pre_loader_style/static/src/js/block_ui.js b/website_pre_loader_style/static/src/js/block_ui.js
new file mode 100644
index 000000000..49ada6e27
--- /dev/null
+++ b/website_pre_loader_style/static/src/js/block_ui.js
@@ -0,0 +1,42 @@
+/** @odoo-module **/
+import {
+ BlockUI
+} from "@web/core/ui/block_ui";
+import { patch } from "@web/core/utils/patch";
+import { xml } from "@odoo/owl";
+const { useState } = owl;
+const rpc = require('web.rpc');
+/**
+ * Customization of BlockUI setup method to handle the loading spinner and message.
+ */
+patch(BlockUI.prototype, 'blockUi', {
+ /**
+ * Custom setup method.
+ */
+ setup() {
+ this._super.apply(this, arguments);
+ this.spin_state = useState({
+ loader_style: ''
+ });
+ const self = this;
+ rpc.query({
+ model: 'ir.config_parameter',
+ method: 'get_param',
+ args: ['website_pre_loader_style.loader_style'],
+ }).then(function(result) {
+ self.spin_state.loader_style = result;
+ });
+ }
+});
+BlockUI.template = xml`
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ 
+
+
+
+
+
+
`;
diff --git a/website_pre_loader_style/static/src/js/payment_processing.js b/website_pre_loader_style/static/src/js/payment_processing.js
new file mode 100644
index 000000000..93ff7abd1
--- /dev/null
+++ b/website_pre_loader_style/static/src/js/payment_processing.js
@@ -0,0 +1,32 @@
+odoo.define('website_pre_loader_style.payment_post_processing', function(require) {
+ 'use strict';
+ /**
+ * Module for customizing payment post-processing behavior.
+ */
+ var PaymentPostProcessing = require('payment.post_processing');
+ var _t = require('web.core')._t;
+ const rpc = require('web.rpc');
+ PaymentPostProcessing.include({
+ /**
+ * Overrides the displayLoading method to show a custom loading message with a pre-loader image.
+ */
+ displayLoading: function() {
+ var msg = _t("We are processing your payment, please wait ...");
+ rpc.query({
+ model: 'ir.config_parameter',
+ method: 'get_param',
+ args: ['website_pre_loader_style.loader_style'],
+ }).then(function(result) {
+ console.log(result)
+ var imgSrc = '/website_pre_loader_style/static/src/img/' + result + '.png';
+ console.log(imgSrc)
+ $.blockUI({
+ 'message': '
+ ![Loading...]()
+
+
+ 
' +
+ '
' + msg +
+ '
'
+ });
+ })
+ },
+ });
+ return PaymentPostProcessing;
+});
diff --git a/website_pre_loader_style/static/src/js/website_pre_loader.js b/website_pre_loader_style/static/src/js/website_pre_loader.js
new file mode 100644
index 000000000..352fbe7f6
--- /dev/null
+++ b/website_pre_loader_style/static/src/js/website_pre_loader.js
@@ -0,0 +1,29 @@
+/** @odoo-module **/
+import { WebsitePreview } from '@website/client_actions/website_preview/website_preview';
+import { patch } from "@web/core/utils/patch";
+const { useState } = owl;
+const rpc = require('web.rpc');
+var self = this;
+/**
+ * Customization of BlockPreview setup method to handle the website preview style.
+ */
+patch(WebsitePreview.components.BlockPreview.prototype, 'website_preview_style', {
+ /**
+ * Overrides the setup method to set the website preview style based on a configuration parameter.
+ * @override
+ */
+ setup() {
+ this._super(...arguments);
+ this.spin_state = useState({
+ style: ''
+ })
+ const self = this;
+ rpc.query({
+ model: 'ir.config_parameter',
+ method: 'get_param',
+ args: ['website_pre_loader_style.loader_style'],
+ }).then(function(result) {
+ self.spin_state.style = result
+ })
+ }
+});
diff --git a/website_pre_loader_style/static/src/xml/website_preloader_templates.xml b/website_pre_loader_style/static/src/xml/website_preloader_templates.xml
new file mode 100644
index 000000000..ea533e330
--- /dev/null
+++ b/website_pre_loader_style/static/src/xml/website_preloader_templates.xml
@@ -0,0 +1,11 @@
+
+Website pre-loader
+
+
+
+
+
+
+
+ Website
+ pre-loader
+
+
+
+ Allows to customize website pre-loader
+
+
+
+
+
+ Choose Style
+
+
+