Georg/dbot
1
0
Fork 0
forked from GitHub/dbot
Code Issues Pull Requests Projects Releases Wiki Activity

add history

Browse Source
This commit is contained in:
Douglas Gardner 2013-04-17 20:02:36 +00:00
parent eb151b658d
commit 4c26a0fc3a
2 changed files with 51 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
public/imgurr.css
View File

@ -18,31 +18,36 @@
top:25px; top:25px;
} }
#link { #history a {
left:25px; left:25px;
text-align:center; text-align:center;
width:168px; width:168px;
font-family:monospace font-family:monospace
margin-bottom:15px;
} }
#link,#loading { #history a,#loading {
font-family:monospace; font-family:monospace;
font-size:10px; font-size:10px;
padding:10px; padding:10px;
top:95px; display:block;
} }
#loading { #loading {
font-weight:500; font-weight:500;
left:220px; left:220px;
min-width:95px; min-width:95px;
top:95px;
} }
#loading,#details,#link { #loading,#details,#history a {
background:rgba(43,43,43,0.8); background:rgba(43,43,43,0.8);
border-radius:5px; border-radius:5px;
color:#85bf25; color:#85bf25;
font-family:sans-serif; }
#history,#loading,#details {
position:absolute; position:absolute;
} }
@ -52,3 +57,33 @@ html,body {
margin:0; margin:0;
padding:0; padding:0;
} }
#history {
top:95px;
left:25px;
max-height:210x;
overflow:hidden;
}
#history a {
margin-bottom:10px;
opacity:0.05;
}
#details {
font-family:sans-serif;
}
#history a:hover, #history a:nth-of-type(1) {
opacity:1 !important;
}
#history a:nth-of-type(2) {
opacity:0.8;
}
#history a:nth-of-type(3) {
opacity:0.6;
}
#history a:nth-of-type(4) {
opacity:0.4;
}
#history a:nth-of-type(5) {
opacity:0.2;
}

8
views/imgur/imgurr.jade
View File

@ -9,7 +9,7 @@ html(lang='en')
var count = 0; var count = 0;
function getNewImage() { function getNewImage() {
count += 1; count += 1;
$('#loading').show(); $('#loading').fadeIn();
$('#loading').text('Loading image ' + count + '...'); $('#loading').text('Loading image ' + count + '...');
document.title = 'random imgur (' + count + ')'; document.title = 'random imgur (' + count + ')';
$('#loading').fadeIn(); $('#loading').fadeIn();
@ -17,8 +17,7 @@ html(lang='en')
$.get("/api/imgur/getRandomImage", function(d) { $.get("/api/imgur/getRandomImage", function(d) {
$('#image').attr('src', d.data[0]); $('#image').attr('src', d.data[0]);
$('#details').text("Fetching info..."); $('#details').text("Fetching info...");
$('#link').text(d.data[0]); $('<a href="' + d.data[0] + '">' + d.data[0] + '</a>').prependTo('#history').hide().slideDown();
$('#link').attr('href',d.data[0]);
$.get("/api/imgur/getImageInfoString", { 'slug': d.data[1] }, function(info) { $.get("/api/imgur/getImageInfoString", { 'slug': d.data[1] }, function(info) {
if(info.data[0].indexOf('undefined') == -1) { if(info.data[0].indexOf('undefined') == -1) {
$("#details").text(count + ': ' + info.data[0]); $("#details").text(count + ': ' + info.data[0]);
@ -35,6 +34,7 @@ html(lang='en')
body body
div#loading Loading image 1... div#loading Loading image 1...
div#details Press [SPACE] to load a new image div#details Press [SPACE] to load a new image
a#link [SPACE] for next div#history
a Press [SPACE] for next
div#container div#container
img#image img#image