This commit is contained in:
j 2012-04-19 20:50:58 +02:00
commit be3296e472
5 changed files with 148 additions and 25 deletions

View file

@ -2,19 +2,7 @@ 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'
})
)
}
}),
$icon = $('#icon'),
$menu = $('<div>').attr({id: 'menu'}).appendTo($body),
$page = $('<div>').attr({id: 'page'}).appendTo($body),
$head = $('<div>').appendTo($page);
@ -37,7 +25,6 @@ Ox.getJSON('json/pandora.json', function(pandora) {
.appendTo($body);
} else {
$element = $('<div>')
.addClass(page)
.html(page)
.appendTo($menu);
}
@ -61,7 +48,9 @@ Ox.getJSON('json/pandora.json', function(pandora) {
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="date">'
+ Ox.formatDate(item[1], '%A, %B %e, %Y')
+ '</div>'
+ '<div class="text">' + item[2] + '</div>';
}).join('');
} else if (page == 'faq') {
@ -72,7 +61,113 @@ Ox.getJSON('json/pandora.json', function(pandora) {
} else if (page == 'tour') {
text = $('<div>')
.append(
$('<img>').attr({src: pandora.pages.tour[tourIndex][0]})
$('<div>')
.addClass('tour')
.append(
$('<img>')
.addClass('tour')
.attr({
src: pandora.pages.tour[tourIndex][0]
})
)
.bind({
click: function(e) {
var $this = $(this), timeout;
if (!$this.hasClass('zoom')) {
$($this.children()[0]).stop().animate({
width: '1280px',
height: '800px',
marginLeft: Math.round(
(384 - window.scrollX - e.clientX) * 11/9
) + 'px',
marginTop: Math.round(
(113 - window.scrollY - e.clientY) * 11/9
) + 'px'
}, 250, function() {
var event;
$this.addClass('zoom').bind({
mouseenter: function(e) {
timeout && clearTimeout(timeout);
$this.bind({
mousemove: function(e) {
event = e;
}
})
$($this.children()[0]).animate({
width: '1280px',
height: '800px',
marginLeft: Math.round(
(384 - window.scrollX - e.clientX) * 11/9
) + 'px',
marginTop: Math.round(
(113 - window.scrollY - e.clientY) * 11/9
) + 'px'
}, 250, function() {
$($this.children()[0]).animate({
marginLeft: Math.round(
(384 - window.scrollX - (event || e).clientX) * 11/9
) + 'px',
marginTop: Math.round(
(113 - window.scrollY - (event || e).clientY) * 11/9
) + 'px'
}, 250, function() {
$this.unbind('mousemove').bind({
mousemove: function(e) {
$($this.children()[0]).stop().css({
width: '1280px',
height: '800px',
marginLeft: Math.round(
(384 - window.scrollX - e.clientX) * 11/9
) + 'px',
marginTop: Math.round(
(113 - window.scrollY - e.clientY) * 11/9
) + 'px'
});
}
});
});
});
},
mousemove: function(e) {
$($this.children()[0]).stop().css({
width: '1280px',
height: '800px',
marginLeft: Math.round(
(384 - window.scrollX - e.clientX) * 11/9
) + 'px',
marginTop: Math.round(
(113 - window.scrollY - e.clientY) * 11/9
) + 'px'
});
},
mouseleave: function() {
timeout = setTimeout(function() {
$($this.children()[0]).stop().animate({
width: '576px',
height: '360px',
marginLeft: 0,
marginTop: 0
}, 250, function() {
$this.unbind('mousemove');
});
timeout = 0;
}, 500);
}
});
});
} else {
$this.unbind('mouseenter').unbind('mousemove').unbind('mouseleave');
$($this.children()[0]).stop().animate({
width: '576px',
height: '360px',
marginLeft: 0,
marginTop: 0
}, 250, function() {
$this.removeClass('zoom');
});
}
}
})
)
.append($('<br>'))
.append($('<br>'))
@ -93,7 +188,7 @@ Ox.getJSON('json/pandora.json', function(pandora) {
})
: page
);
$text.addClass(page).empty().append(text);
$text.empty().append(text);
if (page == 'tour') {
$prevButton
.click(function() {
@ -136,6 +231,13 @@ Ox.getJSON('json/pandora.json', function(pandora) {
});
$img.css({opacity: 0.25});
$p.css({opacity: 0.25});
}
function zoomIn($element, event) {
}
function zoomOut($element, e) {
}