diff --git a/index.js b/index.js index 7fccc197..86758569 100644 --- a/index.js +++ b/index.js @@ -1,8 +1,34 @@ 'use strict'; - +window.onerror = function(error, url) { + if (!url) { + document.onreadystatechange = function() { + if (document.readyState == 'complete') { + var logo = new Image(); + logo.onload = function() { + var warning = document.createElement('div'); + warning.innerHTML = 'Please open this file over HTTP.'; + warning.style.margin = '16px'; + document.body.appendChild(warning); + } + logo.src = 'source/Ox.UI/themes/classic/png/logo128.png'; + document.body.style.backgroundColor = 'rgb(224, 224, 224)'; + document.body.style.color = 'rgb(64, 64, 64)'; + document.body.style.fontFamily = [ + 'Lucida Grande', 'Segoe UI', 'DejaVu Sans', + 'Lucida Sans Unicode', 'Helvetica', 'Arial', 'sans-serif' + ].join(', '); + document.body.style.fontSize = '13px'; + document.body.style.margin = Math.floor( + window.innerHeight / 2 + ) - 128 + 'px'; + document.body.style.textAlign = 'center'; + document.body.appendChild(logo); + } + }; + } +}; Ox.load(function() { - - var app = { + var app = window.oxjs = { $ui: {}, animate: function() { var home = app.url.get().page == ''; @@ -21,7 +47,7 @@ Ox.load(function() { ].forEach(function(element) { app.$ui[element].stop().animate( app.getCSS(element), - 1000, + 500, element == 'screen' ? function() { if (!home) { app.$ui.logo.attr({src: app.getSRC('logo')}); @@ -53,7 +79,17 @@ Ox.load(function() { page: '', previousPage: 'about', theme: 'classic' - } + }, + warning: 'Aw, snap! This website requires an up-to-date, ' + + 'HTML5-compliant web browser. ' + + 'It should work fine in current versions of ' + + 'Chrome, ' + + 'Firefox and ' + + 'Safari, or ' + + 'Internet Explorer with ' + + '' + + 'Chrome Frame installed. ' + + 'To proceed at your own risk, click on the logo above.' }, db: Ox.localStorage('OxJS'), getCSS: function(element) { @@ -202,9 +238,7 @@ Ox.load(function() { }, 500); }); } - Ox.$window.on({ - hashchange: app.urlchange - }); + Ox.$window.on({hashchange: app.urlchange}); app.state.loaded = true; }, loadData: function(callback) { @@ -217,14 +251,10 @@ Ox.load(function() { Ox.get('readme/html/_' + id + '.html' + q, function(html) { app.data.html[id] = html; if (Ox.len(app.data.html) == app.data.pages.length) { - if (navigator.onLine) { - Ox.getJSON(url, function(data) { - app.data.downloads = data; - callback(); - }); - } else { + navigator.onLine ? Ox.getJSON(url, function(data) { + app.data.downloads = data; callback(); - } + }) : callback(); } }); }); @@ -234,17 +264,16 @@ Ox.load(function() { app.setTheme(app.user.theme); app.$ui.screen = app.ui.screen(); app.$ui.loading = app.ui.loading(); - app.$ui.logo = app.ui.logo() - .one({ - load: function() { - Ox.$('body') - .append(app.$ui.screen) - .append(app.$ui.logo) - .append(app.$ui.loading); - app.rotate(); - callback(); - } - }); + app.$ui.logo = app.ui.logo().one({ + load: function() { + Ox.$('body') + .append(app.$ui.screen) + .append(app.$ui.logo) + .append(app.$ui.loading); + app.rotate(); + callback(); + } + }); Ox.$(window).on({resize: app.resize}); }, patchButtonGroup: function($buttonGroup) { @@ -253,17 +282,14 @@ Ox.load(function() { paddingLeft: '8px', paddingRight: '8px', fontSize: '13px' - }); - $buttonGroup.find('.OxButton:first-child').css({ - //paddingLeft: '9px', + }).find('.OxButton:first-child').css({ borderTopLeftRadius: '6px', borderBottomLeftRadius: '6px' - }); - $buttonGroup.find('.OxButton:last-child').css({ - //paddingRight: '9px', + }).find('.OxButton:last-child').css({ borderTopRightRadius: '6px', borderBottomRightRadius: '6px' }); + return $buttonGroup; }, re: { code: [ @@ -474,7 +500,8 @@ Ox.load(function() { .css(app.getCSS('logo')); }, menu: function() { - var $menu = Ox.ButtonGroup({ + return app.patchButtonGroup( + Ox.ButtonGroup({ buttons: app.data.pages, min: 0, selectable: true, @@ -482,48 +509,41 @@ Ox.load(function() { .addClass('menu animate') .bindEvent({ change: function(data) { - if (data.value) { - app.url.set({page: data.value}); - } + data.value && app.url.set({page: data.value}); } }) - app.patchButtonGroup($menu); - return $menu; + ); }, page: function(page, replace) { - var $element = Ox.Container(); - $('