Admin Javascript controller

An admin view template needs a Javascript controller to define how it interacts with the server-side PHP application that you are building. In this example, we are going to use BoostrapSlideShow (included in the system by default)

By default, we use EcmaScript 6 syntax for class declaration. This class must inherit from SCHLIX.CMS.BaseController and at the very least implements the constructor() and the runCommand (command, evt) method. If you need to run something after the DOM is loaded, simply implement the onDOMReady() method like the example below.


/**
 * View Controller class
 */
SCHLIX.CMS.BootstrapSlideshowAdmin = class extends SCHLIX.CMS.BaseController  {  
    /**
     * Constructor
     */
    constructor ()
    {
        super("bootstrapslideshow");
    };



    /**
     * Datatable row format: item title
     * @static
     * @param {type} elCell
     * @param {type} oRecord
     * @param {type} oColumn
     * @param {type} oData
     * @param {type} oDataTable
     * @returns {undefined}
     */
    static formatDataTableCell_Image (elCell, oRecord, oColumn, oData) {

        var field_title = SCHLIX.Util.isUndefined(this.parentControl.element_data["field-item_title"]) ? "title" : this.parentControl.element_data["field-item_title"];
        var odata_id = oRecord.getData("id");
        var odata_cid = oRecord.getData("cid");
        var odata_ext = oRecord.getData("extension");
        var file_exists = oRecord.getData("file_exists");
        var itemTitle = oRecord.getData(field_title); // oRecord.getData("title");
        var itemLink = site_httpbase;
        if (itemTitle == null)
        {
            SCHLIX.log("formatDataTableCell_DefaultTitleColumn cannot process a null title", 'warn');
            return;
        }
        if (itemTitle.length > 40)
            itemTitle = itemTitle.substr(0, 40) + '...';

        var app_name = this.parentControl.app_name;
        if (odata_cid > 0)
        {
            SCHLIX.CMS.__default_formatFolderInDataTable(app_name, elCell, oRecord, itemTitle, site_httpbase + this.parentControl.schlix_application_url + 'action=editcategory&id=' + odata_cid);
        } else
        {
            var icon = file_exists== 'true' ?  '
' : ' [No image]';

            var the_id = oRecord.getData("id");
            var theValue = 'i' + the_id;
            if (itemTitle === '')
                itemTitle = '(Untitled)';
            //itemLink = _schlix_app_controller + oColumn.app_name + '&action=edititem&id=' + oRecord.getData("id");
            // var checkbox = '';            

            itemLink += this.parentControl.schlix_application_url + 'action=edititem&id=' + the_id;
            var item_class = (oRecord.getData('id')==1 || oRecord.getData('virtual_filename') == 'home') ? 'html_home' : 'dragdrop';

            elCell.innerHTML = '' + " " + icon + " " + itemTitle + '';

        }
    };

    onShowImageUploadDialog ()
    {

        var currentCategory = this.cms_control.currentCategory;
        if (currentCategory === 'c0' || currentCategory === 0)
        {
            SCHLIX.Alert.warning('Please navigate to a category before trying to upload a file');
        } else
        {

        var obj = SCHLIX.CMS.getObject('schlix-cms-upload-image-dialog');
            obj.show();
        }

    }; // end func
    onDOMReady (event)
    {
        SCHLIX.Event.on('filedata', 'change', this.updateFileListToUpload, this, true);
    }; // end func

    onSubmitImageUploadDialog ()
    {
        var obj = SCHLIX.CMS.getObject('schlix-cms-upload-image-dialog');
        var form = obj.__getFirstFoundForm();
        return RESOLVE_TO_PARENT;
    }; // end func
////////////////////////////////////////////////////////////
    updateFileListToUpload ()
    {
        var input = document.getElementById('filedata');
        var ul = document.getElementById('filelist');
        while (ul.hasChildNodes()) {
            ul.removeChild(ul.firstChild);
        }
        // You've selected input.files.length files
        for (var i = 0; i < input.files.length; i++) {
            // input.files[i] is a file object
            var li = document.createElement("li");
            li.innerHTML = ' ' + input.files[i].name;
            ul.appendChild(li);
        }
    }; // end func


    runCommand (command, evt)
    {
        switch (command)
        {
            case 'new-item':
                this.redirectToCMSCommand("newitem");
                return true;
                break;
            case 'new-category':
                this.redirectToCMSCommand("newcategory");
                return true;
                break;
            case 'edit-current-category':
                var target = evt.target;                
                window.location = target.href;
                return true;
                break;                                
            case 'upload':
                this.onShowImageUploadDialog();
                break;

            case 'config':
                this.redirectToCMSCommand("editconfig");
                return true;
                break;
            case 'refresh':
                this.cms_control.refreshControls();
                return true;
                break;
            default:
                return super.runCommand(command, evt);
                break;
        }
    }
};

Note: As of October 2016, due to unavailability of documentation tools that can properly parse EcmaScript 6, information about SCHLIX.CMS.BaseController has not been posted yet. Once it is available, we will post an update to the documentation section of this site.