mirror of
https://github.com/webOSArchive/mochi
synced 2026-11-07 03:12:32 -05:00
59 lines
2.7 KiB
JavaScript
59 lines
2.7 KiB
JavaScript
enyo.kind({
|
|
name: "mochi.sample.IconButtonSample",
|
|
classes: "mochi mochi-sample enyo-fit",
|
|
kind: "FittableRows",
|
|
components: [
|
|
{kind: "enyo.Scroller", fit: true, components:[
|
|
{kind: "mochi.Subheader", content: "Icon Button: Default/Disabled"},
|
|
{classes: "mochi-sample-tools", components: [
|
|
{kind: "mochi.IconButton", src: "assets/sample-calendar-icon.png", ontap: "iconTapped"},
|
|
{kind: "mochi.IconButton", src: "assets/sample-calendar-icon.png", ontap: "iconTapped", disabled: true}
|
|
]},
|
|
{tag: "br"},
|
|
{kind: "mochi.Subheader", content: "Icon Button: Active Default/Active Disabled"},
|
|
{classes: "mochi-sample-tools", components: [
|
|
{kind: "mochi.IconButton", src: "assets/sample-calendar-icon.png", ontap: "iconTapped", active: true},
|
|
{kind: "mochi.IconButton", src: "assets/sample-calendar-icon.png", ontap: "iconTapped", active: true, disabled: true}
|
|
]},
|
|
{tag: "br"},
|
|
{kind: "mochi.Subheader", content: "Icon Button: Custom Buttons"},
|
|
{classes: "mochi-sample-tools", components: [
|
|
//{kind: "mochi.IconButton", src: "assets/sample-calendar-icon.png", ontap: "iconTapped", barClasses: "mochi-sample-progress-red"},
|
|
{kind: "mochi.IconButton", src: "assets/sample-calendar-icon.png", ontap:"iconTapped", decoratorLeft: "[", decoratorRight: "]" }
|
|
]},
|
|
{tag: "br"},
|
|
{kind: "mochi.Subheader", content: "Icon Button: View Select Group"},
|
|
{classes: "mochi-sample-tools", components: [
|
|
{kind: "mochi.ViewSelectButton", onActivate: "buttonActivated", components: [
|
|
{kind: "mochi.IconButtonItem", src: "assets/sample-calendar-icon-custom.png"},
|
|
{kind: "mochi.IconButtonItem", src: "assets/sample-calendar-icon-custom.png", active: true},
|
|
{kind: "mochi.IconButtonItem", src: "assets/sample-calendar-icon-custom.png"},
|
|
{kind: "mochi.IconButtonItem", src: "assets/sample-calendar-icon-custom.png", disabled: true},
|
|
{kind: "mochi.IconButtonItem", src: "assets/sample-calendar-icon-custom.png"}
|
|
]}
|
|
]},
|
|
{tag: "br"},
|
|
{classes: "mochi-sample-tools", components: [
|
|
{name: "result", classes: "mochi-sample-content", content: "result"}
|
|
]}
|
|
]}
|
|
],
|
|
iconTapped: function(inSender, inEvent) {
|
|
this.$.result.setContent("The \"" + inSender.name + "\" icon button was tapped.");
|
|
},
|
|
ordinals: ["1st", "2nd", "3rd"],
|
|
iconGroupActivated: function(inSender, inEvent) {
|
|
/*
|
|
if (inEvent.originator.getActive()) {
|
|
var selected = inEvent.originator.indexInContainer();
|
|
this.$.result.setContent("The " + this.ordinals[selected] + " icon button in the group is selected.");
|
|
}
|
|
*/
|
|
},
|
|
buttonActivated: function(inSender, inEvent) {
|
|
if (inEvent.originator.getActive()) {
|
|
this.$.result.setContent("The \"" + inEvent.originator.name + "\" button is selected.");
|
|
}
|
|
}
|
|
});
|