Packages
nitro
6.11.10
11.4.16
11.4.15
11.4.14
9.9.7
9.9.6
8.2.4
8.2.3
8.2.2
8.2.1
8.2.0
7.12.1
7.10.0
7.9.3
7.9.2
7.9.1
7.9.0
7.8.3
7.8.2
7.8.0
7.7.1
7.7.0
7.6.2
7.6.1
7.6.0
7.5.0
7.4.2
7.4.1
7.4.0
7.2.1
7.2.0
7.1.1
7.1.0
6.12.0
6.11.11
6.11.10
6.11.9
6.11.8
6.11.7
6.11.6
6.11.4
6.11.2
6.11.1
6.10.9
6.10.8
6.10.7
6.10.6
6.10.5
6.10.4
6.10.3
6.10.2
6.10.1
6.9.1
6.6.1
6.5.0
6.4.4
6.4.3
6.4.2
6.4.1
6.4.0
5.12.4
5.12.3
5.12.2
5.12.1
5.12.0
5.11.1
5.11.0
5.9.2
5.9.1
5.8.5
5.8.4
5.8.3
5.8.1
5.8.0
5.6.1
5.5.1
5.4.3
5.4.2
5.4.1
5.3.1
5.3.0
5.2.1
5.1.7
5.1.6
5.1.5
5.1.4
5.1.3
5.1.2
5.1.1
4.12.11
4.12.10
4.12.9
4.12.8
4.12.7
4.12.6
4.12.5
4.12.4
4.12.3
4.12.2
4.12.1
4.12.0
4.11.13
4.11.12
4.11.11
4.11.10
4.11.9
4.11.8
4.11.7
4.11.6
4.11.5
4.11.4
4.11.3
4.11.2
4.11.1
4.11.0
4.10.9
4.10.8
4.10.7
4.10.6
4.10.5
4.10.4
4.10.3
4.10.2
4.10.1
4.10.0
4.7.7
4.7.4
4.7.3
4.7.2
4.7.1
4.7.0
4.4.1
4.4.0
1.4.0
NITRO Nitrogen Web Framework
Current section
Files
Jump to
Current section
Files
priv/js/sortable.js
"use strict";
function _instanceof(left, right) { if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) { return !!right[Symbol.hasInstance](left); } else { return left instanceof right; } }
function _classCallCheck(instance, Constructor) { if (!_instanceof(instance, Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
window.addEventListener('touchmove', function () {});
var Sortable =
/*#__PURE__*/
function () {
function Sortable(list, options) {
_classCallCheck(this, Sortable);
this.list = typeof list === 'string' ? document.querySelector(list) : list;
this.items = Array.from(this.list.children);
this.animation = false;
this.options = Object.assign({
animationSpeed: 200,
animationEasing: 'ease-out'
}, options || {});
this.dragStart = this.dragStart.bind(this);
this.dragMove = this.dragMove.bind(this);
this.dragEnd = this.dragEnd.bind(this);
this.list.addEventListener('touchstart', this.dragStart, false);
this.list.addEventListener('mousedown', this.dragStart, false);
}
_createClass(Sortable, [{
key: "dragStart",
value: function dragStart(e) {
var _this = this;
if (this.animation) return;
if (e.type === 'mousedown' && e.which !== 1) return;
if (e.type === 'touchstart' && e.touches.length > 1) return;
this.handle = null;
var el = e.target;
while (el) {
if (el.hasAttribute('data-sortable-handle')) this.handle = el;
if (el.hasAttribute('data-sortable-item')) this.item = el;
if (el.hasAttribute('data-sortable-list')) break;
el = el.parentElement;
}
if (!this.handle) return;
this.list.style.position = 'relative';
this.list.style.height = this.list.offsetHeight + 'px';
this.item.classList.add('is-dragging');
this.itemHeight = this.items[1].offsetTop;
this.listHeight = this.list.offsetHeight;
this.startTouchY = this.getDragY(e);
this.startTop = this.item.offsetTop;
var offsetsTop = this.items.map(function (item) {
return item.offsetTop;
});
this.items.forEach(function (item, index) {
item.style.position = 'absolute';
item.style.top = 0;
item.style.left = 0;
item.style.width = '100%';
item.style.transform = "translateY(".concat(offsetsTop[index], "px)");
item.style.zIndex = item == _this.item ? 2 : 1;
});
setTimeout(function () {
_this.items.forEach(function (item) {
if (_this.item == item) return;
item.style.transition = "transform ".concat(_this.options.animationSpeed, "ms ").concat(_this.options.animationEasing);
});
});
this.positions = this.items.map(function (item, index) {
return index;
});
this.position = Math.round(this.startTop / this.listHeight * this.items.length);
this.touch = e.type == 'touchstart';
window.addEventListener(this.touch ? 'touchmove' : 'mousemove', this.dragMove, {
passive: false
});
window.addEventListener(this.touch ? 'touchend' : 'mouseup', this.dragEnd, false);
}
}, {
key: "dragMove",
value: function dragMove(e) {
var _this2 = this;
if (this.animation) return;
var top = this.startTop + this.getDragY(e) - this.startTouchY;
var newPosition = Math.round(top / this.listHeight * this.items.length);
this.item.style.transform = "translateY(".concat(top, "px)");
this.positions.forEach(function (index) {
if (index == _this2.position || index != newPosition) return;
_this2.swapElements(_this2.positions, _this2.position, index);
_this2.position = index;
});
this.items.forEach(function (item, index) {
if (item == _this2.item) return;
item.style.transform = "translateY(".concat(_this2.positions.indexOf(index) * _this2.itemHeight, "px)");
});
e.preventDefault();
}
}, {
key: "dragEnd",
value: function dragEnd(e) {
var _this3 = this;
this.animation = true;
this.item.style.transition = "all ".concat(this.options.animationSpeed, "ms ").concat(this.options.animationEasing);
this.item.style.transform = "translateY(".concat(this.position * this.itemHeight, "px)");
this.item.classList.remove('is-dragging');
setTimeout(function () {
_this3.list.style.position = '';
_this3.list.style.height = '';
_this3.items.forEach(function (item) {
item.style.top = '';
item.style.left = '';
item.style.right = '';
item.style.position = '';
item.style.transform = '';
item.style.transition = '';
item.style.width = '';
item.style.zIndex = '';
});
_this3.positions.map(function (i) {
return _this3.list.appendChild(_this3.items[i]);
});
_this3.items = Array.from(_this3.list.children);
_this3.animation = false;
}, this.options.animationSpeed);
window.removeEventListener(this.touch ? 'touchmove' : 'mousemove', this.dragMove, {
passive: false
});
window.removeEventListener(this.touch ? 'touchend' : 'mouseup', this.dragEnd, false);
}
}, {
key: "swapElements",
value: function swapElements(array, a, b) {
var temp = array[a];
array[a] = array[b];
array[b] = temp;
}
}, {
key: "getDragY",
value: function getDragY(e) {
return e.touches ? (e.touches[0] || e.changedTouches[0]).pageY : e.pageY;
}
}, {
key: "removeItem",
value: function removeItem(item) {
this.items.splice(this.items.indexOf(item),1);
item.remove();
}
}, {
key: "addItemFrom",
value: function addItemFrom(input) {
var value = querySourceRaw(input);
var bind = '';
if (value && value.hasOwnProperty('text') && value.hasOwnProperty('bind')) {
bind = value.bind;
value = value.text;
}
var inputElement = document.getElementById(input);
if (bind !== '' && bind !== 'null') {
if (inputElement) {
const dropdown = inputElement.parentNode;
if (dropdown && dropdown.classList.contains('dropdown')) { dropdown.classList.remove('dropdown-bind'); }
inputElement.value = '';
inputElement.removeAttribute("data-bind");
}
appendItemFromBind(this.list.id,value,bind);
} else if(value && Date.prototype.isPrototypeOf(value)) {
appendItemFromBind(this.list.id,inputElement.value,pickers[input]._d || "");
if (inputElement) {
inputElement.value = '';
inputElement.removeAttribute("data-bind");
}
}
}
}, {
key: "getValues",
value: function getValues() {
return Array.from(this.items.map(function(item) {
let list = Array.from(item.children).find(x => x.getAttribute("list-item-content"));
let text = list.firstChild.innerHTML;
let bind = item.getAttribute('data-bind');
if(item.getAttribute('date-bind')) return new Date(item.getAttribute('date-bind'));
if (bind) return { 'text': text, 'bind': bind };
return text;
}));
}
}]);
return Sortable;
}();
var SortableMap = new Map([]);
function createSortable(list) {
SortableMap.set(list, new Sortable(list));
}
function removeSortableItem(list, item) {
SortableMap.get(list).removeItem(item);
}
function addSortableItemFrom(list, input) {
var value = querySourceRaw(input);
var isAdded = SortableMap.get(list).items.map(el => el.textContent).includes(value.text || value);
if(qi(input).value != '' && !isAdded)
SortableMap.get(list).addItemFrom(input);
}
function getSortableValues(list) {
let sortable = SortableMap.get(list)
if(sortable) {
return sortable.getValues();
} else {
return Array.from([]);
}
}
function appendItemFromBind(dom,value,bind) {
var sortable = SortableMap.get('#'+dom);
var template = document.createElement('template');
template.innerHTML =
'<div class="list__item" data-sortable-item="data-sortable-item" style="" data-bind="'+ bind + '">' +
'<div class="list__item-close" onclick="removeSortableItem(\'#' + sortable.list.id + '\', this.parentNode);"></div>' +
'<div class="list__item-content" list-item-content="list-item-content"><div class="list__item-title">' + value + '</div></div>' +
'<div class="list__item-handle" data-sortable-handle="data-sortable-handle"></div>' +
'</div>'
var new_item = template.content.firstChild;
if(bind instanceof Date) {
new_item.setAttribute("date-bind", bind);
new_item.setAttribute("data-bind", "");
}
sortable.list.appendChild(new_item);
sortable.items.push(new_item);
}