diff --git a/source/ui/Button.js b/source/ui/Button.js index 03ba5ce3f..1c2986c85 100644 --- a/source/ui/Button.js +++ b/source/ui/Button.js @@ -1,10 +1,16 @@ +/** + Implements an HTML button, with support for grouping +*/ enyo.kind({ name: "enyo.Button", + //* @protected kind: enyo.ToolDecorator, tag: "Button", + //* @public published: { disabled: false }, + //* @protected create: function() { this.inherited(arguments); this.disabledChanged(); diff --git a/source/ui/Checkbox.js b/source/ui/Checkbox.js index f3d5f887b..f1a11582e 100644 --- a/source/ui/Checkbox.js +++ b/source/ui/Checkbox.js @@ -1,5 +1,9 @@ +/** + Implements an HTML checkbox input, with support for grouping +*/ enyo.kind({ name: "enyo.Checkbox", + //* @protected kind: enyo.Input, attributes: { type: "checkbox" @@ -7,10 +11,14 @@ enyo.kind({ events: { onActivate: "" }, + //* @public published: { + //* Value of the checkbox checked: false, + //* Group API requirement for determining selected item active: false }, + //* @protected handlers: { onchange: "change", onclick: "click" diff --git a/source/ui/Group.js b/source/ui/Group.js index 77bac4993..7e32734e7 100644 --- a/source/ui/Group.js +++ b/source/ui/Group.js @@ -1,15 +1,18 @@ +/** + Provides a wrapper around multiple elements. Enables creation of radio groups from arbitrary components supporting the [GroupItem](#enyo.GroupItem) api. +*/ enyo.kind({ name: "enyo.Group", published: { + //* Can there be only one? highlander: true, + //* The control that is selected active: null }, + //* @protected handlers: { onActivate: "activate" }, - create: function() { - this.inherited(arguments); - }, activate: function(inSender, inEvent) { if (this.highlander) { // deactivation messages are ignored unless it's an attempt @@ -35,4 +38,4 @@ enyo.kind({ this.active.addClass("active"); } } -}); \ No newline at end of file +}); diff --git a/source/ui/GroupItem.js b/source/ui/GroupItem.js index aa883880a..900bee256 100644 --- a/source/ui/GroupItem.js +++ b/source/ui/GroupItem.js @@ -1,8 +1,10 @@ +//* Base kind for the Grouping api enyo.kind({ name: "enyo.GroupItem", published: { active: false }, + //* @protected create: function() { this.inherited(arguments); this.activeChanged(); @@ -10,4 +12,4 @@ enyo.kind({ activeChanged: function() { this.bubble("onActivate"); } -}); \ No newline at end of file +}); diff --git a/source/ui/Image.js b/source/ui/Image.js index 2bfeafab0..ab1ee0c15 100644 --- a/source/ui/Image.js +++ b/source/ui/Image.js @@ -1,5 +1,9 @@ +/** + Implements an HTML img element, and bubbles the onload, and onerror events +*/ enyo.kind({ name: "Image", + //* @protected tag: "img", attributes: { onload: enyo.bubbler, diff --git a/source/ui/Input.js b/source/ui/Input.js index af3982dd9..16e8fc75c 100644 --- a/source/ui/Input.js +++ b/source/ui/Input.js @@ -1,14 +1,22 @@ +/** + Implements an HTML input element with cross platform support for change events +*/ enyo.kind({ name: "enyo.Input", published: { + //* Default value of the input value: "", + //* Text to display when the input is empty placeholder: "", disabled: false }, events: { + //* Sent when the input's value has changed, support for IE included. onInputChange: "", + //* Sent when the input's is disabled or enabled. onDisabledChange: "" }, + //* @protected tag: "input", classes: "enyo-input", attributes: { diff --git a/source/ui/NoDom.js b/source/ui/NoDom.js index 389461f72..06f2b1406 100644 --- a/source/ui/NoDom.js +++ b/source/ui/NoDom.js @@ -1,6 +1,9 @@ +/** + A control that returns as its components HTML as its own. +*/ enyo.kind({ name: "enyo.NoDom", generateOuterHtml: function(inHtml) { return inHtml; } -}); \ No newline at end of file +}); diff --git a/source/ui/Repeater.js b/source/ui/Repeater.js index 133226795..da6773df3 100644 --- a/source/ui/Repeater.js +++ b/source/ui/Repeater.js @@ -1,22 +1,39 @@ -enyo.kind({ +/** + A simple control for making lists of items. + + Components of Repeater are copied for each row created, wrapped in a control keeping state of the row index. + + Example: + + {kind: "Repeater", rows: 2, onSetupRow: "setImageSource", components: [ + {kind: "Image"} + ]} + + setImageSource: function(inSender, inEvent) { + var index = inEvent.index; + var rowControl = inEvent.row; + rowControl.$.image.setSrc(this.imageSources[index]); + } +*/ +enyo.kind({ name: "enyo.Repeater", kind: enyo.Control, published: { + //* How many rows to render rows: 0 }, events: { + //* Sends the row index, and the row control, for decoration onSetupRow: "" }, + //* @protected initComponents: function() { this.rowComponents = this.components; this.components = null; this.inherited(arguments); }, - //* @protected - generateInnerHtml: function() { - //this.build(); - return this.inherited(arguments); - }, + //* @public + //* Render the list build: function() { this.destroyClientControls(); for (var i=0; i