Generalize "new" button style
[blerg.git] / www / jssrc / blerg / Controls.js
1 enyo.kind({
2     name: "blerg.Controls",
3     kind: "Control",
4     classes: "blerg-controls",
5     username: null,
6     postShowing: false,
7     published: {
8         loggedIn: false
9     },
10     handlers: {
11         onLogin: "login",
12         onLogout: "logout",
13         onPostVisibility: "postVisibilityUpdate",
14         onClearFeedStatus: "clearFeedStatus"
15     },
16     components: [
17         {name: "loggedOutControls", components: [
18             {tag: "form", onkeyup: "loginKeyUp", classes: "login", components: [
19                 {kind: "onyx.Groupbox", components: [
20                     {kind: "onyx.InputDecorator", components: [
21                         {name: "username", kind: "onyx.Input", placeholder: "Username", attributes: {tabindex: 1}}
22                     ]},
23                     {kind: "onyx.InputDecorator", components: [
24                         {name: "password", kind: "onyx.Input", placeholder: "Password", type: "password", attributes: {tabindex: 2}}
25                     ]},
26                 ]},
27                 {kind: "onyx.Button", content: "Login", onclick: "loginClicked", attributes: {tabindex: 3}}
28             ]}
29         ]},
30         {name: "loggedInControls", showing: false, components: [
31             {name: "greeting", classes: "blerg-controls-greeting", components: [
32                 {tag: null, content: "Hello, "},
33                 {name: "userlink", tag: "a"},
34                 {tag: null, content: ". "},
35                 {kind: "blerg.Link", content: "Logout", onNavigate: "logoutClicked"},
36                 {tag: null, content: "."},
37                 {tag: "br"},
38                 {kind: "blerg.Link", content: "Change Password", onNavigate: "changePasswordClicked"},
39                 {tag: null, content: "."}
40             ]},
41             {classes: "blerg-controls-toolbar", components: [
42                 {kind: "onyx.Button", content: "Feed Your Vanity", onclick: "chatterClicked"},
43                 {name: "feedButton", kind: "onyx.Button", classes: "feed-button", content: "Stalk Your Victims", onclick: "feedClicked"},
44                 {name: "spewButton", kind: "onyx.Button", classes: "spew-button", content: "Spew It!", onclick: "spewToggle"}
45             ]},
46         ]},
47         {name: "api", kind: "blerg.API",
48          onFeedInfo: "gotFeedInfo"}
49     ],
50     showRSS: function(url) {
51         this.$.rssButton.show();
52         if (url)
53             this.$.rssButton.setAttribute('href', url);
54     },
55     hideRSS: function() {
56         this.$.rssButton.hide();
57     },
58     loggedInChanged: function() {
59         if (this.loggedIn) {
60             this.$.loggedOutControls.hide();
61             this.$.loggedInControls.show();
62         } else {
63             this.$.loggedOutControls.show();
64             this.$.loggedInControls.hide();
65         }
66     },
67     loginClicked: function(inSender, inEvent) {
68         this.bubble('onTryLogin', {
69             username: this.$.username.getValue(),
70             password: this.$.password.getValue()
71         });
72         inEvent.preventDefault();
73         return true;
74     },
75     loginKeyUp: function(inSender, inEvent) {
76         if (inEvent.keyCode == 13) {
77             if (this.$.username.hasFocus()) {
78                 this.$.password.focus();
79             } else {
80                 this.loginClicked(this, inEvent);
81             }
82             return true;
83         }
84     },
85     logoutClicked: function() {
86         this.bubble('onTryLogout');
87         return true;
88     },
89     login: function(inSender, inEvent) {
90         this.$.password.setValue('');
91         // TODO: Replace with regular blur() call in future enyo
92         this.$.password.node.blur();
93         this.setLoggedIn(true);
94         this.$.userlink.setAttribute('href', '/#' + inEvent.username);
95         this.$.userlink.setContent('@' + inEvent.username);
96         this.username = inEvent.username;
97
98         this.updateFeedInfo();
99         this.feedStatusUpdateInterval = setInterval(function() {
100             this.updateFeedInfo();
101         }.bind(this), 900000);
102     },
103     logout: function(inSender, inEvent) {
104         this.setLoggedIn(false);
105         clearInterval(this.feedStatusUpdateInterval);
106     },
107     changePasswordClicked: function() {
108         this.bubble('onShowChangePassword');
109     },
110     spewToggle: function(inSender, inEvent) {
111         this.postShowing = !this.postShowing;
112         this.bubble('onPostVisibility', {showing: this.postShowing});
113     },
114     postVisibilityUpdate: function(inSender, inEvent) {
115         this.postShowing = inEvent.showing;
116         this.$.spewButton.addRemoveClass('active', inEvent.showing);
117     },
118     updateFeedInfo: function() {
119         this.$.api.getFeedInfo();
120     },
121     gotFeedInfo: function(inSender, inEvent) {
122         this.$.feedButton.addRemoveClass('new', inEvent.new > 0);
123         if (inEvent.new > 0) {
124             this.$.feedButton.setContent('Stalk Your Victims (' + inEvent.new + ')');
125         } else {
126             this.$.feedButton.setContent('Stalk Your Victims');
127         }
128     },
129     chatterClicked: function() {
130         window.location.href = '/#/ref/' + this.username;
131         this.bubble('onNavigate');
132     },
133     feedClicked: function() {
134         window.location.href = '/#/feed';
135         this.bubble('onNavigate');
136     },
137     clearFeedStatus: function() {
138         this.gotFeedInfo(this, {new: 0});
139     }
140 });