pandotdoslashra/js/pandora.js

144 lines
5.5 KiB
JavaScript
Raw Normal View History

2012-04-18 09:33:42 +00:00
Ox.getJSON('json/pandora.json', function(pandora) {
$(function() {
var $body = $('body'),
$icon = $('#icon')
.bind({
click: function() {
$('#menu > div').removeClass('selected');
$page.empty()
.append($('<div>').html('pan.do/ra'))
.append(
$('<img>').attr({
src: 'http://0x2620.org/jpg/jpg/0xDB/Screenshots/IMG_0009.jpg'
})
)
}
}),
$menu = $('<div>').attr({id: 'menu'}).appendTo($body),
$page = $('<div>').attr({id: 'page'}).appendTo($body),
$head = $('<div>').appendTo($page);
$text = $('<div>').appendTo($page);
$prevButton = $('<span>')
.addClass('button')
.attr({id: 'prevButton', title: 'previous'})
.html('&lt;='),
$nextButton = $('<span>')
.addClass('button')
.attr({id: 'nextButton', title: 'next'})
.html('=&gt;'),
tourIndex = 0;
Ox.forEach(pandora.pages, function(data, page) {
var $element, text;
if (page == '') {
$element = $('<img>')
.attr({id: 'icon', src: 'png/icon256.png'})
.appendTo($body);
} else {
$element = $('<div>')
.addClass(page)
.html(page)
.appendTo($menu);
}
$element.bind({
click: function() {
window.location.hash = page;
}
});
2010-08-03 18:35:31 +00:00
});
2012-04-18 09:33:42 +00:00
window.onhashchange = loadPage;
loadPage();
function loadPage() {
var page = window.location.hash.substr(1),
text;
if (pandora.pages[page]) {
$('#menu > div').removeClass('selected');
page != '' && $('#menu > .' + page).addClass('selected');
if (page == 'news') {
text = pandora.pages.news.map(function(item) {
return '<div class="title">' + item[0] + '</div>'
+ '<div class="date">' + Ox.formatDate(item[1], '%A, %B %e, %Y') + '</div>'
+ '<div class="text">' + item[2] + '</div>';
}).join('');
} else if (page == 'faq') {
text = pandora.pages.faq.map(function(item) {
return '<div class="title"><b>' + item[0] + '</b></div>'
+ '<div class="text">' + item[1] + '</div>';
}).join('');
} else if (page == 'tour') {
text = $('<div>')
.append(
$('<img>').attr({src: pandora.pages.tour[tourIndex][0]})
)
.append($('<br>'))
.append($('<br>'))
.append(
$('<p>').html(pandora.pages.tour[tourIndex][1])
);
2010-08-03 18:35:31 +00:00
} else {
2012-04-18 09:33:42 +00:00
text = pandora.pages[page];
2010-08-03 18:35:31 +00:00
}
2012-04-18 09:33:42 +00:00
$head.empty().append(
page == '' ? 'pan.do/ra &mdash; open media archive'
: page == 'tour' ? $('<span>')
.addClass('button disabled')
.attr({title: 'first'})
.html('tour')
.click(function() {
loadTour(0);
})
: page
);
$text.addClass(page).empty().append(text);
if (page == 'tour') {
$prevButton
.click(function() {
loadTour(-1);
})
.appendTo($head);
$nextButton
.click(function() {
loadTour(1);
})
.appendTo($head);
if (tourIndex == 0) {
$prevButton.addClass('disabled');
} else if (tourIndex == pandora.pages.tour.length - 1) {
$nextButton.addClass('disabled');
}
2010-08-03 18:35:31 +00:00
}
2012-04-18 09:33:42 +00:00
}
}
function loadTour(delta) {
tourIndex = delta == 0 ? 0
: Ox.mod(tourIndex + delta, pandora.pages.tour.length);
$('.button').removeClass('disabled');
if (tourIndex == 0) {
$prevButton.addClass('disabled');
} else if (tourIndex == pandora.pages.tour.length - 1) {
$nextButton.addClass('disabled');
2010-08-03 18:35:31 +00:00
}
2012-04-18 09:33:42 +00:00
var $img = $text.find('img'),
$p = $text.find('p'),
src = pandora.pages.tour[tourIndex][0]
$('<img>')
.load(function() {
$img.css({opacity: 1}).attr({src: src});
$p.css({opacity: 1}).html(pandora.pages.tour[tourIndex][1]);
})
.attr({
src: src
});
$img.css({opacity: 0.25});
$p.css({opacity: 0.25});
}
});
2010-08-03 18:35:31 +00:00
});