Fix list selector on load
[Hacks.git] / Main.js
diff --git a/Main.js b/Main.js
index 68194e2..086d9eb 100644 (file)
--- a/Main.js
+++ b/Main.js
@@ -2,16 +2,22 @@
  * See COPYING for licensing information */
 enyo.kind({
        name: "Main",
-       kind: "VFlexBox",
-       style: "background-color: black",
+       kind: "Pane",
        components: [
                {kind: "ApplicationEvents", onWindowActivated: "windowActivated", onWindowDeactivated: "windowDeactivated"},
-               {name: "hacksCarousel", kind: "Carousel", flex: 1, onGetLeft: "getLeft", onGetRight: "getRight", onScroll: "scrolling", onScrollStart: "startScroll", onScrollStop: "stopScroll"},
-               {name: "info", kind: "HFlexBox", className: "info", style: "opacity: 0", showing: false, components: [
-                       {name: "title"},
-                       {kind: "Spacer"},
-                       {name: "notice", className: "notice"}
-               ]}
+               {name: "mainView", kind: "VFlexBox", components: [
+                       {name: "hacksCarousel", kind: "Carousel", flex: 1, onGetLeft: "getLeft", onGetRight: "getRight", onScroll: "scrolling", onScrollStart: "startScroll", onScrollStop: "stopScroll"},
+                       {name: "info", kind: "HFlexBox", className: "info", align: "center", style: "opacity: 0", onclick: "infoFade", components: [
+                               {className: "wrench", onclick: "openPreferences"},
+                               {name: "hacksListSelector", kind: "ListSelector", popupAlign: "left", onChange: "selectHack", style: "width: 200px"},
+                               {kind: "Spacer"},
+                               {name: "notice", className: "notice"}
+                       ]},
+                       {name: "noPrefsDialog", kind: "ModalDialog", caption: "No Preferences", components: [
+                               {kind: "Button", content: "Okay", onclick: "closeNoPrefsDialog"}
+                       ]}
+               ]},
+               {name: "preferencesView", kind: "HackPreferences", onClose: "savePreferences"}
        ],
        hacksList: [
                {name: "Nimbus", kind: "Nimbus", dark: false},
@@ -26,24 +32,31 @@ enyo.kind({
        ],
        create: function() {
                this.inherited(arguments);
-               /*
-               this.index = localStorage.getItem('hack.index');
-               if (!this.index)
+               try {
+                       this.index = parseInt(localStorage.getItem('hack.index'));
+                       if (!this.index)
+                               this.index = 0;
+               } catch(e) {
+                       enyo.log("Could not load last hack index");
                        this.index = 0;
-               */
-               this.index = 0;
+               }
                this.lastScrollPos = 0;
                this.$.hacksCarousel.setCenterView(this.getHack(this.index));
        },
        ready: function() {
+               var displayList = [];
+               for (var i = 0; i < this.hacksList.length; i++) {
+                       displayList.push({
+                               caption: this.hacksList[i].name,
+                               value: i
+                       });
+               }
+               this.$.hacksListSelector.setItems(displayList);
+               this.$.hacksListSelector.setValue(this.index);
                this.startHack();
                window.addEventListener('resize', this.resizeHack.bind(this), false);
+               this.$.info.addRemoveClass('dark', this.hacksList[this.index].dark);
                this.setNotice('Swipe for more...');
-               this.setTitle(this.hacksList[this.index].name);
-       },
-       setTitle: function(title) {
-               this.$.title.setContent(title);
-               this.infoFade();
        },
        setNotice: function(notice) {
                this.$.notice.setContent(notice);
@@ -51,30 +64,68 @@ enyo.kind({
        },
        infoFade: function() {
                this.$.info.setStyle('opacity: 1');
-               this.$.info.show();
 
                clearTimeout(this.noticeTimer);
                this.noticeTimer = setTimeout(function() {
                        this.$.info.setStyle('opacity: 0');
                        setTimeout(function() {
-                               this.$.info.hide();
-                               this.setNotice('');
-                               this.setTitle('');
+                               this.$.notice.setContent('');
                        }.bind(this), 600);
                }.bind(this), 5000);
        },
+       openPreferences: function() {
+               var view = this.$.hacksCarousel.fetchView('center');
+
+               var meta = view.getPreferencesMetadata();
+               if (meta.length) {
+                       view.stop();
+                       var values = view.getPreferences();
+                       this.$.preferencesView.load(this.hacksList[this.index].name, meta, values);
+                       this.selectView(this.$.preferencesView);
+               } else {
+                       this.$.noPrefsDialog.openAtCenter();
+               }
+       },
+       savePreferences: function(inSender, prefs) {
+               var view = this.$.hacksCarousel.fetchView('center');
+               if (prefs == null) {
+                       enyo.log("Clearing prefs");
+                       view.resetPreferences(prefs);
+                       this.selectHack(this, this.index);
+               } else {
+                       enyo.log("Saving prefs: " + JSON.stringify(prefs));
+                       view.setPreferences(prefs);
+                       view.start();
+               }
+               this.back();
+       },
        windowActivated: function() {
                this.startHack();
        },
        windowDeactivated: function() {
                this.stopHack();
        },
+       selectHack: function(inSender, inValue) {
+               this.stopHack();
+               this.index = inValue;
+               this.lastScrollPos = 0;
+               this.$.hacksCarousel.setCenterView(this.getHack(this.index));
+               this.$.info.addRemoveClass('dark', this.hacksList[this.index].dark);
+               // For some reason, setCenterView above fires the startScroll
+               // event without a subsequent stopScroll event.  To work around
+               // this, we defer the start until later.
+               setTimeout(function() { this.startHack() }.bind(this), 20);
+       },
        startHack: function(direction) {
                var view = this.$.hacksCarousel.fetchView(direction || 'center');
                //enyo.log('starting view ' + view);
                if (view)
                        view.start();
-               //localStorage.setItem('hack.index', this.index);
+               try {
+                       localStorage.setItem('hack.index', this.index);
+               } catch(e) {
+                       enyo.log("Could not set hack index");
+               }
        },
        stopHack: function(direction) {
                var view = this.$.hacksCarousel.fetchView(direction || 'center');
@@ -105,8 +156,9 @@ enyo.kind({
        getLeft: function(inSender, inSnap) {
                if (inSnap && this.index > 0) {
                        this.index--;
+                       this.$.hacksListSelector.setValue(this.index);
                        this.hackHidden('right');
-                       this.setTitle(this.hacksList[this.index].name);
+                       this.infoFade();
                        this.$.info.addRemoveClass('dark', this.hacksList[this.index].dark);
                }
                if (this.index == 0)
@@ -117,8 +169,9 @@ enyo.kind({
        getRight: function(inSender, inSnap) {
                if (inSnap && this.index < this.hacksList.length) {
                        this.index++;
+                       this.$.hacksListSelector.setValue(this.index);
                        this.hackHidden('left');
-                       this.setTitle(this.hacksList[this.index].name);
+                       this.infoFade();
                        this.$.info.addRemoveClass('dark', this.hacksList[this.index].dark);
                }
                if (this.index == this.hacksList.length - 1)
@@ -136,5 +189,8 @@ enyo.kind({
        stopScroll: function(inSender) {
                this.lastScrollPos = this.$.hacksCarousel.scrollLeft;
                this.startHack();
+       },
+       closeNoPrefsDialog: function() {
+               this.$.noPrefsDialog.close();
        }
 });