diff options
| -rw-r--r-- | src/site.clj | 2 | ||||
| -rwxr-xr-x | static/css/header.css | 17 | ||||
| -rw-r--r-- | static/img/youtube.controls.png | bin | 0 -> 1362 bytes | |||
| -rw-r--r-- | static/js/pichat.js | 113 |
4 files changed, 123 insertions, 9 deletions
diff --git a/src/site.clj b/src/site.clj index 084f34c..8a4ab71 100644 --- a/src/site.clj +++ b/src/site.clj @@ -268,7 +268,7 @@ }) ;; User-id/nick cache -;; I keep needing to grab user-id from a nick or nick from a user-id so I thought I'd cache them +;; I keep needing to grab user-id from a nick so I thought I'd cache them (def user-id-cache (ref {})) (def *user-id-cache-size* 500) diff --git a/static/css/header.css b/static/css/header.css index 4c64c72..bf2b0bd 100755 --- a/static/css/header.css +++ b/static/css/header.css @@ -328,3 +328,20 @@ image-rendering: -moz-crisp-edges; width: 27px; display: block; } + +a.youtube { + position: relative; +} + +.youtube .youtube-thumb { + width: 130px; + height: 97px; + padding-bottom: 22px; + margin: 0; +} +.youtube .youtube-controls { + position: absolute; + left: 0; + bottom: 0; + margin: 0; +}
\ No newline at end of file diff --git a/static/img/youtube.controls.png b/static/img/youtube.controls.png Binary files differnew file mode 100644 index 0000000..77e5d04 --- /dev/null +++ b/static/img/youtube.controls.png diff --git a/static/js/pichat.js b/static/js/pichat.js index 886e2c1..46ae121 100644 --- a/static/js/pichat.js +++ b/static/js/pichat.js @@ -6,6 +6,7 @@ var RawFavs = {} var MaxImagePosts = 40 // todo: preload these. also, look into image sprites (no go on animating their sizes tho) +// css clipping perhaps? Imgs = { "chatThumb": "/static/img/thumbs/smallheartfaved.gif", "chatThumbBig": "/static/img/thumbs/chatheartover.gif", @@ -73,19 +74,71 @@ function linkify(text) { // durty hack to use a global to check this... but otherwise i'd have to rewrite the String.replace function? :/ var LastMsgContainsImage = false function linkReplace(url) { - var urlWithoutParams = url.replace(/\?.*$/i, ""); + //var urlWithoutParams = url.replace(/\?.*$/i, ""); if (url.indexOf('http://') == 0 || url.indexOf('https://') == 0 || url.indexOf('ftp://') == 0) linkUrl = url; else linkUrl = 'http://' + url; - if (PicRegex.test(urlWithoutParams)){ - LastMsgContainsImage = true - return "<a target='_blank' href='" + linkUrl + "'><img src='" + linkUrl + "'></a>" - } else { - return "<a target='_blank' href='" + linkUrl + "'>" + url + "</a>" + var uri = parseUri(url) + switch(getUriType(uri)) { + case 'image': + LastMsgContainsImage = true; + return "<a target='_blank' href='" + linkUrl + "'><img src='" + linkUrl + "'></a>"; break; + case 'youtube': + Youtube.startAnimation(); + return "<a target='_blank' class='youtube' href='" + linkUrl + "'>" + + "<img class='youtube-thumb' width='130' height='97' src='"+Youtube.nextThumbUrl(uri.queryKey.v)+"'>" + + "<img class='youtube-controls' src='/static/img/youtube.controls.png'></a>"; break; + default: + return "<a target='_blank' href='" + linkUrl + "'>" + url + "</a>"; } + +} + +Youtube = { + "timer": 0, + + "startAnimation": function(){ + if (!Youtube.timer) + Youtube.timer = setTimeout(Youtube.animate, 1000) + }, + + "animate": function(){ + var thumbs = $(".youtube-thumb") + thumbs.each(Youtube.nextThumb) + if (thumbs.length == 0){ + clearTimeout(Youtube.timer) + Youtube.timer = 0 + } else Youtube.timer = setTimeout(Youtube.animate, 1000); + }, + + "nextThumb": function(){ + var img = $(this); + // yt thumb url is http://i.ytimg.com/vi/0123456789A/1.jpg + var v = img.attr("src").substr(22,11) + var num = img.attr("src").charAt(34); + img.attr("src", (Youtube.nextThumbUrl(v, num))) + }, + + "nextThumbUrl": function(v, num){ + if (!num) num = 0; + num = (parseInt(num) % 3) + 1 // cycle over 1,2,3 + return "http://i.ytimg.com/vi/" + v + "/" + num + ".jpg" + }, + +} + + +function getUriType(uri){ + if (PicRegex.test(uri.file.toLowerCase())) + return "image"; + + if (parseDomain(uri.host) == "youtube.com" && 'v' in uri.queryKey) + return "youtube"; + + return "link"; } function linkifyWithoutImage(text) { @@ -758,7 +811,8 @@ function initBigHand(id){ } -// grab message id etc from some element e that's inside a message +// grab message id etc from some element e that's inside a dump +// (messages have something like id="message-0001" class="dump" ) function getMessageInfo(e){ var message = $(e).parents(".dump") var id = message.attr("id").substr(8) // cut "message-001" to "001" @@ -807,7 +861,7 @@ Tag = { if (favorited) { Tag.rm(message.id, "favorite") $(button).parents(".dump").removeClass("favorite") - if (RawFavs && RawFavs[message.id]) { + if (RawFavs[message.id]) { delete RawFavs[message.id] paletteImageCache = false } @@ -865,3 +919,46 @@ function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } + +function timeFunc(f){ + var start = new Date().getTime(); + var res = f(); + console.log((new Date().getTime()) - start + " msecs"); + return res; +} + +// parseUri 1.2.2 from http://blog.stevenlevithan.com/archives/parseuri +// (c) Steven Levithan <stevenlevithan.com>, MIT License +function parseUri (str) { + var o = parseUri.options, + m = o.parser[o.strictMode ? "strict" : "loose"].exec(str), + uri = {}, + i = 14; + + while (i--) uri[o.key[i]] = m[i] || ""; + + uri[o.q.name] = {}; + uri[o.key[12]].replace(o.q.parser, function ($0, $1, $2) { + if ($1) uri[o.q.name][$1] = $2; + }); + + return uri; +}; + +parseUri.options = { + strictMode: false, + key: ["source","protocol","authority","userInfo","user","password","host","port","relative","path","directory","file","query","anchor"], + q: { + name: "queryKey", + parser: /(?:^|&)([^&=]*)=?([^&]*)/g + }, + parser: { + strict: /^(?:([^:\/?#]+):)?(?:\/\/((?:(([^:@]*)(?::([^:@]*))?)?@)?([^:\/?#]*)(?::(\d*))?))?((((?:[^?#\/]*\/)*)([^?#]*))(?:\?([^#]*))?(?:#(.*))?)/, + loose: /^(?:(?![^:@]+:[^:@\/]*@)([^:\/?#.]+):)?(?:\/\/)?((?:(([^:@]*)(?::([^:@]*))?)?@)?([^:\/?#]*)(?::(\d*))?)(((\/(?:[^?#](?![^?#\/]*\.[^?#\/.]+(?:[?#]|$)))*\/?)?([^?#\/]*))(?:\?([^#]*))?(?:#(.*))?)/ + } +}; +// end parseUri + +function parseDomain(host){ + return host.toLowerCase().replace(/^www\./, "") +}
\ No newline at end of file |
