Add dropdown menu to the tasks

app/Locale/da_DK/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/de_DE/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/es_ES/translations.php

@@ -699,4 +699,5 @@ return array(
     'All status' => 'Todos los estados',
     // 'Add a comment logging moving the task between columns' => '',
     'Moved to column %s' => 'Movido a columna %s',
+    // 'Change description' => '',
 );

app/Locale/fi_FI/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/fr_FR/translations.php

@@ -699,4 +699,5 @@ return array(
     'All status' => 'Tous les états',
     'Add a comment logging moving the task between columns' => 'Ajouter un commentaire de log lorsqu\'une tâche est déplacée dans une autre colonne',
     'Moved to column %s' => 'Tâche déplacée à la colonne %s',
+    'Change description' => 'Changer la description',
 );

app/Locale/hu_HU/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/it_IT/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/ja_JP/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/pl_PL/translations.php

@@ -699,4 +699,5 @@ return array(
     'All status' => 'Wszystkie statusy',
     'Add a comment logging moving the task between columns' => 'Dodaj komentarz dokumentujący przeniesienie zadania pomiędzy kolumnami',
     'Moved to column %s' => 'Przeniosiono do kolumny %s',
+    // 'Change description' => '',
 );

app/Locale/pt_BR/translations.php

@@ -699,4 +699,5 @@ return array(
     'All status' => 'Todos os status',
     'Add a comment logging moving the task between columns' => 'Adicionar un comentário de log ao mover uma tarefa em outra coluna',
     'Moved to column %s' => 'Mover para a coluna %s',
+    // 'Change description' => '',
 );

app/Locale/ru_RU/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/sv_SE/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/th_TH/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Locale/zh_CN/translations.php

@@ -699,4 +699,5 @@ return array(
     // 'All status' => '',
     // 'Add a comment logging moving the task between columns' => '',
     // 'Moved to column %s' => '',
+    // 'Change description' => '',
 );

app/Template/board/filters.php

@@ -30,6 +30,7 @@
                             <i class="fa fa-cog fa-fw"></i>
                             <?= $this->a(t('Configure'), 'project', 'show', array('project_id' => $project['id'])) ?>
                         </li>
+                        <?php endif ?>
                     </ul>
                 </li>
             </ul>
@@ -45,6 +46,5 @@
         <li>
             <a href="#" id="filter-due-date"><?= t('Filter by due date') ?></a>
         </li>
-        <?php endif ?>
     </ul>
 </div>

app/Template/board/task.php

@@ -38,7 +38,17 @@
      data-task-url="<?= $this->u('task', 'show', array('task_id' => $task['id'], 'project_id' => $task['project_id'])) ?>"
      title="<?= t('View this task') ?>">
 
-    <?= $this->a('#'.$task['id'], 'task', 'edit', array('task_id' => $task['id'], 'project_id' => $task['project_id']), false, 'task-edit-popover', t('Edit this task')) ?>
+    <ul class="dropdown">
+        <li>
+            <a href="#" class="dropdown-menu"><?= '#'.$task['id'] ?></a>
+            <ul>
+                <li><i class="fa fa-user"></i> <?= $this->a(t('Change assignee'), 'board', 'changeAssignee', array('task_id' => $task['id'], 'project_id' => $task['project_id']), false, 'assignee-popover') ?></li>
+                <li><i class="fa fa-tag"></i> <?= $this->a(t('Change category'), 'board', 'changeCategory', array('task_id' => $task['id'], 'project_id' => $task['project_id']), false, 'category-popover') ?></li>
+                <li><i class="fa fa-align-left"></i> <?= $this->a(t('Change description'), 'task', 'description', array('task_id' => $task['id'], 'project_id' => $task['project_id']), false, 'task-description-popover') ?></li>
+                <li><i class="fa fa-pencil-square-o"></i> <?= $this->a(t('Edit this task'), 'task', 'edit', array('task_id' => $task['id'], 'project_id' => $task['project_id']), false, 'task-edit-popover') ?></li>
+            </li>
+        </li>
+    </ul>
 
     <?php if ($task['reference']): ?>
     <span class="task-board-reference" title="<?= t('Reference') ?>">
