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({noDom: true, 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 });