better integration of home, about, preferences, login, etc, and support for /item/position urls

pandora/0xdb.json

@@ -424,7 +424,8 @@
         {"id": "player", "title": "Player"},
         {"id": "timeline", "title": "Timeline"},
         {"id": "map", "title": "Map"},
-        {"id": "calendar", "title": "Calendar"}
+        {"id": "calendar", "title": "Calendar"},
+        {"id": "files", "title": "Files"}
     ],
     "layers": [
         {
@@ -537,6 +538,7 @@
             "showAnnotations": true,
             "showControls": true,
             "showGroups": true,
+            "showHome": true,
             "showInfo": true,
             "showMovies": true,
             "showFolder": {

static/js/pandora.js

@@ -23,7 +23,7 @@ Ox.load('Geo', function() {
     window.pandora = new Ox.App({url: '/api/'}).bindEvent({
 
         load: function(event, data) {
-            $.extend(pandora, {
+            Ox.extend(pandora, {
                 requests: {},
                 ui: {}
             });
@@ -32,7 +32,7 @@ Ox.load('Geo', function() {
 
                 Ox.UI.hideLoadingScreen();
 
-                $.extend(pandora, {
+                Ox.extend(pandora, {
                     $ui: {
                         body: $('body'),
                         document: $(document),
@@ -41,9 +41,9 @@ Ox.load('Geo', function() {
                             .unload(unloadWindow)
                     },
                     site: data.site,
-                    user: data.user.level == 'guest' ? $.extend({}, data.site.user) : data.user
+                    user: data.user.level == 'guest' ? Ox.extend({}, data.site.user) : data.user
                 });
-                $.extend(pandora.site, {
+                Ox.extend(pandora.site, {
                     findKeys: $.map(data.site.itemKeys, function(key, i) {
                         return key.find ? key : null;
                     }),
@@ -75,10 +75,7 @@ Ox.load('Geo', function() {
                         return key.columnWidth ? key : null;
                     })
                 });
-                pandora.site.itemViews.push(
+                Ox.extend(pandora.user, {
-                    {id: 'files', title: 'Files', admin: 'true'}
-                );
-                $.extend(pandora.user, {
                     infoRatio: 16 / 9,
                     sectionElement: 'buttons',
                     selectedMovies: [],

static/js/pandora/URL.js

@@ -4,6 +4,14 @@
 pandora.URL = (function() {
 
     var regexps = {
+            '^(|home)$': function(url) {
+                if (url == 'home' || pandora.user.ui.showHome) {
+                    //$('.OxLoadingScreen').stop().remove();
+                    pandora.$ui.home = pandora.ui.home().showScreen();
+                    pandora.user.ui.showHome = false;
+                }
+                pandora.Query.updateGroups();
+            },
             '^\\?url=': function(url) {
                 Ox.print('URL', url)
                 document.location = decodeURIComponent(url.substr(5));
@@ -15,11 +23,27 @@ pandora.URL = (function() {
                     item: ''
                 });
             },
-            '^(|about|archives|faq|help|license|home|news|preferences|software|terms|tour)$': function(url) {
+            '^(about|faq|home|news|software|terms|tour)$': function(url) {
-                pandora.UI.set({
+                pandora.$ui.siteDialog = pandora.ui.siteDialog(url).open();
-                    section: 'site',
+                pandora.Query.updateGroups();
-                    sitePage: url || 'home'
+            },
-                });
+            '^(signin|signout|signup)$': function(url) {
+                if ((url == 'signout') == (pandora.user.level != 'guest')) {
+                    pandora.$ui.accountDialog = (
+                        pandora.user.level == 'guest'
+                        ? pandora.ui.accountDialog(url)
+                        : pandora.ui.accountSignoutDialog()
+                    ).open();
+                }
+                pandora.Query.updateGroups();
+            },
+            '^preferences$': function() {
+                pandora.$ui.preferencesDialog = pandora.ui.preferencesDialog().open();
+                pandora.Query.updateGroups();
+            },
+            '^help$': function() {
+                pandora.$ui.helpDialog = pandora.ui.helpDialog().open();
+                pandora.Query.updateGroups();
             },
             '^admin': function(url) {
                 var split = url.split('/'),
@@ -53,18 +77,40 @@ pandora.URL = (function() {
             },
             '^[0-9A-Z]': function(url) {
                 var split = url.split('/'),
+                    length = split.length,
                     item = split[0],
                     view = new RegExp(
-                        '^(' + $.map(pandora.site.itemViews, function(v) {
+                            '^(' + $.map(pandora.site.itemViews, function(v) {
-                            return v.id;
+                                return v.id;
-                        }).join('|') + ')$'
+                            }).join('|') + ')$'
-                    ).exec(split[1]);
+                        ).exec(split[1]),
-                view = view ? view[0] : pandora.user.ui.itemView;
+                    position = length > 1
+                        ? /[\d\.:-]+/.exec(split[length - 1])
+                        : null;
+                view = view ? view[0]
+                    : position ? pandora.user.ui.videoView
+                    : pandora.user.ui.itemView;
                 pandora.UI.set({
                     section: 'items',
                     item: item,
                     itemView: view
                 });
+                Ox.print('POSITION', position)
+                if (position) {
+                    split[length - 1] = position[0].split('-').map(function(point, i) {
+                        // fixme: this is duplicated, see Ox.VideoPlayer() parsePositionInput()
+                        var parts = point.split(':').reverse();
+                        while (parts.length > 3) {
+                            parts.pop();
+                        }
+                        point = parts.reduce(function(prev, curr, i) {
+                            return prev + (parseFloat(curr) || 0) * Math.pow(60, i);
+                        }, 0);
+                        i == 0 && pandora.UI.set(['videoPosition', item].join('|'), point);
+                        return Ox.formatDuration(point);
+                    }).join('-');
+                    pandora.URL.replace(split.join('/'))
+                }
             }
         };
 
@@ -85,7 +131,7 @@ pandora.URL = (function() {
             var url = document.location.pathname.substr(1) +
                     document.location.search +
                     document.location.hash;
-            $.each(regexps, function(re, fn) {
+            Ox.forEach(regexps, function(fn, re) {
                 //Ox.print(url, 're', re)
                 re = new RegExp(re);
                 if (re.test(url)) {
@@ -106,6 +152,16 @@ pandora.URL = (function() {
             history.pushState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
         },
 
+        replace: function(title, url) {
+            if (arguments.length == 1) { // fixme: remove later
+                url = title;
+            }
+            if (url[0] != '/') {
+                url = '/' + url;
+            }
+            history.replaceState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
+        },
+
         update: function() {
             var oldUserUI = Ox.clone(pandora.user.ui);
             Ox.Request.cancel();

static/js/pandora/pandora.js

@@ -102,14 +102,14 @@ pandora.getVideoPartsAndPoints = function(durations, points) {
     return ret;
 };
 
-pandora.login = function(data) {
+pandora.signin = function(data) {
     pandora.user = data.user;
     pandora.Query.updateGroups();
     Ox.Theme(pandora.user.ui.theme);
     pandora.$ui.appPanel.reload();
 };
 
-pandora.logout = function(data) {
+pandora.signout = function(data) {
     pandora.user = data.user;
     pandora.Query.updateGroups();
     Ox.Theme(pandora.site.user.ui.theme);

static/js/pandora/ui/account.js

@@ -22,28 +22,28 @@ pandora.ui.accountDialogOptions = function(action, value) {
     //Ox.print('ACTION', action)
     pandora.$ui.accountForm && pandora.$ui.accountForm.removeElement();
     var buttons = {
-            login: ['register', 'reset'],
+            signin: ['signup', 'reset'],
-            register: ['login'],
+            signup: ['signin'],
-            reset: ['login'],
+            reset: ['signin'],
-            resetAndLogin: []
+            resetAndSignin: []
         },
         buttonTitle = {
-            login: 'Login',
+            signin: 'Sign In',
-            register: 'Register',
+            signup: 'Sign Up',
             reset: 'Reset Password',
-            resetAndLogin: 'Reset Password and Login'
+            resetAndSignin: 'Reset Password and Sign In'
         },
         dialogText = {
-            login: 'To login to your account, please enter your username and password.',
+            signin: 'To sign in to your account, please enter your username and password.',
-            register: 'To create a new account, please choose a username and password, and enter your e-mail address.',
+            signup: 'To sign up for an account, please choose a username and password, and enter your e-mail address.',
             reset: 'To reset your password, please enter either your username or your e-mail address.',
-            resetAndLogin: 'To login to your account, please choose a new password, and enter the code that we have just e-mailed to you.'
+            resetAndSignin: 'To sign in to your account, please choose a new password, and enter the code that we have just e-mailed to you.'
         },
         dialogTitle = {
-            login: 'Login',
+            signin: 'Sign In',
-            register: 'Register',
+            signup: 'Sign Up',
             reset: 'Reset Password',
-            resetAndLogin: 'Reset Password'
+            resetAndSignin: 'Reset Password'
         };
     function button(type) {
         if (type == 'cancel') {
@@ -115,10 +115,10 @@ pandora.ui.accountForm = function(action, value) {
         });
     }
     var items = {
-            'login': ['username', 'password'],
+            'signin': ['username', 'password'],
-            'register': ['newUsername', 'password', 'email'],
+            'signup': ['newUsername', 'password', 'email'],
             'reset': ['usernameOrEmail'],
-            'resetAndLogin': ['oldUsername', 'newPassword', 'code']
+            'resetAndSignin': ['oldUsername', 'newPassword', 'code']
         },
         $items = $.map(items[action], function(v) {
             return item(v, value);
@@ -127,38 +127,39 @@ pandora.ui.accountForm = function(action, value) {
             id: 'accountForm' + Ox.toTitleCase(action),
             items: $items,
             submit: function(data, callback) {
-                if (action == 'login') {
+                if (action == 'signin') {
                     pandora.api.signin(data, function(result) {
                         if (!result.data.errors) {
                             pandora.$ui.accountDialog.close();
-                            pandora.login(result.data);
+                            pandora.signin(result.data);
                         } else {
                             callback([{id: 'password', message: 'Incorrect password'}]);
                         }
                     });
-                } else if (action == 'register') {
+                } else if (action == 'signup') {
                     pandora.api.signup(data, function(result) {
                         if (!result.data.errors) {
                             pandora.$ui.accountDialog.close();
-                            pandora.login(result.data);
+                            pandora.signin(result.data);
                             pandora.ui.accountWelcomeDialog().open();
                         } else {
                             callback([{id: 'password', message: result.data.errors.toString()}]); // fixme
                         }
                     });
                 } else if (action == 'reset') {
+                    Ox.print('DATA???', data)
                     var usernameOrEmail = data.usernameOrEmail,
-                        key = usernameOrEmail[0].id;
+                        key = usernameOrEmail[0];
                     data = {};
                     data[key] = usernameOrEmail[1];
                     pandora.api.requestToken(data, function(result) {
                         if (!result.data.errors) {
-                            pandora.$ui.accountDialog.options(ui.accountDialogOptions('resetAndLogin', result.data.username));
+                            pandora.$ui.accountDialog.options(pandora.ui.accountDialogOptions('resetAndSignin', result.data.username));
                         } else {
                             callback([{id: 'usernameOrEmail', message: 'Unknown ' + (key == 'username' ? 'username' : 'e-mail address')}])
                         }
                     });
-                } else if (action == 'resetAndLogin') {
+                } else if (action == 'resetAndSignin') {
                     pandora.api.resetPassword(data, function(result) {
                         if (!result.data.errors) {
                             pandora.$ui.accountDialog.close();
@@ -302,7 +303,7 @@ pandora.ui.accountForm = function(action, value) {
     return that;            
 };
 
-pandora.ui.accountLogoutDialog = function() {
+pandora.ui.accountSignoutDialog = function() {
     var that = Ox.Dialog({
             buttons: [
                 Ox.Button({
@@ -310,15 +311,15 @@ pandora.ui.accountLogoutDialog = function() {
                     title: 'Cancel'
                 }).bindEvent('click', function() {
                     that.close();
-                    pandora.$ui.mainMenu.getItem('loginlogout').toggleTitle();
+                    pandora.$ui.mainMenu.getItem('signinsignout').toggleTitle();
                 }),
                 Ox.Button({
-                    id: 'logout',
+                    id: 'signout',
-                    title: 'Logout'
+                    title: 'Sign Out'
                 }).bindEvent('click', function() {
                     that.close();
                     pandora.api.signout({}, function(result) {
-                        pandora.logout(result.data);
+                        pandora.signout(result.data);
                     });
                 })
             ],
@@ -331,12 +332,12 @@ pandora.ui.accountLogoutDialog = function() {
                 .append(
                     Ox.Element()
                         .css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
-                        .html('Are you sure you want to logout?')
+                        .html('Are you sure you want to sign out?')
                 ),
             fixedSize: true,
             height: 128,
-            keys: {enter: 'logout', escape: 'cancel'},
+            keys: {enter: 'signout', escape: 'cancel'},
-            title: 'Logout',
+            title: 'Sign Out',
             width: 304
         });
     return that;
@@ -350,6 +351,7 @@ pandora.ui.accountWelcomeDialog = function() {
                     title: 'Preferences...'
                 }).bindEvent('click', function() {
                     that.close();
+                    pandora.$ui.preferencesDialog = pandora.ui.preferencesDialog().open();
                 }),
                 {},
                 Ox.Button({

static/js/pandora/ui/appPanel.js

@@ -14,9 +14,11 @@ pandora.ui.appPanel = function() {
         });
     that.display = function() {
         // fixme: move animation into Ox.App
-        pandora.$ui.body.css({opacity: 0});
+        var animate = $('#home').length == 0;
+        Ox.print('ANIMATE?', animate)
+        animate && pandora.$ui.body.css({opacity: 0});
         that.appendTo(pandora.$ui.body);
-        pandora.$ui.body.animate({opacity: 1}, 1000);
+        animate && pandora.$ui.body.animate({opacity: 1}, 1000);
         return that;
     }
     that.reload = function() {

static/js/pandora/ui/home.js

@@ -0,0 +1,264 @@
+// vim: et:ts=4:sw=4:sts=4:ft=javascript
+
+pandora.ui.home = function() {
+
+    var that = $('<div>')
+            .attr({id: 'home'})
+            .css({
+                position: 'absolute',
+                width: '100%',
+                height: '100%',
+                background: 'rgb(32, 32, 32)',
+                opacity: 0,
+                zIndex: 1000
+            }),
+        $reflectionImage = $('<img>')
+            .attr({src: '/static/png/logo256.png'})
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: '160px',
+                right: 0,
+                bottom: 0,
+                width: '320px',
+                margin: 'auto',
+                opacity: 0,
+                MozTransform: 'scaleY(-1)',
+                WebkitTransform: 'scaleY(-1)'
+            })
+            .appendTo(that),
+        $reflectionGradient = $('<div>')
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: '160px',
+                right: 0,
+                bottom: 0,
+                width: '320px',
+                height: '160px',
+                margin: 'auto',
+                backgroundImage: '-webkit-linear-gradient(top, rgba(32, 32, 32, 0.8), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))'
+            })
+            .appendTo(that),
+        $logo = $('<img>')
+            .attr({
+                id: 'logo',
+                src: '/static/png/logo256.png'
+            })
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: 0,
+                right: 0,
+                bottom: '160px',
+                width: window.innerWidth + 'px',
+                margin: 'auto',
+                cursor: 'pointer'
+            })
+            .bind({
+                click: function() {
+                    that.fadeOutScreen();
+                }
+            })
+            .appendTo(that),
+        $findInput = Ox.Input({
+                width: 156
+            })
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: '48px',
+                right: '164px',
+                bottom: 0,
+                margin: 'auto',
+                opacity: 0
+            })
+            .click(function(e) {
+                // fixme: why?
+                e.stopPropagation();
+            })
+            .bindEvent({
+                submit: function(data) {
+                    pandora.URL.set('/?find=' + data.value);
+                    that.fadeOutScreen();
+                }
+            })
+            .appendTo(that),
+        $findButton = Ox.Button({
+                title: 'Find',
+                width: 74
+            })
+            .css({
+                position: 'absolute',
+                left: '82px',
+                top: '48px',
+                right: 0,
+                bottom: 0,
+                margin: 'auto',
+                opacity: 0
+            })
+            .bindEvent({
+                click: function() {
+                    pandora.URL.set('/?find=' + $findInput.value());
+                    that.fadeOutScreen();
+                }
+            })
+            .appendTo(that),
+        $browseButton = Ox.Button({
+                title: 'Browse',
+                width: 74
+            })
+            .css({
+                position: 'absolute',
+                left: '246px',
+                top: '48px',
+                right: 0,
+                bottom: 0,
+                margin: 'auto',
+                opacity: 0
+            })
+            .bindEvent({
+                click: function() {
+                    that.fadeOutScreen();
+                }
+            })
+            .appendTo(that),
+        $signupButton = Ox.Button({
+                title: 'Sign Up',
+                width: 74
+            })
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: '112px',
+                right: '246px',
+                bottom: 0,
+                margin: 'auto',
+                opacity: 0
+            })
+            .bindEvent({
+                click: function() {
+                    pandora.URL.set('/signup');
+                    that.fadeOutScreen();
+                }
+            }),    
+        $signinButton = Ox.Button({
+                title: 'Sign In',
+                width: 74
+            })
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: '112px',
+                right: '82px',
+                bottom: 0,
+                margin: 'auto',
+                opacity: 0
+            })
+            .bindEvent({
+                click: function() {
+                    pandora.URL.set('/signin');
+                    that.fadeOutScreen();
+                }
+            }),    
+        $preferencesButton = Ox.Button({
+                title: 'Preferences',
+                width: 156
+            })
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: '112px',
+                right: '164px',
+                bottom: 0,
+                margin: 'auto',
+                opacity: 0
+            })
+            .bindEvent({
+                click: function() {
+                    pandora.URL.set('/preferences');
+                    that.fadeOutScreen();
+                }
+            }),    
+        $aboutButton = Ox.Button({
+                title: 'About ' + pandora.site.site.name,
+                width: 156
+            })
+            .css({
+                position: 'absolute',
+                left: '164px',
+                top: '112px',
+                right: 0,
+                bottom: 0,
+                margin: 'auto',
+                opacity: 0
+            })
+            .bindEvent({
+                click: function() {
+                    pandora.URL.set('/about');
+                    that.fadeOutScreen();
+                }
+            })
+            .appendTo(that),
+        $text = $('<div>')
+            .html('A Movie Database. \u2620 2007-2011 0x2620. All Open Source.')
+            .css({
+                position: 'absolute',
+                left: 0,
+                top: '176px',
+                right: 0,
+                bottom: 0,
+                width: '360px',
+                height: '16px',
+                margin: 'auto',
+                opacity: 0,
+                textAlign: 'center'                               
+            })
+            .appendTo(that);
+
+    if (pandora.user.level == 'guest') {
+        $signupButton.appendTo(that);
+        $signinButton.appendTo(that);
+    } else {
+        $preferencesButton.appendTo(that);
+    }
+
+    that.fadeInScreen = function() {
+        Ox.print('FADE IN SCREEN')
+        that.appendTo(Ox.UI.$body).animate({opacity: 1}, 500, function() {
+            that.find(':not(#logo)').animate({opacity: 1}, 250, function() {
+                $findInput.focusInput();
+            });
+        });
+        $logo.animate({width: '320px'}, 500);
+        return that;
+    };
+
+    that.fadeOutScreen = function() {
+        that.find(':not(#logo)').hide();
+        $logo.animate({width: window.innerWidth + 'px'}, 500);
+        that.animate({opacity: 0}, 500, function() {
+            that.remove();
+        });
+        return that;
+    };
+
+    that.hideScreen = function() {
+        that.hide().remove();
+        that.find(':not(#logo)').css({opacity: 0});
+        $logo.css({width: window.innerWidth + 'px'});
+        return that;
+    };
+
+    that.showScreen = function() {
+        Ox.print('SHOW SCREEN')
+        $logo.css({width: '320px'});
+        that.find(':not(#logo)').css({opacity: 1});
+        that.css({opacity: 1}).appendTo(Ox.UI.$body);
+        $findInput.focusInput();
+        return that;
+    };
+
+    return that;
+  
+};

static/js/pandora/ui/homePage.js

@@ -1,5 +1,7 @@
 // vim: et:ts=4:sw=4:sts=4:ft=javascript
 
+// fixme: remove
+
 pandora.ui.homePage = function() {
 
     var that = Ox.Element()

static/js/pandora/ui/menu.js

@@ -28,8 +28,8 @@ pandora.ui.mainMenu = function() {
                     { id: 'preferences', title: 'Preferences...', disabled: isGuest, keyboard: 'control ,' },
                     { id: 'archives', title: 'Archives...', disabled: isGuest },
                     {},
-                    { id: 'register', title: 'Register...', disabled: !isGuest },
+                    { id: 'signup', title: 'Sign Up...', disabled: !isGuest },
-                    { id: 'loginlogout', title: isGuest ? 'Login...' : 'Logout...' }
+                    { id: 'signinsignout', title: isGuest ? 'Sign In...' : 'Sign Out...' }
                 ] },
                 { id: 'listMenu', title: 'List', items: [
                     { id: 'history', title: 'History', items: [
@@ -201,267 +201,21 @@ pandora.ui.mainMenu = function() {
                 }
             },
             click: function(event, data) {
-                if (data.id == 'about') {
+                if (data.id == 'home') {
-                    var tabs = [
+                    pandora.$ui.home = pandora.ui.home().fadeInScreen();
-                        {id: 'about', title: 'About', selected: true},
+                } else if (['about', 'news', 'tour', 'faq', 'tos', 'contact', 'software'].indexOf(data.id) > -1) {
-                        {id: 'news', title: 'News'},
+                    pandora.$ui.siteDialog = pandora.ui.siteDialog(data.id).open();
-                        {id: 'tour', title: 'Take a Tour'},
+                    pandora.URL.push(data.id);
-                        {id: 'faq', title: 'Frequently Asked Questions'},
+                } else if (data.id == 'preferences') {
-                        {id: 'tos', title: 'Terms of Service'},
+                    pandora.$ui.preferencesDialog = pandora.ui.preferencesDialog().open();
-                        {id: 'contact', title: 'Contact'},
+                } else if (data.id == 'signup') {
-                        {id: 'software', title: 'Software'}
+                    pandora.$ui.accountDialog = pandora.ui.accountDialog('signup').open();
-                    ];
+                } else if (data.id == 'signinsignout') {
-                    var $tabPanel = Ox.TabPanel({
+                    pandora.$ui.accountDialog = (
-                            content: function(id) {
+                        pandora.user.level == 'guest'
-                                return Ox.SplitPanel({
+                        ? pandora.ui.accountDialog('signin')
-                                    elements: [
+                        : pandora.ui.accountSignoutDialog()
-                                        {
+                    ).open();
-                                            element: Ox.Element()
-                                                .css({padding: '16px'})
-                                                .append(
-                                                    $('<img>')
-                                                        .attr({src: '/static/png/logo256.png'})
-                                                        .css({width: '128px'})
-                                                ),
-                                            size: 144
-                                        },
-                                        {
-                                            element: Ox.Element()
-                                                .css({padding: '16px', overflowY: 'auto'})
-                                                .html(Ox.repeat(Ox.getObjectById(tabs, id).title + ' ', 200))
-                                        }
-                                    ],
-                                    orientation: 'horizontal'
-                                });
-                            },
-                            tabs: tabs
-                        })
-                        .bindEvent({
-                            change: function(data) {
-                                $dialog.options({
-                                    title: Ox.getObjectById(tabs, data.selected).title
-                                });
-                            }
-                        });
-                    var $dialog = Ox.Dialog({
-                        buttons: [
-                            Ox.Button({
-                                id: 'close',
-                                title: 'Close'
-                            }).bindEvent({
-                                click: function() {
-                                    $dialog.close();
-                                }
-                            })
-                        ],
-                        //closeButton: true,
-                        content: $tabPanel,
-                        height: Math.round((window.innerHeight - 24) * 0.75),
-                        //maximizeButton: true,
-                        minHeight: 256,
-                        minWidth: 640,
-                        title: 'About',
-                        width: Math.round(window.innerWidth * 0.75),
-                    }).open();
-                } else if (data.id == 'home') {
-                    var $screen = $('<div>')
-                            .attr({id: 'screen'})
-                            .css({
-                                position: 'absolute',
-                                width: '100%',
-                                height: '100%',
-                                background: 'rgb(32, 32, 32)',
-                                opacity: 0,
-                                zIndex: 1000
-                            })
-                            .appendTo(Ox.UI.$body),
-                        $reflectionImage = $('<img>')
-                            .attr({
-                                src: '/static/png/logo256.png'
-                            })
-                            .css({
-                                position: 'absolute',
-                                left: 0,
-                                top: '160px',
-                                right: 0,
-                                bottom: 0,
-                                width: '320px',
-                                margin: 'auto',
-                                opacity: 0,
-                                MozTransform: 'scaleY(-1)',
-                                WebkitTransform: 'scaleY(-1)'
-                            })
-                            .appendTo($screen),
-                        $reflectionGradient = $('<div>')
-                            .css({
-                                position: 'absolute',
-                                left: 0,
-                                top: '160px',
-                                right: 0,
-                                bottom: 0,
-                                width: '320px',
-                                height: '160px',
-                                margin: 'auto',
-                                backgroundImage: '-webkit-linear-gradient(top, rgba(32, 32, 32, 0.8), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))'
-                            })
-                            .appendTo($screen),
-                        $logo = $('<img>')
-                            .attr({
-                                id: 'logo',
-                                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(':not(#logo)').remove();
-                                    $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)
-                            .focusInput(),
-                        $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 ' + pandora.site.site.name,
-                                width: 156
-                            })
-                            .css({
-                                position: 'absolute',
-                                left: '164px',
-                                top: '112px',
-                                right: 0,
-                                bottom: 0,
-                                margin: 'auto',
-                                opacity: 0
-                            })
-                            .appendTo($screen),
-                        $text = $('<div>')
-                            .html('A Movie Database. \u2620 2007-2011 0x2620. All Open Source.')
-                            .css({
-                                position: 'absolute',
-                                left: 0,
-                                top: '176px',
-                                right: 0,
-                                bottom: 0,
-                                width: '360px',
-                                height: '16px',
-                                margin: 'auto',
-                                opacity: 0,
-                                textAlign: 'center'                               
-                            })
-                            .appendTo($screen)
-                    $screen.animate({opacity: 1}, 500, function() {
-                        $screen.find(':not(#logo)').animate({opacity: 1}, 250)
-                    });
-                    $logo.animate({width: '320px'}, 500);
-                        
-                    /*
-                    var $dialog = Ox.Dialog({
-                        buttons: [
-                            Ox.Button({
-                                id: 'close',
-                                title: 'Close'
-                            }).bindEvent({
-                                click: function() {
-                                    $dialog.close();
-                                }
-                            })
-                        ],
-                        height: 498,
-                        id: 'home',
-                        keys: {enter: 'close', escape: 'close'},
-                        title: pandora.site.site.name,
-                        width: 800
-                    }).open();
-                    */
-                } else if (data.id == 'register') {
-                    pandora.$ui.accountDialog = pandora.ui.accountDialog('register').open();
-                } else if (data.id == 'loginlogout') {
-                    pandora.$ui.accountDialog = (pandora.user.level == 'guest' ?
-                        pandora.ui.accountDialog('login') : pandora.ui.accountLogoutDialog()).open();
                 } else if (data.id == 'stills') {
                     var id = pandora.user.ui.item || pandora.user.ui.listItem;
                     pandora.$ui.postersDialog = pandora.ui.framesDialog(id).open();

static/js/pandora/ui/viewSelect.js

@@ -7,9 +7,7 @@ pandora.ui.viewSelect = function() {
                     checked: pandora.user.ui.lists[pandora.user.ui.list].listView == view.id,
                     title: 'View ' + view.title
                 });
-            }) : pandora.site.itemViews.filter(function(view) {
+            }) : pandora.site.itemViews.map(function(view) {
-                return !view.admin || pandora.user.level == 'admin';
-            }).map(function(view) {
                 return $.extend($.extend({}, view), {
                     checked: pandora.user.ui.itemView == view.id,
                     title: 'View: ' + view.title

static/json/pandora.json

@@ -41,5 +41,8 @@
   "js/pandora/ui/videoPreview.js", 
   "js/pandora/ui/editor.js",
   "js/pandora/ui/infoView.js",
-  "js/pandora/ui/mediaView.js"
+  "js/pandora/ui/mediaView.js",
+  "js/pandora/ui/home.js",
+  "js/pandora/ui/preferencesDialog.js",
+  "js/pandora/ui/siteDialog.js"
 ]