Portfolio Of Antoine Wette « »
Portfolio Of Antoine Wette
Visit aw-digital.com
-
Meta
Added 5 months ago -
Categories
-
Links of interest
/* Author:
Antoine Wette
01.05.2011
www.aw-digital.com
info@aw-digital.com
PLEASE DONT USE THIS SCRIPT OR PARTS OF THIS SCRIPT WITHOUT MY CONSENT
*/
var workCounter = 0;
var blogCounter = 0;
var size_work = 0;
var size_blog = 0;
var detailsCounter = 0;
var detailsAngle = 0;
var size_details = 0;
var startAngle = 270;
var menuTop = 0;
var work_titles, work_dates, work_folders, work_backgrounds, work_screen;
var blog_titles, blog_dates, blog_folders, blog_backgrounds;
var tempType;
// 0 = WORK, 1 = WORK DETAILS, 2 = ABOUT ME, 3 = LAB, 4 = LAB DETAILS, 5 = AWARDS
var currentView = 0;
var article = '';
$(document).ready(function() {
//loadWorkXML();
loadSite();
$('.container').css('ms-transition-duration', '1s');
//alert(window.location);
$('#bg').css('opacity', 0);
$('.view').css('top', -20);
// OPEN WORK
$(".item1").click(function(element) {
if (currentView != 0) {
hide_last(currentView, 0);
loadWorkXML();
menuTop = 0;
$('.menu_but').css('background-position', '0 ' + menuTop + 'px');
}
});
// OPEN ABOUT ME
$(".item2").click(function(element) {
if (currentView != 2) {
loadAbout();
}
});
// OPEN LAB
$(".item3").click(function(element) {
if (currentView != 3) {
loadLab();
}
});
// OPEN AWARDS
$(".item4").click(function(element) {
if (currentView != 5) {
loadAwards();
}
});
$("#details .previous, #details .next, #details .show_info").mouseenter(function(element) {
$(this).stop().animate({
opacity: 0.9
}, 300);
$("#details .gallery").stop().animate({
opacity: 0.2
}, {
duration: 400
});
});
$("#details .previous, #details .next, #details .show_info").mouseleave(function(element) {
$(this).stop().animate({
opacity: 0
}, 150);
$("#details .gallery").stop().animate({
opacity: 1
}, {
duration: 150
});
});
if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {
$(".screen").click(function() {
$("#details .gallery").stop().delay(700).animate({
opacity: 1
}, {
duration: 400
});
$("#details .infobox").stop().animate({
opacity: 0,
height: 180
}, {
duration: 100,
complete: function() {
$("#details .infobox").css('display', 'none');
}
});
$(".screenshots, .screen").css('width', 700);
$(".screenshots").css('margin-left', -350);
$(".screenshots, .screen").css('border-radius', 0);
$("#details .previous, #details .next, #details .show_info").stop().animate({
opacity: 0
}, {
duration: 150
});
});
}
$("#details .show_info").click(function(element) {
$("#details .infobox").css('display', 'block');
$("#details .infobox").stop().animate({
opacity: 1,
height: 150
}, {
duration: 500
});
});
$("#details .infobox").mouseleave(function(element) {
$("#details .infobox").stop().animate({
opacity: 0,
height: 180
}, {
duration: 100,
complete: function() {
$("#details .infobox").css('display', 'none');
}
});
});
$(".screenshots .previous").click(function(element) {
setTimeout("previousScreen();", 400);
$(".screenshots, .screen").css('width', 400);
$(".screenshots, .screen").css('border-radius', 200);
$(".screenshots").css('margin-left', -200);
$("#details .infobox").stop().animate({
opacity: 0,
height: 180
}, {
duration: 100,
complete: function() {
$("#details .infobox").css('display', 'none');
}
});
});
$(".screenshots .next").click(function(element) {
setTimeout("nextScreen();", 400);
$(".screenshots, .screen").css('width', 400);
$(".screenshots, .screen").css('border-radius', 200);
$(".screenshots").css('margin-left', -200);
$("#details .infobox").stop().animate({
opacity: 0,
height: 180
}, {
duration: 100,
complete: function() {
$("#details .infobox").css('display', 'none');
}
});
});
$('.screenshots').mouseenter(function(element) {
$("#details .gallery").stop().delay(700).animate({
opacity: 1
}, {
duration: 400
});
$(".screenshots, .screen").css('width', 700);
$(".screenshots").css('margin-left', -350);
$(".screenshots, .screen").css('border-radius', 0);
});
$('.screenshots').mouseleave(function(element) {
$("#details .gallery").stop().animate({
opacity: 0.3
}, {
duration: 200
});
$(".screenshots, .screen").css('width', 400);
$(".screenshots, .screen").css('border-radius', 200);
$(".screenshots").css('margin-left', -200);
});
$('.menu_but').click(function(element) {
$('#menu ul, .lava_slider').css('display', 'block');
$('#menu ul').stop().animate({
opacity: 1,
left: 0
}, 200);
$('.lava_slider').stop().animate({
opacity: 0.6,
marginLeft: 45
}, 200);
$(this).css('background-position', '-35px ' + menuTop + 'px');
});
$('#menu').mouseleave(function(element) {
$('#menu ul').stop().animate({
opacity: 0,
left: -10
}, {
duration: 200,
complete: function() {
$('#menu ul, .lava_slider').css('display', 'block');
}
});
$('.lava_slider').stop().animate({
opacity: 0,
marginLeft: 35
}, 200);
$('.menu_but').css('background-position', '0 ' + menuTop + 'px');
});
$('#menu li').mouseenter(function(element) {
position = $(this).position();
$('.lava_slider').stop().animate({
left: position.left,
width: $(this).css('width')
}, {
duration: 300,
easing: 'easeOutBack'
});
});
});
function loadSite() {
var section = '' + window.location;
section = section.split('#');
article = '';
if (section.length > 1) {
var spliResult = section[1].split('=');
section = spliResult[0];
if (section.length > 2) {
article = spliResult[1];
}
if (section == 'about') {
setTimeout("loadAbout();", 200);
}
if (section == 'lab') {
setTimeout("loadLab();", 100);
if (article != undefined) {
setTimeout("blogCounter = article*1-1;$('body').stop().animate({backgroundColor:'#'+blog_backgrounds[blogCounter]},{duration:200});" + "$('#bg').stop().animate({opacity:0},{duration:50,complete:function(){$('#bg').css('background-image','url(img/'+blog_folders[blogCounter]+'/bg.jpg)');$('#bg').delay(150).animate({opacity:0.8},{duration:1000});}} );", 1400);
setTimeout("open_blog();", 2000);
}
}
if (section == 'awards') {
setTimeout("loadAwards();", 200);
}
if (section == 'work') {
loadWorkXML();
if (article != undefined) {
setTimeout("workCounter = article*1-1;$('body').stop().animate({backgroundColor:'#'+work_backgrounds[workCounter]},{duration:200});" + "$('#bg').stop().animate({opacity:0},{duration:50,complete:function(){$('#bg').css('background-image','url(img/'+work_folders[workCounter]+'/bg.jpg)');$('#bg').delay(150).animate({opacity:0.8},{duration:1000});}} );", 700);
setTimeout("open_work();", 1200);
}
} else {
loadWorkXML();
}
} else {
loadWorkXML();
}
}
function changeURL(section) {
var url = '' + window.location;
url = url.split('#');
url = url[0] + '#' + section;
window.location = url;
}
function loadAbout() {
hide_last(currentView, 2);
open_about();
menuTop = -35;
$('.menu_but').css('background-position', '0 ' + menuTop + 'px');
changeURL('about');
}
function loadLab() {
hide_last(currentView, 3);
loadBlogXML();
menuTop = -70;
$('.menu_but').css('background-position', '0 ' + menuTop + 'px');
}
function loadAwards() {
hide_last(currentView, 5);
menuTop = -105;
open_awards();
$('.menu_but').css('background-position', '0 ' + menuTop + 'px');
changeURL('awards');
}
function nextScreen() {
detailsCounter++;
$('#details .previous').css('display', 'block');
if (detailsCounter == size_details - 1) {
$('#details .next').css('display', 'none');
}
$('#details .container').css('-moz-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
$('#details .container').css('-webkit-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
$('#details .container').css('-o-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
$('#details .container').css('ms-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
setTimeout("$('.screen').css('background-image','url(img/'+work_folders[workCounter]+'/'+ detailsCounter +'.jpg)')", 300);
}
function previousScreen() {
detailsCounter--;
$('#details .next').css('display', 'block');
if (detailsCounter == 0) {
$('#details .previous').css('display', 'none');
}
$('#details .container').css('-moz-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
$('#details .container').css('-webkit-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
$('#details .container').css('-o-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
$('#details .container').css('ms-transform', 'rotate(' + (360 * detailsCounter) + 'deg)');
setTimeout("$('.screen').css('background-image','url(img/'+work_folders[workCounter]+'/'+ detailsCounter +'.jpg)')", 300);
}
function loadWorkXML() {
changeURL('');
$.get("work.xml", function(xml) {
xml = parseXml(xml);
size_work = $('work', xml).size();
work_titles = new Array(size_work);
work_dates = new Array(size_work);
work_folders = new Array(size_work);
work_backgrounds = new Array(size_work);
work_descriptions = new Array(size_work);
work_urls = new Array(size_work);
work_tags = new Array(size_work);
work_screen = new Array(size_work);
work_awards = new Array(size_work);
$('work', xml).each(function(i) {
work_titles[i] = $(this).find("title").text();
work_dates[i] = $(this).find("date").text();
work_folders[i] = $(this).find("folder").text();
work_backgrounds[i] = $(this).find("background").text();
work_descriptions[i] = $(this).find("description").text();
work_urls[i] = $(this).find("url").text();
work_tags[i] = $(this).find("tags").text();
work_screen[i] = $(this).find("screen").text();
work_awards[i] = $(this).find("award").text();
});
workCounter = 0;
loadWork();
$('body').stop().animate({
backgroundColor: "#" + work_backgrounds[workCounter]
}, {
duration: 200
});
$('#bg').stop().animate({
opacity: 0
}, {
duration: 50,
complete: function() {
$('#bg').css("background-image", 'url(img/' + work_folders[workCounter] + '/bg.jpg)');
$('#bg').delay(150).animate({
opacity: 0.8
}, {
duration: 1000
});
}
});
}, 'xml');
}
function loadBlogXML() {
changeURL('lab');
$.get("lab.xml", function(xml) {
xml = parseXml(xml);
size_blog = $('blog', xml).size();
blog_titles = new Array(size_work);
blog_dates = new Array(size_work);
blog_folders = new Array(size_work);
blog_backgrounds = new Array(size_work);
blog_descriptions = new Array(size_work);
blog_demos = new Array(size_work);
blog_downloads = new Array(size_work);
$('blog', xml).each(function(i) {
blog_titles[i] = $(this).find("title").text();
blog_dates[i] = $(this).find("date").text();
blog_folders[i] = $(this).find("folder").text();
blog_backgrounds[i] = $(this).find("background").text();
blog_descriptions[i] = $(this).find("description").text();
blog_demos[i] = $(this).find("demo").text();
blog_downloads[i] = $(this).find("download").text();
});
blogCounter = 0;
loadBlog();
$('body').stop().animate({
backgroundColor: "#" + blog_backgrounds[blogCounter]
}, {
duration: 200
});
$('#bg').stop().animate({
opacity: 0
}, {
duration: 50,
complete: function() {
$('#bg').css("background-image", 'url(img/' + blog_folders[blogCounter] + '/bg.jpg)');
$('#bg').delay(150).animate({
opacity: 0.8
}, {
duration: 1000
});
}
});
}, 'xml');
}
function loadBlog() {
blogCounter = 0;
$('#blog').css('display', 'block');
setTimeout("$('#blog .container').css('-moz-transform','rotate(0deg)');$('#blog .container').css('-webkit-transform','rotate(0deg)');" + "$('#blog .container').css('-o-transform','rotate(0deg)');$('#blog .container').css('ms-transform','rotate(0deg)');", 400);
$('#blog .container').html('');
startAngle = 270;
for (var i = 0; i < size_blog; i++) {
$('#blog .container').append('<div class="blog blog' + i + '"><div class="color"></div></div>');
$('.blog' + i).append('<div class="view"></div>');
$('.blog' + i).append('<div class="info"><div class="title">' + generateTitleSpan(blog_titles[i], blog_backgrounds[i]) + '</div><div class="counter"><span style="top:9px;position:relative">' + (i + 1) + '/' + size_blog + '</span></div></div>');
$('.blog' + i).find('.color').css('background-image', 'url(img/' + blog_folders[i] + "/color.jpg)");
$('.blog' + i).css('left', 550 + cosDEG(startAngle) * 445);
$('.blog' + i).css('top', 550 - sinDEG(startAngle) * 445);
$('.blog' + i).css('-moz-transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.blog' + i).css('-webkit-transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.blog' + i).css('-o-transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.blog' + i).css('ms-transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
if (i > 1) {
$('.blog' + i).css('-moz-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.blog' + i).css('-webkit-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.blog' + i).css('-o-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.blog' + i).css('ms-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.blog' + i).css('opacity', 0);
}
startAngle += 45;
}
$('.blog0').attr('class', 'blog blog0 active');
$('.blog1').attr('class', 'blog blog1 next');
$('.blog0').css('-moz-transform', 'scale(1,1) rotate(0deg)');
$('.blog0').css('-webkit-transform', 'scale(1,1) rotate(0deg)');
$('.blog0').css('-o-transform', 'scale(1,1) rotate(0deg)');
$('.blog0').css('ms-transform', 'scale(1,1) rotate(0deg)');
bind_work('blog');
Cufon.replace('.csstransitions .info .title');
}
function sinDEG(Nummer) {
Nummer = Math.sin(Nummer / 180 * Math.PI);
if ((Nummer + "").indexOf("e") > -1) Nummer = 0;
return Nummer;
}
function cosDEG(Nummer) {
Nummer = Math.cos(Nummer / 180 * Math.PI);
if ((Nummer + "").indexOf("e") > -1) Nummer = 0;
return Nummer;
}
function generateTitleSpan(title, color) {
var mySplitResult = title.split(' ');
var resultString = '<span style="color:#' + color + '">';
var len = mySplitResult.length;
for (var i = 0; i < len; i++) {
if (i < len - 1) {
resultString += mySplitResult[i] + ' ';
} else {
resultString += '</span>';
resultString += mySplitResult[i];
}
}
return resultString;
}
function generateTags(tags, color) {
var mySplitResult = tags.split(' ');
var resultString = '';
var len = mySplitResult.length;
for (var i = 0; i < len; i++) {
resultString += '<span class="tag" style="background:#' + color + '">' + mySplitResult[i] + '</span>';
}
return resultString;
}
function loadWork() {
workCounter = 0;
detailsCounter = 0;
size_details = work_screen[workCounter] * 1;
$('#work').css('display', 'block');
setTimeout("$('#work .container').css('-moz-transform','rotate(0deg)');$('#work .container').css('-webkit-transform','rotate(0deg)');" + "$('#work .container').css('-o-transform','rotate(0deg)');$('#work .container').css('ms-transform','rotate(0deg)');", 400);
$('#work .container').html('');
startAngle = 270;
for (var i = 0; i < size_work; i++) {
$('#work .container').append('<div class="work work' + i + '"><div class="color"></div></div>');
$('.work' + i).append('<div class="view"></div>');
$('.work' + i).append('<div class="info"><div class="title">' + generateTitleSpan(work_titles[i], work_backgrounds[i]) + '</div><div class="counter"><span style="top:9px;position:relative">' + (i + 1) + '/' + size_work + '</span></div></div>');
$('.work' + i).find('.color').css('background-image', 'url(img/' + work_folders[i] + "/color.jpg)");
$('.work' + i).css('left', 550 + cosDEG(startAngle) * 445);
$('.work' + i).css('top', 550 - sinDEG(startAngle) * 445);
//$('.work'+i).find('.color').css('-moz-transform','rotate('+((-i*45)%360)+'deg)');
$('.work' + i).css('-moz-transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('-o-transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('ms-transform', 'scale(.7,.7) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('-webkit-transform', 'scale(0.7,0.7) rotate(' + ((-i * 45) % 360) + 'deg)');
if (i > 1) {
$('.work' + i).css('-moz-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('-webkit-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('-o-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('ms-transform', 'scale(0,0) rotate(' + ((-i * 45) % 360) + 'deg)');
$('.work' + i).css('opacity', 0);
}
startAngle += 45;
}
$('.work0').attr('class', 'work work0 active');
$('.work1').attr('class', 'work work1 next');
$('.work0').css('-moz-transform', 'scale(1,1) rotate(0deg)');
$('.work0').css('-webkit-transform', 'scale(1,1) rotate(0deg)');
$('.work0').css('-o-transform', 'scale(1,1) rotate(0deg)');
$('.work0').css('ms-transform', 'scale(1,1) rotate(0deg)');
bind_work('work');
Cufon.replace('.csstransitions .info .title');
}
function parseXml(xml) {
return xml;
}
function hide_last(lastSection, newSection) {
// 0 = WORK, 1 = WORK DETAILS, 2 = ABOUT ME, 3 = LAB, 4 = LAB DETAILS, 5 = AWARDS
if (lastSection == 0) {
hide_thumbs('work');
}
if (lastSection == 1) {
hide_details();
}
if (lastSection == 2) {
hide_about();
}
if (lastSection == 3) {
hide_thumbs('blog');
}
if (lastSection == 4) {
hide_article();
}
if (lastSection == 5) {
hide_awards();
}
currentView = newSection;
}
function hide_thumbs(type) {
tempType = type;
//$('#work .container').css('-moz-transform','rotate('+((workCounter+3)*45)%360+'deg)');
//$('#work .container').css('-webkit-transform','rotate('+((workCounter+3)*45)%360+'deg)');
$('#' + type + ' .' + type).css('-moz-transform', 'scale(0.1,0.1) rotate(180deg)');
$('#' + type + ' .' + type).css('-webkit-transform', 'scale(0.1,0.1) rotate(180deg)');
$('#' + type + ' .' + type).css('opacity', 0);
setTimeout("$('#'+tempType+' .'+tempType).remove();" + "$('#'+tempType).css('display','none');" + "$('#'+tempType+' .container').css('-moz-transform','rotate(-180deg)');" + "$('#'+tempType+' .container').css('-o-transform','rotate(-180deg)');" + "$('#'+tempType+' .container').css('ms-transform','rotate(-180deg)');" + "$('#'+tempType+' .container').css('-webkit-transform','rotate(-180deg)');", 700);
}
function hide_details() {
$('#details .container').css('-moz-transform', 'rotate(' + (detailsCounter * 360 + 180) + 'deg)');
$('#details .container').css('-webkit-transform', 'rotate(' + (detailsCounter * 360 + 180) + 'deg)');
$('#details .container').css('-o-transform', 'rotate(' + (detailsCounter * 360 + 180) + 'deg)');
$('#details .container').css('ms-transform', 'rotate(' + (detailsCounter * 360 + 180) + 'deg)');
setTimeout("$('#details').css('display','none');$('#details .container').css('-webkit-transform','rotate(-180deg)');$('#details .container').css('-moz-transform','rotate(-180deg)');" + "$('#details .container').css('-o-transform','rotate(-180deg)');$('#details .container').css('ms-transform','rotate(-180deg)');", 700);
}
function hide_about() {
$('#about .container').css('-moz-transform', 'rotate(180deg)');
$('#about .container').css('-webkit-transform', 'rotate(180deg)');
$('#about .container').css('-o-transform', 'rotate(180deg)');
$('#about .container').css('ms-transform', 'rotate(180deg)');
setTimeout("$('#about').css('display','none');$('#about .container').css('-webkit-transform','rotate(-180deg)');$('#about .container').css('-moz-transform','rotate(-180deg)');" + "$('#about .container').css('-o-transform','rotate(-180deg)');$('#about .container').css('ms-transform','rotate(-180deg)');", 700);
}
function hide_awards() {
$('#awards .container').css('-moz-transform', 'rotate(180deg)');
$('#awards .container').css('-webkit-transform', 'rotate(180deg)');
$('#awards .container').css('-o-transform', 'rotate(180deg)');
$('#awards .container').css('ms-transform', 'rotate(180deg)');
setTimeout("$('#awards').css('display','none');$('#awards .container').css('-webkit-transform','rotate(-180deg)');$('#awards .container').css('-moz-transform','rotate(-180deg)');" + "$('#awards .container').css('-o-transform','rotate(-180deg)');$('#awards .container').css('ms-transform','rotate(-180deg)');", 700);
}
function hide_article() {
$('#article .container').css('-moz-transform', 'rotate(180deg)');
$('#article .container').css('-webkit-transform', 'rotate(180deg)');
$('#article .container').css('-o-transform', 'rotate(180deg)');
$('#article .container').css('-ms-transform', 'rotate(180deg)');
setTimeout("$('#article').css('display','none');$('#article .container').css('-webkit-transform','rotate(-180deg)');$('#article .container').css('-moz-transform','rotate(-180deg)');" + "$('#article .container').css('-o-transform','rotate(-180deg)');$('#article .container').css('ms-transform','rotate(-180deg)');", 700);
}
function open_awards() {
$('#awards').css('display', 'block');
$('body').stop().animate({
backgroundColor: "#eac787"
}, {
duration: 500
});
$('#bg').stop().animate({
opacity: 0
}, {
duration: 50,
complete: function() {
$('#bg').css("background-image", 'url(img/awards.jpg)');
$('#bg').delay(150).animate({
opacity: 0.8
}, {
duration: 1000
});
}
});
setTimeout("$('#awards .container').css('-moz-transform','rotate(0deg)');$('#awards .container').css('-webkit-transform','rotate(0deg)');" + "$('#awards .container').css('-o-transform','rotate(0deg)');$('#awards .container').css('ms-transform','rotate(0deg)');", 700);
}
function open_about() {
$('#about').css('display', 'block');
$('body').stop().animate({
backgroundColor: "#bfd0e4"
}, {
duration: 500
});
$('#bg').stop().animate({
opacity: 0
}, {
duration: 50,
complete: function() {
$('#bg').css("background-image", 'url(img/about_bg.jpg)');
$('#bg').delay(350).animate({
opacity: 0.8
}, {
duration: 1000
});
}
});
$('#about .container').animate({
'rotate': '0deg'
}, {
duration: 600
});
setTimeout("$('#about .container').css('-moz-transform','rotate(0deg)');$('#about .container').css('-webkit-transform','rotate(0deg)');" + "$('#about .container').css('ms-transform','rotate(0deg)');$('#about .container').css('-o-transform','rotate(0deg)');", 700);
}
function open_blog() {
changeURL('lab=' + (blogCounter + 1));
hide_last(3, 4);
$('#article').css('display', 'block');
$('#article .article').html('<div class="title">' + generateTitleSpan(blog_titles[blogCounter], blog_backgrounds[blogCounter]) + '</div>');
$('#article .article').append('<div class="large" style="background-image:url(img/' + blog_folders[blogCounter] + '/large.jpg)"></div>');
$('#article .article').append('<div class="description">' + blog_descriptions[blogCounter] + '</div>');
var linkHTML = '<div class="links">';
if (blog_demos[blogCounter] != '') {
linkHTML += '<a target="blank" href="' + blog_demos[blogCounter] + '" class="demo">DEMO</a>';
}
if (blog_downloads[blogCounter] != '') {
linkHTML += '<a target="blank" href="' + blog_downloads[blogCounter] + '" class="download">DOWNLOAD</a>';
}
linkHTML += '</div>';
$('#article .article').append(linkHTML);
Cufon.replace('.csstransitions .article .title');
setTimeout("$('#article .container').css('-moz-transform','rotate(0deg)');$('#article .container').css('-webkit-transform','rotate(0deg)');" + "$('#article .container').css('-o-transform','rotate(0deg)');$('#article .container').css('ms-transform','rotate(0deg)');", 700);
}
function open_work() {
changeURL('work=' + (workCounter + 1));
size_details = work_screen[workCounter] * 1;
hide_last(0, 1);
var awardHTML = '';
$('#details').css('display', 'block');
$('#details .infobox').html('<div class="title">' + generateTitleSpan(work_titles[workCounter], work_backgrounds[workCounter]) + '</div>');
$('#details .infobox').append('<div class="description">' + work_descriptions[workCounter] + '</div>');
if (work_awards[workCounter] != '') {
awardHTML += '<div class="award"><a target="blank" href="http://' + work_awards[workCounter] + '" class="siteoftheday">SITE OF THE DAY</a></div>';
}
$('#details .infobox').append(awardHTML);
$('#details .infobox').append('<div class="url"><a style="color:#' + work_backgrounds[workCounter] + '" href="http://' + work_urls[workCounter] + '" target="blank">' + work_urls[workCounter] + '</a></div>');
$('#details .infobox').append('<div class="tags">' + generateTags(work_tags[workCounter], work_backgrounds[workCounter]) + '</div>');
Cufon.replace('.csstransitions .infobox .title');
$('.screen').css('background-image', 'url(img/' + work_folders[workCounter] + '/' + detailsCounter % size_details + '.jpg)');
setTimeout("$('#details .previous').css('display','none');$('#details .next').css('display','block');$('#details .next, #details .show_info').stop().animate({opacity:1},300).delay(400).animate({opacity:0},300);" + "$('#details .container').css('-moz-transform','rotate(0deg)');$('#details .container').css('-webkit-transform','rotate(0deg)');" + "$('#details .container').css('-o-transform','rotate(0deg)');$('#details .container').css('ms-transform','rotate(0deg)');", 700);
}
function change(direction, type) {
if (type == 'work') {
if (direction == 'next') {
workCounter++;
}
if (direction == 'previous') {
workCounter--;
}
var tempCounter = workCounter;
var temp_folders = work_folders;
var temp_backgrounds = work_backgrounds;
}
if (type == 'blog') {
if (direction == 'next') {
blogCounter++;
}
if (direction == 'previous') {
blogCounter--;
}
var tempCounter = blogCounter;
var temp_folders = blog_folders;
var temp_backgrounds = blog_backgrounds;
}
$('#' + type + ' .container').css('-moz-transform', 'rotate(' + (tempCounter * 45) % 360 + 'deg)');
$('#' + type + ' .container').css('-webkit-transform', 'rotate(' + (tempCounter * 45) % 360 + 'deg)');
$('#' + type + ' .container').css('-o-transform', 'rotate(' + (tempCounter * 45) % 360 + 'deg)');
$('#' + type + ' .container').css('ms-transform', 'rotate(' + (tempCounter * 45) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter)).css('-moz-transform', 'scale(1,1) rotate(' + (-45 * tempCounter) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter)).css('-webkit-transform', 'scale(1,1) rotate(' + (-45 * tempCounter) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter)).css('-o-transform', 'scale(1,1) rotate(' + (-45 * tempCounter) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter)).css('ms-transform', 'scale(1,1) rotate(' + (-45 * tempCounter) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter)).css('border-width', 8);
$('#' + type + ' .' + type + (tempCounter)).attr('class', type + ' ' + type + tempCounter + ' active');
$('#' + type + ' .' + type + (tempCounter - 1)).attr('class', type + ' ' + type + (tempCounter - 1) + ' prev');
$('#' + type + ' .' + type + (tempCounter - 2)).attr('class', type + ' ' + type + (tempCounter - 2));
$('#' + type + ' .' + type + (tempCounter + 2)).attr('class', type + ' ' + type + (tempCounter + 2));
$('#' + type + ' .' + type + (tempCounter + 1)).attr('class', type + ' ' + type + (tempCounter + 1) + ' next');
$('#' + type + ' .' + type + (tempCounter + 2)).css('-moz-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter + 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 2)).css('-webkit-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter + 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 2)).css('-o-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter + 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 2)).css('ms-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter + 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 2)).css('opacity', 0);
$('#' + type + ' .' + type + (tempCounter - 2)).css('-moz-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter - 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 2)).css('-webkit-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter - 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 2)).css('-o-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter - 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 2)).css('ms-transform', 'scale(0,0) rotate(' + (-45 * (tempCounter - 2)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 2)).css('opacity', 0);
$('#' + type + ' .' + type + (tempCounter - 1)).css('-moz-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter - 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 1)).css('-webkit-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter - 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 1)).css('-o-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter - 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 1)).css('ms-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter - 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter - 1)).css('border-width', 0);
$('#' + type + ' .' + type + (tempCounter + 1)).css('border-width', 0);
$('#' + type + ' .' + type + (tempCounter + 1)).css('-moz-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter + 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 1)).css('-webkit-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter + 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 1)).css('-o-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter + 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 1)).css('ms-transform', 'scale(0.7,0.7) rotate(' + (-45 * (tempCounter + 1)) % 360 + 'deg)');
$('#' + type + ' .' + type + (tempCounter + 1)).css('opacity', 1);
$('#' + type + ' .' + type + (tempCounter - 1)).css('opacity', 1);
$('#bg').stop().animate({
opacity: 0
}, {
duration: 50,
complete: function() {
$('#bg').css("background-image", 'url(img/' + temp_folders[tempCounter] + '/bg.jpg)');
$('#bg').delay(500).animate({
opacity: 0.8
}, {
duration: 600
});
}
});
$('body').stop().animate({
backgroundColor: "#" + temp_backgrounds[tempCounter]
}, {
duration: 500
});
}
function bind_work(type) {
$('.' + type + ',#' + type + ' .next,#' + type + ' .prev').unbind('click');
$('.' + type + ', #' + type + ' .active').unbind('mouseenter');
$('.' + type + '').unbind('mouseleave');
$('#' + type + ' .active').click(function(element) {
if (type == 'work') {
open_work();
}
if (type == 'blog') {
open_blog();
}
});
$('#' + type + ' .next').click(function(element) {
change('next', type);
$(this).find(".view").stop().animate({
opacity: 0,
top: -20
}, {
duration: 0
});
bind_work(type);
return false;
});
$('#' + type + ' .prev').click(function(element) {
change('previous', type);
$(this).find(".view").stop().animate({
opacity: 0,
top: -20
}, {
duration: 0
});
bind_work(type);
return false;
});
$('.' + type + '').mouseenter(function(element) {
$(this).find(".view").stop().animate({
opacity: 1,
top: 0
}, {
duration: 300
});
});
$('#' + type + ' .active').mouseenter(function(element) {
$(this).find(".info").stop().delay(100).animate({
height: 120
}, {
duration: 200
});
$(this).find(".info .counter").stop().delay(450).animate({
height: 31
}, {
duration: 150
});
$(this).find(".info .title").stop().delay(400).animate({
opacity: 1
}, {
duration: 200
});
});
$('.' + type + '').mouseleave(function(element) {
$(this).find(".view").stop().animate({
opacity: 0,
top: -20
}, {
duration: 200
});
$(this).find(".info").stop().animate({
height: 0
}, {
duration: 200
});
$(this).find(".info .title").stop().animate({
opacity: 0
}, {
duration: 20
});
$(this).find(".info .counter").stop().animate({
height: 0
}, {
duration: 50
});
});
}
/* Author:
Antoine Wette
01.05.2011
www.aw-digital.com
info@aw-digital.com
PLEASE DONT USE THIS SCRIPT OR PARTS OF THIS SCRIPT WITHOUT MY CONSENT
*/
var workCounter = 0;
var blogCounter = 0;
var size_work = 0;
var size_blog = 0;
var detailsCounter = 0;
var detailsAngle = 0;
var size_details = 0;
var startAngle = 270;
var menuTop = 0;
var work_titles, work_dates, work_folders, work_backgrounds, work_screen;
var blog_titles, blog_dates, blog_folders, blog_backgrounds;
var tempType;
// 0 = WORK, 1 = WORK DETAILS, 2 = ABOUT ME, 3 = LAB, 4 = LAB DETAILS, 5 = AWARDS
var currentView = 0;
var article = '';
$(document).ready(function() {
//loadWorkXML();
loadSite();
$('.container').css('ms-transition-duration','1s');
//alert(window.location);
$('#bg').css('opacity',0);
$('.view').css('top',-20);
// OPEN WORK
$(".item1").click(function(element) {
if(currentView != 0){
hide_last(currentView, 0);
loadWorkXML();
menuTop = 0;
$('.menu_but').css('background-position','0 ' +menuTop +'px');
}
});
// OPEN ABOUT ME
$(".item2").click(function(element) {
if(currentView != 2){
loadAbout();
}
});
// OPEN LAB
$(".item3").click(function(element) {
if(currentView != 3){
loadLab();
}
});
// OPEN AWARDS
$(".item4").click(function(element) {
if(currentView != 5){
loadAwards();
}
});
$("#details .previous, #details .next, #details .show_info").mouseenter(function(element) {
$(this).stop().animate({opacity:0.9},300);
$("#details .gallery").stop().animate(
{opacity:0.2},{duration:400}
);
});
$("#details .previous, #details .next, #details .show_info").mouseleave(function(element) {
$(this).stop().animate({opacity:0},150);
$("#details .gallery").stop().animate(
{opacity:1},{duration:150}
);
});
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {
$(".screen").click(function(){
$("#details .gallery").stop().delay(700).animate(
{opacity:1},{duration:400}
);
$("#details .infobox").stop().animate(
{opacity:0,height:180},{duration:100, complete: function(){$("#details .infobox").css('display','none');}}
);
$(".screenshots, .screen").css('width',700);
$(".screenshots").css('margin-left',-350);
$(".screenshots, .screen").css('border-radius',0);
$("#details .previous, #details .next, #details .show_info").stop().animate(
{opacity:0},{duration:150}
);
});
}
$("#details .show_info").click(function(element) {
$("#details .infobox").css('display','block');
$("#details .infobox").stop().animate(
{opacity:1,height:150},{duration:500}
);
});
$("#details .infobox").mouseleave(function(element) {
$("#details .infobox").stop().animate(
{opacity:0,height:180},{duration:100, complete: function(){$("#details .infobox").css('display','none');}}
);
});
$(".screenshots .previous").click(function(element) {
setTimeout("previousScreen();",400);
$(".screenshots, .screen").css('width',400);
$(".screenshots, .screen").css('border-radius',200);
$(".screenshots").css('margin-left',-200);
$("#details .infobox").stop().animate(
{opacity:0,height:180},{duration:100, complete: function(){$("#details .infobox").css('display','none');}}
);
});
$(".screenshots .next").click(function(element) {
setTimeout("nextScreen();",400);
$(".screenshots, .screen").css('width',400);
$(".screenshots, .screen").css('border-radius',200);
$(".screenshots").css('margin-left',-200);
$("#details .infobox").stop().animate(
{opacity:0,height:180},{duration:100, complete: function(){$("#details .infobox").css('display','none');}}
);
});
$('.screenshots').mouseenter(function(element) {
$("#details .gallery").stop().delay(700).animate(
{opacity:1},{duration:400}
);
$(".screenshots, .screen").css('width',700);
$(".screenshots").css('margin-left',-350);
$(".screenshots, .screen").css('border-radius',0);
});
$('.screenshots').mouseleave(function(element) {
$("#details .gallery").stop().animate(
{opacity:0.3},{duration:200}
);
$(".screenshots, .screen").css('width',400);
$(".screenshots, .screen").css('border-radius',200);
$(".screenshots").css('margin-left',-200);
});
$('.menu_but').click(function(element) {
$('#menu ul, .lava_slider').css('display','block');
$('#menu ul').stop().animate(
{opacity: 1, left:0},200
);
$('.lava_slider').stop().animate(
{opacity: 0.6, marginLeft:45},200
);
$(this).css('background-position','-35px '+menuTop+'px');
});
$('#menu').mouseleave(function(element) {
$('#menu ul').stop().animate(
{opacity: 0, left:-10},{duration:200,complete:function(){$('#menu ul, .lava_slider').css('display','block');}}
);
$('.lava_slider').stop().animate(
{opacity: 0, marginLeft:35},200
);
$('.menu_but').css('background-position','0 ' +menuTop +'px');
});
$('#menu li').mouseenter(function(element) {
position = $(this).position();
$('.lava_slider').stop().animate(
{left: position.left, width:$(this).css('width')},{duration:300,easing:'easeOutBack'}
);
});
});
function loadSite(){
var section = '' + window.location;
section = section.split('#');
article = '';
if(section.length>1){
var spliResult = section[1].split('=');
section = spliResult[0];
if(section.length>2){article = spliResult[1];}
if(section == 'about'){
setTimeout("loadAbout();",200);
}
if(section == 'lab'){
setTimeout("loadLab();",100);
if(article != undefined){
setTimeout("blogCounter = article*1-1;$('body').stop().animate({backgroundColor:'#'+blog_backgrounds[blogCounter]},{duration:200});"+
"$('#bg').stop().animate({opacity:0},{duration:50,complete:function(){$('#bg').css('background-image','url(img/'+blog_folders[blogCounter]+'/bg.jpg)');$('#bg').delay(150).animate({opacity:0.8},{duration:1000});}} );",1400);
setTimeout("open_blog();",2000);
}
}
if(section == 'awards'){
setTimeout("loadAwards();",200);
}
if(section == 'work'){
loadWorkXML();
if(article != undefined){
setTimeout("workCounter = article*1-1;$('body').stop().animate({backgroundColor:'#'+work_backgrounds[workCounter]},{duration:200});"+
"$('#bg').stop().animate({opacity:0},{duration:50,complete:function(){$('#bg').css('background-image','url(img/'+work_folders[workCounter]+'/bg.jpg)');$('#bg').delay(150).animate({opacity:0.8},{duration:1000});}} );",700);
setTimeout("open_work();",1200);
}
}else{
loadWorkXML();
}
}
else{
loadWorkXML();
}
}
function changeURL(section){
var url = '' + window.location;
url = url.split('#');
url = url[0]+'#' +section;
window.location = url;
}
function loadAbout(){
hide_last(currentView, 2);
open_about();
menuTop = -35;
$('.menu_but').css('background-position','0 ' +menuTop +'px');
changeURL('about');
}
function loadLab(){
hide_last(currentView, 3);
loadBlogXML();
menuTop = -70;
$('.menu_but').css('background-position','0 ' +menuTop +'px');
}
function loadAwards(){
hide_last(currentView, 5);
menuTop = -105;
open_awards();
$('.menu_but').css('background-position','0 ' +menuTop +'px');
changeURL('awards');
}
function nextScreen(){
detailsCounter++;
$('#details .previous').css('display','block');
if(detailsCounter==size_details-1){$('#details .next').css('display','none');}
$('#details .container').css('-moz-transform','rotate('+(360*detailsCounter)+'deg)');
$('#details .container').css('-webkit-transform','rotate('+(360*detailsCounter)+'deg)');
$('#details .container').css('-o-transform','rotate('+(360*detailsCounter)+'deg)');
$('#details .container').css('ms-transform','rotate('+(360*detailsCounter)+'deg)');
setTimeout("$('.screen').css('background-image','url(img/'+work_folders[workCounter]+'/'+ detailsCounter +'.jpg)')",300);
}
function previousScreen(){
detailsCounter--;
$('#details .next').css('display','block');
if(detailsCounter==0){$('#details .previous').css('display','none');}
$('#details .container').css('-moz-transform','rotate('+(360*detailsCounter)+'deg)');
$('#details .container').css('-webkit-transform','rotate('+(360*detailsCounter)+'deg)');
$('#details .container').css('-o-transform','rotate('+(360*detailsCounter)+'deg)');
$('#details .container').css('ms-transform','rotate('+(360*detailsCounter)+'deg)');
setTimeout("$('.screen').css('background-image','url(img/'+work_folders[workCounter]+'/'+ detailsCounter +'.jpg)')",300);
}
function loadWorkXML(){
changeURL('');
$.get("work.xml",function(xml){
xml = parseXml(xml);
size_work = $('work',xml).size();
work_titles = new Array(size_work);
work_dates = new Array(size_work);
work_folders = new Array(size_work);
work_backgrounds = new Array(size_work);
work_descriptions = new Array(size_work);
work_urls = new Array(size_work);
work_tags = new Array(size_work);
work_screen = new Array(size_work);
work_awards = new Array(size_work);
$('work',xml).each(function(i) {
work_titles[i] = $(this).find("title").text();
work_dates[i] = $(this).find("date").text();
work_folders[i] = $(this).find("folder").text();
work_backgrounds[i] = $(this).find("background").text();
work_descriptions[i] = $(this).find("description").text();
work_urls[i] = $(this).find("url").text();
work_tags[i] = $(this).find("tags").text();
work_screen[i] = $(this).find("screen").text();
work_awards[i] = $(this).find("award").text();
});
workCounter = 0;
loadWork();
$('body').stop().animate(
{backgroundColor:"#"+work_backgrounds[workCounter]},{duration:200}
);
$('#bg').stop().animate(
{opacity:0},{duration:50,complete:function(){
$('#bg').css("background-image",'url(img/'+work_folders[workCounter]+'/bg.jpg)');
$('#bg').delay(150).animate(
{opacity:0.8},{duration:1000}
);
}}
);
},'xml');
}
function loadBlogXML(){
changeURL('lab');
$.get("lab.xml",function(xml){
xml = parseXml(xml);
size_blog = $('blog',xml).size();
blog_titles = new Array(size_work);
blog_dates = new Array(size_work);
blog_folders = new Array(size_work);
blog_backgrounds = new Array(size_work);
blog_descriptions = new Array(size_work);
blog_demos = new Array(size_work);
blog_downloads = new Array(size_work);
$('blog',xml).each(function(i) {
blog_titles[i] = $(this).find("title").text();
blog_dates[i] = $(this).find("date").text();
blog_folders[i] = $(this).find("folder").text();
blog_backgrounds[i] = $(this).find("background").text();
blog_descriptions[i] = $(this).find("description").text();
blog_demos[i] = $(this).find("demo").text();
blog_downloads[i] = $(this).find("download").text();
});
blogCounter = 0;
loadBlog();
$('body').stop().animate(
{backgroundColor:"#"+blog_backgrounds[blogCounter]},{duration:200}
);
$('#bg').stop().animate(
{opacity:0},{duration:50,complete:function(){
$('#bg').css("background-image",'url(img/'+blog_folders[blogCounter]+'/bg.jpg)');
$('#bg').delay(150).animate(
{opacity:0.8},{duration:1000}
);
}}
);
},'xml');
}
function loadBlog(){
blogCounter = 0;
$('#blog').css('display','block');
setTimeout("$('#blog .container').css('-moz-transform','rotate(0deg)');$('#blog .container').css('-webkit-transform','rotate(0deg)');"
+"$('#blog .container').css('-o-transform','rotate(0deg)');$('#blog .container').css('ms-transform','rotate(0deg)');",400);
$('#blog .container').html('');
startAngle=270;
for(var i=0;i<size_blog;i++){
$('#blog .container').append('<div class="blog blog'+i+'"><div class="color"></div></div>');
$('.blog'+i).append('<div class="view"></div>');
$('.blog'+i).append('<div class="info"><div class="title">'+generateTitleSpan(blog_titles[i],blog_backgrounds[i]) +'</div><div class="counter"><span style="top:9px;position:relative">'+(i+1)+'/'+size_blog+'</span></div></div>');
$('.blog'+i).find('.color').css('background-image','url(img/'+blog_folders[i]+"/color.jpg)");
$('.blog'+i).css('left',550+cosDEG(startAngle)*445);
$('.blog'+i).css('top',550-sinDEG(startAngle)*445);
$('.blog'+i).css('-moz-transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
$('.blog'+i).css('-webkit-transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
$('.blog'+i).css('-o-transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
$('.blog'+i).css('ms-transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
if(i>1){
$('.blog'+i).css('-moz-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.blog'+i).css('-webkit-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.blog'+i).css('-o-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.blog'+i).css('ms-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.blog'+i).css('opacity',0);
}
startAngle+=45;
}
$('.blog0').attr('class','blog blog0 active');
$('.blog1').attr('class','blog blog1 next');
$('.blog0').css('-moz-transform','scale(1,1) rotate(0deg)');
$('.blog0').css('-webkit-transform','scale(1,1) rotate(0deg)');
$('.blog0').css('-o-transform','scale(1,1) rotate(0deg)');
$('.blog0').css('ms-transform','scale(1,1) rotate(0deg)');
bind_work('blog');
Cufon.replace('.csstransitions .info .title');
}
function sinDEG(Nummer)
{
Nummer = Math.sin(Nummer/180*Math.PI);
if((Nummer+"").indexOf("e")>-1)
Nummer = 0;
return Nummer;
}
function cosDEG(Nummer)
{
Nummer = Math.cos(Nummer/180*Math.PI);
if((Nummer+"").indexOf("e")>-1)
Nummer = 0;
return Nummer;
}
function generateTitleSpan(title,color){
var mySplitResult = title.split(' ');
var resultString = '<span style="color:#'+color+'">';
var len = mySplitResult.length;
for(var i=0; i < len; i++){
if(i < len-1){
resultString+= mySplitResult[i] +' ';
}
else{
resultString+='</span>';
resultString+= mySplitResult[i];
}
}
return resultString;
}
function generateTags(tags,color){
var mySplitResult = tags.split(' ');
var resultString = '';
var len = mySplitResult.length;
for(var i=0; i < len; i++){
resultString += '<span class="tag" style="background:#'+color+'">'+mySplitResult[i]+'</span>';
}
return resultString;
}
function loadWork(){
workCounter = 0;
detailsCounter = 0;
size_details = work_screen[workCounter]*1;
$('#work').css('display','block');
setTimeout("$('#work .container').css('-moz-transform','rotate(0deg)');$('#work .container').css('-webkit-transform','rotate(0deg)');"
+"$('#work .container').css('-o-transform','rotate(0deg)');$('#work .container').css('ms-transform','rotate(0deg)');",400);
$('#work .container').html('');
startAngle=270;
for(var i=0;i<size_work;i++){
$('#work .container').append('<div class="work work'+i+'"><div class="color"></div></div>');
$('.work'+i).append('<div class="view"></div>');
$('.work'+i).append('<div class="info"><div class="title">'+generateTitleSpan(work_titles[i],work_backgrounds[i]) +'</div><div class="counter"><span style="top:9px;position:relative">'+(i+1)+'/'+size_work+'</span></div></div>');
$('.work'+i).find('.color').css('background-image','url(img/'+work_folders[i]+"/color.jpg)");
$('.work'+i).css('left',550+cosDEG(startAngle)*445);
$('.work'+i).css('top',550-sinDEG(startAngle)*445);
//$('.work'+i).find('.color').css('-moz-transform','rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('-moz-transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('-o-transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('ms-transform','scale(.7,.7) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('-webkit-transform','scale(0.7,0.7) rotate('+((-i*45)%360)+'deg)');
if(i>1){
$('.work'+i).css('-moz-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('-webkit-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('-o-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('ms-transform','scale(0,0) rotate('+((-i*45)%360)+'deg)');
$('.work'+i).css('opacity',0);
}
startAngle+=45;
}
$('.work0').attr('class','work work0 active');
$('.work1').attr('class','work work1 next');
$('.work0').css('-moz-transform','scale(1,1) rotate(0deg)');
$('.work0').css('-webkit-transform','scale(1,1) rotate(0deg)');
$('.work0').css('-o-transform','scale(1,1) rotate(0deg)');
$('.work0').css('ms-transform','scale(1,1) rotate(0deg)');
bind_work('work');
Cufon.replace('.csstransitions .info .title');
}
function parseXml(xml)
{
return xml;
}
function hide_last(lastSection, newSection){
// 0 = WORK, 1 = WORK DETAILS, 2 = ABOUT ME, 3 = LAB, 4 = LAB DETAILS, 5 = AWARDS
if(lastSection == 0){hide_thumbs('work');}
if(lastSection == 1){hide_details();}
if(lastSection == 2){hide_about();}
if(lastSection == 3){hide_thumbs('blog');}
if(lastSection == 4){hide_article();}
if(lastSection == 5){hide_awards();}
currentView = newSection;
}
function hide_thumbs(type){
tempType = type;
//$('#work .container').css('-moz-transform','rotate('+((workCounter+3)*45)%360+'deg)');
//$('#work .container').css('-webkit-transform','rotate('+((workCounter+3)*45)%360+'deg)');
$('#'+type+' .'+type).css('-moz-transform','scale(0.1,0.1) rotate(180deg)');
$('#'+type+' .'+type).css('-webkit-transform','scale(0.1,0.1) rotate(180deg)');
$('#'+type+' .'+type).css('opacity',0);
setTimeout("$('#'+tempType+' .'+tempType).remove();"
+"$('#'+tempType).css('display','none');"
+"$('#'+tempType+' .container').css('-moz-transform','rotate(-180deg)');"
+"$('#'+tempType+' .container').css('-o-transform','rotate(-180deg)');"
+"$('#'+tempType+' .container').css('ms-transform','rotate(-180deg)');"
+"$('#'+tempType+' .container').css('-webkit-transform','rotate(-180deg)');",700);
}
function hide_details(){
$('#details .container').css('-moz-transform','rotate('+(detailsCounter*360+180)+'deg)');
$('#details .container').css('-webkit-transform','rotate('+(detailsCounter*360+180)+'deg)');
$('#details .container').css('-o-transform','rotate('+(detailsCounter*360+180)+'deg)');
$('#details .container').css('ms-transform','rotate('+(detailsCounter*360+180)+'deg)');
setTimeout("$('#details').css('display','none');$('#details .container').css('-webkit-transform','rotate(-180deg)');$('#details .container').css('-moz-transform','rotate(-180deg)');"
+"$('#details .container').css('-o-transform','rotate(-180deg)');$('#details .container').css('ms-transform','rotate(-180deg)');",700);
}
function hide_about(){
$('#about .container').css('-moz-transform','rotate(180deg)');
$('#about .container').css('-webkit-transform','rotate(180deg)');
$('#about .container').css('-o-transform','rotate(180deg)');
$('#about .container').css('ms-transform','rotate(180deg)');
setTimeout("$('#about').css('display','none');$('#about .container').css('-webkit-transform','rotate(-180deg)');$('#about .container').css('-moz-transform','rotate(-180deg)');"
+"$('#about .container').css('-o-transform','rotate(-180deg)');$('#about .container').css('ms-transform','rotate(-180deg)');",700);
}
function hide_awards(){
$('#awards .container').css('-moz-transform','rotate(180deg)');
$('#awards .container').css('-webkit-transform','rotate(180deg)');
$('#awards .container').css('-o-transform','rotate(180deg)');
$('#awards .container').css('ms-transform','rotate(180deg)');
setTimeout("$('#awards').css('display','none');$('#awards .container').css('-webkit-transform','rotate(-180deg)');$('#awards .container').css('-moz-transform','rotate(-180deg)');"
+"$('#awards .container').css('-o-transform','rotate(-180deg)');$('#awards .container').css('ms-transform','rotate(-180deg)');",700);
}
function hide_article(){
$('#article .container').css('-moz-transform','rotate(180deg)');
$('#article .container').css('-webkit-transform','rotate(180deg)');
$('#article .container').css('-o-transform','rotate(180deg)');
$('#article .container').css('-ms-transform','rotate(180deg)');
setTimeout("$('#article').css('display','none');$('#article .container').css('-webkit-transform','rotate(-180deg)');$('#article .container').css('-moz-transform','rotate(-180deg)');"
+"$('#article .container').css('-o-transform','rotate(-180deg)');$('#article .container').css('ms-transform','rotate(-180deg)');",700);
}
function open_awards(){
$('#awards').css('display','block');
$('body').stop().animate(
{backgroundColor:"#eac787"},{duration:500}
);
$('#bg').stop().animate(
{opacity:0},{duration:50,complete:function(){
$('#bg').css("background-image",'url(img/awards.jpg)');
$('#bg').delay(150).animate(
{opacity:0.8},{duration:1000}
);
}}
);
setTimeout("$('#awards .container').css('-moz-transform','rotate(0deg)');$('#awards .container').css('-webkit-transform','rotate(0deg)');"
+"$('#awards .container').css('-o-transform','rotate(0deg)');$('#awards .container').css('ms-transform','rotate(0deg)');",700);
}
function open_about(){
$('#about').css('display','block');
$('body').stop().animate(
{backgroundColor:"#bfd0e4"},{duration:500}
);
$('#bg').stop().animate(
{opacity:0},{duration:50,complete:function(){
$('#bg').css("background-image",'url(img/about_bg.jpg)');
$('#bg').delay(350).animate(
{opacity:0.8},{duration:1000}
);
}}
);
$('#about .container').animate(
{'rotate':'0deg'},{duration:600}
);
setTimeout("$('#about .container').css('-moz-transform','rotate(0deg)');$('#about .container').css('-webkit-transform','rotate(0deg)');"
+"$('#about .container').css('ms-transform','rotate(0deg)');$('#about .container').css('-o-transform','rotate(0deg)');",700);
}
function open_blog(){
changeURL('lab='+(blogCounter+1));
hide_last(3,4);
$('#article').css('display','block');
$('#article .article').html('<div class="title">'+generateTitleSpan(blog_titles[blogCounter],blog_backgrounds[blogCounter])+'</div>');
$('#article .article').append('<div class="large" style="background-image:url(img/'+blog_folders[blogCounter]+'/large.jpg)"></div>');
$('#article .article').append('<div class="description">'+blog_descriptions[blogCounter]+'</div>');
var linkHTML = '<div class="links">';
if(blog_demos[blogCounter] != ''){
linkHTML += '<a target="blank" href="'+blog_demos[blogCounter]+'" class="demo">DEMO</a>';
}if(blog_downloads[blogCounter] != ''){
linkHTML += '<a target="blank" href="'+blog_downloads[blogCounter]+'" class="download">DOWNLOAD</a>';
}
linkHTML +='</div>';
$('#article .article').append(linkHTML);
Cufon.replace('.csstransitions .article .title');
setTimeout("$('#article .container').css('-moz-transform','rotate(0deg)');$('#article .container').css('-webkit-transform','rotate(0deg)');"
+"$('#article .container').css('-o-transform','rotate(0deg)');$('#article .container').css('ms-transform','rotate(0deg)');",700);
}
function open_work(){
changeURL('work='+(workCounter+1));
size_details = work_screen[workCounter]*1;
hide_last(0,1);
var awardHTML = '';
$('#details').css('display','block');
$('#details .infobox').html('<div class="title">'+generateTitleSpan(work_titles[workCounter],work_backgrounds[workCounter])+'</div>');
$('#details .infobox').append('<div class="description">'+work_descriptions[workCounter]+'</div>');
if(work_awards[workCounter] != ''){
awardHTML += '<div class="award"><a target="blank" href="http://'+work_awards[workCounter]+'" class="siteoftheday">SITE OF THE DAY</a></div>';
}
$('#details .infobox').append(awardHTML);
$('#details .infobox').append('<div class="url"><a style="color:#'+work_backgrounds[workCounter]+'" href="http://'+work_urls[workCounter]+'" target="blank">'+work_urls[workCounter]+'</a></div>');
$('#details .infobox').append('<div class="tags">'+generateTags(work_tags[workCounter],work_backgrounds[workCounter])+'</div>');
Cufon.replace('.csstransitions .infobox .title');
$('.screen').css('background-image','url(img/'+work_folders[workCounter]+'/'+ detailsCounter%size_details +'.jpg)');
setTimeout("$('#details .previous').css('display','none');$('#details .next').css('display','block');$('#details .next, #details .show_info').stop().animate({opacity:1},300).delay(400).animate({opacity:0},300);"
+"$('#details .container').css('-moz-transform','rotate(0deg)');$('#details .container').css('-webkit-transform','rotate(0deg)');"
+"$('#details .container').css('-o-transform','rotate(0deg)');$('#details .container').css('ms-transform','rotate(0deg)');",700);
}
function change(direction,type){
if(type == 'work' ){
if(direction == 'next'){workCounter++;}
if(direction == 'previous'){workCounter--;}
var tempCounter = workCounter;
var temp_folders = work_folders;
var temp_backgrounds = work_backgrounds;
}
if(type == 'blog' ){
if(direction == 'next'){blogCounter++;}
if(direction == 'previous'){blogCounter--;}
var tempCounter = blogCounter;
var temp_folders = blog_folders;
var temp_backgrounds = blog_backgrounds;
}
$('#'+type+' .container').css('-moz-transform','rotate('+(tempCounter*45)%360+'deg)');
$('#'+type+' .container').css('-webkit-transform','rotate('+(tempCounter*45)%360+'deg)');
$('#'+type+' .container').css('-o-transform','rotate('+(tempCounter*45)%360+'deg)');
$('#'+type+' .container').css('ms-transform','rotate('+(tempCounter*45)%360+'deg)');
$('#'+type+' .'+type+(tempCounter)).css('-moz-transform','scale(1,1) rotate('+(-45*tempCounter)%360+'deg)');
$('#'+type+' .'+type+(tempCounter)).css('-webkit-transform','scale(1,1) rotate('+(-45*tempCounter)%360+'deg)');
$('#'+type+' .'+type+(tempCounter)).css('-o-transform','scale(1,1) rotate('+(-45*tempCounter)%360+'deg)');
$('#'+type+' .'+type+(tempCounter)).css('ms-transform','scale(1,1) rotate('+(-45*tempCounter)%360+'deg)');
$('#'+type+' .'+type+(tempCounter)).css('border-width',8);
$('#'+type+' .'+type+(tempCounter)).attr('class',type+' '+type+tempCounter +' active');
$('#'+type+' .'+type+(tempCounter-1)).attr('class',type+' '+type+(tempCounter-1) +' prev');
$('#'+type+' .'+type+(tempCounter-2)).attr('class',type+' '+type+(tempCounter-2));
$('#'+type+' .'+type+(tempCounter+2)).attr('class',type+' '+type+(tempCounter+2));
$('#'+type+' .'+type+(tempCounter+1)).attr('class',type+' '+type+(tempCounter+1) +' next');
$('#'+type+' .'+type+(tempCounter+2)).css('-moz-transform','scale(0,0) rotate('+(-45*(tempCounter+2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+2)).css('-webkit-transform','scale(0,0) rotate('+(-45*(tempCounter+2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+2)).css('-o-transform','scale(0,0) rotate('+(-45*(tempCounter+2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+2)).css('ms-transform','scale(0,0) rotate('+(-45*(tempCounter+2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+2)).css('opacity',0);
$('#'+type+' .'+type+(tempCounter-2)).css('-moz-transform','scale(0,0) rotate('+(-45*(tempCounter-2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-2)).css('-webkit-transform','scale(0,0) rotate('+(-45*(tempCounter-2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-2)).css('-o-transform','scale(0,0) rotate('+(-45*(tempCounter-2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-2)).css('ms-transform','scale(0,0) rotate('+(-45*(tempCounter-2))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-2)).css('opacity',0);
$('#'+type+' .'+type+(tempCounter-1)).css('-moz-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter-1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-1)).css('-webkit-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter-1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-1)).css('-o-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter-1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-1)).css('ms-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter-1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter-1)).css('border-width',0);
$('#'+type+' .'+type+(tempCounter+1)).css('border-width',0);
$('#'+type+' .'+type+(tempCounter+1)).css('-moz-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter+1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+1)).css('-webkit-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter+1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+1)).css('-o-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter+1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+1)).css('ms-transform','scale(0.7,0.7) rotate('+(-45*(tempCounter+1))%360+'deg)');
$('#'+type+' .'+type+(tempCounter+1)).css('opacity',1);
$('#'+type+' .'+type+(tempCounter-1)).css('opacity',1);
$('#bg').stop().animate(
{opacity:0},{duration:50,complete:function(){
$('#bg').css("background-image",'url(img/'+temp_folders[tempCounter]+'/bg.jpg)');
$('#bg').delay(500).animate(
{opacity:0.8},{duration:600}
);
}}
);
$('body').stop().animate(
{backgroundColor:"#"+temp_backgrounds[tempCounter]},{duration:500}
);
}
function bind_work(type){
$('.'+type +',#'+type +' .next,#'+type +' .prev').unbind('click');
$('.'+type +', #'+type +' .active').unbind('mouseenter');
$('.'+type+'').unbind('mouseleave');
$('#'+type+' .active').click(function(element) {
if(type=='work'){
open_work();
}
if(type=='blog'){
open_blog();
}
});
$('#'+type +' .next').click(function(element) {
change('next',type);
$(this).find(".view").stop().animate(
{opacity:0,top:-20},{duration:0}
);
bind_work(type);
return false;
});
$('#'+type +' .prev').click(function(element) {
change('previous',type);
$(this).find(".view").stop().animate(
{opacity:0,top:-20},{duration:0}
);
bind_work(type);
return false;
});
$('.'+type+'').mouseenter(function(element) {
$(this).find(".view").stop().animate(
{opacity:1,top:0},{duration:300}
);
});
$('#'+type+' .active').mouseenter(function(element) {
$(this).find(".info").stop().delay(100).animate(
{height:120},{duration:200}
);
$(this).find(".info .counter").stop().delay(450).animate(
{height:31},{duration:150}
);
$(this).find(".info .title").stop().delay(400).animate(
{opacity:1},{duration:200}
);
});
$('.'+type+'').mouseleave(function(element) {
$(this).find(".view").stop().animate(
{opacity:0,top:-20},{duration:200}
);
$(this).find(".info").stop().animate(
{height:0},{duration:200}
);
$(this).find(".info .title").stop().animate(
{opacity:0},{duration:20}
);
$(this).find(".info .counter").stop().animate(
{height:0},{duration:50}
);
});
}
- Follow @usejquery Showcase RSS
-
Categories
-
Blog Posts
-
Partner
-
Links Of Interest
-
Latest Site
-
Startups, This Is How Design Works
Startups, This Is How Design Works
-