From 4af66ae1eab5c753bd659f8629a4cf114b75f519 Mon Sep 17 00:00:00 2001 From: rlx <0x0073@0x2620.org> Date: Sat, 4 Jun 2011 06:42:38 +0000 Subject: [PATCH] home screen demo --- static/js/pandora/ui/menu.js | 129 +++++++++++++++++++++++++++++++++++ 1 file changed, 129 insertions(+) diff --git a/static/js/pandora/ui/menu.js b/static/js/pandora/ui/menu.js index 90484f8..979d00b 100644 --- a/static/js/pandora/ui/menu.js +++ b/static/js/pandora/ui/menu.js @@ -207,6 +207,134 @@ pandora.ui.mainMenu = function() { title: 'About' }).open(); } else if (data.id == 'home') { + var $screen = $('
') + .attr({id: 'screen'}) + .css({ + position: 'absolute', + width: '100%', + height: '100%', + background: 'rgb(32, 32, 32)', + opacity: 0, + zIndex: 1000 + }) + .appendTo(Ox.UI.$body), + $logo = $('') + .attr({ + src: '/static/png/logo256.png' + }) + .css({ + position: 'absolute', + left: 0, + top: 0, + right: 0, + bottom: '160px', + width: window.innerWidth + 'px', + margin: 'auto' + }) + .bind({ + click: function() { + $screen.find('div').add('#screen > input').animate({opacity: 0}, 250); + $logo.animate({ + width: window.innerWidth + 'px' + }, 500) + $screen.animate({opacity: 0}, 500, function() { + $screen.remove(); + }); + } + }) + .appendTo($screen), + $input = Ox.Input({ + width: 156 + }) + .css({ + position: 'absolute', + left: 0, + top: '48px', + right: '164px', + bottom: 0, + margin: 'auto', + opacity: 0 + }) + .click(function(e) { + e.stopPropagation(); + }) + .appendTo($screen), + $findButton = Ox.Button({ + title: 'Find', + width: 74 + }) + .css({ + position: 'absolute', + left: '82px', + top: '48px', + right: 0, + bottom: 0, + margin: 'auto', + opacity: 0 + }) + .appendTo($screen), + $browseButton = Ox.Button({ + title: 'Browse', + width: 74 + }) + .css({ + position: 'absolute', + left: '246px', + top: '48px', + right: 0, + bottom: 0, + margin: 'auto', + opacity: 0 + }) + .appendTo($screen); + $signupButton = Ox.Button({ + title: 'Sign Up', + width: 74 + }) + .css({ + position: 'absolute', + left: 0, + top: '112px', + right: '246px', + bottom: 0, + margin: 'auto', + opacity: 0 + }) + .appendTo($screen); + $signinButton = Ox.Button({ + title: 'Sign In', + width: 74 + }) + .css({ + position: 'absolute', + left: 0, + top: '112px', + right: '82px', + bottom: 0, + margin: 'auto', + opacity: 0 + }) + .appendTo($screen); + $aboutButton = Ox.Button({ + title: 'About', + width: 156 + }) + .css({ + position: 'absolute', + left: '164px', + top: '112px', + right: 0, + bottom: 0, + margin: 'auto', + opacity: 0 + }) + .appendTo($screen); + $screen.animate({opacity: 1}, 500, function() { + $screen.find('div').add('#screen > input').animate({opacity: 1}, 250) + }); + $logo.animate({width: '320px'}, 500); + + /* var $dialog = new Ox.Dialog({ buttons: [ new Ox.Button({ @@ -224,6 +352,7 @@ pandora.ui.mainMenu = function() { title: app.site.site.name, width: 800 }).open(); + */ } else if (data.id == 'register') { app.$ui.accountDialog = pandora.ui.accountDialog('register').open(); } else if (data.id == 'loginlogout') {