{components: [
{style: "float: right; text-align: center; margin: 0 0 1em 1em;", components: [
{style: "font-size: 14pt; margin-bottom: 4pt;", content: "Curious? Click this unbelievably obnoxious button!"},
- {kind: "onyx.Button", content: "I want to Blërg!", style: "font-size: 40pt; padding: 1em; background-color: #C0F; color: #F88;", onclick: "startSignup"}
+ {kind: "onyx.Button", content: "I want to Blërg!", classes: "signup-button", onclick: "startSignup"}
]}
]},
{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>'},
{style: "clear: both;"},
{name: "contentBox", allowHtml: true},
{classes: "latest", components: [
- {tag: "h2", content: "Latest posts"},
- {name: "latestPosts", classes: "latest-posts", onmouseover: "pauseTicker", onmouseout: "startTicker"},
- {tag: "h2", content: "Latest tags"},
- {name: "latestTags", classes: "latest-tags"}
+ {classes: "latest-posts", components: [
+ {name: "latestPostsScroller", classes: "latest-scroller", onmouseover: "pauseTicker", onmouseout: "startTicker", components: [
+ {tag: "h2", content: "Latest posts"},
+ {name: "latestPosts"}
+ ]}
+ ]},
+ {classes: "latest-tags", components: [
+ {classes: "latest-scroller", components: [
+ {tag: "h2", content: "Latest tags"},
+ {name: "latestTags"}
+ ]}
+ ]}
]}
],
create: function() {
req.go();
},
startTickerCycle: function() {
- this.tickerTimeout = setTimeout(function() {
- this.$.latestPosts.node.scrollTop = 0;
- this.startTicker();
- }.bind(this), 2500);
+ var starter = function() {
+ if (this.$.latestPostsScroller.hasNode()) {
+ var n = this.$.latestPostsScroller.node;
+ if (n.scrollTop >= n.scrollHeight - n.clientHeight)
+ n.scrollTop = 0;
+ this.startTicker();
+ } else {
+ this.tickerTimeout = setTimeout(starter, 1000);
+ }
+ }.bind(this)
+ this.tickerTimeout = setTimeout(starter, 2500);
},
startTicker: function() {
if (this.tickerInterval)
this.tickerInterval = null;
},
ticker: function() {
- var n = this.$.latestPosts.node;
+ var n = this.$.latestPostsScroller.node;
if (n.scrollTop < n.scrollHeight - n.clientHeight) {
n.scrollTop += 2;
} else {