MyCo

@@ -103,8 +103,7 @@ view_home=function() {

           sum+=value;

           diff='<td class="positive">+'+value.toFixed(2)+' €</td>';

         }

-        menu='<div class="btn-group" data-grp="'+g+'"><button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-cog"></span></button><ul class="dropdown-menu"><li><a class="home_grp_cat_btn"><span class="glyphicon glyphicon-th-list"></span> Catégories</a></li></ul></div>';

-        tbody.html(tbody.html()+'<tr><td><a class="group-link" data-uuid="'+g+'">'+balances[g].name+'</a></td>'+diff+'<td>'+menu+'</td></tr>');

+        tbody.html(tbody.html()+'<tr><td><a class="group-link" data-uuid="'+g+'">'+balances[g].name+'</a></td>'+diff+'</tr>');

       }

     }

     $('#view-home #mybalances a.group-link').bind('click',function(e) {

@@ -130,18 +129,6 @@ view_home=function() {

   view_part('#view-home');

 }

-on_home_grp_cat_btn_click=function(e) {

-  grp_id=$(e.target).parents('div.btn-group').data('grp');

-  grp=groups[grp_id];

-  ul=$('#grp_cat_modal ul');

-  html="";

-  for(cid in grp.getSortedCategories()) {

-    html+="<li><span class='cat-color' style='background-color: "+grp.categories[cid]['color']+"'></span> "+grp.categories[cid]['name']+"</li>";

-  }

-  ul.html(html);

-  $('#grp_cat_modal').modal('show');

-}

-

 /****************

  * View group

  ****************/

@@ -207,6 +194,77 @@ show_contributions=function(group,contributor_email) {

   $('.contribution_edit_btn').bind('click',on_contribution_edit_btn_click);

 }

+on_categories_group_btn_click=function(e) {

+  group=groups[$('#view-group').data('uuid')];

+  $('#view-group-categories').data('group-uuid',$('#view-group').data('uuid'));

+  refresh_group_categories(group);

+  view_part('#view-group-categories');

+}

+

+refresh_group_categories=function(group) {

+  ul=$('#view-group-categories ul');

+  html="";

+  for(cid in group.getSortedCategories()) {

+    html+="<li data-uuid='"+cid+"'><span class='cat-color' style='background-color: "+group.categories[cid]['color']+"'></span> "+group.categories[cid]['name']+"</li>";

+  }

+  ul.html(html);

+  $('#view-group-categories ul li').bind('click',on_categories_group_cat_click);

+}

+

+on_categories_group_cat_click=function(e) {

+  li=$(e.target);

+  if (li.prop("tagName")!='LI') {

+    return true;

+  }

+  cid=li.data('uuid');

+  group=groups[$('#view-group-categories').data('group-uuid')];

+  cat=group.categories[cid];

+  li.html("<span class='cat-color' style='background-color: "+cat['color']+"'></span> "+

+  "<input type='text' value=\""+cat.name+"\"/> "+

+  "<button class='btn btn-default btn-xs cat_edit'><span class='glyphicon glyphicon-ok'></span></button>"+

+  "<button class='btn btn-default btn-xs cat_delete'><span class='glyphicon glyphicon-trash'></span></button>");

+  li.children('button.cat_edit').bind('click',{'li': li,'group': group,'cid': cid},on_categories_group_cat_edit_valid_btn_click);

+  li.children('button.cat_delete').bind('click',{'li': li,'group': group,'cid': cid},on_categories_group_cat_delete_btn_click);

+}

+

+on_categories_group_cat_edit_valid_btn_click=function(e) {

+  name=e.data.li.children('input:first').val();

+  cat=e.data.group.categories[e.data.cid];

+  e.data.group.updateCategory(e.data.cid,new Category(name,cat.color));

+  groups.save();

+  refresh_group_categories(e.data.group);

+}

+

+on_categories_group_cat_delete_btn_click=function(e) {

+  e.data.group.deleteCategory(e.data.cid);

+  groups.save();

+  refresh_group_categories(e.data.group);

+}

+

+on_categories_go_back_group_btn_click=function(e) {

+  view_group(groups[$('#view-group-categories').data('group-uuid')]);

+}

+

+on_categories_group_add_btn_click=function(e) {

+  name=$('#add_category input')[0].value;

+  

+  if (jQuery.type(name)!='string' || name=='') {

+    return;

+  }

+  group_uuid=$('#view-group-categories').data('group-uuid');

+  group=groups[group_uuid];

+  

+  if (group.getCategoryByName(name,true)) {

+    alert('Cette catégorie existe déjà');

+  }

+  else {

+    group.addCategory(new Category(name));

+    $('#add_category input')[0].value='';

+    refresh_group_categories(group);

+  }

+}

+

+

 /*****************************

  * Trash

  *****************************/

@@ -856,8 +914,13 @@ $( document ).ready( function() {

   $("#view-group-trash #go-back-group").bind('click',on_go_back_group_btn_click);

   $("#view-group-trash-contributors #go-back-group").bind('click',on_go_back_group_trash_contributors_btn_click);

+  $('#categories_group_btn').bind('click',on_categories_group_btn_click);

   $('#trash_group_btn').bind('click',on_trash_group_btn_click);

   $('#remove_group_btn').bind('click',on_remove_group_btn_click);

+  

+  $('#view-group-categories span.input-group-addon').bind('click',on_categories_group_add_btn_click);

+  $("#view-group-categories button.go-back-group").bind('click',on_categories_go_back_group_btn_click);

+  

   view_home();

   pleaseWaitHide();

 } );

@@ -352,21 +352,39 @@ function Group(uuid,name,data) {

   this.deleteCategory=function(uuid,time) {

     this.categories[uuid].lastChange=time || new Date().getTime();

-    this.deletedCategory[uuid]=this.categories[uuid].export();

+    this.deletedCategories[uuid]=this.categories[uuid].export();

     delete this.categories[uuid];

   }

   this.restoreCategory=function(uuid) {

-    this.deletedCategory[uuid].lastChange=new Date().getTime();

-    this.categories[uuid]=this.importCategory(this.deletedCategory[uuid]);

-    delete this.deletedCategory[uuid];

+    this.deletedCategories[uuid].lastChange=new Date().getTime();

+    this.categories[uuid]=this.importCategory(this.deletedCategories[uuid]);

+    delete this.deletedCategories[uuid];

+  }

+  

+  this.getCategoryByName=function(name,approx) {

+    if(approx) {

+      name=String(name).replace(/^\s+|\s+$/g, '').toLowerCase();

+    }

+    for (uuid in this.categories) {

+      if (approx) {

+        if (String(this.categories[uuid].name).replace(/^\s+|\s+$/g, '').toLowerCase()==name) {

+          return this.categories[uuid];

+        }

+      }

+      else if(this.categories[uuid].name==name) {

+        return this.categories[uuid]

+      }

+    }

+    return false;

   }

   this.importCategory=function(data) {

     return new Category(

       decodeURIComponent(data.name),

       data.color,

-      data.lastChange

+      data.lastChange,

+      data.uuid

     );

   }

@@ -452,7 +470,6 @@ function Group(uuid,name,data) {

           this.deletedContributions[uuid]=data.deletedContributions[uuid];

         }

       }

-      console.log(data.categories);

       if (jQuery.type(data.categories) == 'object') {

         for (uuid in data.categories) {

           this.categories[uuid]=this.importCategory(data.categories[uuid]);

@@ -497,15 +514,17 @@ function Contributor(name,email) {

   }

 }

-function Category(name,color,lastChange) {

+function Category(name,color,lastChange,uuid) {

   this.name=name;

   this.color=color || '#'+(0x1000000+(Math.random())*0xffffff).toString(16).substr(1,6);

   this.lastChange=lastChange || new Date().getTime();

+  this.uuid=uuid || generate_uuid();

   this.export=function() {

     return {

       'name': encodeURIComponent(this.name),

       'color': this.color,

-      'lastChange': this.lastChange

+      'lastChange': this.lastChange,

+      'uuid': this.uuid

     };

   }

 }

@@ -67,7 +67,7 @@ span.cat-color {

   display: inline-block;

 }

-#grp_cat_modal ul {

+#view-group-categories ul {

   list-style-type: none;

   padding: 0;

 }

@@ -132,6 +132,10 @@ span.cat-color {

 .group-title {

   font-weight: bold;

 }

+

+.nav a, #mybalances a, #add_category span {

+  cursor: pointer;

+}

 </style>

   <body>

     <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">

@@ -175,7 +179,6 @@ span.cat-color {

       <tr>

         <th>Groupe</th>

         <th>Balance</th>

-        <th>&nbsp;</th>

       </tr>

     </thead>

     <tbody></tbody>

@@ -183,7 +186,6 @@ span.cat-color {

       <tr>

         <td id='total-label'>Total :</td>

         <td id='total-value'></td>

-        <td>&nbsp;</td>

       </tr>

     </tfoot>

   </table>

@@ -256,6 +258,7 @@ span.cat-color {

       </div>

       <div class="collapse navbar-collapse" id="bottom-navbar-collapse-1">

         <ul class="nav navbar-nav navbar-right">

+          <li><a id='categories_group_btn'><span class='glyphicon glyphicon-th-list'></span> Catégories</span></a></li>

           <li><a id='trash_group_btn'><span class='glyphicon glyphicon-trash'></span> Corbeille</span></a></li>

           <li><a id='remove_group_btn'><span class='glyphicon glyphicon-floppy-remove'></span> Supprimer le groupe</span></a></li>

         </ul>

@@ -309,6 +312,18 @@ span.cat-color {

   </table>

 </div>

+<div id='view-group-categories' class='part row'>

+  <h1>Catégories <button type="button" class="btn btn-default go-back-group"><span class="glyphicon glyphicon-arrow-left"> Retour</span></button></h1>

+  <div class='col-xs-6'>

+    <ul>

+    </ul>

+    <div id="add_category" class='input-group'>

+      <input type='text' class="form-control" placeholder='nom'/>

+      <span class="input-group-addon"><span class="glyphicon glyphicon-plus"></span></span>

+    </div>

+  </div>

+</div>

+

 <div class="modal fade" id="add_group_modal" tabindex="-1" role="dialog" aria-labelledby="addGroupModal" aria-hidden="true">

   <div class="modal-dialog">

     <div class="modal-content">

@@ -615,23 +630,6 @@ span.cat-color {

   </div><!-- /.modal-dialog -->

 </div>

-<div class="modal fade" id="grp_cat_modal" tabindex="-1" role="dialog" aria-labelledby="grpCatModal" aria-hidden="true">

-  <div class="modal-dialog">

-    <div class="modal-content">

-      <div class="modal-header">

-        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>

-        <h4 class="modal-title">Catégories</h4>

-      </div>

-      <div class="modal-body">

-        <ul id='grp_cat_list'></ul>

-      </div>

-      <div class="modal-footer">

-        <button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>

-      </div>

-    </div><!-- /.modal-content -->

-  </div><!-- /.modal-dialog -->

-</div>

-

 </div>

   <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->