smartxtrader 3.8.1-xm.0

package/src/javascript/_common/string_util.js

@@ -0,0 +1,50 @@
+const moment     = require('moment');
+
+const toTitleCase = str => (
+    (str || '').replace(/\w[^\s/\\]*/g, txt => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase())
+);
+
+const toISOFormat = date => (date instanceof moment ? date.format('YYYY-MM-DD') : '');
+
+const toReadableFormat = (date) => {
+    if (date instanceof moment) {
+        return date.format('DD MMM YYYY');
+    }
+    return '';
+};
+
+const padLeft = (txt, len, char) => {
+    const text = String(txt || '');
+    return text.length >= len ? text : `${Array((len - text.length) + 1).join(char)}${text}`;
+};
+
+const compareBigUnsignedInt = (a, b) => {
+    let first_num  = numberToString(a);
+    let second_num = numberToString(b);
+    if (!first_num || !second_num) {
+        return '';
+    }
+    const max_length = Math.max(first_num.length, second_num.length);
+    first_num        = padLeft(first_num, max_length, '0');
+    second_num       = padLeft(second_num, max_length, '0');
+
+    // lexicographical comparison
+    let order = 0;
+    if (first_num !== second_num) {
+        order = first_num > second_num ? 1 : -1;
+    }
+
+    return order;
+};
+
+const numberToString = n => (typeof n === 'number' ? String(n) : n);
+
+module.exports = {
+    toISOFormat,
+    toReadableFormat,
+    toTitleCase,
+    padLeft,
+    numberToString,
+
+    compareBigUnsignedInt,
+};

package/src/javascript/_common/tab_selector.js

