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!", style: "font-size: 40pt; padding: 1em; background-color: #C0F; color: #F88;", 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             {tag: "h2", content: "Latest posts"},
  24             {name: "latestPosts", classes: "latest-posts", onmouseover: "pauseTicker", onmouseout: "startTicker"},
  25             {tag: "h2", content: "Latest tags"},
  26             {name: "latestTags", classes: "latest-tags"}
  27         ]}
  28     ],
  29     create: function() {
  30         this.inherited(arguments);
  31
  32         this.bubble("onSetTitle", {section: "Welcome!"});
  33         this.loadLatest();
  34     },
  35     destroy: function() {
  36         this.stopTicker();
  37         this.inherited(arguments);
  38     },
  39     loadMore: function() {
  40         var req = new enyo.Ajax({
  41             url: "/welcome.html",
  42             handleAs: "text"
  43         });
  44         req.response(function(inSender, inResponse) {
  45             this.$.contentBox.setContent(inResponse);
  46             this.$.moreLink.hide();
  47         }.bind(this));
  48         req.go();
  49     },
  50     startSignup: function() {
  51         this.bubble('onStartSignup');
  52     },
  53     loadLatest: function() {
  54         var req = new enyo.Ajax({
  55             url: baseURL + '/latest.json'
  56         });
  57         req.response(function(inSender, inResponse) {
  58             this.$.latestTags.destroyComponents();
  59             for (var i = 0; i < inResponse.tags.length; i++) {
  60                 var v = inResponse.tags[i];
  61                 this.$.latestTags.createComponent({
  62                     kind: "blerg.Link",
  63                     href: baseURL + "/#/tag/" + v,
  64                     content: "#" + v,
  65                     classes: "ref"
  66                 });
  67                 this.$.latestTags.createComponent({tag: null, content: " "});
  68             }
  69             this.$.latestTags.render();
  70
  71             this.$.latestPosts.destroyComponents();
  72             for (var i = 0; i < inResponse.records.length; i++) {
  73                 var v = inResponse.records[i];
  74                 this.$.latestPosts.createComponent({kind: "blerg.BriefRecord"}, v);
  75             }
  76             this.$.latestPosts.render();
  77             this.startTickerCycle();
  78         }.bind(this));
  79         req.go();
  80     },
  81     startTickerCycle: function() {
  82         this.tickerTimeout = setTimeout(function() {
  83             this.$.latestPosts.node.scrollTop = 0;
  84             this.startTicker();
  85         }.bind(this), 2500);
  86     },
  87     startTicker: function() {
  88         if (this.tickerInterval)
  89             return;
  90         this.tickerInterval = setInterval(this.ticker.bind(this), 100);
  91     },
  92     pauseTicker: function() {
  93         clearInterval(this.tickerInterval);
  94         this.tickerInterval = null;
  95     },
  96     stopTicker: function() {
  97         clearTimeout(this.tickerTimeout);
  98         this.tickerTimeout = null;
  99         clearInterval(this.tickerInterval);
 100         this.tickerInterval = null;
 101     },
 102     ticker: function() {
 103         var n = this.$.latestPosts.node;
 104         if (n.scrollTop < n.scrollHeight - n.clientHeight) {
 105             n.scrollTop += 2;
 106         } else {
 107             this.stopTicker();
 108             this.startTickerCycle();
 109         }
 110     }
 111 });