updated skilltree

mojotrollz/api/char/js/skilltree.js

@@ -11,42 +11,136 @@ function skilltree(){
         var id_img = '#'+this.id +'i';
         switch (event.which) {
             case 1:
-                if(!is_point_max() && !is_icon_max(id_count)){
+                if(is_icon_skillable(id) && !is_point_max() && !is_icon_max(id_count)){
-                    write_icon_cur(id_count,id_img,1);}
+                    write_icon_cur(id,id_count,id_img,1);}
                 break;
             case 2:
                 //alert('Middle Mouse button pressed.');
                 break;
             case 3:
-                if(!is_icon_min(id_count)){
+                if(is_icon_deskillable(id) && !is_icon_min(id_count)){
-                    write_icon_cur(id_count,id_img,-1);}
+                    write_icon_cur(id,id_count,id_img,-1);}
                 break;
             default:
                 //alert('You have a strange Mouse!');
         }
     });
 }
+function write_points(){
+    $('#treeheader1 .stdText').html(' - '+points_spent_t1+' Points');
+    $('#treeheader2 .stdText').html(' - '+points_spent_t2+' Points');
+    $('#treeheader3 .stdText').html(' - '+points_spent_t3+' Points');
+}
 
+function is_icon_skillable(id){
+    tree = parseInt($(id).attr('t'));
+    row = parseInt($(id).attr('r'));
+    column = parseInt($(id).attr('r'));
+    count = 0;
+    
+    $('#tree'+tree+' .icon').each(function(){
+        if($(this).attr('r') < row){
+            count += parseInt($('#'+this.id+'c').attr('cur'));}
+    });
+    
+    if(count < 5*(row-1)){
+        return false;}
+    
+    if( $('#'+this.id+'i').hasClass('icon_border_grey_inc_left') ||
+        $('#'+this.id+'i').hasClass('icon_border_green_inc_left') ||
+        $('#'+this.id+'i').hasClass('icon_border_yellow_inc_left')){
+        alert("abc");
+    }
+    
+    if( $('#'+this.id+'i').hasClass('icon_border_grey_inc') ||
+        $('#'+this.id+'i').hasClass('icon_border_green_inc') ||
+        $('#'+this.id+'i').hasClass('icon_border_yellow_inc')){
+        alert("abc2");
+    }
+    
+    return true;
+    
+}
+function is_icon_deskillable(id){
+    tree = parseInt($(id).attr('t'));
+    row = parseInt($(id).attr('r'));
+    count = 0;
+    $('#tree'+tree+' .icon').each(function(){
+        if($(this).attr('r') > row){
+            count += parseInt($('#'+this.id+'c').attr('cur'));}
+    });
+    if(count > 0){
+        return false;}
+    return true;
+}
 function is_point_max(){
     return points_max <= points_spent_t1 + points_spent_t2 +points_spent_t3;}
 function is_icon_max(id){
     return $(id).attr('max') <= $(id).attr('cur');}
 function is_icon_min(id){
     return 0 >= $(id).attr('cur');}