@@ -0,0 +1,196 @@
+const tabListener        = require('@binary-com/binary-style').tabListener;
+const getElementById     = require('./common_functions').getElementById;
+const Url                = require('./url');
+const applyToAllElements = require('./utility').applyToAllElements;
+
+const TabSelector = (() => {
+    // obj_tabs will be built in the following format:
+    // obj_tabs = { first_tab_group_selector_id: { id_tabs: [ id_of_tab_one, id_of_tab_two ] }
+    // we will use id_tabs to handle which tab to show when going to the left or right tab
+    let obj_tabs = {};
+
+    const onLoad = () => {
+        tabListener();
+        obj_tabs = {};
+        applyToAllElements('.tab-selector-wrapper .tm-ul', (tab_selector) => {
+            const tab_selector_id = tab_selector.getAttribute('id');
+            applyToAllElements('.tm-li', (tab) => {
+                if (!/tab-selector/.test(tab.className)) {
+                    const tab_id = tab.getAttribute('id');
+                    if (!obj_tabs[tab_selector_id]) {
+                        obj_tabs[tab_selector_id] = { id_tabs: [] };
+                    }
+                    if (!obj_tabs[tab_selector_id].circles) {
+                        obj_tabs[tab_selector_id].circles = getElementById(`${tab_selector_id}_circles`).children;
+                    }
+                    obj_tabs[tab_selector_id].id_tabs.push(tab_id);
+                }
+                tab.addEventListener('click', slideSelectorOnMenuClick);
+            }, '', tab_selector);
+        });
+        // set initial width and margin-left of tab selector
+        repositionSelector();
+        window.addEventListener('resize', repositionSelector);
+
+        applyToAllElements('.go-left', (element) => {
+            element.addEventListener('click', goLeft);
+        });
+        applyToAllElements('.go-right', (element) => {
+            element.addEventListener('click', goRight);
+        });
+
+        setMobileHeader();
+    };
+
+    const repositionSelector = () => {
+        const params_hash = Url.paramsHash();
+        Object.keys(obj_tabs).forEach((tab_id) => {
+            const id_to_show = params_hash[tab_id] || obj_tabs[tab_id].id_tabs[0];
+            const el_to_show = getElementById(id_to_show);
+            if (el_to_show.parentNode) {
+                const selector = el_to_show.parentNode.getAttribute('id');
+                changeTab({ selector, el_to_show });
+            }
+        });
+    };
+
+    const slideSelectorOnMenuClick = (e) => {
+        if (e.target.nodeName !== 'A' || /a-active/.test(e.target.classList)) {
+            return;
+        }
+        const selector      = e.target.closest('ul').getAttribute('id');
+        const current_index = obj_tabs[selector].id_tabs.indexOf(e.target.parentNode.getAttribute('id'));
+        slideSelector(selector, e.target);
+        Array.from(obj_tabs[selector].circles).forEach((circle, idx) => {
+            if (idx === current_index) {
+                circle.classList.add('selected');
+            } else {
+                circle.classList.remove('selected');
+            }
+        });
+        updateURL(selector, e.target.parentNode.getAttribute('id'));
+    };
+
+    const updateURL = (selector, tab_id) => {
+        Url.updateParamsWithoutReload({
+            [selector]: tab_id,
+        }, true);
+    };
+
+    const setMobileHeader = () => {
+        const el_mobile_tab = getElementById('tab_mobile_header');
+
+        if (el_mobile_tab) {
+            const active_tab = document.getElementsByClassName('a-active');
+            if (active_tab) el_mobile_tab.innerHTML = active_tab[0].innerHTML;
+        }
+    };
+
+    const goLeft = (e) => {
+        changeTab({ selector: e.target.getAttribute('data-parent'), direction: 'left' });
+    };
+
+    const goRight = (e) => {
+        changeTab({ selector: e.target.getAttribute('data-parent'), direction: 'right' });
+    };
+
+    const changeTab = (options) => {
+        const params_hash     = Url.paramsHash();
+        const arr_id_tabs     = obj_tabs[options.selector].id_tabs;
+        const id_selected_tab = params_hash[options.selector] || obj_tabs[options.selector].id_tabs[0];
+        const current_index   = arr_id_tabs.indexOf(id_selected_tab);
+        let index_to_show = current_index;
+        if (options.direction) {
+            if (options.direction === 'left') {
+                index_to_show = current_index > 0 ? current_index - 1 : arr_id_tabs.length - 1;
+            } else {
+                index_to_show = current_index === arr_id_tabs.length - 1 ? 0 : current_index + 1;
+            }
+            options.el_to_show = getElementById(arr_id_tabs[index_to_show]);
+            updateURL(options.selector, arr_id_tabs[index_to_show]);
+        }
+
+        if (!options.el_to_show || !options.selector) {
+            return;
+        }
+
+        selectCircle(options.selector, current_index, index_to_show);
+        slideSelector(options.selector, options.el_to_show);
+        options.el_to_show.getElementsByTagName('a')[0].click();
+        setMobileHeader();
+
+        if (params_hash.section) {
+            setTimeout(() => { $.scrollTo($(`#${params_hash.section}`), 500, { offset: -10 }); }, 500);
+        }
+    };
+
+    const slideSelector = (selector, el_to_show) => {
+        getElementById(`${selector}_selector`).setAttribute('style', `width: ${el_to_show.offsetWidth}px; margin-left: ${el_to_show.offsetLeft}px;`);
+    };
+
+    const selectCircle = (selector, old_index, index_to_show) => {
+        if (obj_tabs[selector].circles.length > 1) {
+            obj_tabs[selector].circles[old_index].classList.remove('selected');
+            obj_tabs[selector].circles[index_to_show].classList.add('selected');
+        }
+    };
+
+    const updateTabDisplay = () => {
+        applyToAllElements('.tab-menu', (el_tab_menu) => {
+            // hide tabs if there is only one tab visible
+            const ul = el_tab_menu.querySelector('ul');
+            if (ul) {
+                const visible_tabs = Array.from(ul.children).filter(el => (
+                    !el.classList.contains('tab-selector')
+                    && (!el.dataset.show
+                        || el.dataset.show && el.classList.contains('data-show-visible'))
+                ));
+                if (visible_tabs.length <= 1) el_tab_menu.setVisibility(0);
+            }
+            // resize tab selector
+            if (el_tab_menu.querySelector('.tab-selector')) {
+                repositionSelector();
+            }
+        });
+    };
+
+    const onUnload = () => {
+        window.removeEventListener('resize', repositionSelector);
+        obj_tabs = {};
+
+        applyToAllElements('.tm-li', (element) => {
+            element.removeEventListener('click', slideSelectorOnMenuClick);
+        });
+
+        applyToAllElements('.go-left', (element) => {
+            element.removeEventListener('click', goLeft);
+        });
+        applyToAllElements('.go-right', (element) => {
+            element.removeEventListener('click', goRight);
+        });
+    };
+
+    const onChangeTab = (fn) => {
+        applyToAllElements('.go-left', (element) => {
+            element.addEventListener('click', (e) => {
+                fn({ selector: e.target.getAttribute('data-parent'), direction: 'left' });
+            });
+        });
+        applyToAllElements('.go-right', (element) => {
+            element.addEventListener('click', (e) => {
+                fn({ selector: e.target.getAttribute('data-parent'), direction: 'right' });
+            });
+        });
+    };
+
+    return {
+        onChangeTab,
+        onLoad,
+        onUnload,
+        repositionSelector,
+        slideSelector,
+        updateTabDisplay,
+    };
+})();
+
+module.exports = TabSelector;

