implemented visuals, system js ajax call

mojotrollz/page/default_page/default_page.php

@@ -13,6 +13,7 @@ class default_page extends SYSTEM\PAGE\Page {
                 '<script type="text/javascript" language="JavaScript" src="'.SYSTEM\WEBPATH(new PPAGE(),'default_page/js/wizard.js').'"></script>'.
                 '<script type="text/javascript" language="JavaScript" src="'.SYSTEM\WEBPATH(new PPAGE(),'default_page/js/onlinegraphic.js').'"></script>'.
                 '<script type="text/javascript" language="JavaScript" src="'.SYSTEM\WEBPATH(new PPAGE(),'wizard_details/js/wizard_details.js').'"></script>'.
+                '<script type="text/javascript" language="JavaScript" src="'.SYSTEM\WEBPATH(new PPAGE(),'wizard_visuals/js/wizard_visuals.js').'"></script>'.
                 '<script type="text/javascript" language="JavaScript" src="'.SYSTEM\WEBPATH(new PPAGE(),'wizard_spawn/js/wizard_spawn.js').'"></script>';
     }
       

mojotrollz/page/default_page/js/wizard.js

@@ -38,16 +38,8 @@ function SYSTEM(endpoint, group){
     this.group = group;
     this.pagestates = null;
 }