-function write_icon_cur(id,id_img,amount){
+function write_icon_cur(id,id_count,id_img,amount){
-    current = $(id).attr('cur');
+    current = $(id_count).attr('cur');
     current = parseInt(current)+amount;
-    $(id).attr('cur',current);
+    $(id_count).attr('cur',current);
-    $(id).html(current+'/'+$(id).attr('max'));
+    $(id_count).html(current+'/'+$(id_count).attr('max'));
-    if(is_icon_max(id)){
+    if(is_icon_max(id_count)){
-        write_icon_yellow(id,id_img);
+        write_icon_yellow(id,id_count,id_img);
     } else {
-        write_icon_green(id,id_img);
+        write_icon_green(id,id_count,id_img);}
+    
+    tree = parseInt($(id).attr('t'));
+    row = parseInt($(id).attr('r'));
+    
+    switch(tree){
+        case 1:
+            points_spent_t1 += amount;
+            break;
+        case 2:
+            points_spent_t2 += amount;
+            break;
+        case 3:
+            points_spent_t3 += amount;
+            break;
+    }
+    write_points();
+    
+    count = 0;
+    $('#tree'+tree+' .icon').each(function(){
+        if($(this).attr('r') <= row){
+            count += parseInt($('#'+this.id+'c').attr('cur'));}
+    });    
+    if(count >= 5*(row)){
+        $('#tree'+tree+' .icon').each(function(){
+            if(parseInt($('#'+this.id).attr('r')) == row+1){
+                if(!$('#'+this.id+'i').hasClass('talent_arrow')){
+                    current = parseInt($('#'+this.id+'c').attr('cur'));
+                    $('#'+this.id+'c').html(current+'/'+$('#'+this.id+'c').attr('max'));
+                }
+                if(is_icon_max('#'+this.id+'c')){
+                    write_icon_yellow('#'+this.id,'#'+this.id+'c','#'+this.id+'i');
+                } else {
+                    write_icon_green('#'+this.id,'#'+this.id+'c','#'+this.id+'i');
+                }
+            }
+        });
+    } else {
+        $('#tree'+tree+' .icon').each(function(){
+            if(parseInt($('#'+this.id).attr('r')) > row){
+                $('#'+this.id+'c').html('');
+                write_icon_grey('#'+this.id,'#'+this.id+'c','#'+this.id+'i');
+            }
+        });
     }
 }
-function write_icon_green(id,id_img){
+function write_icon_green(id,id_count,id_img){
-    $(id).removeClass('icon_text_yellow');
+    if($(id_img).hasClass('icon_empty')){
-    $(id).addClass('icon_text_green');
+        return;}
+        
+    $(id_count).removeClass('icon_text_yellow');
+    $(id_count).addClass('icon_text_green');
+    
+    $(id).attr('style','background: url(./api.php?call=files&cat=skilltree_skills&id='+$(id).attr('icon')+') 50% 50% no-repeat;');
     
     if( $(id_img).hasClass('icon_border_grey') ||
         $(id_img).hasClass('icon_border_yellow')){
@@ -90,9 +184,14 @@ function write_icon_green(id,id_img){
         $(id_img).removeClass('icon_border_yellow_left');
         $(id_img).addClass('icon_border_green_left');}
 }
-function write_icon_yellow(id,id_img){
+function write_icon_yellow(id,id_count,id_img){
-    $(id).removeClass('icon_text_green');
+    if($(id_img).hasClass('icon_empty')){
-    $(id).addClass('icon_text_yellow');
+        return;}
+    
+    $(id_count).removeClass('icon_text_green');
+    $(id_count).addClass('icon_text_yellow');
+    
+    $(id).attr('style','background: url(./api.php?call=files&cat=skilltree_skills&id='+$(id).attr('icon')+') 50% 50% no-repeat;');
     
     if( $(id_img).hasClass('icon_border_grey') ||
         $(id_img).hasClass('icon_border_green')){
@@ -135,4 +234,56 @@ function write_icon_yellow(id,id_img){
         $(id_img).removeClass('icon_border_grey_left');
         $(id_img).removeClass('icon_border_green_left');
         $(id_img).addClass('icon_border_yellow_left');}
+}
+
+function write_icon_grey(id,id_count,id_img){
+    if($(id_img).hasClass('icon_empty')){
+        return;}
+    
+    $(id_count).removeClass('icon_text_green');
+    $(id_count).removeClass('icon_text_yellow');
+    
+    $(id).attr('style','background: url(./api.php?call=files&cat=skilltree_skills_grey&id='+$(id).attr('icon')+') 50% 50% no-repeat;');
+    
+    if( $(id_img).hasClass('icon_border_yellow') ||
+        $(id_img).hasClass('icon_border_green')){
+        $(id_img).removeClass('icon_border_yellow');
+        $(id_img).removeClass('icon_border_green');
+        $(id_img).addClass('icon_border_grey');}
+    
+    if( $(id_img).hasClass('icon_border_yellow_down') ||
+        $(id_img).hasClass('icon_border_green_down')){
+        $(id_img).removeClass('icon_border_yellow_down');
+        $(id_img).removeClass('icon_border_green_down');
+        $(id_img).addClass('icon_border_grey_down');}
+    
+    if( $(id_img).hasClass('icon_border_yellow_down_right') ||
+        $(id_img).hasClass('icon_border_green_down_right')){
+        $(id_img).removeClass('icon_border_yellow_down_right');
+        $(id_img).removeClass('icon_border_green_down_right');
+        $(id_img).addClass('icon_border_grey_down_right');}
+    
+    if( $(id_img).hasClass('icon_border_yellow_right') ||
+        $(id_img).hasClass('icon_border_green_right')){
+        $(id_img).removeClass('icon_border_yellow_right');
+        $(id_img).removeClass('icon_border_green_right');
+        $(id_img).addClass('icon_border_grey_right');}
+    
+    if( $(id_img).hasClass('icon_border_yellow_inc') ||
+        $(id_img).hasClass('icon_border_green_inc')){
+        $(id_img).removeClass('icon_border_yellow_inc');
+        $(id_img).removeClass('icon_border_green_inc');
+        $(id_img).addClass('icon_border_grey_inc');}
+    
+    if( $(id_img).hasClass('icon_border_yellow_inc_left') ||
+        $(id_img).hasClass('icon_border_green_inc_left')){
+        $(id_img).removeClass('icon_border_yellow_inc_left');
+        $(id_img).removeClass('icon_border_green_inc_left');
+        $(id_img).addClass('icon_border_grey_inc_left');}
+    
+    if( $(id_img).hasClass('icon_border_yellow_left') ||
+        $(id_img).hasClass('icon_border_green_left')){
+        $(id_img).removeClass('icon_border_yellow_left');
+        $(id_img).removeClass('icon_border_green_left');
+        $(id_img).addClass('icon_border_grey_left');}
 }

mojotrollz/api/char/skilltree.php

@@ -12,7 +12,7 @@ class skilltree{
                     $tree = 'tree'.$t;
                     
                     if($c == 1){
-                        $vars[$tree] .= '<div class="treerowspacer">';}
+                        $vars[$tree] .= '<div class="treerowspacer" t="'.$t.'" r="'.$r.'">';}
                             
                     if( count($res) > $count &&
                         $res[$count]['tree'] == $t &&
@@ -38,7 +38,11 @@ class skilltree{
                                                     'border' => $res[$count]['border'],
                                                     'text_color' => $text_color,
                                                     'max_text' => $max_text,
-                                                    'max' => $res[$count]['max']));
+                                                    'max' => $res[$count]['max'],
+                                                    'tree' => $t,
+                                                    'row' => $r,
+                                                    'column' => $c,
+                                                    'icon' => $res[$count]['icon']));
                             
                         $count++;
                     } else {
@@ -46,11 +50,15 @@ class skilltree{
                         $vars[$tree] .= \SYSTEM\PAGE\replace::replaceFile(SYSTEM\SERVERPATH(new PAPI(),'char/tpl/skilltree_icon.tpl'),
                                             array(  'id' => $id,
                                                     'style' => 'visibility:hidden;',
-                                                    'type' => 'talent_icon',
+                                                    'type' => 'talent_icon icon_empty',
                                                     'border' => '',
                                                     'text_color' => '',
                                                     'max_text' => '',
-                                                    'max' => 0));
+                                                    'max' => 0,
+                                                    'tree' => $t,
+                                                    'row' => $r,
+                                                    'column' => $c,
+                                                    'icon' => ''));
                     }
                     
                     if($c == 4){

mojotrollz/api/char/tpl/skilltree_icon.tpl

@@ -1,4 +1,4 @@
-<div class="icon" id="${id}" style="${style}">
+<div class="icon" id="${id}" style="${style}" t="${tree}" r="${row}" c="${column}" icon="${icon}">
     <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="${type} ${border}" alt="" id="${id}i">
     <div class="icon_number ${text_color}" id="${id}c" max="${max}" cur="0">${max_text}</div>
 </div>