Plugin Snippets

daeks edited this page Sep 25, 2013 · 10 revisions

This page is intends to show you some examples how to handle different usecases.

Displaying a dialog window in your plugin

Normally your plugin should do something. Therefore often a small dialog window is required. How do we get it? First we need to edit our dialog.php to add a small html snippet like

<?php
    // For config related stuff, we need to include the common.php
    require_once('../../common.php');   
    // also we check for authenitification
    checkSession();

    // let as switch between our different actions if we want to display different dialogs
    switch($_GET['action']){
        case 'example':
            echo '<b>Hello World</b>';
            break;           
    }   
?>

Saving that, we are also editing our init.js like

(function (global, $) {

    // get the relative path of our plugin
    var codiad = global.codiad,
        scripts= document.getElementsByTagName('script'),
        path = scripts[scripts.length-1].src.split('?')[0],
        curpath = path.split('/').slice(0, -1).join('/')+'/';

    $(window)
        .load(function() {
            // start the plugin
            codiad.example.init();
        });

    codiad.example = {

        controller: curpath + 'controller.php',
        dialog: curpath + 'dialog.php',

        init: function () {
            // use codiad functions to load a dialog with 500px width and our example
            codiad.modal.load(500, this.dialog + '?action=example');
        };
})(this, jQuery);

Hooking into an existing function to provide a new functionallity

To provide new functionally, you can also extend existing functions by hooking into their method and overwritting it.

  • Example for overwritting rightbar menu entries:
init: function () {
    // look for entry with specific onclick and replace it's onclick function
    $('#sb-right a[onclick="codiad.update.check();"]').attr("onclick", "codiad.autoupdate.check();");
}
  • Example for overwritting filemanager contextmenu entries
init: function() {
    // look for menu entry and replace it's onclick function
    $('#context-menu a[onclick="codiad.filemanager.uploadToNode($(\\'#context-menu\\').attr(\\'data-path\\'));"]').attr("onclick", "codiad.demo.denied();");
}

Advanced example for overwritting dialogs:

init: function() {
    $('#modal-content').hover(function() {
        // look for a link and replace it's onclick function
        $('#modal-content a[onclick=\\'codiad.plugin_manager.install();\\']').attr("onclick", "codiad.demo.denied();");
        // look for a set of buttons and replace it's onclick function
        $('#modal-content button[onclick*=\\'codiad.plugin_manager.install\\']').each(function() {
            $(this).attr("onclick", "codiad.demo.denied();");
        });
        // look for a inputfield by name and replace it's onclick function
        $('#modal-content input[name="project_path"]').attr("readonly", true);
    },function() {});
}

More examples could be found at https://github.com/Codiad/CodiadDemo/blob/master/demo/instance.instance.js

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.