From b4f3c5710795c0792e7e21659571002079acd133 Mon Sep 17 00:00:00 2001 From: Chip Black Date: Thu, 3 Feb 2011 00:32:43 -0800 Subject: [PATCH] Revamp latest stuff on frontpage --- www/css/blerg.css | 18 ++++++++ www/index.html | 12 ++--- www/js/Bytex64.FX.js | 103 +++++++++++++++++++++++++++++++++++++++++++ www/js/blerg.js | 90 +++++++++++++++++++++++++++++-------- 4 files changed, 199 insertions(+), 24 deletions(-) create mode 100644 www/js/Bytex64.FX.js diff --git a/www/css/blerg.css b/www/css/blerg.css index 8bd4166..4ff8277 100644 --- a/www/css/blerg.css +++ b/www/css/blerg.css @@ -126,3 +126,21 @@ h1, h2, h3 { color: #8F8F8F; text-align: right; } + +#latest h2 { + font-size: 16pt; +} + +#latest-posts { + height: 92pt; + overflow: hidden; +} + +#latest-posts .record { + font-size: 12pt; + margin: 4pt 0; +} + +.author { + font-weight: bold; +} diff --git a/www/index.html b/www/index.html index 20dc6e0..ac215ab 100644 --- a/www/index.html +++ b/www/index.html @@ -7,6 +7,7 @@ Blërg! + @@ -53,12 +54,11 @@
-
-

Quick and dirty hack to show recent tags

-
- -

And here are some users with recent activity

-
+
+

Latest tags

+
+

Latest posts

+

I am 12 and what is this

diff --git a/www/js/Bytex64.FX.js b/www/js/Bytex64.FX.js new file mode 100644 index 0000000..4f9902f --- /dev/null +++ b/www/js/Bytex64.FX.js @@ -0,0 +1,103 @@ +if (typeof(Bytex64) == 'undefined') Bytex64 = {}; +Bytex64.FX = {}; +Bytex64.FX.version = 1.0; + +Bytex64.FX.Effect = function(fx, secs) { + this.fx = fx; + this.secs = secs; + + this.run = function() { + Bytex64.FX.run(this.fx, this.secs); + }; +}; + +Bytex64.FX.ParallelEffect = function(fxs, secs) { + this.fx = function(p) { + for (i in fxs) { + fxs[i](p); + } + }; + this.secs = secs; + + this.run = function() { + Bytex64.FX.run(this.fx, this.secs); + }; +}; + +Bytex64.FX.EffectChain = function(chain) { + this.chain = chain; + this.current = 0; + + this.fx_current = function(p) { + this.chain[this.current].fx(p); + }; + + this.run = function() { + _this = this; + + fx = function(p) { + _this.fx_current(p); + if (p == 1.0) + _this.run_next(); + }; + + Bytex64.FX.run(fx, this.chain[this.current].secs); + }; + + this.run_next = function() { + this.current++; + + if (this.current >= this.chain.length) { + this.current = 0; + return; + } + + this.run(); + }; + +}; + +Bytex64.FX.updateInterval = 50; + +Bytex64.FX.run = function(fx, secs) { + secs = secs * 1000; + + var interval; + var start = (new Date()).getTime(); + + fx(0.0); + + interval = setInterval(function() { + var d = (new Date()).getTime() - start; + if (d >= secs) { + clearInterval(interval); + fx(1.0); + } else { + fx(d/secs); + } + }, Bytex64.FX.updateInterval); +} + +Bytex64.FX.create = function(fx, secs) { + return function() { + Bytex64.FX.run(fx, secs); + } +} + +Bytex64.FX.fadeIn = function(elem) { + return function(p) { + if (p == 0.0) + elem.style.display = 'block'; + elem.style.opacity = p; + } +} + +Bytex64.FX.fadeOut = function(elem) { + return function(p) { + elem.style.opacity = 1.0 - p; + if (p == 1.0) + elem.style.display = 'none'; + } +} + +/* vim: set ts=4 sts=4 sw=4 expandtab: */ diff --git a/www/js/blerg.js b/www/js/blerg.js index eae9cbc..96f6cb2 100644 --- a/www/js/blerg.js +++ b/www/js/blerg.js @@ -8,7 +8,10 @@ var recordTemplate = new Template( '
#{data}
Posted #{date}
' ); var tagRecordTemplate = new Template( - '
#{data}
Posted by @#{author} on #{date}
' + '
#{data}
Posted by @#{author} on #{date}
' +); +var latestRecordsTemplate = new Template( + '
@#{author} #{data}
' ); // Page elements @@ -402,34 +405,85 @@ function resizePostContent() { }, 150); } -function loadNewThings() { - new Ajax.Request(baseURL + '/newtags.json', { +var tickerTimer = null; +var tickerHead, tickerTail; + +function tickerFader(a, b, p) { + var p2 = 1 - p; + + a.style.opacity = p; + a.style.lineHeight = (100 * p) + '%'; + + b.style.opacity = p2; + b.style.lineHeight = (100 * p2) + '%'; + if (p == 1.0) + b.hide(); +} + +function fadeOut(p) { +} + +function ticker() { + tickerHead.show(); + Bytex64.FX.run(tickerFader.curry(tickerHead, tickerTail), 0.5); + tickerHead = tickerHead.nextSibling; + tickerTail = tickerTail.nextSibling; + if (tickerHead == null) { + stopTicker(); + loadLatest.delay(10); + } +} + +function startTicker() { + stopTicker(); + for (var elem = $('latest-posts').firstChild; elem != null; elem = elem.nextSibling) { + elem.hide(); + } + + // Show the first five + tickerHead = $('latest-posts').firstChild; + for (var i = 0; i < 5 && tickerHead; i++) { + tickerHead.show(); + tickerHead = tickerHead.nextSibling; + } + tickerTail = $('latest-posts').firstChild; + tickerTimer = setInterval(ticker, 5000); +} + +function stopTicker() { + if (tickerTimer) + clearInterval(tickerTimer); + tickerTimer = null; +} + +function loadLatest() { + new Ajax.Request(baseURL + '/latest.json', { onSuccess: function(r) { - $('newtags').update(); - r.responseText.evalJSON().each(function(v) { + var j = r.responseText.evalJSON(); + + $('latest-tags').update(); + j.tags.each(function(v) { var a = new Element('a', {href: '/#tag/' + v}); a.insert('#' + v); - $('newtags').insert(a); - $('newtags').insert(new Element('br')); + $('latest-tags').insert(a); + $('latest-tags').appendChild(document.createTextNode(' ')); }); - } - }); - new Ajax.Request(baseURL + '/newusers.json', { - onSuccess: function(r) { - $('newusers').update(); - r.responseText.evalJSON().each(function(v) { - var a = new Element('a', {href: '/#' + v}); - a.insert('@' + v); - $('newusers').insert(a); - $('newusers').insert(new Element('br')); + $('latest-posts').update(); + j.records.each(function(v) { + v.data = v.data.replace(/&/g, '&').replace(//g, '>'); + v.date = (new Date(v.timestamp * 1000)).toString(); + var html = latestRecordsTemplate.evaluate(v); + $('latest-posts').insert(html); }); + startTicker(); } }); } function hashSwitch() { var m; + stopTicker(); if (m = location.search.match(/^\?post\/([^/]+)\/(.+)/)) { $('post').show(); $('post.content').value = '[' + decodeURIComponent(m[1]).replace(']','').replace('[','') + '](' + decodeURIComponent(m[2]) + ')'; @@ -463,7 +517,7 @@ function hashSwitch() { $('older_link').hide(); $('welcome').show(); $('rss').hide(); - loadNewThings(); + loadLatest(); } } -- 2.25.1