www/jssrc/blerg/Welcome.js

   1 enyo.kind({
   2     name: "blerg.Welcome",
   3     statics: {
   4         locationDetect: function(l) {
   5             if (l.hash.match(/^(#\/?)?$/))
   6                 return {kind: "blerg.Welcome"}
   7             else
   8                 return false;
   9         }
  10     },
  11     components: [
  12         {components: [
  13             {style: "float: right; text-align: center; margin: 0 0 1em 1em;", components: [
  14                 {style: "font-size: 14pt; margin-bottom: 4pt;", content: "Curious? Click this unbelievably obnoxious button!"},
  15                 {kind: "onyx.Button", content: "I want to Blërg!", classes: "signup-button", onclick: "startSignup"}
  16             ]}
  17         ]},
  18         {allowHtml: true, content: '<h2>I am 12 and what is this</h2> <p>Blërg is a microblogging platform.  Or maybe a miniblogging platform.  Blërg is not sure.  Blërg is a lot like <a href="http://twitter.com/">Twitter</a>, but aims to fix some of its idiosyncracies.  Blërg does not want to be a full blogging platform like <a href="http://wordpress.com/">Wordpress</a> or <a href="http://livejournal.com/">Livejournal</a>.  Blërg is also an <a href="/doc/">open source tagged text database engine</a> written in C that does the back-end work. Blërg\'s author finds it entertaining to anthropomorphize Blërg in the third person.</p>'},
  19         {name: "moreLink", kind: "blerg.Link", onNavigate: "loadMore", content: "Tell me more..."},
  20         {style: "clear: both;"},
  21         {name: "contentBox", allowHtml: true},
  22         {classes: "latest", components: [
  23             {classes: "latest-posts", components: [
  24                 {name: "latestPostsScroller", classes: "latest-scroller", onmouseover: "pauseTicker", onmouseout: "startTicker", components: [
  25                     {tag: "h2", content: "Latest posts"},
  26                     {name: "latestPosts"}
  27                 ]}
  28             ]},
  29             {classes: "latest-tags", components: [
  30                 {classes: "latest-scroller", components: [
  31                     {tag: "h2", content: "Latest tags"},
  32                     {name: "latestTags"}
  33                 ]}
  34             ]}
  35         ]}
  36     ],
  37     create: function() {
  38         this.inherited(arguments);
  39
  40         this.bubble("onSetTitle", {section: "Welcome!"});
  41         this.loadLatest();
  42     },
  43     destroy: function() {
  44         this.stopTicker();
  45         this.inherited(arguments);
  46     },
  47     loadMore: function() {
  48         var req = new enyo.Ajax({
  49             url: "/welcome.html",
  50             handleAs: "text"
  51         });
  52         req.response(function(inSender, inResponse) {
  53             this.$.contentBox.setContent(inResponse);
  54             this.$.moreLink.hide();
  55         }.bind(this));
  56         req.go();
  57     },
  58     startSignup: function() {
  59         this.bubble('onStartSignup');
  60     },
  61     loadLatest: function() {
  62         var req = new enyo.Ajax({
  63             url: baseURL + '/latest.json'
  64         });
  65         req.response(function(inSender, inResponse) {
  66             this.$.latestTags.destroyComponents();
  67             for (var i = 0; i < inResponse.tags.length; i++) {
  68                 var v = inResponse.tags[i];
  69                 this.$.latestTags.createComponent({
  70                     kind: "blerg.Link",
  71                     href: baseURL + "/#/tag/" + v,
  72                     content: "#" + v,
  73                     classes: "ref"
  74                 });
  75                 this.$.latestTags.createComponent({tag: null, content: " "});
  76             }
  77             this.$.latestTags.render();
  78
  79             this.$.latestPosts.destroyComponents();
  80             for (var i = 0; i < inResponse.records.length; i++) {
  81                 var v = inResponse.records[i];
  82                 this.$.latestPosts.createComponent({kind: "blerg.BriefRecord"}, v);
  83             }
  84             this.$.latestPosts.render();
  85             this.startTickerCycle();
  86         }.bind(this));
  87         req.go();
  88     },
  89     startTickerCycle: function() {
  90         var starter = function() {
  91             if (this.$.latestPostsScroller.hasNode()) {
  92                 var n = this.$.latestPostsScroller.node;
  93                 if (n.scrollTop >= n.scrollHeight - n.clientHeight)
  94                     n.scrollTop = 0;
  95                 this.startTicker();
  96             } else {
  97                 this.tickerTimeout = setTimeout(starter, 1000);
  98             }
  99         }.bind(this)
 100         this.tickerTimeout = setTimeout(starter, 2500);
 101     },
 102     startTicker: function() {
 103         if (this.tickerInterval)
 104             return;
 105         this.tickerInterval = setInterval(this.ticker.bind(this), 100);
 106     },
 107     pauseTicker: function() {
 108         clearInterval(this.tickerInterval);
 109         this.tickerInterval = null;
 110     },
 111     stopTicker: function() {
 112         clearTimeout(this.tickerTimeout);
 113         this.tickerTimeout = null;
 114         clearInterval(this.tickerInterval);
 115         this.tickerInterval = null;
 116     },
 117     ticker: function() {
 118         var n = this.$.latestPostsScroller.node;
 119         if (n.scrollTop < n.scrollHeight - n.clientHeight) {
 120             n.scrollTop += 2;
 121         } else {
 122             this.stopTicker();
 123             this.startTickerCycle();
 124         }
 125     }
 126 });