From 1341413869be892e84a0bf6b3a5fe41e40a2fcea Mon Sep 17 00:00:00 2001
From: rylon <rylon@web.de>
Date: Thu, 6 Nov 2014 17:18:05 +0100
Subject: [PATCH] skilltree improvements, reset buttons

---
 mojotrollz/api/char/js/skilltree.js   | 116 ++++++++++++++++----------
 mojotrollz/api/char/tpl/skilltree.tpl |   6 +-
 2 files changed, 74 insertions(+), 48 deletions(-)

diff --git a/mojotrollz/api/char/js/skilltree.js b/mojotrollz/api/char/js/skilltree.js
index 70ac59f..1afafb4 100644
--- a/mojotrollz/api/char/js/skilltree.js
+++ b/mojotrollz/api/char/js/skilltree.js
@@ -12,26 +12,51 @@ function skilltree(){
         switch (event.which) {
             case 1:
                 if(is_icon_skillable(id) && !is_point_max() && !is_icon_max(id_count)){
-                    write_icon_cur(id,id_count,id_img,1);}
+                    write_icon(id,id_count,id_img,1);}
                 break;
             case 2:
                 //alert('Middle Mouse button pressed.');
                 break;
             case 3:
                 if(is_icon_deskillable(id) && !is_icon_min(id_count)){
-                    write_icon_cur(id,id_count,id_img,-1);}
+                    write_icon(id,id_count,id_img,-1);}
                 break;
             default:
                 //alert('You have a strange Mouse!');
         }
     });
+    $('.reset').click(function(){
+       write_reset(parseInt($(this).attr('t')));
+    });
 }
-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 write_reset(tree){
+    switch(tree){
+        case 1:
+            points_spent_t1 = 0;
+            break;
+        case 2:
+            points_spent_t2 = 0;
+            break;
+        case 3:
+            points_spent_t3 = 0;
+            break;
+    }
+    write_points_spent(tree,0);
+    $('#tree'+tree+' .icon').each(function(){
+        var id = '#'+this.id;
+        var id_count = '#'+this.id +'c';
+        var id_img = '#'+this.id +'i';
+        
+        if(parseInt($(id).attr('r')) == 1){
+            write_icon_green(id,id_count,id_img);
+            write_icon_cur_null(id_count);
+            write_icon_cur(id_count,0);
+        }else{
+            write_icon_grey(id,id_count,id_img);
+            write_icon_cur_null(id_count);
+        }
+    });
 }
-
 function is_icon_skillable(id){
     tree = parseInt($(id).attr('t'));
     row = parseInt($(id).attr('r'));
@@ -79,19 +104,7 @@ 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_count,id_img,amount){
-    current = $(id_count).attr('cur');
-    current = parseInt(current)+amount;
-    $(id_count).attr('cur',current);
-    $(id_count).html(current+'/'+$(id_count).attr('max'));
-    if(is_icon_max(id_count)){
-        write_icon_yellow(id,id_count,id_img);
-    } else {
-        write_icon_green(id,id_count,id_img);}
-    
-    tree = parseInt($(id).attr('t'));
-    row = parseInt($(id).attr('r'));
-    
+function write_points_spent(tree,amount){
     switch(tree){
         case 1:
             points_spent_t1 += amount;
@@ -103,35 +116,49 @@ function write_icon_cur(id,id_count,id_img,amount){
             points_spent_t3 += amount;
             break;
     }
-    write_points();
+    
+    $('#treeheader1 .stdText').html(' - '+points_spent_t1+' Points');
+    $('#treeheader2 .stdText').html(' - '+points_spent_t2+' Points');
+    $('#treeheader3 .stdText').html(' - '+points_spent_t3+' Points');
+}
+function write_icon_cur(id_count,amount){
+    var current = parseInt($(id_count).attr('cur'))+amount;
+    $(id_count).attr('cur',current);
+    $(id_count).html(current+'/'+$(id_count).attr('max'));
+}
+function write_icon_cur_null(id_count){
+    $(id_count).attr('cur',0);
+    $(id_count).html('');
+}
+function write_icon(id,id_count,id_img,amount){
+    write_icon_cur(id_count,amount);
+    write_points_spent(tree,amount);
+    if(is_icon_max(id_count)){
+        write_icon_yellow(id,id_count,id_img);
+    } else {
+        write_icon_green(id,id_count,id_img);}
+    
+    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 >= 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');
-                }
+        count += parseInt($('#'+this.id+'c').attr('cur'));
+        if((parseInt($('#'+this.id).attr('r'))-1)*5 <= count){
+            if(!$('#'+this.id+'i').hasClass('talent_arrow')){
+                current = parseInt($('#'+this.id+'c').attr('cur'));
+                $('#'+this.id+'c').html(current+'/'+$('#'+this.id+'c').attr('max'));
             }
-        });
-    } 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');
+            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 {
+            $('#'+this.id+'c').html('');
+            write_icon_grey('#'+this.id,'#'+this.id+'c','#'+this.id+'i');
+        }    
+    });
 }
 function write_icon_green(id,id_count,id_img){
     if($(id_img).hasClass('icon_empty')){
@@ -235,7 +262,6 @@ function write_icon_yellow(id,id_count,id_img){
         $(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;}
diff --git a/mojotrollz/api/char/tpl/skilltree.tpl b/mojotrollz/api/char/tpl/skilltree.tpl
index 9187d4b..c5527f6 100644
--- a/mojotrollz/api/char/tpl/skilltree.tpl
+++ b/mojotrollz/api/char/tpl/skilltree.tpl
@@ -7,7 +7,7 @@
                     <span class="stdText"> - 0 points</span>
                 </strong>
             </div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" id="treeheaderimg1" width="59" height="20" alt="Reset this tree">
+            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="reset" t="1" width="59" height="20" alt="Reset this tree">
         </td>
         <td class="talentheader">
             <div id="treeheader2">
@@ -16,7 +16,7 @@
                     <span class="stdText"> - 0 points</span>
                 </strong>
             </div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" id="treeheaderimg2" width="59" height="20" alt="Reset this tree">
+            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="reset" t="2" width="59" height="20" alt="Reset this tree">
         </td>
         <td class="talentheader">
             <div id="treeheader3">
@@ -25,7 +25,7 @@
                     <span class="stdText"> - 0 points</span>
                 </strong>
             </div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" id="treeheaderimg3" width="59" height="20" alt="Reset this tree">
+            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="reset" t="3" width="59" height="20" alt="Reset this tree">
         </td>
     </tr>
     <tr>