{"_id":"54e2254d22de1c230094b156","parentDoc":null,"version":{"_id":"54d5635532d98b0d00384afb","project":"54d53c7b23010a0d001aca0c","__v":10,"forked_from":"54d53c7c23010a0d001aca0f","createdAt":"2015-02-07T00:59:01.934Z","releaseDate":"2015-02-07T00:59:01.934Z","categories":["54d5635632d98b0d00384afc","54d5635632d98b0d00384afd","54d5635632d98b0d00384afe","54d5635632d98b0d00384aff","54d5635632d98b0d00384b00","54d5635632d98b0d00384b01","54d5635632d98b0d00384b02","54d652097e05890d006f153e","54dd1315ca1e5219007e9daa","54e21e2b22de1c230094b147","54e68e62a43fe13500db3879","54fa1d3fe7a0ba2f00306309","551c453a23a1ee190034d19a","551df586e52a0b23000c62b6","551f39be6886f8230055f02a","55a6720751457325000e4d97"],"is_deprecated":false,"is_hidden":false,"is_beta":true,"is_stable":true,"codename":"","version_clean":"0.1.0","version":"0.1"},"user":"54cfa8e1a8a4fd0d00b7fd1d","__v":11,"project":"54d53c7b23010a0d001aca0c","category":{"_id":"54d5635632d98b0d00384afd","project":"54d53c7b23010a0d001aca0c","version":"54d5635532d98b0d00384afb","__v":7,"pages":["54d5635632d98b0d00384b03","54d5635632d98b0d00384b04","54d5635632d98b0d00384b05","54d5635632d98b0d00384b06","54d5635632d98b0d00384b07","54d5635632d98b0d00384b08","54d5635632d98b0d00384b09","54d5635632d98b0d00384b0a","54d5635632d98b0d00384b0b","54d5635632d98b0d00384b0c","54d5635632d98b0d00384b0d","54d5635632d98b0d00384b0e","54d5635632d98b0d00384b0f","54e2254d22de1c230094b156","54e2255622de1c230094b158","54e23b349d045721004cbc26","54e65455d8873117005c773f","54e6b5c0ba1a980d00e3ecb0","551c12c781b8563500fd998e"],"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-02-06T23:43:39.709Z","from_sync":false,"order":7,"slug":"plugin-base-classes","title":"Plugin Base Classes"},"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-02-16T17:13:49.231Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"auth":"required","params":[],"url":""},"isReference":false,"order":1,"body":"A plugin is always an instance of `Plugin()` either in it's pure vanilla form or one of the many classes that are based on it. These classes all provide additional functionality on top of the base `Plugin()` features, which include event handling and management of resources used by the plugin for easy loading and unloading. Other classes add unique features that can be re-used throughout Cloud9. For instance the `Editor()` class serves as the base class for any of the editor components.\n\nHere's an incomplete list of the different types of base classes:\n\n- [Dialog](doc:dialog) \n- [Panel](doc:panel) \n- [Editor](doc:creating-an-editor-plugin)\n- MountTab\n- [DebuggerPanel](doc:debug-panel)\n- [CollabPane](doc:collab-panel)\n- [PreferencePanel](doc:preference-panel)\n\nThe code for creating a basic plugin is this:\n\n```javascript\nvar plugin = new Plugin(\"Your Name\", main.consumes);\nvar emit = plugin.getEmitter();\n\nplugin.on(\"load\", function(){ });\nplugin.on(\"unload\", function(){ });\n\nplugin.freezePublicAPI({\n    show: show\n});\n```\n\nSome of the base classes allow for setting extra options to create the instance. These options are always passed as the 3rd argument to the constructor.\n\n```javascript\nvar plugin = new Dialog(\"Your Name\", main.consumes, {\n    name: \"my-plugin-name\",\n    allowClose: true,\n    title: \"Some Title\"\n});\n```\n\nBase classes often also introduce new events to the life cycle of the plugin. For instance the `Dialog` base class adds these events:\n\n```javascript\nplugin.on(\"draw\", function(e){ });\nplugin.on(\"show\", function(){ });\nplugin.on(\"hide\", function(){ });\n```\n\n# One Base Class per Plugin\n[block:callout]\n{\n  \"type\": \"info\",\n  \"title\": \"Rule of Thumb\",\n  \"body\": \"Only include one base class per plugin.\"\n}\n[/block]\nFor instance, If your package needs to interact with one or more dialogs. Create one or more plugins, one for each dialog. Provide an API for your dialog and access that interface by importing the dialog in your plugin (via `main.consumes`).\n\n# Creating your own Base Class\n\nTo create your own base class use the `plugin.baseclass()` method to mark your class as such.\n\n```javascript\ndefine(function(require, module, exports) {\n    main.consumes = [\"Plugin\", \"ui\"];\n    main.provides = [\"MyBaseClass\"];\n    return main;\n    \n    function main(options, imports, register) {\n        var ui = imports.ui;\n\n        function MyBaseClass(developer, deps, options) {\n            var plugin = new Plugin(developer, deps.concat(main.consumes));\n            var emit = plugin.getEmitter();\n            \n            // Get the name from the options (optional)\n            var name = options.name;\n            \n            // Mark this plugin as a base class\n            plugin.baseclass();\n            \n            // Set the public API (Plugin won't be frozen)\n            plugin.freezePublicAPI({\n                \n            });\n            \n            // Set default name (will append integer)\n            plugin.load(name, \"myclass\");\n    \n            return plugin;\n        }\n        \n        register(null, {\n            MyBaseClass: MyBaseClass\n        });\n    }\n});\n```","excerpt":"","slug":"base-classes","type":"basic","title":"Base Classes"}
A plugin is always an instance of `Plugin()` either in it's pure vanilla form or one of the many classes that are based on it. These classes all provide additional functionality on top of the base `Plugin()` features, which include event handling and management of resources used by the plugin for easy loading and unloading. Other classes add unique features that can be re-used throughout Cloud9. For instance the `Editor()` class serves as the base class for any of the editor components. Here's an incomplete list of the different types of base classes: - [Dialog](doc:dialog) - [Panel](doc:panel) - [Editor](doc:creating-an-editor-plugin) - MountTab - [DebuggerPanel](doc:debug-panel) - [CollabPane](doc:collab-panel) - [PreferencePanel](doc:preference-panel) The code for creating a basic plugin is this: ```javascript var plugin = new Plugin("Your Name", main.consumes); var emit = plugin.getEmitter(); plugin.on("load", function(){ }); plugin.on("unload", function(){ }); plugin.freezePublicAPI({ show: show }); ``` Some of the base classes allow for setting extra options to create the instance. These options are always passed as the 3rd argument to the constructor. ```javascript var plugin = new Dialog("Your Name", main.consumes, { name: "my-plugin-name", allowClose: true, title: "Some Title" }); ``` Base classes often also introduce new events to the life cycle of the plugin. For instance the `Dialog` base class adds these events: ```javascript plugin.on("draw", function(e){ }); plugin.on("show", function(){ }); plugin.on("hide", function(){ }); ``` # One Base Class per Plugin [block:callout] { "type": "info", "title": "Rule of Thumb", "body": "Only include one base class per plugin." } [/block] For instance, If your package needs to interact with one or more dialogs. Create one or more plugins, one for each dialog. Provide an API for your dialog and access that interface by importing the dialog in your plugin (via `main.consumes`). # Creating your own Base Class To create your own base class use the `plugin.baseclass()` method to mark your class as such. ```javascript define(function(require, module, exports) { main.consumes = ["Plugin", "ui"]; main.provides = ["MyBaseClass"]; return main; function main(options, imports, register) { var ui = imports.ui; function MyBaseClass(developer, deps, options) { var plugin = new Plugin(developer, deps.concat(main.consumes)); var emit = plugin.getEmitter(); // Get the name from the options (optional) var name = options.name; // Mark this plugin as a base class plugin.baseclass(); // Set the public API (Plugin won't be frozen) plugin.freezePublicAPI({ }); // Set default name (will append integer) plugin.load(name, "myclass"); return plugin; } register(null, { MyBaseClass: MyBaseClass }); } }); ```