The marc modification template management page is a sort of all-in-one interface with lots of different kinds of actions appearing at the same time. The screen is more complicated and (in my opinion) harder to approach initially than other pages which are divided into the same categories of interactions (list, add, edit). I propose a revision which shows and hides sections of the page so that each task can be given better focus.
Created attachment 49591 [details] [review] Bug 16148 - Revised layout and behavior of marc modification template management This patch makes changes to the layout and behavior of the marc modification template management page to make it adhere better to common interaction patterns in Koha. - The initial view shows a list of templates rather than pre-selecting the first available template for editing. - A toolbar has been added with a "New template" button. - The initial view of existing templates has an actions menu containing menu items for 'Edit actions,' 'Duplicate,' and 'Delete.' It doesn't appear to be possible to edit an existing template's name. - The "Create template" form is no longer shown all the time. - Clicking the "New template" toolbar button triggers a modal with the form for creating a template. An existing template can be chosen to duplicate. - Choosing "Duplicate" from one of the template menus triggers the "New template" modal and preselects the corresponding template in the "duplicate" <select>. - When editing actions for a template: - The breadcrumbs menu now reflects that a template is being modified. - The template name has been added as a heading. - A "New action" button appears in the toolbar - The "Edit" and "Delete" links now have a Bootstrap button style. - The add/edit form is now hidden by default. - Clicking "New action" or "edit" shows the add or edit form. - Clicking "Cancel" in the add/edit form hides the form. To test, apply the patch and clear your cache if necessary. - Got to Tools -> MARC modification templates - Test the "New template" button. - Confirm that new template creation works. - Confirm that duplicating a template works. - Test the menu items in the "Actions" menu: - "Duplicate" should trigger the new template modal and preselect the template you chose to duplicate. Confirm that the template is successfully duplicated. - "Delete" should prompt you to confirm the deletion. Test both cancelling and confirming this operation. - "Edit actions" should load the page for adding or editing actions to a template. Test the operations on this page: New action, edit, delete, changing action order. Note that this patch does not fix Bug 15814, so action descriptions must still not contain single quotes.
Created attachment 49603 [details] [review] Bug 16148 - Revised layout and behavior of marc modification template management This patch makes changes to the layout and behavior of the marc modification template management page to make it adhere better to common interaction patterns in Koha. - The initial view shows a list of templates rather than pre-selecting the first available template for editing. - A toolbar has been added with a "New template" button. - The initial view of existing templates has an actions menu containing menu items for 'Edit actions,' 'Duplicate,' and 'Delete.' It doesn't appear to be possible to edit an existing template's name. - The "Create template" form is no longer shown all the time. - Clicking the "New template" toolbar button triggers a modal with the form for creating a template. An existing template can be chosen to duplicate. - Choosing "Duplicate" from one of the template menus triggers the "New template" modal and preselects the corresponding template in the "duplicate" <select>. - When editing actions for a template: - The breadcrumbs menu now reflects that a template is being modified. - The template name has been added as a heading. - A "New action" button appears in the toolbar - The "Edit" and "Delete" links now have a Bootstrap button style. - The add/edit form is now hidden by default. - Clicking "New action" or "edit" shows the add or edit form. - Clicking "Cancel" in the add/edit form hides the form. To test, apply the patch and clear your cache if necessary. - Got to Tools -> MARC modification templates - Test the "New template" button. - Confirm that new template creation works. - Confirm that duplicating a template works. - Test the menu items in the "Actions" menu: - "Duplicate" should trigger the new template modal and preselect the template you chose to duplicate. Confirm that the template is successfully duplicated. - "Delete" should prompt you to confirm the deletion. Test both cancelling and confirming this operation. - "Edit actions" should load the page for adding or editing actions to a template. Test the operations on this page: New action, edit, delete, changing action order. Note that this patch does not fix Bug 15814, so action descriptions must still not contain single quotes. Followed test plan, works as expected. Signed-off-by: Marc Véron <veron@veron.ch>
There is a bug when you click on "edit an action" and then on "new action". I am wondering if we should not display all the actions when there are only 3 buttons and there is not a lot of columns (2 here), to avoid 1 click.
Created attachment 51575 [details] [review] Bug 16148 - Revised layout and behavior of marc modification template management This patch makes changes to the layout and behavior of the marc modification template management page to make it adhere better to common interaction patterns in Koha. - The initial view shows a list of templates rather than pre-selecting the first available template for editing. - A toolbar has been added with a "New template" button. - The initial view of existing templates has an actions menu containing menu items for 'Edit actions,' 'Duplicate,' and 'Delete.' It doesn't appear to be possible to edit an existing template's name. - The "Create template" form is no longer shown all the time. - Clicking the "New template" toolbar button triggers a modal with the form for creating a template. An existing template can be chosen to duplicate. - Choosing "Duplicate" from one of the template menus triggers the "New template" modal and preselects the corresponding template in the "duplicate" <select>. - When editing actions for a template: - The breadcrumbs menu now reflects that a template is being modified. - The template name has been added as a heading. - A "New action" button appears in the toolbar - The "Edit" and "Delete" links now have a Bootstrap button style. - The add/edit form is now hidden by default. - Clicking "New action" or "edit" shows the add or edit form. - Clicking "Cancel" in the add/edit form hides the form. To test, apply the patch and clear your cache if necessary. - Got to Tools -> MARC modification templates - Test the "New template" button. - Confirm that new template creation works. - Confirm that duplicating a template works. - Test the menu items in the "Actions" menu: - "Duplicate" should trigger the new template modal and preselect the template you chose to duplicate. Confirm that the template is successfully duplicated. - "Delete" should prompt you to confirm the deletion. Test both cancelling and confirming this operation. - "Edit actions" should load the page for adding or editing actions to a template. Test the operations on this page: New action, edit, delete, changing action order. Note that this patch does not fix Bug 15814, so action descriptions must still not contain single quotes.
Patch tested with a sandbox, by Filippos Kolovos <f.kolovos@gmail.com>
Created attachment 51977 [details] [review] Bug 16148 - Revised layout and behavior of marc modification template management This patch makes changes to the layout and behavior of the marc modification template management page to make it adhere better to common interaction patterns in Koha. - The initial view shows a list of templates rather than pre-selecting the first available template for editing. - A toolbar has been added with a "New template" button. - The initial view of existing templates has an actions menu containing menu items for 'Edit actions,' 'Duplicate,' and 'Delete.' It doesn't appear to be possible to edit an existing template's name. - The "Create template" form is no longer shown all the time. - Clicking the "New template" toolbar button triggers a modal with the form for creating a template. An existing template can be chosen to duplicate. - Choosing "Duplicate" from one of the template menus triggers the "New template" modal and preselects the corresponding template in the "duplicate" <select>. - When editing actions for a template: - The breadcrumbs menu now reflects that a template is being modified. - The template name has been added as a heading. - A "New action" button appears in the toolbar - The "Edit" and "Delete" links now have a Bootstrap button style. - The add/edit form is now hidden by default. - Clicking "New action" or "edit" shows the add or edit form. - Clicking "Cancel" in the add/edit form hides the form. To test, apply the patch and clear your cache if necessary. - Got to Tools -> MARC modification templates - Test the "New template" button. - Confirm that new template creation works. - Confirm that duplicating a template works. - Test the menu items in the "Actions" menu: - "Duplicate" should trigger the new template modal and preselect the template you chose to duplicate. Confirm that the template is successfully duplicated. - "Delete" should prompt you to confirm the deletion. Test both cancelling and confirming this operation. - "Edit actions" should load the page for adding or editing actions to a template. Test the operations on this page: New action, edit, delete, changing action order. Note that this patch does not fix Bug 15814, so action descriptions must still not contain single quotes. Signed-off-by: Filippos Kolovos <f.kolovos@gmail.com>
Owen, The dropdown list does not select the template when I want to duplicate an existing template. It comes from a JS error (TypeError: document.getElementById(...) is null) raised by marc_modification_templates.js line 2 window.modaction_legend_innerhtml = document.getElementById('modaction_legend').innerHTML;
Created attachment 52080 [details] [review] Bug 16148: Add preventDefault to avoid the scrollbar to move to the top .. when click on buttons
Created attachment 52373 [details] [review] Bug 16148 [Follow-up] Revised layout and behavior of marc modification template management This follow-up corrects a JavaScript error by using jQuery, which is is more forgiving when selecting elements which may not exist on the page. Also changed: Corrected a duplicate class attribute and fixed a jshint error.
Created attachment 52382 [details] [review] Bug 16148 - Revised layout and behavior of marc modification template management This patch makes changes to the layout and behavior of the marc modification template management page to make it adhere better to common interaction patterns in Koha. - The initial view shows a list of templates rather than pre-selecting the first available template for editing. - A toolbar has been added with a "New template" button. - The initial view of existing templates has an actions menu containing menu items for 'Edit actions,' 'Duplicate,' and 'Delete.' It doesn't appear to be possible to edit an existing template's name. - The "Create template" form is no longer shown all the time. - Clicking the "New template" toolbar button triggers a modal with the form for creating a template. An existing template can be chosen to duplicate. - Choosing "Duplicate" from one of the template menus triggers the "New template" modal and preselects the corresponding template in the "duplicate" <select>. - When editing actions for a template: - The breadcrumbs menu now reflects that a template is being modified. - The template name has been added as a heading. - A "New action" button appears in the toolbar - The "Edit" and "Delete" links now have a Bootstrap button style. - The add/edit form is now hidden by default. - Clicking "New action" or "edit" shows the add or edit form. - Clicking "Cancel" in the add/edit form hides the form. To test, apply the patch and clear your cache if necessary. - Got to Tools -> MARC modification templates - Test the "New template" button. - Confirm that new template creation works. - Confirm that duplicating a template works. - Test the menu items in the "Actions" menu: - "Duplicate" should trigger the new template modal and preselect the template you chose to duplicate. Confirm that the template is successfully duplicated. - "Delete" should prompt you to confirm the deletion. Test both cancelling and confirming this operation. - "Edit actions" should load the page for adding or editing actions to a template. Test the operations on this page: New action, edit, delete, changing action order. Note that this patch does not fix Bug 15814, so action descriptions must still not contain single quotes. Signed-off-by: Filippos Kolovos <f.kolovos@gmail.com> Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Created attachment 52383 [details] [review] Bug 16148: Add preventDefault to avoid the scrollbar to move to the top .. when click on buttons Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Created attachment 52384 [details] [review] Bug 16148 [Follow-up] Revised layout and behavior of marc modification template management This follow-up corrects a JavaScript error by using jQuery, which is is more forgiving when selecting elements which may not exist on the page. Also changed: Corrected a duplicate class attribute and fixed a jshint error. Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Created attachment 52385 [details] [review] Bug 16148: Fix submit button text The text of the submit button should be init getting the val(), and not the text(). Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Created attachment 52484 [details] [review] Bug 16148 [Follow-up] - Use Font Awesome for arrows instead of images
Created attachment 52485 [details] [review] Bug 16148 [Follow-up] - Use Font Awesome for arrows instead of images
Created attachment 52486 [details] [review] [SIGNED-OFF] Bug 16148 [Follow-up] - Use Font Awesome for arrows instead of images Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Pushed to master for 16.11, thanks Owen, Jonathan!