mirror of
https://github.com/sudoxnym/habitica-self-host.git
synced 2026-04-14 19:47:03 +00:00
feat(sortable): use angular-ui-sortable instead of jqueryui directly
This commit is contained in:
parent
ba8cda2e51
commit
750135b673
6 changed files with 27 additions and 31 deletions
|
|
@ -16,7 +16,6 @@
|
|||
"dependencies": {
|
||||
"jquery": "~2.1.0",
|
||||
"jquery.cookie": "~1.4.0",
|
||||
"jquery-ui": "~1.10.3",
|
||||
"angular": "1.3.0-beta.11",
|
||||
"angular-ui": "~0.4.0",
|
||||
"angular-sanitize": "1.3.0-beta.11",
|
||||
|
|
@ -40,9 +39,13 @@
|
|||
"swagger-ui": "git://github.com/wordnik/swagger-ui.git",
|
||||
"ngInfiniteScroll": "1.0.0",
|
||||
"jquery-colorbox": "~1.4.36",
|
||||
"pnotify": "~1.3.1"
|
||||
"pnotify": "~1.3.1",
|
||||
"angular-ui-sortable": "~0.12.10"
|
||||
},
|
||||
"devDependencies": {
|
||||
"angular-mocks": "1.3.0-beta.11"
|
||||
},
|
||||
"resolutions": {
|
||||
"angular": "1.3.0-beta.11"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
window.habitrpg = angular.module('habitrpg',
|
||||
['ngResource', 'ngSanitize', 'userServices', 'groupServices', 'memberServices', 'challengeServices',
|
||||
'authServices', 'notificationServices', 'guideServices', 'authCtrl',
|
||||
'ui.bootstrap', 'ui.keypress', 'ui.router', 'chieffancypants.loadingBar', 'At', 'pasvaz.bindonce', 'infinite-scroll', 'ui.select2'])
|
||||
'ui.bootstrap', 'ui.keypress', 'ui.router', 'chieffancypants.loadingBar', 'At', 'pasvaz.bindonce', 'infinite-scroll', 'ui.select2', 'ui.sortable'])
|
||||
|
||||
// @see https://github.com/angular-ui/ui-router/issues/110 and https://github.com/HabitRPG/habitrpg/issues/1705
|
||||
// temporary hack until they have a better solution
|
||||
|
|
|
|||
|
|
@ -84,6 +84,21 @@ habitrpg.controller("TasksCtrl", ['$scope', '$rootScope', '$location', 'User','N
|
|||
});
|
||||
};
|
||||
|
||||
$scope.sortableOptions = {
|
||||
// Because we're manually handling sorting via splice (index.coffee#user.ops), we cancel jQuery UI
|
||||
update: function(e,ui) {
|
||||
ui.item.sortable.cancel();
|
||||
},
|
||||
stop: function(e, ui) {
|
||||
User.user.ops.sortTask({
|
||||
params: {id: ui.item.scope().task.id},
|
||||
query: {from: ui.item.sortable.index, to:ui.item.sortable.dropindex}
|
||||
});
|
||||
},
|
||||
axis: 'y',
|
||||
//distance: 5
|
||||
};
|
||||
|
||||
/*
|
||||
------------------------
|
||||
To-Dos
|
||||
|
|
@ -177,5 +192,4 @@ habitrpg.controller("TasksCtrl", ['$scope', '$rootScope', '$location', 'User','N
|
|||
$.getScript('//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js');
|
||||
(window.adsbygoogle = window.adsbygoogle || []).push({});
|
||||
}
|
||||
|
||||
}]);
|
||||
|
|
|
|||
|
|
@ -40,28 +40,6 @@ habitrpg.directive('whenScrolled', function() {
|
|||
};
|
||||
});
|
||||
|
||||
/**
|
||||
* Add sortable
|
||||
*/
|
||||
habitrpg.directive('habitrpgSortable', ['User', function(User) {
|
||||
return function($scope, element, attrs, ngModel) {
|
||||
$(element).sortable({
|
||||
axis: "y",
|
||||
distance: 5,
|
||||
start: function (event, ui) {
|
||||
ui.item.data('startIndex', ui.item.index());
|
||||
},
|
||||
stop: function (event, ui) {
|
||||
var taskType = angular.element(ui.item[0]).scope().task.type + 's';
|
||||
var startIndex = ui.item.data('startIndex');
|
||||
var task = User.user[taskType][startIndex];
|
||||
User.user.ops.sortTask({params:{id:task.id},query:{from:startIndex, to:ui.item.index()}});
|
||||
}
|
||||
});
|
||||
}
|
||||
}]);
|
||||
|
||||
|
||||
habitrpg
|
||||
.directive('habitrpgTasks', ['$rootScope', 'User', function($rootScope, User) {
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -26,10 +26,11 @@
|
|||
"bower_components/angular-bootstrap/ui-bootstrap-tpls.js",
|
||||
"bower_components/bootstrap/dist/js/bootstrap.js",
|
||||
|
||||
"bower_components/jquery-ui/ui/minified/jquery.ui.core.min.js",
|
||||
"bower_components/jquery-ui/ui/minified/jquery.ui.widget.min.js",
|
||||
"bower_components/jquery-ui/ui/minified/jquery.ui.mouse.min.js",
|
||||
"bower_components/jquery-ui/ui/minified/jquery.ui.sortable.min.js",
|
||||
"bower_components/jquery-ui/ui/minified/core.min.js",
|
||||
"bower_components/jquery-ui/ui/minified/widget.min.js",
|
||||
"bower_components/jquery-ui/ui/minified/mouse.min.js",
|
||||
"bower_components/jquery-ui/ui/minified/sortable.min.js",
|
||||
"bower_components/angular-ui-sortable/sortable.min.js",
|
||||
|
||||
"bower_components/habitrpg-shared/dist/habitrpg-shared.js",
|
||||
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ script(id='templates/habitrpg-tasks.html', type="text/ng-template")
|
|||
hr
|
||||
|
||||
// Actual List
|
||||
ul(class='{{list.type}}s main-list', ng-show='obj[list.type + "s"].length > 0', habitrpg-sortable)
|
||||
ul(class='{{list.type}}s main-list', ng-show='obj[list.type + "s"].length > 0', ui-sortable='sortableOptions', ng-model='obj[list.type + "s"]')
|
||||
include ./task
|
||||
|
||||
// Static Rewards
|
||||
|
|
|
|||
Loading…
Reference in a new issue