webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'ListSample',
        kind: 'List',
        count: 1000,
        items: [],
        handlers: {
            onSetupItem: 'setupItem'
        },
        components: [

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'ListSample',
        kind: 'List',
        count: 10000,
        handlers: {
            onSetupItem: 'setupItem',
            ontap: 'tapped'
        },
        components: [{ name: 'text' }],

webOS101

.dont {
    border: 2px solid red;
    padding: 2px;
}
 
.do {
    border: 2px solid green;
    padding: 2px;
}

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'RepeaterSample',
        kind: 'Scroller',
        components: [{
            kind: 'Repeater',
            count: 100,
            components: [{ name: 'text' }],
            onSetupItem: 'setupItem',
            ontap: 'tapped'

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'AjaxSample',
        components: [
            { kind: 'Button', content: 'Fetch Repositories', ontap: 'fetch' },
            { name: 'repos', content: 'Not loaded...', allowHtml: true }
        ],
        fetch: function() {
            var ajax = new enyo.Ajax({
                url: 'https://api.github.com/users/enyojs/repos'

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'Expando',
        components: [
            { name: 'expander', content: 'Presto',
              style: 
              'width: 100px; background-color: lightblue; text-align: center;' },
            { name: 'animator', kind: 'Animator', duration: 1500, startValue: 100,
              endValue: 300, onStep: 'expand', onEnd: 'done' },
            { kind: 'Button', content: 'Start', ontap: 'startAnimator' },

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'Svg',
        svg: '',
        rendered: function() {
            this.inherited(arguments);
            this.svgChanged();
            // Can only call when we have a node
        },
        svgChanged: function() {

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'View',
        classes: 'moon',
        components: [
            { kind: 'moon.Button', content: 'Hello', ontap: 'tapped' },
            { kind: 'moon.CheckboxItem', checked: true, content: 'Check me',
                onchange: 'changed' },
            { kind: 'moon.InputDecorator', components: [
                { kind: 'moon.Input', placeholder: 'Enter something',

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'OnyxSample',
        components: [
            { kind: 'onyx.Toolbar', components: [
                { content: 'Toolbar' },
                { kind: 'onyx.Button', content: 'Toolbar Button' }
            ]},
            { content: 'Radio Group' },
            { kind: 'onyx.RadioGroup', onActivate: 'activated', components: [

webOS101

enyo.ready(function() {
    enyo.kind({
        name: 'ControlSample',
        components: [
            { kind: 'onyx.Button', content: 'Click', ontap: 'tapped' },
            { tag: 'br'},
            { kind: 'onyx.Checkbox', checked: true, onchange: 'changed' },
            { tag: 'br'},
            { kind: 'onyx.InputDecorator', components: [
                { kind: 'onyx.Input', placeholder: 'Enter something',