Web   ·   Wiki   ·   Activities   ·   Blog   ·   Lists   ·   Chat   ·   Meeting   ·   Bugs   ·   Git   ·   Translate   ·   Archive   ·   People   ·   Donate
summaryrefslogtreecommitdiffstats
path: root/html/app.js
diff options
context:
space:
mode:
Diffstat (limited to 'html/app.js')
-rw-r--r--html/app.js79
1 files changed, 79 insertions, 0 deletions
diff --git a/html/app.js b/html/app.js
new file mode 100644
index 0000000..3fb4be6
--- /dev/null
+++ b/html/app.js
@@ -0,0 +1,79 @@
+// Sample using Enyo to handle Art4apps library
+
+// Item component with image, text and sound
+enyo.kind({
+ name: "Item.Element",
+ kind: enyo.Control,
+ published: { image: "", sound: "", text: "" },
+ ontap: "taped",
+ components: [
+ { name: "itemImage", classes: "itemImage", kind: "Image", ontap: "taped" },
+ { name: "itemText", classes: "itemText", ontap: "taped" },
+ { name: "itemSound", classes: "itemSound", kind: "HTML5.Audio", preload: "auto", autobuffer: true, controlsbar: true }
+ ],
+
+ // Constructor
+ create: function() {
+ this.inherited(arguments);
+ this.imageChanged();
+ this.soundChanged();
+ this.textChanged();
+ },
+
+ // Image setup
+ imageChanged: function() {
+ if (this.image.length != 0) {
+ this.$.itemImage.setAttribute("src", this.image);
+ this.$.itemImage.show();
+ } else {
+ this.$.itemImage.hide();
+ }
+ },
+
+ // Sound setup
+ soundChanged: function() {
+ this.$.itemSound.setSrc(this.sound);
+ },
+
+ // Text setup
+ textChanged: function() {
+ if (this.text.length != 0) {
+ this.$.itemText.setContent(this.text);
+ this.$.itemText.show();
+ } else {
+ this.$.itemText.show();
+ }
+ },
+
+ // Play sound when image taped
+ taped: function() {
+ if (this.$.itemSound.paused())
+ this.$.itemSound.play();
+ else
+ this.$.itemSound.pause();
+ }
+});
+
+
+// Main app class
+enyo.kind({
+ name: "TestArt4Apps",
+ kind: enyo.Control,
+ components: [
+ { components: [
+ { content: "Click image or use control bar to hear the word.", classes: "title" },
+ { kind: "Item.Element", text: "Alligator", image: "images/alligator.png", sound: ["audio/alligator.ogg", "audio/alligator.mp3"], classes: "item" },
+ { kind: "Item.Element", text: "Girl", image: "images/girl.png", sound: ["audio/girl.ogg", "audio/girl.mp3"], classes: "item" },
+ { kind: "Item.Element", text: "Sandwich", image: "images/sandwich.png", sound: ["audio/sandwich.ogg", "audio/sandwich.mp3"], classes: "item" },
+ { classes: "footer", components: [
+ { content: "Images and sounds CC BY-SA from", classes: "licence" },
+ { tag: "a", attributes: {"href":"http://art4apps.org/"}, content: "Art4Apps", classes: "licence" }
+ ]}
+ ]}
+ ],
+
+ // Constructor
+ create: function() {
+ this.inherited(arguments);
+ }
+});