JSFiddle - React, Tailwind, and code Playground

by Serge Zahharenko

JavaScript

var tip = false;

var icoDlg = {
    show: function(icon, callback, width) {
        width == '' ? width = 200 : '';
        icoDlg.close();
        var location = icon.offset();
        $('body').append('<div id="icoDlg" class="icon-dlg ' + icon.attr("id") + '"><span class="arrow-s"></span><span class="arrow"></span><div></div></div>');
        $('#icoDlg').css('width',width + 'px').css('margin-left' , '-' + ($('#icoDlg').width() + 15) + 'px').css('left' , location.left).css('top' ,  location.top).show(200).click(function(event){
            event.stopPropagation();
        });
        $.isFunction(callback) ? callback.call(this) : $('#icoDlg div').html(callback);
    },
    close: function(){
        $('#icoDlg').remove();
    }
};

var icons = {
    processing: false,
    
    clickReg: function(iconId) {
        var service = newService('icons', {cmd: 13}); //IconsCommand::IconClick constant value, current value is 13
        service.addVar('id', iconId);
        service.call({ success: function(res, status) {
                    //alert('User ' + res);
                    } });
    },
    
    add: function() {
        modalDlg.open({ type: 'icons', width: 675, openCallBack: function() {}, closeCallBack: function() {} });
    },
    
    save: function(alist, ilist) {
        if (this.processing == false) {
            this.processing = true;
            progressBar2.show({containerId:'saveIcons'});
            
            var aorder = new Array();
            var iorder = new Array();
            $(alist).children('li').each(function(i){
                aorder[i] = $(this).attr('id');
            });
            $(ilist).children('li').each(function(i){
                iorder[i] = $(this).attr('id');
            });
            
            var service = newService('icons', {cmd: 1, active: aorder, inactive: iorder});
            service.call( { success: function(res, status) {
                                        icons.processing = false;
             ...