62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai// START WRAPPER: The YUI.add wrapper is added by the build system, when you use YUI Builder to build your component from the raw source in this file
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai// YUI.add("mywidget", function(Y) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* Any frequently used shortcuts, strings and constants */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai var Lang = Y.Lang;
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* MyWidget class constructor */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai function MyWidget(config) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai MyWidget.superclass.constructor.apply(this, arguments);
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai }
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * Required NAME static field, to identify the Widget class and
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * used as an event prefix, to generate class names etc. (set to the
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * class name in camel case).
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai MyWidget.NAME = "myWidget";
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * The attribute configuration for the widget. This defines the core user facing state of the widget
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai MyWidget.ATTRS = {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai attrA : {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai value: "A" // The default value for attrA, used if the user does not set a value during construction.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , valueFn: "_defAttrAVal" // Can be used as a substitute for "value", when you need access to "this" to set the default value.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , setter: "_setAttrA" // Used to normalize attrA's value while during set. Refers to a prototype method, to make customization easier
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , getter: "_getAttrA" // Used to normalize attrA's value while during get. Refers to a prototype method, to make customization easier
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , validator: "_validateAttrA" // Used to validate attrA's value before updating it. Refers to a prototype method, to make customization easier
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , readOnly: true // Cannot be set by the end user. Can be set by the component developer at any time, using _set
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , writeOnce: true // Can only be set once by the end user (usually during construction). Can be set by the component developer at any time, using _set
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , lazyAdd: false // Add (configure) the attribute during initialization.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // You only need to set lazyAdd to false if your attribute is
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // setting some other state in your setter which needs to be set during initialization
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // (not generally recommended - the setter should be used for normalization.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // You should use listeners to update alternate state).
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai , broadcast: 1 // Whether the attribute change event should be broadcast or not.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai }
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // ... attrB, attrC, attrD ... attribute configurations.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // Can also include attributes for the super class if you want to override or add configuration parameters
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai };
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * The HTML_PARSER static constant is used if the Widget supports progressive enhancement, and is
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * used to populate the configuration for the MyWidget instance from markup already on the page.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai MyWidget.HTML_PARSER = {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai attrA: function (srcNode) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // If progressive enhancement is to be supported, return the value of "attrA" based on the contents of the srcNode
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai }
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai };
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* Templates for any markup the widget uses. Usually includes {} tokens, which are replaced through Y.substitute */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai MyWidget.MYNODE_TEMPLATE = "<div id={mynodeid}></div>";
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* MyWidget extends the base Widget class */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai Y.extend(MyWidget, Y.Widget, {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai initializer: function() {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * initializer is part of the lifecycle introduced by
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * the Base class. It is invoked during construction,
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * and can be used to setup instance specific state or publish events which
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * require special configuration (if they don't need custom configuration,
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * events are published lazily only if there are subscribers).
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai *
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * It does not need to invoke the superclass initializer.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * init() will call initializer() for all classes in the hierarchy.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai this.publish("myEvent", {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai defaultFn: this._defMyEventFn,
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai bubbles:false
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai });
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai destructor : function() {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * destructor is part of the lifecycle introduced by
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * the Widget class. It is invoked during destruction,
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * and can be used to cleanup instance specific state.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai *
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * Anything under the boundingBox will be cleaned up by the Widget base class
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * We only need to clean up nodes/events attached outside of the bounding Box
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai *
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * It does not need to invoke the superclass destructor.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * destroy() will call initializer() for all classes in the hierarchy.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai renderUI : function() {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * renderUI is part of the lifecycle introduced by the
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * Widget class. Widget's renderer method invokes:
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai *
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * renderUI()
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * bindUI()
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * syncUI()
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai *
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * renderUI is intended to be used by the Widget subclass
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * to create or insert new elements into the DOM.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // this._mynode = Node.create(Y.substitute(MyWidget.MYNODE_TEMPLATE, {mynodeid: this.get("id") + "_mynode"}));
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai bindUI : function() {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * bindUI is intended to be used by the Widget subclass
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * to bind any event listeners which will drive the Widget UI.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai *
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * It will generally bind event listeners for attribute change
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * events, to update the state of the rendered UI in response
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * to attribute value changes, and also attach any DOM events,
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * to activate the UI.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // this.after("attrAChange", this._afterAttrAChange);
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai syncUI : function() {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /*
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * syncUI is intended to be used by the Widget subclass to
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * update the UI to reflect the initial state of the widget,
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * after renderUI. From there, the event listeners we bound above
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai * will take over.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // this._uiSetAttrA(this.get("attrA"));
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // Beyond this point is the MyWidget specific application and rendering logic
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* Attribute state supporting methods (see attribute config above) */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai _defAttrAVal : function() {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // this.get("id") + "foo";
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai _setAttrA : function(attrVal, attrName) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // return attrVal.toUpperCase();
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai _getAttrA : function(attrVal, attrName) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // return attrVal.toUpperCase();
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai _validateAttrA : function(attrVal, attrName) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // return Lang.isString(attrVal);
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* Listeners, UI update methods */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai _afterAttrAChange : function(e) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* Listens for changes in state, and asks for a UI update (controller). */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // this._uiSetAttrA(e.newVal);
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai _uiSetAttrA : function(val) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai /* Update the state of attrA in the UI (view) */
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // this._mynode.set("innerHTML", val);
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai },
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai _defMyEventFn : function(e) {
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai // The default behavior for the "myEvent" event.
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai }
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai });
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai Y.namespace("MyApp").MyWidget = MyWidget;
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai
e808b8824ca1091c8efb5669db9129e68e5e1c14Satyen Desai// }, "3.2.0", {requires:["widget", "substitute"]});
62509f008d5e74c5dfe93307eebb094e9c997f11Satyen Desai// END WRAPPER