Node's Pastoral Musicians

    ice-ismds-plugin

    1.7.0-ccp1 • Public • Published

    Writing a Plugin

    Introduction

    ICE plugins allows for easy modification, customization, and enhancement of the ice.core library. Instead of changing the core programming of ICE, you can add functionality with ICE plugins.

    Creating a plugin

    • First download this repository. This is the basic template of an ICE plugin.

    Notes

    1. ICE Core uses require.js so every plugin has to have a main.js in the src folder.

    Folder Structure

    Folder Description
    demo/ This is where your demo pages for you plugin goes. In ice-core, these are html pages but this folder can contain anything that can showcase your project.
    dist/ This is where any files needed to use your plugin goes.
    documents/ This is where your documentation goes. ICE and it's plugins will use Beautiful Docs. This library converts md files into static html files.
    drivers/ This folder contains all the drivers to run Selenium.
    grunt/ This folder contains all the configs and task for grunt that ICE currently uses. You can add to this folder but it isn't reccommended to remove any of the tasks or configs.
    src/ This is where you write your plugin.
    test/ This is where all the testing goes.
    test/fixtures/ ICE needs a config or a geometry to run, store your testing configs here.
    test/functional/ This is where you will write your functional tests.
    test/helpers/ You can provide helper libraries here to help with unit tests and automated ones.
    test/lib/ You can provide any additional libraries needed to help you run your tests.
    test/manual/ If you want to test a feature manually, you can put the pages here.
    test/pages/ Pages that your test run.
    test/specs/ This is where your unit test should go.

    ICE Plugin Hooks

    registerProxy

    This function is used to access plugin functions through the core.

    Parameters Type Description
    name String The name that the core associates the callback with.
    callback Function The function that gets associated to the name.

    This is how you use the registerProxy function:

    ice.registerProxy('return-one', function(){
      return 1;
    });
    

    execute

    This function is used run the callbacks you registered to the proxy.

    Parameters Type Description
    name String The name of the plugin function you want to access.

    This is how you use the execute function:

    ice.execute('return-one');
    

    Using Plugins

    1. Include ICE Plugin and the css:

      <script src="dist/js/ice.<name>.plugin.js"></script> 
      <link  href="dist/css/ice.<name>.pugin.css"></link>
    2. Include ICE CORE:

      <script src="bower_components/ice-core/dist/js/ice.core.min.js"></script>
    3. Include DIV to be the venue map container and a DIV for the selection tool buttons:

      <div id="venue_page" ></div>
      <div id="buttons" ></div>

      (note: if you want the buttons to be positioned a particular way, you will likely need to wrap both the venue map and buttons in a div that is set with position: relative and then set the buttons div to position:absolute)

    4. Create an ice instance:

      var ice = new ICE.create({'div':'canvas div'});
    
    5.  Pass the ice instance to the <name>Plugin.create function:
    
    ```javascript
    ICE.<name>Plugin.create(ice, options);
    

    Compiling

    Ice Core uses node and grunt with convenient methods for working with the library. It's how we compile our code, run tests, and run the documentation server. To use it, install the required dependencies as directed and then run some Grunt commands.

    Install Grunt

    From the command line:

    1. Install grunt-cli globally with npm install -g grunt-cli.
    2. Install bower globally with npm install -g bower.
    3. Navigate to the root directory of the project, then run npm install. npm will look at [package.json] and run bower install. bower will look at [bower.json]
    4. Navigate to the root directory of the project, then run bower install.

    When completed, you'll be able to run the various Grunt commands provided from the command line.

    Unfamiliar with npm? Don't have node installed? That's a-okay. npm stands for node packaged modules and is a way to manage development dependencies through node.js. Download and install node.js before proceeding.

    Available Grunt commands

    Build - grunt bundle

    creates the /dist/js directory with compiled files. Uses UglifyJS.

    creates the '/docs/'

    Tests - grunt concurrent:test

    Runs a selenium server. Required to run all cucumber tests

    Tests - grunt cucumber

    Runs all cucumber tests. Requires a selenium server to be running.

    Tests - grunt karma:dev

    Runs all unit tests present in the test/specs folder. Generates a coverage report in the coverage folder. Can be viewed by navigating to localhost/coverage.

    Server - grunt server

    This is used to run the demo folder. After you run the command, open http://localhost:9000 in your browser and it will open up the demo files.

    Troubleshooting dependencies

    Should you encounter problems with installing dependencies or running Grunt commands, uninstall all previous dependency versions (global and local). Then, rerun npm install.

    Running the BDD

    You need to run three seperate commands to run the bdd

    node ./node_modules/selenium-standalone/bin/selenium-standalone start // This is to start the selenium server

    grunt test-servers // This is to run the connect server to serve the html pages

    grunt cucumber:functional:debug // This runs the cucumber tests

    License

    Ticketmaster Terms of Use

    Install

    npm i ice-ismds-plugin

    DownloadsWeekly Downloads

    2

    Version

    1.7.0-ccp1

    License

    none

    Last publish

    Collaborators

    • tmtech