-SYSTEM.prototype.load_pagestates = function(){
+
-    result = false;
+SYSTEM.prototype.handle_call_pagestates = function (data) {
-    newps = this.pagestates;
-    if(!this.pagestates){
-        $.ajax({
-            async: false,
-            dataType: "json",
-            url: this.endpoint+'?call=pagestates&group='+this.group,
-            data: {},
-            success:    function (data) {
     if(data['status']){
         newps = data['result'];
         console.log('SYSTEM: loaded Pagestates');
@@ -56,7 +48,22 @@ SYSTEM.prototype.load_pagestates = function(){
         console.log('SYSTEM: Problem with your Pagestates.');
         result = false;}
 }
+
+SYSTEM.prototype.call = function(call,success,data,data_type,async){
+    $.ajax({
+            async: async,
+            data: data,
+            dataType: data_type,
+            url: this.endpoint+'?'+call,
+            success:    success
     });
+}
+
+SYSTEM.prototype.load_pagestates = function(){
+    result = false;
+    newps = this.pagestates;
+    if(!this.pagestates){
+        this.call('call=pagestates&group='+this.group,this.handle_call_pagestates,{},"json",false);
     } else { result = true;}
     this.pagestates = newps;
     return result;
@@ -100,6 +107,10 @@ $(document).ready(function() {
     sys.load('start');
 });
 
+
+function sendInfo(json,toolbar){
+    $.get('./api.php?call=charcreation&json='+json,function(){sys.load(toolbar)})}
+
 function init_start(){
     register_login();
     load_visualisation('mojopulse');
@@ -108,15 +119,6 @@ function init_start(){
         sys.load('wizard_details');});
 }
 
-function init_wizard_details(){
-    wizard_details();
-    sys.load('wizard_details_toolbar');}
-
-function init_wizard_details_toolbar(){
-    $('#last').click(function(){sys.load($(this).attr('sysload'));});
-    $('#next').click(function(){sys.load($(this).attr('sysload'));});
-}
-
 function register_login(){
     $("#login_form input").not("[type=submit]").jqBootstrapValidation({
         preventSubmit: true,

mojotrollz/page/wizard_details/details.tpl

@@ -39,9 +39,9 @@
     <br>
     <a class="dwarf human fadein info" info="class_paladin" cclass="paladin" href="#" style="padding-left:30px;"><img src="${WOWICONS}paladin.png" /></a>
 </div>
-<div class="lifecraft link-color" id="details_info" style="float: left; margin-top: 15px; width: 190px; height: 300px; overflow-y: hidden; padding: 8px; font-size: 14px; background: url(${PICPATH}infotext_background.png) no-repeat;">
+<div class="lifecraft link-color" id="details_info" style="float: left; margin-top: 15px; width: 190px; height: 300px; overflow-y: hidden; padding: 8px; font-size: 14px;">
     <h3><img src="${WOWICONS}help_questionmark.png" width="25px"/>&nbsp;&nbsp;Info</h3>
     <div id="info_content">${infotext_default}</div>
 </div>
 <div class="clear"></div>
-<div id="frame_content_toolbar" style="margin-top: 50px; height: 75px;">${default_page_toolbar}</div>
+<div id="frame_content_toolbar" style="margin-top: 50px; height: 75px;"></div>

mojotrollz/page/wizard_details/js/wizard_details.js

@@ -1,10 +1,13 @@
-function sendInfo(json){
+function init_wizard_details_toolbar(){
-    $.get('./api.php?call=charcreation&json='+json,function(){load_toolbar();})}
+    $('#last').click(function(){sys.load($(this).attr('sysload'));});
+    $('#next').click(function(){sys.load($(this).attr('sysload'));});
+}
 
-function wizard_details (){
+function init_wizard_details (){
+    sys.load('wizard_details_toolbar');
     
     $('#charname').keyup(function(){
-        sendInfo('{"char_name" : "'+$(this).val()+'"}');});
+        sendInfo('{"char_name" : "'+$(this).val()+'"}','wizard_details_toolbar');});
     
     $('.info').mouseover(function(){
         var info = $(this).attr('info');
@@ -18,7 +21,7 @@ function wizard_details (){
         $('#details_race a').addClass('fadeout');
         $('#details_race .'+$(this).attr('gender')).addClass('fadein');
         $(this).addClass('selected');
-        sendInfo('{"char_gender" : "'+$(this).attr('gender')+'"}');
+        sendInfo('{"char_gender" : "'+$(this).attr('gender')+'"}','wizard_details_toolbar');
     });
     
     $('#details_race a').click(function(){
@@ -26,7 +29,7 @@ function wizard_details (){
         $('#details_gender a').removeClass('selected');
         $('#details_gender .'+$(this).attr('gender')).addClass('selected');
         $(this).addClass('selected');
-        sendInfo('{"char_race" : "'+$(this).attr('race')+'", "char_gender" : "'+$(this).attr('gender')+'"}');
+        sendInfo('{"char_race" : "'+$(this).attr('race')+'", "char_gender" : "'+$(this).attr('gender')+'"}','wizard_details_toolbar');
     });
     
     $('#details_class a').click(function(){
@@ -55,8 +58,7 @@ function wizard_details (){
         if(!$('#details_race .selected').hasClass('fadein')){
             $('#details_race .selected').removeClass('selected');
         }
-        sendInfo('{"char_class" : "'+$(this).attr('cclass')+'"}');
+        sendInfo('{"char_class" : "'+$(this).attr('cclass')+'"}','wizard_details_toolbar');
-        
     });
 
     $('#content .male').click(function (){male();});

mojotrollz/page/wizard_visuals/js/wizard_visuals.js

@@ -0,0 +1,8 @@
+function init_wizard_visuals_toolbar(){
+    $('#last').click(function(){sys.load($(this).attr('sysload'));});
+    $('#next').click(function(){sys.load($(this).attr('sysload'));});
+}
+
+function init_wizard_visuals (){
+    sys.load('wizard_visuals_toolbar');
+}

mojotrollz/page/wizard_visuals/wizard_visuals.php

@@ -14,6 +14,8 @@ class wizard_visuals extends SYSTEM\PAGE\Page {
         $vars = array();               
         $vars['js'] = $this->js();
         $vars['css'] = $this->css();
-        return 'not implemented';        
+        $vars['WOWICONS'] = \SYSTEM\CONFIG\config::get(\SYSTEM\CONFIG\config_ids::SYS_CONFIG_PATH_BASEURL).'api.php?call=files&cat=wowicons&id=';
+        $vars['infotext_default'] = \SYSTEM\locale::getStrings(DBD\locale_string::VALUE_CATEGORY_WOW_INFOTEXT)['default'];
+        return  SYSTEM\PAGE\replace::replaceFile(SYSTEM\SERVERPATH(new PPAGE(),'wizard_visuals/wizard_visuals.tpl'), $vars);
     }
 }

mojotrollz/page/wizard_visuals/wizard_visuals.tpl

@@ -0,0 +1,6 @@
+<div class="lifecraft link-color" id="details_info" style="float: left; margin-top: 15px; width: 190px; height: 300px; overflow-y: hidden; padding: 8px; font-size: 14px;">
+    <h3><img src="${WOWICONS}help_questionmark.png" width="25px"/>&nbsp;&nbsp;Info</h3>
+    <div id="info_content">${infotext_default}</div>
+</div>
+<div class="clear"></div>
+<div id="frame_content_toolbar" style="margin-top: 50px; height: 75px;">${wizard_visuals_toolbar}</div>