package/src/javascript/_common/third_party_links.js

@@ -0,0 +1,96 @@
+const localize               = require('./localize').localize;
+const BinarySocket           = require('../app/base/socket');
+const Dialog                 = require('../app/common/attach_dom/dialog');
+const isEuCountry            = require('../app/common/country_base').isEuCountry;
+const getCurrentBinaryDomain = require('../config').getCurrentBinaryDomain;
+
+const ThirdPartyLinks = (() => {
+    const init = () => {
+        BinarySocket.wait('website_status', 'authorize', 'landing_company').then(() => {
+            document.body.addEventListener('click', clickHandler);
+        });
+    };
+
+    const clickHandler = (e) => {
+        if (!e.target) return;
+        const el_link = e.target.closest('a') || e.target.closest('area');
+        if (!el_link) return;
+
+        const href = el_link.href;
+        if (isEuCountry()) {
+            const dialog = document.querySelector('#third_party_redirect_dialog');
+            if (dialog && dialog.contains(el_link)) return;
+
+            if (isThirdPartyLink(href)) {
+                e.preventDefault();
+                showThirdPartyLinkPopup(href);
+            }
+        } else {
+            const dialog = document.querySelector('#telegram_installation_dialog');
+            if (dialog && dialog.contains(el_link)) return;
+
+            if (isTelegramLink(href)) {
+                e.preventDefault();
+                showTelegramPopup(href);
+            }
+        }
+    };
+
+    const openThirdPartyLink = (href) => {
+        const link = window.open();
+        link.opener = null;
+        link.location = href;
+    };
+
+    const showThirdPartyLinkPopup = (href) => {
+        // show third-party website redirect notification for logged in and logged out EU clients
+        Dialog.confirm({
+            id               : 'third_party_redirect_dialog',
+            localized_message: localize(['You will be redirected to a third-party website which is not owned by XYZSTRATEGY.com.', 'Click OK to proceed.']),
+        }).then((should_proceed) => {
+            if (should_proceed && isTelegramLink(href))  {
+                showTelegramPopup(href);
+            } else if (should_proceed) {
+                openThirdPartyLink(href);
+            }
+        });
+    };
+
+    const showTelegramPopup = (href) => {
+        // show a popup to remind clients to have Telegram app installed on their device
+        Dialog.confirm({
+            id               : 'telegram_installation_dialog',
+            localized_message: localize(['Please ensure that you have the Telegram app installed on your device.', 'Click OK to proceed.']),
+        }).then((should_proceed) => {
+            if (should_proceed) {
+                openThirdPartyLink(href);
+            }
+        });
+    };
+
+    const isTelegramLink = (href) => /t\.me/.test(href);
+
+    const isThirdPartyLink = (href) => {
+        let destination;
+        try {
+            destination = new URL(href);
+        } catch (e) {
+            return false;
+        }
+        return !!destination.host
+            && !new RegExp(`^.*\\.${getCurrentBinaryDomain() || 'binary\\.com'}$`).test(destination.host) // destination host is not binary subdomain
+            // TODO: [app-link-refactor] - Remove backwards compatibility for `deriv.app`
+            && !(/deriv\\.app$/.test(destination.host) || /app\\.deriv\\.com$/.test(destination.host)) // destination host is not deriv.app
+            && !/^.*\\.binary\\.bot$/.test(destination.host) // destination host is not binary subdomain
+            && !/www.(betonmarkets|xodds).com/.test(destination.host) // destination host is not binary old domain
+            && !/deriv.(app|com)/.test(destination.host) // destination host is not deriv
+            && window.location.host !== destination.host;
+    };
+
+    return {
+        init,
+        isThirdPartyLink,
+    };
+})();
+
+module.exports = ThirdPartyLinks;

