SHARE
TWEET

Untitled

a guest Apr 23rd, 2019 88 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. $(document).ready(function () {
  2.  
  3.     var selectedLangs = [];
  4.     var selectedCountries = [];
  5.     var selectedEditCountry = '';
  6.     var $languagesSelect = $('.js-languages-select');
  7.     var $countriesSelect = $('.js-countries-select');
  8.     var $languagesContainer = $('.js-languages-container');
  9.     var $countriesContainer = $('.js-countries-container');
  10.  
  11.     var langVariables = {
  12.         'up' : '#LANGUAGE_CODE_UP#',
  13.         'code' : '#LANGUAGE_CODE#',
  14.         'name' : '#LANGUAGE#'
  15.     };
  16.  
  17.     var countryVariables = {
  18.         'up' : '#COUNTRY_CODE_UP#',
  19.         'code' : '#COUNTRY_CODE#',
  20.         'name' : '#COUNTRY#',
  21.         //этот плейсхолдер использовался для вставки картинки таба
  22.         //был убран, т.к. тег img с плесйхолдером в src делал лишний запрос на эту же страницу
  23.         //и снова грузил весь контент
  24.         //'image' : '#COUNTRY_IMAGE#'
  25.     };
  26.  
  27.     // Нажатие кнопки добавления вкладки страны
  28.     $(document).on('click', '.js-add-country', function (el, ev) {
  29.         selectedCountries = $countriesSelect.val();
  30.     });
  31.  
  32.     // Нажатие кнопки добавления вкладки языка
  33.     $(document).on('click', '.js-add-language', function (el, ev) {
  34.         selectedLangs = $languagesSelect.val();
  35.     });
  36.  
  37.     // Добавление вкладки языка
  38.     $(document).on('click', '.js-apply-languages', function (el, ev) {
  39.         doApply($languagesContainer, $languagesSelect, selectedLangs, LANGUAGES, langVariables);
  40.     });
  41.  
  42.     // Добавление вкладки языка
  43.     $(document).on('click', '.js-apply-countries', function (el, ev) {
  44.         doApply($countriesContainer, $countriesSelect, selectedCountries, COUNTRIES, countryVariables);
  45.     });
  46.  
  47.     // Отменить изменения добавления или удаления языка
  48.     $(document).on('click', '.js-discard-languages', function (el, ev) {
  49.         discardTabs($languagesSelect, selectedLangs);
  50.     });
  51.  
  52.     // Отменить изменения добавления или удаления страны
  53.     $(document).on('click', '.js-discard-countries', function (el, ev) {
  54.         discardTabs($countriesSelect, selectedCountries);
  55.     });
  56.  
  57.     // Отменить изменения по клику мимо модалки
  58.     $(document).on('click', '#add-language-modal', function (el, ev) {
  59.         var $target = $(el.target);
  60.         var clickedOutside = $target[0].id === 'add-language-modal';
  61.  
  62.         if (clickedOutside) {
  63.             discardTabs($languagesSelect, selectedLangs);
  64.         }
  65.     });
  66.  
  67.     // Отменить изменения по клику мимо модалки
  68.     $(document).on('click', '#add-country-modal', function (el, ev) {
  69.         var $target = $(el.target);
  70.  
  71.         var clickedOutside = $target[0].id === 'add-country-modal';
  72.  
  73.         if (clickedOutside) {
  74.             discardTabs($countriesSelect, selectedCountries);
  75.         }
  76.     });
  77.  
  78.     // подготовка модальной формы редактирования
  79.     $(document).on('click', '.js-edit-country', function (el, ev) {
  80.         selectedCountries = $countriesSelect.val();
  81.         for (i in selectedCountries) {
  82.             var countryTab = '.js-tab-' + selectedCountries[i];
  83.             if ($(countryTab).hasClass('active')) {
  84.                 selectedEditCountry = selectedCountries[i];
  85.                 initValueForEditCountry(selectedCountries[i]);
  86.             }
  87.         }
  88.  
  89.         $countriesSelect.val(selectedCountries);
  90.         $countriesSelect.trigger("chosen:updated");
  91.     });
  92.  
  93.     // редактирование таба
  94.     $(document).on('click', '.js-apply-edit-countries', function (el, ev) {
  95.         var newSelectedEditCountry = $(".js-edit-countries-select").chosen().val();
  96.         if (selectedEditCountry != newSelectedEditCountry) {
  97.             console.log(selectedEditCountry, newSelectedEditCountry);
  98.             editTab(selectedEditCountry, newSelectedEditCountry, COUNTRIES)
  99.         }
  100.     });
  101.  
  102.     // отмена добавления таба
  103.  
  104.     function editTab(editCountry, newCountry, codes) {  // COUNTRIES - codes
  105.         var code = codes[newCountry];
  106.         console.log(code.image);
  107.         var tabId = 'tab-' + editCountry;
  108.  
  109.         var $tab = $('.js-tab-' + editCountry);
  110.         var $tabBody = $('js-tab-body-' + editCountry);
  111.         $tab.find('.js-tab-image').attr('src', code.image);
  112.  
  113.         $tab.removeClass('js-tab-' + editCountry).addClass('js-tab-' + newCountry).show();
  114.         $tab.find('.js-tab-name').attr('href', '#' + tabId);
  115.  
  116.         $tabBody.removeClass('js-tab-body-' + editCountry).addClass('js-tab-body-' + newCountry).show();
  117.         $tabBody.attr('id', tabId);
  118.  
  119.     }
  120.  
  121.     function doApply($container, $select, selected, tabCodes, tabVariables) {
  122.         var newSelected = $select.val();
  123.         var removed = [];
  124.         removed = selected.filter(x => newSelected.indexOf(x) < 0 );
  125.  
  126.         // Оповещаем, что удалены языки, которые уже были сохранены ранее
  127.         if (removed.length) {
  128.             swal({
  129.                     title: "Внимание",
  130.                     text: "Вы собираетесь удалить: " + removed.join(', ') + '. Если вы продолжите, то все данные для этих элементов будут удалены безвозвратно. Продолжить?',
  131.                     confirmButtonText: "Да, удалить",
  132.                     showCancelButton: true,
  133.                     cancelButtonText: "Нет, я подумаю",
  134.                     closeOnConfirm: true,
  135.                     closeOnCancel: true
  136.                 },
  137.                 function (isConfirm) {
  138.                     if (isConfirm) {
  139.                         applyTabs($container, $select, selected, tabCodes, tabVariables);
  140.                     }
  141.                     return false;
  142.                 });
  143.         } else {
  144.             applyTabs($container, $select, selected, tabCodes, tabVariables);
  145.         }
  146.     }
  147.  
  148.     // Применяем новые языки (добавляем или удаляем или то и другое)
  149.     function applyTabs($container, $select, selected, codes, variablesArr) {
  150.         var newSelected = $select.val(),
  151.             $tabTemplate = $container.find('.js-tab-template').first(),
  152.             $tabBodyTemplate = $container.find('.js-tab-body-template').first(),
  153.             newTabs = [];
  154.  
  155.         // Удаляем
  156.         $.each(selected, function(i, el){
  157.             console.log(el);
  158.             if (in_array(el, newSelected)) {
  159.                 return;
  160.             }
  161.  
  162.             $('.js-tab-' + el).remove();
  163.             $('.js-tab-body-' + el).remove();
  164.         });
  165.  
  166.         // Добавляем
  167.         $.each(newSelected, function(i, el){
  168.             if (in_array(el, selected)) {
  169.                 return;
  170.             }
  171.             if ($('.js-tab-' + el).length) {
  172.                 return;
  173.             }
  174.  
  175.             var code = codes[el];
  176.             var variablesUp = variablesArr.up;
  177.             var variablesCode = variablesArr.code;
  178.             var variablesName = variablesArr.name;
  179.             var variables = [];
  180.             variables[variablesUp] = code.code.toUpperCase();
  181.             variables[variablesCode] = code.code;
  182.             variables[variablesName] = code.name;
  183.  
  184.             var tabId = 'tab-' + el;
  185.  
  186.             var $tab = $tabTemplate.clone();
  187.             var $tabBody = $tabBodyTemplate.clone();
  188.  
  189.             $tab.html(template_replace($tab.html(), variables));
  190.             //устанавливаеми картинку для вкладки при добавлении
  191.             $tab.find('.js-tab-image').attr('src', code.image);
  192.             $tabBody.html(template_replace($tabBody.html(), variables));
  193.  
  194.             $tab.removeClass('js-tab-template').addClass('js-tab-' + el).show();
  195.             $tab.find('.js-tab-name').attr('href', '#' + tabId);
  196.  
  197.             $tabBody.removeClass('js-tab-body-template').addClass('js-tab-body-' + el).show();
  198.             $tabBody.attr('id', tabId);
  199.  
  200.             $tabBody.find('.js-editable-template').each(function (index, element) {
  201.                 $(this).removeClass('js-editable-template');
  202.                 $(this).addClass('js-editable');
  203.             });
  204.  
  205.             //добавим дата аттрибут для кнопки добавить в галереях
  206.             $tabBody.find('.js-upload-from-languages').attr('data-upload-language', el);
  207.             $tabBody.find('.js-replace-from-languages').attr('data-upload-language', el);
  208.             //задаем класс для селекта с выбором языков в галереях
  209.             $tabBody.find('.js-choose-slide-language-').removeClass('js-choose-slide-language-').addClass('js-choose-slide-language-' + el);
  210.             //задаем языковую метку контейнера со слайдами
  211.             $tabBody.find('.js-slide-language-container-').removeClass('js-slide-language-container-').addClass('js-slide-language-container-' + el);
  212.             // добавляем селектам текущий язык
  213.             $tabBody.find('.js-select-language-upload').each(function (index, select) {
  214.                 $(select).attr('data-upload-language', el);
  215.                 var entityCode = $(select).attr('data-entity-code');
  216.                 $(select).addClass('js-choose-slide-language-'+el+'-'+entityCode);
  217.             });
  218.             $tabBody.find('.js-slide-container').each(function (index, container) {
  219.                 var tab = $(container).find('.js-sortable');
  220.                 var newContainerSlideCode = $(tab).attr('data-entity-code');
  221.                 $(tab).addClass('js-slide-language-container-'+el+'-'+newContainerSlideCode);
  222.             });
  223.  
  224.             $tabTemplate.before($tab);
  225.             $tabBodyTemplate.before($tabBody);
  226.  
  227.             newTabs.push($tabBody);
  228.         });
  229.  
  230.         // Переинициализируем табы
  231.         // $(".nav-tabs").tabs();
  232.  
  233.         setTimeout(function () {
  234.             initEditors($container);
  235.             initCustomCheckboxes($container);
  236.             checkBox();
  237.             initDatepickers();
  238.             hideButtonsUpload();
  239.             if (newTabs.length) {
  240.                 for (var i in newTabs) {
  241.                     $(newTabs[i]).find('.js-select-language-upload');
  242.                     initCustomSelects(newTabs[i]);
  243.                 }
  244.             }
  245.         }, 500);
  246.  
  247.         $('.jsLanguagesModal .jsModalClose').click();
  248.     }
  249.  
  250.     // Возвращаемся к предыдущему состоянию
  251.     function discardTabs($select, selected) {
  252.  
  253.         $select.val(selected);
  254.         $select.trigger("chosen:updated");
  255.  
  256.         $('.jsLanguagesModal .jsModalClose').click();
  257.     }
  258.  
  259.     //Быстрое удаление языковой вкладки по клику на крестик
  260.     $('body').on('click', '.js-delete-language',function (e) {
  261.  
  262.         e.preventDefault();
  263.         var target = e.currentTarget;
  264.         var language = $(target).data('language');
  265.  
  266.         //удаление вкладки
  267.         var $tab = $(target).closest('.tab-pane');
  268.         $tab.remove();
  269.  
  270.         /**
  271.          * удаление таба
  272.          * делаем проверку что это был именно активный таб
  273.          * и выбираем соседний таб, добавляем ему класс active чтобы он отображался на странице
  274.          */
  275.         var tabClass = '.js-tab-'+language;
  276.         if($(tabClass).hasClass('active')) {
  277.             $(tabClass).remove();
  278.             setActive($('.js-languages-container'));
  279.             reInitsAfterDeleteLang(language);
  280.         }
  281.     });
  282.  
  283.     //Быстрое удаление вкладки страны по клику на крестик
  284.     $('body').on('click', '.js-delete-country',function (e) {
  285.  
  286.         e.preventDefault();
  287.         var target = e.currentTarget;
  288.         var country = $(target).data('country');
  289.  
  290.         //удаление вкладки
  291.         var $tab = $(target).closest('.tab-pane');
  292.         $tab.remove();
  293.  
  294.         /**
  295.          * удаление таба
  296.          * делаем проверку что это был именно активный таб
  297.          * и выбираем соседний таб, добавляем ему класс active чтобы он отображался на странице
  298.          */
  299.         var tabClass = '.js-tab-country-'+country;
  300.         if($(tabClass).hasClass('active')) {
  301.             $(tabClass).remove();
  302.             setActive($('.js-countries-container'));
  303.             reInitsAfterDeleteCountry(country);
  304.         }
  305.     });
  306.  
  307.     /**
  308.      * Делаем активной другую вкладку взамен удаленной
  309.      * @param $container
  310.      */
  311.     function setActive($container) {
  312.         $container.find('li').first().addClass('active');
  313.         $container.find('div .tab-pane').first().addClass('active');
  314.     }
  315.  
  316.     /**
  317.      * Переинициализация необходимых элементов после удаления языковой вкладки
  318.      * @param language
  319.      */
  320.     function reInitsAfterDeleteLang(language) {
  321.         if(typeof(language) == 'undefined') {
  322.             return;
  323.         }
  324.         /**
  325.          * Переинициализация модалки для добавленя языков убираем
  326.          * @type {jQuery|HTMLElement}
  327.          */
  328.         var $select = $('.js-languages-select');
  329.         $select.find('option').each(function (index, element) {
  330.             if($(element).attr('value') == language) {
  331.                 $(element).prop('selected', false);
  332.                 $(element).removeClass('js-default');
  333.             }
  334.         });
  335.         $select.trigger('change');
  336.         initCustomSelects($('.jsLanguagesModal#add-language-modal '));
  337.     }
  338.  
  339.     function reInitsAfterDeleteCountry(country) {
  340.         if(typeof(country) == 'undefined') {
  341.             return;
  342.         }
  343.         /**
  344.          * Переинициализация модалки для добавленя языков убираем
  345.          * @type {jQuery|HTMLElement}
  346.          */
  347.         var $select = $('.js-countries-select');
  348.         $select.find('option').each(function (index, element) {
  349.             if($(element).attr('value') == 'country-' + country) {
  350.                 $(element).prop('selected', false);
  351.                 $(element).removeClass('js-default');
  352.             }
  353.         });
  354.         $select.trigger('change');
  355.         initCustomSelects($('.jsLanguagesModal#add-country-modal '));
  356.     }
  357.  
  358.     // в модальной форме редактирования страны устанавливаем значение
  359.     function initValueForEditCountry(country) {
  360.         var $select = $('.js-edit-countries-select');
  361.         $select.find('option').each(function (index, element) {
  362.             if($(element).attr('value') == country) {
  363.                 $(element).prop('selected', true);
  364.                 $(element).addClass('js-default');
  365.             } else {
  366.                 $(element).prop('selected', false);
  367.                 $(element).removeClass('js-default');
  368.             }
  369.         });
  370.         $select.trigger('chosen:updated');
  371.         initCustomSelects($('.jsLanguagesModal#edit-country-modal'));
  372.     }
  373. });
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top