From 0284e663363df550ba8cda03fc1ba8f864ddf856 Mon Sep 17 00:00:00 2001
From: Kyle M Hall <kyle@bywatersolutions.com>
Date: Tue, 14 Jun 2016 11:55:25 +0000
Subject: [PATCH] Bug 15707 [QA Followup] - Fix UI issues

---
 Koha/Library/Group.pm                              | 27 +++++++-
 koha-tmpl/intranet-tmpl/prog/css/staff-global.css  |  5 ++
 .../prog/en/modules/admin/library_groups.tt        | 77 +++++++++++++++-------
 3 files changed, 82 insertions(+), 27 deletions(-)

diff --git a/Koha/Library/Group.pm b/Koha/Library/Group.pm
index ad2063b..cd53899 100644
--- a/Koha/Library/Group.pm
+++ b/Koha/Library/Group.pm
@@ -37,7 +37,19 @@ Koha::Library::Group - Koha Library::Group object class
 
 =cut
 
-=head3 my @children = $self->get_children()
+=head3 my @parent = $self->parent()
+
+=cut
+
+sub parent {
+    my ($self) = @_;
+
+    $self->{_parent} ||= Koha::Library::Groups->find( $self->parent_id );
+
+    return $self->{_parent};
+}
+
+=head3 my @children = $self->children()
 
 =cut
 
@@ -63,7 +75,9 @@ sub library {
 
     return unless $self->branchcode;
 
-    return Koha::Libraries->find( $self->branchcode );
+    $self->{_library} ||= Koha::Libraries->find( $self->branchcode );
+
+    return $self->{_library};
 }
 
 =head3 libraries_not_direct_children
@@ -87,7 +101,14 @@ sub libraries_not_direct_children {
 
     my @branchcodes = map { $_->branchcode } @children;
 
-    return Koha::Libraries->search( { branchcode => { -not_in => \@branchcodes } } );
+    return Koha::Libraries->search(
+        {
+            branchcode => { -not_in => \@branchcodes }
+        },
+        {
+            order_by => 'branchname'
+        }
+    );
 }
 
 =head3 store
