Redesign user tasks
[blerg.git] / www / jssrc / blerg / Post.js
1 enyo.kind({
2         name: "blerg.Post",
3         kind: "Control",
4         classes: "blerg-post",
5         handlers: {
6                 onPostVisibility: "postVisibilityUpdate"
7         },
8         resizePostContentTimeout: null,
9         components: [
10                 {tag: "h2", content: "What's on your mind?"},
11                 {kind: "onyx.InputDecorator", components: [
12                         {name: "postContent", classes: "content", kind: "onyx.TextArea", onkeydown: "resizePostContent"}
13                 ]},
14                 {classes: "buttons", components: [
15                         {kind: "onyx.Button", content: "Close", onclick: "closePost", classes: "onyx-negative"},
16                         {kind: "onyx.Button", content: "Post", onclick: "doPost", classes: "onyx-affirmative"}
17                 ]}
18         ],
19         getData: function() {
20                 return this.$.postContent.getValue();
21         },
22         setData: function(inVal) {
23                 this.$.postContent.setValue(inVal);
24         },
25         closePost: function() {
26                 this.bubble('onPostVisibility', {showing: false});
27         },
28         doPost: function() {
29                 this.bubble('onPost', {data: this.getData()});
30         },
31         postVisibilityUpdate: function(inSender, inEvent) {
32                 if (inEvent.showing)
33                         this.show();
34                 else
35                         this.hide();
36         },
37         resizePostContent: function(inSender, inEvent) {
38                 if (this.resizePostContentTimeout)
39                         clearTimeout(this.resizePostContentTimeout);
40                 this.resizePostContentTimeout = setTimeout(function() {
41                         var n = this.$.postContent.hasNode();
42                         if (!n)
43                                 return;
44                         var c = this.getData();
45                         var lines = Math.floor(c.length / (100 * (n.clientWidth / 1000))) + 1;
46                         var m = c.match(/\r?\n/g);
47                         if (m)
48                                 lines += m.length;
49                         if (lines <= 3) {
50                                 this.$.postContent.setStyle("");
51                         } else {
52                                 this.$.postContent.setStyle("height: " + (lines * 17) + "pt");
53                         }
54                         this.resizePostContentTimeout = null;
55                 }.bind(this), 150);
56         }
57 });