@@ -111,11 +121,7 @@
 
         <?php if (! empty($task['description'])): ?>
             <span title="<?= t('Description') ?>" class="task-board-tooltip" data-href="<?= $this->u('board', 'description', array('task_id' => $task['id'], 'project_id' => $task['project_id'])) ?>">
-            <?php if (! isset($not_editable)): ?>
-                <a class="task-description-popover" href="?controller=task&amp;action=description&amp;task_id=<?= $task['id'] ?>"><i class="fa fa-file-text-o" data-href="?controller=task&amp;action=description&amp;task_id=<?= $task['id'] ?>"></i></a>
-            <?php else: ?>
                 <i class="fa fa-file-text-o"></i>
-            <?php endif ?>
             </span>
         <?php endif ?>
     </div>

assets/css/app.css

@@ -1479,7 +1479,7 @@ a.task-board-nobody {
 
 .task-board-category {
     font-weight: bold;
-    font-size: 0.8em;
+    font-size: 0.9em;
     color: #000;
     border: 1px solid #555;
     border-radius: 4px;
@@ -1489,13 +1489,13 @@ a.task-board-nobody {
 }
 
 .task-board-footer {
-    height: 18px;
+    height: 20px;
 }
 
 .task-board-date {
     position: absolute;
     bottom: 0;
-    left: 5px;
+    left: 0;
     font-weight: bold;
     color: #000;
 }
@@ -2002,51 +2002,26 @@ a.task-board-nobody {
         height: 18px;
     }
 }
-/*
+.dropdown {
- * Dropit v1.1.0
- * http://dev7studios.com/dropit
- *
- * Copyright 2012, Dev7studios
- * Free to use and abuse under the MIT license.
- * http://www.opensource.org/licenses/mit-license.php
- */
-
-/* These styles assume you are using ul and li */
-.dropit {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-}
-
-.dropit .dropit-trigger {
     position: relative;
 }
 
-.dropit .dropit-submenu {
+.dropdown li {
-    position: absolute;
+    list-style: none;
-    top: 100%;
+}
-    left: 0; /* dropdown left or right */
+
-    z-index: 1000;
+/* submenu */
+.dropdown ul {
     display: none;
+    position: absolute;
+    left: 0;
+    z-index: 1000;
     min-width: 180px;
     list-style: none;
-    padding: 0;
+    margin: 3px 0 0 1px;
-    margin: 0;
+    padding: 6px 0;    
-}
-
-.dropit .dropit-open .dropit-submenu {
-    display: block;
-}
-
-.dropdown ul {
-    display: none; /* Hide before plugin loads */
-}
-
-.dropdown ul.dropit-submenu {
     background-color: #fff;
     border: 1px solid #b2b2b2;
-    padding: 6px 0;
-    margin: 3px 0 0 1px;
     -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
             border-radius: 3px;
@@ -2055,13 +2030,14 @@ a.task-board-nobody {
             box-shadow: 0px 1px 3px rgba(0,0,0,0.15);
 }
 
-.dropdown ul.dropit-submenu li {
+.dropdown ul li {
     padding: 0;
     margin: 0;
     font-size: 1.1em;
     display: block;
     line-height: 30px;
     padding-left: 10px;
+    padding-right: 10px;
 }
 
 .page-header ul.dropdown {
@@ -2071,3 +2047,17 @@ a.task-board-nobody {
 .page-header a.dropdown-menu {
     font-size: 1.1em;
 }
+
+td li.dropit-trigger {
+    margin: 0;
+}
+
+.task-board .dropit-submenu a {
+    font-weight: normal;
+    text-decoration: underline;
+    font-size: 0.9em;
+}
+
+.task-board .dropit-submenu a:hover {
+    text-decoration: none;
+}

assets/css/src/dropdown.css

@@ -1,48 +1,23 @@
-/*
+.dropdown {
- * Dropit v1.1.0
- * http://dev7studios.com/dropit
- *
- * Copyright 2012, Dev7studios
- * Free to use and abuse under the MIT license.
- * http://www.opensource.org/licenses/mit-license.php
- */
-
-/* These styles assume you are using ul and li */
-.dropit {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-}
-
-.dropit .dropit-trigger {
     position: relative;
 }
 
-.dropit .dropit-submenu {
+.dropdown li {
-    position: absolute;
+    list-style: none;
-    top: 100%;
+}
-    left: 0; /* dropdown left or right */
+
-    z-index: 1000;
+/* submenu */
+.dropdown ul {
     display: none;
+    position: absolute;
+    left: 0;
+    z-index: 1000;
     min-width: 180px;
     list-style: none;
-    padding: 0;
+    margin: 3px 0 0 1px;
-    margin: 0;
+    padding: 6px 0;    
-}
-
-.dropit .dropit-open .dropit-submenu {
-    display: block;
-}
-
-.dropdown ul {
-    display: none; /* Hide before plugin loads */
-}
-
-.dropdown ul.dropit-submenu {
     background-color: #fff;
     border: 1px solid #b2b2b2;
-    padding: 6px 0;
-    margin: 3px 0 0 1px;
     -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
             border-radius: 3px;
@@ -51,13 +26,14 @@
             box-shadow: 0px 1px 3px rgba(0,0,0,0.15);
 }
 
-.dropdown ul.dropit-submenu li {
+.dropdown ul li {
     padding: 0;
     margin: 0;
     font-size: 1.1em;
     display: block;
     line-height: 30px;
     padding-left: 10px;
+    padding-right: 10px;
 }
 
 .page-header ul.dropdown {
@@ -67,3 +43,17 @@
 .page-header a.dropdown-menu {
     font-size: 1.1em;
 }
+
+td li.dropit-trigger {
+    margin: 0;
+}
+
+.task-board .dropit-submenu a {
+    font-weight: normal;
+    text-decoration: underline;
+    font-size: 0.9em;
+}
+
+.task-board .dropit-submenu a:hover {
+    text-decoration: none;
+}

assets/css/src/task.css

@@ -63,7 +63,7 @@ a.task-board-nobody {
 
 .task-board-category {
     font-weight: bold;
-    font-size: 0.8em;
+    font-size: 0.9em;
     color: #000;
     border: 1px solid #555;
     border-radius: 4px;
@@ -73,13 +73,13 @@ a.task-board-nobody {
 }
 
 .task-board-footer {
-    height: 18px;
+    height: 20px;
 }
 
 .task-board-date {
     position: absolute;
     bottom: 0;
-    left: 5px;
+    left: 0;
     font-weight: bold;
     color: #000;
 }

assets/js/src/base.js

@@ -160,17 +160,8 @@ var Kanboard = (function() {
             }
         },
 
-        // Common init
         Init: function() {
 
-            // Datepicker
-            $(".form-date").datepicker({
-                showOtherMonths: true,
-                selectOtherMonths: true,
-                dateFormat: 'yy-mm-dd',
-                constrainInput: false
-            });
-
             // Project select box
             $("#board-selector").chosen({
                 width: 180
@@ -180,23 +171,38 @@ var Kanboard = (function() {
                 window.location = $(this).attr("data-board-url").replace(/PROJECT_ID/g, $(this).val());
             });
 
+            // Check the session every 60s
+            window.setInterval(Kanboard.CheckSession, 60000);
+
+            Mousetrap.bind("ctrl+enter", function() {
+                $("form").submit();
+            });
+
+            Kanboard.InitAfterAjax();
+        },
+
+        InitAfterAjax: function() {
+            
+            // Datepicker
+            $(".form-date").datepicker({
+                showOtherMonths: true,
+                selectOtherMonths: true,
+                dateFormat: 'yy-mm-dd',
+                constrainInput: false
+            });
+
             // Markdown Preview for textareas
             $("#markdown-preview").click(Kanboard.MarkdownPreview);
             $("#markdown-write").click(Kanboard.MarkdownWriter);
 
-            // Check the session every 60s
-            window.setInterval(Kanboard.CheckSession, 60000);
-
             // Auto-select input fields
             $(".auto-select").focus(function() {
                 $(this).select();
             });
 
-            Mousetrap.bind("ctrl+enter", function() {
+            // Dropdown
-                $("form").submit();
+            $(".dropit-submenu").hide();
-            });
+            $('.dropdown').not(".dropit").dropit();
-
-            $('.dropdown').dropit();
         }
     };
 

assets/js/src/board.js

@@ -4,7 +4,7 @@ Kanboard.Board = (function() {
 
     function on_popover(e)
     {
-        Kanboard.Popover(e, Kanboard.Init);
+        Kanboard.Popover(e, Kanboard.InitAfterAjax);
     }
 
     function keyboard_shortcuts()
@@ -13,7 +13,7 @@ Kanboard.Board = (function() {
 
             Kanboard.OpenPopover(
                 $(".task-creation-popover").attr('href'),
-                Kanboard.Init
+                Kanboard.InitAfterAjax
             );
         });
     }
@@ -38,10 +38,10 @@ Kanboard.Board = (function() {
         });
 
         // Assignee change
-        $(".assignee-popover").click(Kanboard.Popover);
+        $(".assignee-popover").click(on_popover);
 
         // Category change
-        $(".category-popover").click(Kanboard.Popover);
+        $(".category-popover").click(on_popover);
 
         // Task edit popover
         $(".task-edit-popover").click(on_popover);
@@ -50,6 +50,7 @@ Kanboard.Board = (function() {
         // Description popover
         $(".task-description-popover").click(on_popover);
 
+        // Tooltip for column description
         $(".column-tooltip").tooltip({
             content: function(e) {
                 return $(this).attr("title");
@@ -175,6 +176,7 @@ Kanboard.Board = (function() {
             success: function(data) {
                 $("#board").remove();
                 $("#main").append(data);
+                Kanboard.InitAfterAjax();
                 board_load_events();
                 filter_apply();
             }
@@ -192,6 +194,7 @@ Kanboard.Board = (function() {
                     200: function(data) {
                         $("#board").remove();
                         $("#main").append(data);
+                        Kanboard.InitAfterAjax();
                         board_unload_events();
                         board_load_events();
                         filter_apply();

assets/js/src/init.js

@@ -1,5 +1,5 @@
 // Initialization
-$(function() {
+jQuery(document).ready(function() {
     
     Kanboard.Init();
 

assets/js/vendor/dropit.min.js

@@ -1,4 +1,99 @@
-(function(b){b.fn.dropit=function(c){var d={init:function(c){this.dropit.settings=b.extend({},this.dropit.defaults,c);return this.each(function(){var c=b(this),a=b.fn.dropit.settings;c.addClass("dropit").find(">"+a.triggerParentEl+":has("+a.submenuEl+")").addClass("dropit-trigger").find(a.submenuEl).addClass("dropit-submenu").hide();c.on(a.action,a.triggerParentEl+":has("+a.submenuEl+") > "+a.triggerEl+"",function(){if("click"==a.action&&b(this).parents(a.triggerParentEl).hasClass("dropit-open"))return a.beforeHide.call(this),
+/*
-b(this).parents(a.triggerParentEl).removeClass("dropit-open").find(a.submenuEl).hide(),a.afterHide.call(this),!1;a.beforeHide.call(this);b(".dropit-open").removeClass("dropit-open").find(".dropit-submenu").hide();a.afterHide.call(this);a.beforeShow.call(this);b(this).parents(a.triggerParentEl).addClass("dropit-open").find(a.submenuEl).show();a.afterShow.call(this);return!1});b(document).on("click",function(){a.beforeHide.call(this);b(".dropit-open").removeClass("dropit-open").find(".dropit-submenu").hide();
+ * Dropit v1.1.0
-a.afterHide.call(this)});if("mouseenter"==a.action)c.on("mouseleave",function(){a.beforeHide.call(this);b(this).removeClass("dropit-open").find(a.submenuEl).hide();a.afterHide.call(this)});a.afterLoad.call(this)})}};if(d[c])return d[c].apply(this,Array.prototype.slice.call(arguments,1));if("object"!==typeof c&&c)b.error('Method "'+c+'" does not exist in dropit plugin!');else return d.init.apply(this,arguments)};b.fn.dropit.defaults={action:"click",submenuEl:"ul",triggerEl:"a",triggerParentEl:"li",
+ * http://dev7studios.com/dropit
-afterLoad:function(){},beforeShow:function(){},afterShow:function(){},beforeHide:function(){},afterHide:function(){}};b.fn.dropit.settings={}})(jQuery);
+ *
+ * Copyright 2012, Dev7studios
+ * Free to use and abuse under the MIT license.
+ * http://www.opensource.org/licenses/mit-license.php
+ */
+
+;(function($) {
+
+    $.fn.dropit = function(method) {
+
+        var methods = {
+
+            init : function(options) {
+                this.dropit.settings = $.extend({}, this.dropit.defaults, options);
+                return this.each(function() {
+                    var $el = $(this),
+                         el = this,
+                         settings = $.fn.dropit.settings;
+
+                    // Hide initial submenus
+                    $el.addClass('dropit')
+                    .find('>'+ settings.triggerParentEl +':has('+ settings.submenuEl +')').addClass('dropit-trigger')
+                    .find(settings.submenuEl).addClass('dropit-submenu').hide();
+
+                    // Open on click
+                    $el.on(settings.action, settings.triggerParentEl +':has('+ settings.submenuEl +') > '+ settings.triggerEl +'', function(){
+                        // Close click menu's if clicked again
+                        if(settings.action == 'click' && $(this).parents(settings.triggerParentEl).hasClass('dropit-open')){
+                            settings.beforeHide.call(this);
+                            $(this).parent().removeClass('dropit-open').find(settings.submenuEl).hide();
+                            // $(this).parents(settings.triggerParentEl).removeClass('dropit-open').find(settings.submenuEl).hide();
+                            settings.afterHide.call(this);
+                            return false;
+                        }
+
+                        // Hide open menus
+                        settings.beforeHide.call(this);
+                        $('.dropit-open').removeClass('dropit-open').find('.dropit-submenu').hide();
+                        settings.afterHide.call(this);
+
+                        // Open this menu
+                        settings.beforeShow.call(this);
+                        $(this).parent().addClass('dropit-open').find(settings.submenuEl).show();
+                        // $(this).parents(settings.triggerParentEl).addClass('dropit-open').find(settings.submenuEl).show();
+                        settings.afterShow.call(this);
+
+                        return false;
+                    });
+
+                    // Close if outside click
+                    $(document).on('click', function(){
+                        settings.beforeHide.call(this);
+                        $('.dropit-open').removeClass('dropit-open').find('.dropit-submenu').hide();
+                        settings.afterHide.call(this);
+                    });
+
+                    // If hover
+                    if(settings.action == 'mouseenter'){
+                        $el.on('mouseleave', function(){
+                            settings.beforeHide.call(this);
+                            $(this).removeClass('dropit-open').find(settings.submenuEl).hide();
+                            settings.afterHide.call(this);
+                        });
+                    }
+
+                    settings.afterLoad.call(this);
+                });
+            }
+
+        };
+
+        if (methods[method]) {
+            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
+        } else if (typeof method === 'object' || !method) {
+            return methods.init.apply(this, arguments);
+        } else {
+            $.error( 'Method "' +  method + '" does not exist in dropit plugin!');
+        }
+
+    };
+
+    $.fn.dropit.defaults = {
+        action: 'click', // The open action for the trigger
+        submenuEl: 'ul', // The submenu element
+        triggerEl: 'a', // The trigger element
+        triggerParentEl: 'li', // The trigger parent element
+        afterLoad: function(){}, // Triggers when plugin has loaded
+        beforeShow: function(){}, // Triggers before submenu is shown
+        afterShow: function(){}, // Triggers after submenu is shown
+        beforeHide: function(){}, // Triggers before submenu is hidden
+        afterHide: function(){} // Triggers before submenu is hidden
+    };
+
+    $.fn.dropit.settings = {};
+
+})(jQuery);