diff --git a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css
index 6b22201..4967f0f 100644
--- a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css
+++ b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css
@@ -2969,3 +2969,8 @@ fieldset.rows + fieldset.action {
 .yui-u .rows li p label.widelabel {
     width: auto;
 }
+
+span.name {
+    font-weight: bold;
+    font-style: italic;
+}
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/library_groups.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/library_groups.tt
index 6880b82..ee7ac45 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/library_groups.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/library_groups.tt
@@ -6,13 +6,38 @@
 <script type="text/javascript">
 //<![CDATA[
     $(document).ready(function() {
-        $(".library-groups").treetable(
+        $('.library-groups').treetable(
             {
                 expandable: true,
-                initialState: "expanded",
+                initialState: 'expanded',
                 clickableNodeNames: true,
             }
         );
+
+        $('.add-group').on('click', function() {
+            var id = $(this).data('groupId');
+            add_group( id );
+        });
+
+        $('.edit-group').on('click', function() {
+            var id = $(this).data('groupId');
+            var title = $(this).data('groupTitle');
+            var description = $(this).data('groupDescription');
+            edit_group( id, title, description );
+        });
+
+        $('.delete-group').on('click', function() {
+            var id = $(this).data('groupId');
+            var title = $(this).data('groupTitle');
+            delete_group( id, title );
+        });
+
+        $('.remove-library').on('click', function() {
+            var id = $(this).data('groupId');
+            var library = $(this).data('groupLibrary');
+            var parent_title = $(this).data('groupParentTitle');
+            remove_library( id, library, parent_title );
+        });
     });
 
     function add_group( parent_id ) {
@@ -40,15 +65,19 @@
         $('#edit-group-modal').modal('show');
     }
 
-    function remove_library( id ) {
+    function delete_group( id, title ) {
+        $('#delete-group-modal-title').html(title);
+        $('#delete-group-modal-id').val( id );
+        $('#delete-group-modal').modal('show');
+    }
+
+    function remove_library( id, library, parent_title ) {
+        $('#remove-library-modal-library').html( library );
+        $('#remove-library-modal-group').html(parent_title);
         $('#remove-library-modal-id').val( id );
         $('#remove-library-modal').modal('show');
     }
 
-    function delete_group( id ) {
-        $('#delete-group-modal-id').val( id );
-        $('#delete-group-modal').modal('show');
-    }
 //]]>
 </script>
 </head>
@@ -63,7 +92,7 @@
 </div>
 
 [% IF added %]
-    <div class="dialog alert group-added">
+    <div class="dialog message group-added">
         [% IF added.branchcode %]
             <i>[% added.library.branchname %]</i> added to group.
         [% ELSE %]
@@ -71,7 +100,7 @@
         [% END %]
     </div>
 [% ELSIF deleted %]
-    <div class="dialog alert group-deleted">
+    <div class="dialog message group-deleted">
         [% IF deleted.title %]
             Group <i>[% deleted.title %]</i> has been deleted.
         [% ELSE %]
@@ -87,8 +116,8 @@
                 <div class="yui-g">
                     <div id="toolbar" class="btn-toolbar">
                         <div class="btn-group">
-                            <a id="add-group-[% group.id %]" class="btn btn-small" href="#" onclick="add_group()">
-                                <i class="fa fa-plus-circle"></i> Add group
+                            <a id="add-group-root" class="btn btn-small add-group" href="#">
+                                <i class="fa fa-plus"></i> Add group
                             </a>
                         </div>
                     </div>
@@ -170,10 +199,10 @@
             <input id="delete-group-modal-action" type="hidden" name="action" value="delete" />
             <input id="delete-group-modal-id" type="hidden" name="id" value="" />
             <div class="modal-header">
-                <h3 id="delete-group-modal-label">Delete group or library</h3>
+                <h3 id="delete-group-modal-label">Delete group</h3>
             </div>
             <div class="modal-body">
-                Are you sure you want to delete this?
+                Are you sure you want to delete <span id="delete-group-modal-title" class="name"></span>?
             </div>
             <div class="modal-footer">
                 <button type="submit" class="btn btn-danger"><i class="fa fa-trash"></i> Delete</button>
@@ -190,10 +219,10 @@
                 <h3 id="remove-library-modal-label">Remove library from group</h3>
             </div>
             <div class="modal-body">
-                Are you sure you want to remove this library?
+                Are you sure you want to remove <span id="remove-library-modal-library" class="name"></span> from <span id="remove-library-modal-group" class="name"><span>?
             </div>
             <div class="modal-footer">
-                <button type="submit" class="btn btn-danger"><i class="fa fa-minus-circle"></i> Remove</button>
+                <button type="submit" class="btn btn-danger"><i class="fa fa-trash"></i> Remove</button>
                 <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
             </div>
         </form>
@@ -206,9 +235,9 @@
     <tr data-tt-id="[% group.id %]" data-tt-parent-id="[% group.parent_id %]">
         <td>
             [% IF group.branchcode %]
-                <i class="fa fa-home"></i> [% group.branchcode %]
+                [% group.branchcode %]
             [% ELSE %]
-                <i class="fa fa-object-group"></i> [% group.title %]
+                [% group.title %]
             [% END %]
         </td>
         <td>
@@ -220,25 +249,25 @@
         </td>
         <td>
             [% IF group.branchcode %]
-                <button class="btn btn-small delete-library" onclick="remove_library([% group.id %])"><i class="fa fa-minus-circle"></i> Remove from group</button>
+                <button class="btn btn-small remove-library" data-group-id="[% group.id %]" data-group-library="[% group.library.branchname %]" data-group-parent-title="[% group.parent.title %]" ><i class="fa fa-trash"></i> Remove from group</button>
             [% ELSE %]
                 <div class="btn-group">
                     <button class="btn btn-small dropdown-toggle" data-toggle="dropdown"><i class="fa fa-wrench"></i> Actions <span class="caret"></span></button>
                     <ul class="dropdown-menu">
                         <li>
-                            <a id="add-group-[% group.id %]" href="#" onclick="add_group([% group.id %])">
-                                <i class="fa fa-plus-circle"></i> Add sub-group
+                            <a id="add-group-[% group.id %]" href="#" class="add-group" data-group-id="[% group.id %]">
+                                <i class="fa fa-plus"></i> Add sub-group
                             </a>
                        </li>
 
                         <li>
-                            <a class="delete-group" id="delete-group-[% group.id %]" href="#" onclick="edit_group([% group.id %], '[% group.title | replace('\'', '\\\'') | html %]', '[% group.description | replace('\'', '\\\'') | html %]')">
-                                <i class="fa fa-edit"></i> Edit
+                            <a class="edit-group" id="edit-group-[% group.id %]" href="#" class="edit-group" data-group-id="[% group.id %]" data-group-title="[% group.title | html %]" data-group-description="[% group.description | html %]">
+                                <i class="fa fa-pencil"></i> Edit
                             </a>
                        </li>
 
                         <li>
-                            <a class="delete-group" id="delete-group-[% group.id %]" href="#" onclick="delete_group([% group.id %])">
+                            <a class="delete-group" id="delete-group-[% group.id %]" href="#" class="delete-group" data-group-id="[% group.id %]" data-group-title="[% group.title | html %]">
                                 <i class="fa fa-trash"></i> Delete
                             </a>
                        </li>
@@ -246,7 +275,7 @@
                 </div>
 
                 <div class="btn-group">
-                    <button class="btn btn-small dropdown-toggle" data-toggle="dropdown"><i class="fa fa-home"></i> Add library <span class="caret"></span></button>
+                    <button class="btn btn-small dropdown-toggle" data-toggle="dropdown"><i class="fa fa-plus"></i> Add library <span class="caret"></span></button>
                     <ul class="dropdown-menu">
                         [% FOREACH library IN group.libraries_not_direct_children %]
                             <li>
-- 
2.1.4