package/src/javascript/_common/url.js

@@ -0,0 +1,199 @@
+const urlForLanguage         = require('./language').urlFor;
+const urlLang                = require('./language').urlLang;
+const createElement          = require('./utility').createElement;
+const isEmptyObject          = require('./utility').isEmptyObject;
+const getTopLevelDomain      = require('./utility').getTopLevelDomain;
+const Language               = require('./language');
+const getCurrentBinaryDomain = require('../config').getCurrentBinaryDomain;
+require('url-polyfill');
+
+const Url = (() => {
+    let location_url,
+        static_host;
+
+    const init = (url) => {
+        location_url = url ? getLocation(url) : window.location;
+    };
+
+    const getLocation = url => createElement('a', { href: decodeURIComponent(url) });
+
+    const reset = () => {
+        location_url = window ? window.location : location_url;
+    };
+
+    const params = (href) => {
+        const arr_params = [];
+        const parsed     = ((href ? new URL(href) : location_url).search || '').substr(1).split('&');
+        let p_l          = parsed.length;
+        while (p_l--) {
+            const param = parsed[p_l].split('=');
+            arr_params.push(param);
+        }
+        return arr_params;
+    };
+
+    const paramsHash = (href) => {
+        const param_hash = {};
+        const arr_params = params(href);
+        let param        = arr_params.length;
+        while (param--) {
+            if (arr_params[param][0]) {
+                param_hash[arr_params[param][0]] = arr_params[param][1] || '';
+            }
+        }
+        return param_hash;
+    };
+
+    const paramsHashToString = pars => (isEmptyObject(pars) ? '' : Object.keys(pars).map(key => `${key}=${pars[key] || ''}`).join('&'));
+
+    const normalizePath = path => (path ? path.replace(/(^\/|\/$|[^a-zA-Z0-9-_/])/g, '') : '');
+
+    const urlFor = (path, pars, language, should_change_to_legacy = false) => {
+        const lang = (language || urlLang()).toLowerCase();
+        // url language might differ from passed language, so we will always replace using the url language
+        const url_lang = (language ? urlLang().toLowerCase() : lang);
+        const url = window.location.href;
+        let domain = url.substring(0, url.indexOf(`/${url_lang}/`) + url_lang.length + 2);
+        if (should_change_to_legacy) {
+            domain = domain.replace(/\/app/,'');
+        }
+        const new_url = `${domain}${(normalizePath(path) || 'trading')}.html${(pars ? `?${pars}` : '')}`;
+        // replace old lang with new lang
+        return urlForLanguage(lang, new_url);
+    };
+
+    const default_domain = 'binary.com';
+    const host_map = { // the exceptions regarding updating the URLs
+        'bot.binary.com'    : 'www.binary.bot',
+        'api.deriv.com'     : 'api.deriv.com', // same, shouldn't change
+        'academy.binary.com': 'academy.binary.com',
+        'blog.binary.com'   : 'blog.binary.com',
+    };
+
+    const urlForCurrentDomain = (href) => {
+        const current_domain = getCurrentBinaryDomain();
+
+        if (!current_domain) {
+            return href; // don't change when domain is not supported
+        }
+
+        const url_object = new URL(href);
+        if (Object.keys(host_map).includes(url_object.hostname)) {
+            url_object.hostname = host_map[url_object.hostname];
+        } else if (url_object.hostname.match(default_domain)) {
+            // to keep all non-XYZSTRATEGY links unchanged, we use default domain for all XYZSTRATEGY links in the codebase (javascript and templates)
+            url_object.hostname = url_object.hostname.replace(new RegExp(`\\.${default_domain}`, 'i'), `.${current_domain}`);
+        } else {
+            return href;
+        }
+
+        return url_object.href;
+    };
+
+    const urlForStatic = (path = '') => {
+        if (!static_host || static_host.length === 0) {
+            static_host = document.querySelector('script[src*="vendor.min.js"]');
+            if (static_host) {
+                static_host = static_host.getAttribute('src');
+            }
+
+            if (static_host && static_host.length > 0) {
+                static_host = static_host.substr(0, static_host.indexOf('/js/') + 1);
+            } else {
+                static_host = Url.websiteUrl();
+            }
+        }
+
+        return static_host + path.replace(/(^\/)/g, '');
+    };
+
+    const deriv_app_domain = `https://app.deriv.${getTopLevelDomain()}`;
+
+    const urlForDeriv = (path, pars) => `${(getAllowedLocalStorageOrigin() || deriv_app_domain)}/${path}${pars ? `?${pars}` : ''}`;
+
+    const getAllowedLocalStorageOrigin = () => {
+        // TODO: [app-link-refactor] - Remove backwards compatibility for `deriv.app`
+        if (
+            /^smarttrader-staging\.deriv\.app$/i.test(window.location.hostname) ||
+            /^staging-smarttrader\.deriv\.com$/i.test(window.location.hostname)
+        ) {
+            return 'https://staging-app.deriv.com';
+        } else if (
+            /^smarttrader\.deriv\.app$/i.test(window.location.hostname) ||
+            /^smarttrader\.deriv\.com$/i.test(window.location.hostname)
+        ) {
+            return deriv_app_domain;
+        }
+        return deriv_app_domain;
+    };
+
+    /**
+     * @param {Object} new_params - Object with param-value pairs. To delete param, set value to null.
+     * @param {boolean} should_preserve_old - Should existing query parameters be preserved.
+     */
+    const updateParamsWithoutReload = (new_params, should_preserve_old) => {
+        const updated_params = should_preserve_old
+            ? Object.assign(paramsHash(), new_params)
+            : new_params;
+        Object.keys(new_params).forEach(key => {
+            if (new_params[key] === null) {
+                delete updated_params[key];
+            }
+        });
+        const url = new URL(window.location);
+        url.search = paramsHashToString(updated_params);
+        window.history.replaceState({ url: url.href }, '', url.href);
+    };
+
+    const getSection = (url = window.location.href) => (url.match(new RegExp(`/${urlLang()}/(.*)/`, 'i')) || [])[1];
+
+    const getHashValue = (name) => {
+        const hash  = (location_url || window.location).hash;
+        const value = hash.split('=');
+        return new RegExp(name).test(hash) && value.length > 1 ? value[1] : '';
+    };
+
+    const getStaticUrl = () => {
+        const host = 'https://deriv';
+        const domain = getTopLevelDomain();
+        let lang = Language.get().toLowerCase();
+    
+        if (lang && lang !== 'en') {
+            lang = `/${lang}`;
+        } else {
+            lang = '';
+        }
+        
+        if (lang.includes('_')) {
+            lang = lang.replace('_', '-');
+        }
+    
+        const url = `${host}.${domain}${lang}`;
+        return url;
+    };
+
+    return {
+        init,
+        reset,
+        paramsHash,
+        getLocation,
+        paramsHashToString,
+        urlFor,
+        urlForCurrentDomain,
+        urlForStatic,
+        urlForDeriv,
+        getAllowedLocalStorageOrigin,
+        getSection,
+        getHashValue,
+        updateParamsWithoutReload,
+        getStaticUrl,
+
+        param           : name => paramsHash()[name],
+        websiteUrl      : () => `${location.protocol}//${location.hostname}/`,
+        getDefaultDomain: () => default_domain,
+        getHostMap      : () => host_map,
+        resetStaticHost : () => { static_host = undefined; },
+    };
+})();
+
+module.exports = Url;