AS1024
/
Kanboard-Prod
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add delay of 1.5s for draggable items on touch devices

This commit is contained in:
Frederic Guillot 2015-08-29 11:57:09 -04:00
parent f4c3ca9991
commit 720d1bc3bd
14 changed files with 80 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ChangeLog
View File

@ -22,6 +22,7 @@ New features:
Improvements:
* Add delay of 1.5s for draggable items on touch devices
* Improve file attachments tooltip on the board
* Adjust automatically the height of the placeholder during drag and drop
* Show all tasks when using no search criteria

2
Makefile
View File

@ -5,7 +5,7 @@ CSS_PRINT = $(addprefix assets/css/src/, $(addsuffix .css, print links table boa
CSS_VENDOR = $(addprefix assets/css/vendor/, $(addsuffix .css, jquery-ui.min jquery-ui-timepicker-addon.min chosen.min fullcalendar.min font-awesome.min c3.min))
JS_APP = $(addprefix assets/js/src/, $(addsuffix .js, Popover Dropdown Tooltip Markdown Sidebar Search App Screenshot Calendar Board Swimlane Gantt TaskRepartitionChart UserRepartitionChart CumulativeFlowDiagram BurndownChart BudgetChart AvgTimeColumnChart TaskTimeColumnChart LeadCycleTimeChart Router))
JS_VENDOR = $(addprefix assets/js/vendor/, $(addsuffix .js, jquery-1.11.1.min jquery-ui.min jquery-ui-timepicker-addon.min chosen.jquery.min moment.min fullcalendar.min mousetrap.min mousetrap-global-bind.min))
JS_VENDOR = $(addprefix assets/js/vendor/, $(addsuffix .js, jquery-1.11.1.min jquery-ui.min jquery-ui-timepicker-addon.min jquery.ui.touch-punch.min chosen.jquery.min moment.min fullcalendar.min mousetrap.min mousetrap-global-bind.min))
JS_LANG = $(addprefix assets/js/vendor/lang/, $(addsuffix .js, da de es fi fr hu it ja nl nb pl pt pt-br ru sv sr th tr zh-cn))
all: css js

53
app/Template/project/filters.php
View File

@ -51,31 +51,34 @@
<?= $this->form->hidden('project_id', $filters) ?>
<?= $this->form->text('search', $filters, array(), array('placeholder="'.t('Filter').'"'), 'form-input-large') ?>
</form>
<?= $this->render('app/filters_helper', array('reset' => 'status:open')) ?>
<?php if (isset($users_list)): ?>
<div class="dropdown filters">
<i class="fa fa-caret-down"></i> <a href="#" class="dropdown-menu"><?= t('Users') ?></a>
<ul>
<li><a href="#" class="filter-helper" data-filter="status:open"><?= t('All users') ?></a></li>
<li><a href="#" class="filter-helper" data-filter="status:open assignee:nobody"><?= t('Not assigned') ?></a></li>
<?php foreach ($users_list as $user): ?>
<li><a href="#" class="filter-helper" data-filter='status:open assignee:"<?= $this->e($user) ?>"'><?= $this->e($user) ?></a></li>
<?php endforeach ?>
</ul>
</div>
<?php endif ?>
<div class="filter-dropdowns">
<?= $this->render('app/filters_helper', array('reset' => 'status:open')) ?>
<?php if (isset($categories_list) && ! empty($categories_list)): ?>
<div class="dropdown filters">
<i class="fa fa-caret-down"></i> <a href="#" class="dropdown-menu"><?= t('Categories') ?></a>
<ul>
<li><a href="#" class="filter-helper" data-filter="status:open"><?= t('All categories') ?></a></li>
<li><a href="#" class="filter-helper" data-filter="status:open category:none"><?= t('No category') ?></a></li>
<?php foreach ($categories_list as $category): ?>
<li><a href="#" class="filter-helper" data-filter='status:open category:"<?= $this->e($category) ?>"'><?= $this->e($category) ?></a></li>
<?php endforeach ?>
</ul>
</div>
<?php endif ?>
<?php if (isset($users_list)): ?>
<div class="dropdown filters">
<i class="fa fa-caret-down"></i> <a href="#" class="dropdown-menu"><?= t('Users') ?></a>
<ul>
<li><a href="#" class="filter-helper" data-filter="status:open"><?= t('All users') ?></a></li>
<li><a href="#" class="filter-helper" data-filter="status:open assignee:nobody"><?= t('Not assigned') ?></a></li>
<?php foreach ($users_list as $user): ?>
<li><a href="#" class="filter-helper" data-filter='status:open assignee:"<?= $this->e($user) ?>"'><?= $this->e($user) ?></a></li>
<?php endforeach ?>
</ul>
</div>
<?php endif ?>
<?php if (isset($categories_list) && ! empty($categories_list)): ?>
<div class="dropdown filters">
<i class="fa fa-caret-down"></i> <a href="#" class="dropdown-menu"><?= t('Categories') ?></a>
<ul>
<li><a href="#" class="filter-helper" data-filter="status:open"><?= t('All categories') ?></a></li>
<li><a href="#" class="filter-helper" data-filter="status:open category:none"><?= t('No category') ?></a></li>
<?php foreach ($categories_list as $category): ?>
<li><a href="#" class="filter-helper" data-filter='status:open category:"<?= $this->e($category) ?>"'><?= $this->e($category) ?></a></li>
<?php endforeach ?>
</ul>
</div>
<?php endif ?>
</div>
</div>

2
assets/css/app.css
View File

File diff suppressed because one or more lines are too long

2
assets/css/print.css
View File

File diff suppressed because one or more lines are too long

4
assets/css/src/board.css
View File

@ -143,3 +143,7 @@ a.board-swimlane-toggle {
height: 70px;
margin-bottom: 10px;
}
div.draggable-item-selected {
border: 1px solid #000;
}

4
assets/css/src/filters.css
View File

@ -62,3 +62,7 @@ form.search {
div.search {
margin-bottom: 20px;
}
.filter-dropdowns {
display: inline-block;
}

12
assets/css/src/responsive.css
View File

@ -1,4 +1,14 @@
/* responsive design */
@media only screen and (max-width: 1080px) {
div.filter-dropdowns .filters {
margin-left: 0;
}
div.filter-dropdowns {
display: block;
margin-top: 5px;
}
}
@media only screen and (max-width: 1024px) {
li.hide-tablet,

1
assets/css/src/task.css
View File

@ -305,4 +305,3 @@ span.task-board-date-overdue {
.flag-milestone {
color: green;
}

14
assets/js/app.js
View File

File diff suppressed because one or more lines are too long

5
assets/js/src/Board.js
View File

@ -113,12 +113,13 @@ Board.prototype.dragAndDrop = function() {
var self = this;
$(".board-task-list").sortable({
forcePlaceholderSize: true,
delay: 300,
delay: $.support.touch ? 1500 : 300,
distance: 5,
connectWith: ".board-task-list",
placeholder: "draggable-placeholder",
items: ".draggable-item",
stop: function(event, ui) {
ui.item.removeClass("draggable-item-selected");
self.save(
ui.item.attr('data-task-id'),
ui.item.parent().attr("data-column-id"),
@ -127,6 +128,7 @@ Board.prototype.dragAndDrop = function() {
);
},
start: function(event, ui) {
ui.item.addClass("draggable-item-selected");
ui.placeholder.height(ui.item.height());
}
});
@ -225,7 +227,6 @@ Board.prototype.hideColumn = function(columnId) {
$(".board-column-" + columnId + " .board-rotation").each(function() {
var position = $(".board-swimlane").position();
// $(".board-column-task-collapsed").height($(window).height() - position.top);
$(this).css("width", $(".board-column-" + columnId + "").height());
});

2
assets/js/src/Gantt.js
View File

@ -268,6 +268,7 @@ Gantt.prototype.listenForBlockResize = function(startDate) {
jQuery("div.ganttview-block", this.options.container).resizable({
grid: this.options.cellWidth,
handles: "e,w",
delay: $.support.touch ? 1500 : 300,
stop: function() {
var block = jQuery(this);
self.updateDataAndPosition(block, startDate);
@ -282,6 +283,7 @@ Gantt.prototype.listenForBlockMove = function(startDate) {
jQuery("div.ganttview-block", this.options.container).draggable({
axis: "x",
delay: $.support.touch ? 1500 : 300,
grid: [this.options.cellWidth, this.options.cellWidth],
stop: function() {
var block = jQuery(this);

11
assets/js/vendor/jquery.ui.touch-punch.min.js vendored Normal file
View File

@ -0,0 +1,11 @@
/*!
* jQuery UI Touch Punch 0.2.3
*
* Copyright 2011–2014, Dave Furfero
* Dual licensed under the MIT or GPL Version 2 licenses.
*
* Depends:
* jquery.ui.widget.js
* jquery.ui.mouse.js
*/
!function(a){function f(a,b){if(!(a.originalEvent.touches.length>1)){a.preventDefault();var c=a.originalEvent.changedTouches[0],d=document.createEvent("MouseEvents");d.initMouseEvent(b,!0,!0,window,1,c.screenX,c.screenY,c.clientX,c.clientY,!1,!1,!1,!1,0,null),a.target.dispatchEvent(d)}}if(a.support.touch="ontouchend"in document,a.support.touch){var e,b=a.ui.mouse.prototype,c=b._mouseInit,d=b._mouseDestroy;b._touchStart=function(a){var b=this;!e&&b._mouseCapture(a.originalEvent.changedTouches[0])&&(e=!0,b._touchMoved=!1,f(a,"mouseover"),f(a,"mousemove"),f(a,"mousedown"))},b._touchMove=function(a){e&&(this._touchMoved=!0,f(a,"mousemove"))},b._touchEnd=function(a){e&&(f(a,"mouseup"),f(a,"mouseout"),this._touchMoved||f(a,"click"),e=!1)},b._mouseInit=function(){var b=this;b.element.bind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),c.call(b)},b._mouseDestroy=function(){var b=this;b.element.unbind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),d.call(b)}}}(jQuery);

2
composer.json
View File

@ -9,7 +9,7 @@
"fabiang/xmpp" : "0.6.1",
"fguillot/json-rpc" : "1.0.1",
"fguillot/picodb" : "1.0.1",
"fguillot/simpleLogger" : "0.0.2",
"fguillot/simpleLogger" : "1.0.0",
"fguillot/simple-validator" : "1.0.0",
"nickcernis/html-to-markdown" : "2.2.1",
"pimple/pimple" : "~3.0",