Made some pre-setup server-side to make avoid loading screens on website load

www-root/index.html

@@ -9,7 +9,7 @@
     <script src="/js/jquery.js"></script>
     <script src="/js/ngn4-0.4.1.js"></script>
     <script src="/js/page.js"></script>
-    <style id="generator-style"></style>
+    <style id="generator-style">{generatorStyle}</style>
     <style id="name-style"></style>
   </head>
   <body>
@@ -29,4 +29,9 @@
     </div>
     <div class="ngn4-panel ngn4-footer"><p>Copyrighted content and trademarks are the property of the publishers and developers of the game series, and the developer of this website is in no way affilated with them.</p><p>By continuing to use this site, you agree to the use of cookies. These are only used to recall where you were between sessions, and are not shared with any third-parties.</p><p>This is still a work in progress, with bugs and poor optimization. I recommend you do not browse this website on a very limited metered connection.</p><center><a href="javascript:hideFooter();">CLOSE</a></center></div>
   </body>
+  <script type="text/javascript">
+    var initData = {initData};
+    var genList = {genList};
+    var inited = {inited};
+  </script>
 </html>

www-root/js/page.js

@@ -120,33 +120,39 @@ function updateLists() {
   $('#menu-items').html("Loading...");
 
   $.get('/l/generators', function(data, err) {
-    // 1. Categories
-    var keys = Object.keys(data.categories);
-    var items = {};
-    $('#menu-items').html('');
-    for(var i = 0; i < keys.length; ++i) {
-      var key = keys[i];
-      var item = $('<div class="item" data-id="'+key+'"><span>'+data.categories[key]+'</span><div class="ngn4-panel"></div></div>');
-
-      items[key] = item;
-      $('#menu-items').append(item);
-
-      categories[key] = data.categories[key];
+    if(!err) {
+      setList(data);
     }
-
-    // 2. Sub menus
-    keys = Object.keys(data.generators);
-    for(var i = 0; i < keys.length; ++i) {
-      var key = keys[i];
-      var item = $('<a href="javascript:selectGenerator(\''+key+'\')">'+data.generators[key]+'</a>');
-
-      $('div', items[key.split('/')[0]]).append(item);
-    }
-
-    applyMediaQueries(true);
   });
 }
 
+function setList(data) {
+  // 1. Categories
+  var keys = Object.keys(data.categories);
+  var items = {};
+  $('#menu-items').html('');
+  for(var i = 0; i < keys.length; ++i) {
+    var key = keys[i];
+    var item = $('<div class="item" data-id="'+key+'"><span>'+data.categories[key]+'</span><div class="ngn4-panel"></div></div>');
+
+    items[key] = item;
+    $('#menu-items').append(item);
+
+    categories[key] = data.categories[key];
+  }
+
+  // 2. Sub menus
+  keys = Object.keys(data.generators);
+  for(var i = 0; i < keys.length; ++i) {
+    var key = keys[i];
+    var item = $('<a href="javascript:selectGenerator(\''+key+'\')">'+data.generators[key]+'</a>');
+
+    $('div', items[key.split('/')[0]]).append(item);
+  }
+
+  applyMediaQueries(true);
+}
+
 function applyMediaQueries(force) {
   var mq = window.matchMedia("(max-width: 980px)");
 
@@ -190,14 +196,21 @@ $(document).ready(function() {
     $('.ngn4-footer').hide();
   }
 
-  var lastGenerator = getCookie('last_generator');
-  if(lastGenerator.length > 0) {
-    selectGenerator(lastGenerator);
-  } else {
-    selectGenerator('default');
-  }
+  if(inited !== true) {
+    var lastGenerator = getCookie('last_generator');
+    if(lastGenerator.length > 0) {
+      selectGenerator(lastGenerator);
+    } else {
+      selectGenerator('default');
+    }
 
-  updateLists();
+    updateLists();
+  } else {
+    var fullId = initData.catId + '/' + initData.id;
+    setGenerator(fullId, set.addGenerator(fullId, initData, true));
+
+    setList(genList);
+  }
 });
 
 $(window).resize(applyMediaQueries);