+ 
-
- 
-
-
-
-
- The JavaScript library for modern browsers and touch devices. No jQuery.
+
+ 
+
-
+
+
+
+ SortableJS
+JavaScript library for reorderable drag-and-drop lists
+ +
+ Simple list
+ Shared lists
+ Cloning
+ Disabling sorting
+ Handles
+ Filter
+ Thresholds
+ Grid
+ Nested sortables
+ MultiDrag
+ Swap
+
Features
+Examples
+Plugins
+Comparisons
+Framework Support
+
-
-
List A
- -
-
- бегемот -
- корм -
- антон -
- сало -
- железосталь -
- валик -
- кровать -
- краб -
+
-
- Features
-
+
-
-
-
-
- List B
- -
-
- казнить -
- , -
- нельзя -
- помиловать -
+
+
- Simple list example
+
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
+
new Sortable(example1, {
+ animation: 150,
+ ghostClass: 'blue-background-class'
+});
+
-
-
-
-
Multi
-
+ +
Group A
-
- 
-
+
- + +
+
+ +
Shared lists
+
+
- Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
-
+ Group B
-
- 
-
+
-
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
- new Sortable(example2Left, {
+ group: 'shared', // set both lists to same group
+ animation: 150
+});
-
- Group C
-
- 
-
+new Sortable(example2Right, {
+ group: 'shared',
+ animation: 150
+});
-
+ +
+
Cloning
+Try dragging from one list to another. The item you drag will be cloned and the clone will stay in the original list.
+
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
+
new Sortable(example3Left, {
+ group: {
+ name: 'shared',
+ pull: 'clone' // To clone: set pull to 'clone'
+ },
+ animation: 150
+});
-
-
-
-
- Editable list
+new Sortable(example3Right, {
+ group: {
+ name: 'shared',
+ pull: 'clone'
+ },
+ animation: 150
+});
+
+
+
+
+
+ Disabling Sorting
+ Try sorting the list on the left. It is not possible because it has it's sort option set to false. However, you can still drag from the list on the left to the list on the right.
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
-
-
- - Оля✖
- - Владимир✖
- - Алина✖
-
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
+
+new Sortable(example4Left, {
+ group: {
+ name: 'shared',
+ pull: 'clone',
+ put: false // Do not allow items to be put into this list
+ },
+ animation: 150,
+ sort: false // To disable sorting: set sort to false
+});
-
+new Sortable(example4Right, {
+ group: 'shared',
+ animation: 150
+});
+
+
+
+
+
+ Handle
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
+
+new Sortable(example5, {
+ handle: '.handle', // handle's class
+ animation: 150
+});
+
+
+
+
+
+ Filter
+ Try dragging the item with a red background. It cannot be done, because that item is filtered out using the filter option.
+
+ Item 1
+ Item 2
+ Item 3
+ Filtered
+ Item 4
+ Item 5
+
+
+new Sortable(example6, {
+ filter: '.filtered', // 'filtered' class is not draggable
+ animation: 150
+});
+
+
+
+
+
+ Thresholds
+ Try modifying the inputs below to affect the swap thresholds. You can see the swap zones of the squares colored in dark blue, while the "dead zones" (that do not cause a swap) are colored in light blue.
+
+
+
+
+
+ 1
+
+
+
+
+ 2
+
+
+
+
+
+
+new Sortable(example7, {
+ swapThreshold: 1,
+ animation: 150
+});
-
-
-
-
-
-
- Advanced groups
-
- pull & put
-
- - Meat
- - Potato
- - Tea
-
+
+ Examples
+
+
+
+
+ Grid Example
+
+ Item 1Item 2Item 3Item 4Item 5Item 6Item 7Item 8Item 9Item 10Item 11Item 12Item 13Item 14Item 15Item 16Item 17Item 18Item 19Item 20
-
-
- only pull (clone) no reordering
-
- - Sex
- - Drugs
- - Rock'n'roll
-
+
+
+
+
+ Nested Sortables Example
+ NOTE: When using nested Sortables with animation, it is recommended that the fallbackOnBody option is set to true.
It is also always recommended that either the invertSwap option is set to true, or the swapThreshold option is lower than the default value of 1 (eg 0.65).
+
+ Item 1.1
+
+ Item 2.1
+ Item 2.2
+
+ Item 3.1
+ Item 3.2
+ Item 3.3
+ Item 3.4
+
+
+ Item 2.3
+ Item 2.4
+
+
+ Item 1.2
+ Item 1.3
+ Item 1.4
+
+ Item 2.1
+ Item 2.2
+ Item 2.3
+ Item 2.4
+
+
+ Item 1.5
-
-
- only put
-
- - Money
- - Force
- - Agility
-
+
+// Loop through each nested sortable element
+for (var i = 0; i < nestedSortables.length; i++) {
+ new Sortable(nestedSortables[i], {
+ group: 'nested',
+ animation: 150,
+ fallbackOnBody: true,
+ swapThreshold: 0.65
+ });
+}
+
-
+
+ Plugins
-
+
+
+
+ MultiDrag
+ The MultiDrag plugin allows for multiple items to be dragged at a time. You can click to "select" multiple items, and then drag them as one item.
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
+
+new Sortable(multiDragDemo, {
+ multiDrag: true, // Enable multi-drag
+ selectedClass: 'selected', // The class applied to the selected items
+ fallbackTolerance: 3, // So that we can select items on mobile
+ animation: 150
+});
+
+
+
+
+
+ Swap
+ The Swap plugin changes the behaviour of Sortable to allow for items to be swapped with eachother rather than sorted.
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+
+
+new Sortable(swapDemo, {
+ swap: true, // Enable swap plugin
+ swapClass: 'highlight', // The class applied to the hovered swap item
+ animation: 150
+});
+
+
+
-
-
-
-
- Drag handle and selectable text
-
-
- - ☰Select text freely
- - ☰Drag my handle
- - ☰Best of both worlds
-
-
+
-
+
+ Comparisons
-
+
-
-
-
-
- AngularJS / ng-sortable
-
-
-
-
-
-
-
-
- {{remaining()}} of {{todos.length}} remaining
-
- -
-
- {{todo.text}}
-
-
-
-
+
+ jQuery-UI
+
-
+ Dragula
+
-
+
-
-
-
-
- Code example
- // Simple list
-var list = document.getElementById("my-ui-list");
-Sortable.create(list); // That's all.
+
+ Framework Support
+
+
+
-// Grouping
-var foo = document.getElementById("foo");
-Sortable.create(foo, { group: "omega" });
+ Vue
+ Vue.Draggable
-var bar = document.getElementById("bar");
-Sortable.create(bar, { group: "omega" });
+ React
+ react-sortablejs
+ Angular
+ ngx-sortablejs
-// Or
-var container = document.getElementById("multi");
-var sort = Sortable.create(container, {
- animation: 150, // ms, animation speed moving items when sorting, `0` — without animation
- handle: ".tile__title", // Restricts sort start click/touch to the specified element
- draggable: ".tile", // Specifies which items inside the element should be sortable
- onUpdate: function (evt/**Event*/){
- var item = evt.item; // the current dragged HTMLElement
- }
-});
+ jQuery
+ jquery-sortablejs
-// ..
-sort.destroy();
+ Knockout
+ knockout-sortablejs
+ Meteor
+ meteor-sortablejs
-// Editable list
-var editableList = Sortable.create(editable, {
- filter: '.js-remove',
- onFilter: function (evt) {
- var el = editableList.closest(evt.item); // get dragged item
- el && el.parentNode.removeChild(el);
- }
-});
-
-
+ Polymer
+ polymer-sortablejs
-
+
+
-
-
-
-
+
+
-
-
-
-
-
-
-
-
-
-
diff --git a/jquery.binding.js b/jquery.binding.js
deleted file mode 100644
index 16d7729b4..000000000
--- a/jquery.binding.js
+++ /dev/null
@@ -1,57 +0,0 @@
-/**
- * jQuery plugin for Sortable
- * @author RubaXa
- * @license MIT
- */
-(function (factory) {
- "use strict";
-
- if (typeof define === "function" && define.amd) {
- define(["jquery"], factory);
- }
- else {
- /* jshint sub:true */
- factory(jQuery);
- }
-})(function ($) {
- "use strict";
-
-
- /* CODE */
-
-
- /**
- * jQuery plugin for Sortable
- * @param {Object|String} options
- * @param {..*} [args]
- * @returns {jQuery|*}
- */
- $.fn.sortable = function (options) {
- var retVal;
-
- this.each(function () {
- var $el = $(this),
- sortable = $el.data('sortable');
-
- if (!sortable && (options instanceof Object || !options)) {
- sortable = new Sortable(this, options);
- $el.data('sortable', sortable);
- }
-
- if (sortable) {
- if (options === 'widget') {
- return sortable;
- }
- else if (options === 'destroy') {
- sortable.destroy();
- $el.removeData('sortable');
- }
- else if (options in sortable) {
- retVal = sortable[sortable].apply(sortable, [].slice.call(arguments, 1));
- }
- }
- });
-
- return (retVal === void 0) ? this : retVal;
- };
-});
diff --git a/knockout-sortable.js b/knockout-sortable.js
deleted file mode 100644
index 6a7f70137..000000000
--- a/knockout-sortable.js
+++ /dev/null
@@ -1,161 +0,0 @@
-(function () {
- "use strict";
-
- var init = function (element, valueAccessor, allBindings, viewModel, bindingContext, sortableOptions) {
-
- var options = buildOptions(valueAccessor, sortableOptions);
-
- //It's seems that we cannot update the eventhandlers after we've created the sortable, so define them in init instead of update
- ['onStart', 'onEnd', 'onRemove', 'onAdd', 'onUpdate', 'onSort', 'onFilter'].forEach(function (e) {
- if (options[e] || eventHandlers[e])
- options[e] = function (eventType, parentVM, parentBindings, handler, e) {
- var itemVM = ko.dataFor(e.item),
- //All of the bindings on the parent element
- bindings = ko.utils.peekObservable(parentBindings()),
- //The binding options for the draggable/sortable binding of the parent element
- bindingHandlerBinding = bindings.sortable || bindings.draggable,
- //The collection that we should modify
- collection = bindingHandlerBinding.collection || bindingHandlerBinding.foreach;
- if (handler)
- handler(e, itemVM, parentVM, collection, bindings);
- if (eventHandlers[eventType])
- eventHandlers[eventType](e, itemVM, parentVM, collection, bindings);
- }.bind(undefined, e, viewModel, allBindings, options[e]);
- });
-
- viewModel._sortable = Sortable.create(element, options);
-
- //Destroy the sortable if knockout disposes the element it's connected to
- ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
- viewModel._sortable.destroy();
- });
- return ko.bindingHandlers.template.init(element, valueAccessor);
- },
- update = function (element, valueAccessor, allBindings, viewModel, bindingContext, sortableOptions) {
-
- //There seems to be some problems with updating the options of a sortable
- //Tested to change eventhandlers and the group options without any luck
-
- return ko.bindingHandlers.template.update(element, valueAccessor, allBindings, viewModel, bindingContext);
- },
- eventHandlers = (function (handlers) {
-
- var moveOperations = [],
- tryMoveOperation = function (e, itemVM, parentVM, collection, parentBindings) {
- //A move operation is the combination of a add and remove event, this is to make sure that we have both the target and origin collections
- var currentOperation = { event: e, itemVM: itemVM, parentVM: parentVM, collection: collection, parentBindings: parentBindings },
- existingOperation = moveOperations.filter(function (op) {
- return op.itemVM === currentOperation.itemVM;
- })[0];
-
- if (!existingOperation) {
- moveOperations.push(currentOperation);
- }
- else {
- //We're finishing the operation and already have a handle on the operation item meaning that it's safe to remove it
- moveOperations.splice(moveOperations.indexOf(existingOperation), 1);
-
- var removeOperation = currentOperation.event.type === 'remove' ? currentOperation : existingOperation,
- addOperation = currentOperation.event.type === 'add' ? currentOperation : existingOperation;
-
- moveItem(itemVM, removeOperation.collection, addOperation.collection, addOperation.event.clone, addOperation.event);
- }
- },
- //Moves an item from the to (collection to from (collection), these can be references to the same collection which means it's a sort,
- //clone indicates if we should move or copy the item into the new collection
- moveItem = function (itemVM, from, to, clone, e) {
- //Unwrapping this allows us to manipulate the actual array
- var fromArray = from(),
- //It's not certain that the items actual index is the same as the index reported by sortable due to filtering etc.
- originalIndex = fromArray.indexOf(itemVM);
-
- //Remove sortables "unbound" element
- e.item.parentNode.removeChild(e.item);
-
- //This splice is necessary for both clone and move/sort
- //In sort/move since it shouldn't be at this index/in this array anymore
- //In clone since we have to work around knockouts valuHasMutated when manipulating arrays and avoid a "unbound" item added by sortable
- fromArray.splice(originalIndex, 1);
- //Update the array, this will also remove sortables "unbound" clone
- from.valueHasMutated();
- if (clone && from !== to) {
- //Readd the item
- fromArray.splice(originalIndex, 0, itemVM);
- //Force knockout to update
- from.valueHasMutated();
- }
- //Insert the item on its new position
- to().splice(e.newIndex, 0, itemVM);
- //Make sure to tell knockout that we've modified the actual array.
- to.valueHasMutated();
- };
-
- handlers.onRemove = tryMoveOperation;
- handlers.onAdd = tryMoveOperation;
- handlers.onUpdate = function (e, itemVM, parentVM, collection, parentBindings) {
- //This will be performed as a sort since the to/from collections reference the same collection and clone is set to false
- moveItem(itemVM, collection, collection, false, e);
- };
-
- return handlers;
- })({}),
- //bindingOptions are the options set in the "data-bind" attribute in the ui.
- //options are custom options, for instance draggable/sortable specific options
- buildOptions = function (bindingOptions, options) {
- //deep clone/copy of properties from the "from" argument onto the "into" argument and returns the modified "into"
- var merge = function (into, from) {
- for (var prop in from) {
- if (Object.prototype.toString.call(from[prop]) === '[object Object]') {
- if (Object.prototype.toString.call(into[prop]) !== '[object Object]') {
- into[prop] = {};
- }
- into[prop] = merge(into[prop], from[prop]);
- }
- else
- into[prop] = from[prop];
- }
-
- return into;
- },
- //unwrap the supplied options
- unwrappedOptions = ko.utils.peekObservable(bindingOptions()).options || {};
-
- //Make sure that we don't modify the provided settings object
- options = merge({}, options);
-
- //group is handled differently since we should both allow to change a draggable to a sortable (and vice versa),
- //but still be able to set a name on a draggable without it becoming a drop target.
- if (unwrappedOptions.group && Object.prototype.toString.call(unwrappedOptions.group) !== '[object Object]') {
- //group property is a name string declaration, convert to object.
- unwrappedOptions.group = { name: unwrappedOptions.group };
- }
-
- return merge(options, unwrappedOptions);
- };
-
- ko.bindingHandlers.draggable = {
- sortableOptions: {
- group: { pull: 'clone', put: false },
- sort: false
- },
- init: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
- return init(element, valueAccessor, allBindings, viewModel, bindingContext, ko.bindingHandlers.draggable.sortableOptions);
- },
- update: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
- return update(element, valueAccessor, allBindings, viewModel, bindingContext, ko.bindingHandlers.draggable.sortableOptions);
- }
- };
-
- ko.bindingHandlers.sortable = {
- sortableOptions: {
- group: { pull: true, put: true }
- },
- init: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
- return init(element, valueAccessor, allBindings, viewModel, bindingContext, ko.bindingHandlers.sortable.sortableOptions);
- },
- update: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
- return update(element, valueAccessor, allBindings, viewModel, bindingContext, ko.bindingHandlers.sortable.sortableOptions);
- }
- };
-
-})();
\ No newline at end of file
diff --git a/meteor/README.md b/meteor/README.md
deleted file mode 100644
index c3403582e..000000000
--- a/meteor/README.md
+++ /dev/null
@@ -1,119 +0,0 @@
-Reactive reorderable lists with [Sortable](http://rubaxa.github.io/Sortable/),
-backed by [Meteor.js](http://meteor.com) collections:
-
-* new elements arriving in the collection will update the list as you expect
-* elements removed from the collection will be removed from the list
-* drag and drop between lists updates collections accordingly
-
-Demo: http://rubaxa-sortable.meteor.com
-
-# Meteor
-
-If you're new to Meteor, here's what the excitement is all about -
-[watch the first two minutes](https://www.youtube.com/watch?v=fsi0aJ9yr2o); you'll be hooked by 1:28.
-That screencast is from 2012. In the meantime, Meteor has become a mature JavaScript-everywhere web
-development framework. Read more at [Why Meteor](http://www.meteorpedia.com/read/Why_Meteor).
-
-
-# Usage
-
-Simplest invocation - order will be lost when the page is refreshed:
-
-```handlebars
-{{#sortable }}
-```
-
-Persist the sort order in the 'order' field of each document in the collection:
-
-*Client:*
-
-```handlebars
-{{#sortable items= sortField="order"}}
-```
-
-*Server:*
-
-```js
-Sortable.collections = ; // the name, not the variable
-```
-
-Along with `items`, `sortField` is the only Meteor-specific option. If it's missing, the package will
-assume there is a field called "order" in the collection, holding unique `Number`s such that every
-`order` differs from that before and after it by at least 1. Basically, keep to 0, 1, 2, ... .
-Try not to depend on a particular format for this field; it *is* though guaranteed that a `sort` will
-produce lexicographical order, and that the order will be maintained after an arbitrary number of
-reorderings, unlike with [naive solutions](http://programmers.stackexchange.com/questions/266451/maintain-ordered-collection-by-updating-as-few-order-fields-as-possible).
-
-Remember to declare on the server which collections you want to be reorderable from the client.
-Otherwise, the library will error because the client would be able to modify numerical fields in
-any collection, which represents a security risk.
-
-
-## Passing options to the Sortable library
-
- {{#sortable items= option1=value1 option2=value2...}}
- {{#sortable items= options=myOptions}}
-
-For available options, please refer to [the main README](../README.md#options). You can pass them directly
-or under the `options` object. Direct options (`key=value`) override those in `options`. It is best
-to pass presentation-related options directly, and functionality-related settings in an `options`
-object, as this will enable designers to work without needing to inspect the JavaScript code:
-
-
- ...
- {{#sortable items=Players handle=".sortable-handle" ghostClass="sortable-ghost" options=playerOptions}}
-
-
-Define the options in a helper for the template that calls Sortable:
-
-```js
-Template.myTemplate.helpers({
- playerOptions: function () {
- return {
- group: {
- name: "league",
- pull: true,
- put: false
- },
- sort: false
- };
- }
-});
-```
-
-
-## Events
-
-All the original Sortable events are supported. In addition, they will receive
-the data context in `event.data`. You can access `event.data.order` this way:
-
-```handlebars
-{{#sortable items=players options=playersOptions}}
-```
-
-```js
-Template.myTemplate.helpers({
- playersOptions: function () {
- return {
- onSort: function(/**Event*/event) {
- console.log('Moved player #%d from %d to %d',
- event.data.order, event.oldIndex, event.newIndex
- );
- }
- };
- }
-});
-```
-
-
-# Issues
-
-If you encounter an issue while using this package, please CC @dandv when you file it in this repo.
-
-
-# TODO
-
-* Array support
-* Tests
-* Misc. - see reactivize.js
-* [GitHub issues](https://github.com/RubaXa/Sortable/labels/%E2%98%84%20meteor)
diff --git a/meteor/example/.meteor/.finished-upgraders b/meteor/example/.meteor/.finished-upgraders
deleted file mode 100644
index 8a761038c..000000000
--- a/meteor/example/.meteor/.finished-upgraders
+++ /dev/null
@@ -1,8 +0,0 @@
-# This file contains information which helps Meteor properly upgrade your
-# app when you run 'meteor update'. You should check it into version control
-# with your project.
-
-notices-for-0.9.0
-notices-for-0.9.1
-0.9.4-platform-file
-notices-for-facebook-graph-api-2
diff --git a/meteor/example/.meteor/.gitignore b/meteor/example/.meteor/.gitignore
deleted file mode 100644
index 408303742..000000000
--- a/meteor/example/.meteor/.gitignore
+++ /dev/null
@@ -1 +0,0 @@
-local
diff --git a/meteor/example/.meteor/.id b/meteor/example/.meteor/.id
deleted file mode 100644
index b39baa1d8..000000000
--- a/meteor/example/.meteor/.id
+++ /dev/null
@@ -1,7 +0,0 @@
-# This file contains a token that is unique to your project.
-# Check it into your repository along with the rest of this directory.
-# It can be used for purposes such as:
-# - ensuring you don't accidentally deploy one app on top of another
-# - providing package authors with aggregated statistics
-
-ir0jg2douy3yo5mehw
diff --git a/meteor/example/.meteor/packages b/meteor/example/.meteor/packages
deleted file mode 100644
index a33b0edfd..000000000
--- a/meteor/example/.meteor/packages
+++ /dev/null
@@ -1,12 +0,0 @@
-# Meteor packages used by this project, one per line.
-#
-# 'meteor add' and 'meteor remove' will edit this file for you,
-# but you can also edit it by hand.
-
-meteor-platform
-autopublish
-insecure
-rubaxa:sortable
-dburles:mongo-collection-instances
-fezvrasta:bootstrap-material-design
-# twbs:bootstrap
diff --git a/meteor/example/.meteor/platforms b/meteor/example/.meteor/platforms
deleted file mode 100644
index 8a3a35f9f..000000000
--- a/meteor/example/.meteor/platforms
+++ /dev/null
@@ -1,2 +0,0 @@
-browser
-server
diff --git a/meteor/example/.meteor/release b/meteor/example/.meteor/release
deleted file mode 100644
index dab6b552c..000000000
--- a/meteor/example/.meteor/release
+++ /dev/null
@@ -1 +0,0 @@
-METEOR@1.1.0.2
diff --git a/meteor/example/.meteor/versions b/meteor/example/.meteor/versions
deleted file mode 100644
index abcbcf0a3..000000000
--- a/meteor/example/.meteor/versions
+++ /dev/null
@@ -1,53 +0,0 @@
-autopublish@1.0.3
-autoupdate@1.2.1
-base64@1.0.3
-binary-heap@1.0.3
-blaze@2.1.2
-blaze-tools@1.0.3
-boilerplate-generator@1.0.3
-callback-hook@1.0.3
-check@1.0.5
-dburles:mongo-collection-instances@0.3.3
-ddp@1.1.0
-deps@1.0.7
-ejson@1.0.6
-fastclick@1.0.3
-fezvrasta:bootstrap-material-design@0.3.0
-geojson-utils@1.0.3
-html-tools@1.0.4
-htmljs@1.0.4
-http@1.1.0
-id-map@1.0.3
-insecure@1.0.3
-jquery@1.11.3_2
-json@1.0.3
-lai:collection-extensions@0.1.3
-launch-screen@1.0.2
-livedata@1.0.13
-logging@1.0.7
-meteor@1.1.6
-meteor-platform@1.2.2
-minifiers@1.1.5
-minimongo@1.0.8
-mobile-status-bar@1.0.3
-mongo@1.1.0
-observe-sequence@1.0.6
-ordered-dict@1.0.3
-random@1.0.3
-reactive-dict@1.1.0
-reactive-var@1.0.5
-reload@1.1.3
-retry@1.0.3
-routepolicy@1.0.5
-rubaxa:sortable@1.2.0
-session@1.1.0
-spacebars@1.0.6
-spacebars-compiler@1.0.6
-templating@1.1.1
-tracker@1.0.7
-twbs:bootstrap@3.3.4
-ui@1.0.6
-underscore@1.0.3
-url@1.0.4
-webapp@1.2.0
-webapp-hashing@1.0.3
diff --git a/meteor/example/README.md b/meteor/example/README.md
deleted file mode 100644
index 51d154718..000000000
--- a/meteor/example/README.md
+++ /dev/null
@@ -1,60 +0,0 @@
-# RubaXa:Sortable Meteor demo
-
-This demo showcases the two-way integration between the reorderable list
-widget [Sortable](https://github.com/RubaXa/Sortable/) and Meteor.js. Meteor
-Mongo collections are updated when items are added, removed or reordered, and
-the order is persisted.
-
-It also shows list grouping and control over what lists can give or receive
-elements. You can only drag elements from the list to the left onto the list
-to the right.
-
-## Usage
-
-The example uses the local package from the checkout, so it needs to wire
-up some files (`package.js` and `package.json`). This is done by the handy
-run script:
-
-### Windows
-
- git clone https://github.com/RubaXa/Sortable.git
- cd Sortable
- git checkout dev
- cd meteor\example
- run.bat
-
-### Elsewhere
-
- git clone https://github.com/RubaXa/Sortable.git
- cd Sortable
- git checkout dev
- meteor/example./run.sh
-
-## Prior art
-
-### Differential
-
-Differential wrote [a blog post on reorderable lists with
-Meteor](http://differential.com/blog/sortable-lists-in-meteor-using-jquery-ui) and
-[jQuery UI Sortable](http://jqueryui.com/sortable/). It served as inspiration
-for integrating [rubaxa:sortable](rubaxa.github.io/Sortable/),
-which uses the HTML5 native drag&drop API (not without [its
-limitations](https://github.com/RubaXa/Sortable/issues/106)).
-The reordering method used by the Differential example can lead to data loss
-though, because it calculates the new order of a dropped element as the
-arithmetic mean of the elements before and after it. This [runs into limitations
-of floating point precision](http://programmers.stackexchange.com/questions/266451/maintain-ordered-collection-by-updating-as-few-order-fields-as-possible)
-in JavaScript after <50 reorderings.
-
-### Todos animated
-
-http://todos-dnd-animated.meteor.com/ ([source](https://github.com/nleush/meteor-todos-sortable-animation))
-is based on old Meteor Blaze (back then Spark) API, and won't work with current versions.
-It does showcase some neat features, such as animation when collection elements
-are reordered by another client. It uses jQuery UI Sortable as well, which lacks
-some features vs. rubaxa:Sortable, e.g. text selection within the item.
-
-## TODO
-
-* Animation
-* Indication that an item is being edited
diff --git a/meteor/example/client/define-object-type.css b/meteor/example/client/define-object-type.css
deleted file mode 100644
index d67b4b1d7..000000000
--- a/meteor/example/client/define-object-type.css
+++ /dev/null
@@ -1,57 +0,0 @@
-.glyphicon {
- vertical-align: baseline;
- font-size: 80%;
- margin-right: 0.5em;
-}
-
-[class^="mdi-"], [class*=" mdi-"] {
- vertical-align: baseline;
- font-size: 90%;
- margin-right: 0.4em;
-}
-
-.list-pair {
- display: flex; /* use the flexbox model */
- flex-direction: row;
-}
-.sortable {
-/* font-size: 2em;*/
-}
-
-.sortable.source {
- /*background: #9FA8DA;*/
- flex: 0 0 auto;
- margin-right: 1em;
- cursor: move;
- cursor: -webkit-grabbing;
-}
-
-.sortable.target {
- /*background: #3F51B5;*/
- flex: 1 1 auto;
- margin-left: 1em;
-}
-
-.target .well {
-
-}
-
-.sortable-handle {
- cursor: move;
- cursor: -webkit-grabbing;
-}
-.sortable-handle.pull-right {
- margin-top: 0.3em;
-}
-
-.sortable-ghost {
- opacity: 0.6;
-}
-
-/* show the remove button on hover */
-.removable .close {
- display: none;
-}
-.removable:hover .close {
- display: block;
-}
diff --git a/meteor/example/client/define-object-type.html b/meteor/example/client/define-object-type.html
deleted file mode 100644
index d852cbcb5..000000000
--- a/meteor/example/client/define-object-type.html
+++ /dev/null
@@ -1,94 +0,0 @@
-
- Reactive RubaXa:Sortable for Meteor
-
-
-
- {{> navbar}}
-
-
-
- RubaXa:Sortable - reactive reorderable lists for Meteor
- Drag attribute types from the left to define an object type on the right
- Drag the handle to reorder elements
-
-
- {{> typeDefinition}}
-
-
-
-
-
-
-
-
-
- {{#sortable items=types options=typesOptions}}
-
- {{{icon}}} {{name}}
-
- {{/sortable}}
-
-
-
- {{#sortable items=attributes animation="100" handle=".sortable-handle" ghostClass="sortable-ghost" options=attributesOptions}}
- {{> sortableItemTarget}}
- {{/sortable}}
-
-
-
-
-
-
-
-
-
- {{{icon}}}
-
- {{name}}
- {{order}}
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/meteor/example/client/define-object-type.js b/meteor/example/client/define-object-type.js
deleted file mode 100644
index ad2a19e2a..000000000
--- a/meteor/example/client/define-object-type.js
+++ /dev/null
@@ -1,101 +0,0 @@
-// Define an object type by dragging together attributes
-
-Template.typeDefinition.helpers({
- types: function () {
- return Types.find({}, { sort: { order: 1 } });
- },
- typesOptions: {
- sortField: 'order', // defaults to 'order' anyway
- group: {
- name: 'typeDefinition',
- pull: 'clone',
- put: false
- },
- sort: false // don't allow reordering the types, just the attributes below
- },
-
- attributes: function () {
- return Attributes.find({}, {
- sort: { order: 1 },
- transform: function (doc) {
- doc.icon = Types.findOne({name: doc.type}).icon;
- return doc;
- }
- });
- },
- attributesOptions: {
- group: {
- name: 'typeDefinition',
- put: true
- },
- onAdd: function (event) {
- delete event.data._id; // Generate a new id when inserting in the Attributes collection. Otherwise, if we add the same type twice, we'll get an error that the ids are not unique.
- delete event.data.icon;
- event.data.type = event.data.name;
- event.data.name = 'Rename me (double click)'
- },
- // event handler for reordering attributes
- onSort: function (event) {
- console.log('Item %s went from #%d to #%d',
- event.data.name, event.oldIndex, event.newIndex
- );
- }
- }
-});
-
-Template.sortableItemTarget.events({
- 'dblclick .name': function (event, template) {
- // Make the name editable. We should use an existing component, but it's
- // in a sorry state - https://github.com/arillo/meteor-x-editable/issues/1
- var name = template.$('.name');
- var input = template.$('input');
- if (input.length) { // jQuery never returns null - http://stackoverflow.com/questions/920236/how-can-i-detect-if-a-selector-returns-null
- input.show();
- } else {
- input = $('');
- name.after(input);
- }
- name.hide();
- input.focus();
- },
- 'blur input[type=text]': function (event, template) {
- // commit the change to the name, if any
- var input = template.$('input');
- input.hide();
- template.$('.name').show();
- // TODO - what is the collection here? We'll hard-code for now.
- // https://github.com/meteor/meteor/issues/3303
- if (this.name !== input.val() && this.name !== '')
- Attributes.update(this._id, {$set: {name: input.val()}});
- },
- 'keydown input[type=text]': function (event, template) {
- if (event.which === 27) {
- // ESC - discard edits and keep existing value
- template.$('input').val(this.name);
- event.preventDefault();
- event.target.blur();
- } else if (event.which === 13) {
- // ENTER
- event.preventDefault();
- event.target.blur();
- }
- }
-});
-
-// you can add events to all Sortable template instances
-Template.sortable.events({
- 'click .close': function (event, template) {
- // `this` is the data context set by the enclosing block helper (#each, here)
- template.collection.remove(this._id);
- // custom code, working on a specific collection
- if (Attributes.find().count() === 0) {
- Meteor.setTimeout(function () {
- Attributes.insert({
- name: 'Not nice to delete the entire list! Add some attributes instead.',
- type: 'String',
- order: 0
- })
- }, 1000);
- }
- }
-});
diff --git a/meteor/example/model.js b/meteor/example/model.js
deleted file mode 100644
index 8ae88226a..000000000
--- a/meteor/example/model.js
+++ /dev/null
@@ -1,2 +0,0 @@
-Types = new Mongo.Collection('types');
-Attributes = new Mongo.Collection('attributes');
diff --git a/meteor/example/run.bat b/meteor/example/run.bat
deleted file mode 100755
index a6d845af5..000000000
--- a/meteor/example/run.bat
+++ /dev/null
@@ -1,4 +0,0 @@
-mklink ..\..\package.js "meteor/package.js"
-mklink package.json "../../package.json"
-meteor run
-del ..\..\package.js package.json
diff --git a/meteor/example/run.sh b/meteor/example/run.sh
deleted file mode 100755
index aab44abf2..000000000
--- a/meteor/example/run.sh
+++ /dev/null
@@ -1,15 +0,0 @@
-# sanity check: make sure we're in the root directory of the example
-cd "$( dirname "$0" )"
-
-# delete temp files even if Ctrl+C is pressed
-int_trap() {
- echo "Cleaning up..."
-}
-trap int_trap INT
-
-ln -s "meteor/package.js" ../../package.js 2>/dev/null
-ln -s "../../package.json" package.json 2>/dev/null
-
-meteor run "$@"
-
-rm ../../package.js package.json
diff --git a/meteor/example/server/fixtures.js b/meteor/example/server/fixtures.js
deleted file mode 100644
index 617acf948..000000000
--- a/meteor/example/server/fixtures.js
+++ /dev/null
@@ -1,75 +0,0 @@
-Meteor.startup(function () {
- if (Types.find().count() === 0) {
- [
- {
- name: 'String',
- icon: ''
- },
- {
- name: 'Text, multi-line',
- icon: ''
- },
- {
- name: 'Category',
- icon: ''
- },
- {
- name: 'Number',
- icon: ''
- },
- {
- name: 'Date',
- icon: ''
- },
- {
- name: 'Hyperlink',
- icon: ''
- },
- {
- name: 'Image',
- icon: ''
- },
- {
- name: 'Progress',
- icon: ''
- },
- {
- name: 'Duration',
- icon: ''
- },
- {
- name: 'Map address',
- icon: ''
- },
- {
- name: 'Relationship',
- icon: ''
- }
- ].forEach(function (type, i) {
- Types.insert({
- name: type.name,
- icon: type.icon,
- order: i
- });
- }
- );
- console.log('Initialized attribute types.');
- }
-
- if (Attributes.find().count() === 0) {
- [
- { name: 'Name', type: 'String' },
- { name: 'Created at', type: 'Date' },
- { name: 'Link', type: 'Hyperlink' },
- { name: 'Owner', type: 'Relationship' }
- ].forEach(function (attribute, i) {
- Attributes.insert({
- name: attribute.name,
- type: attribute.type,
- order: i
- });
- }
- );
- console.log('Created sample object type.');
- }
-});
diff --git a/meteor/example/server/sortable-collections.js b/meteor/example/server/sortable-collections.js
deleted file mode 100644
index 76069a592..000000000
--- a/meteor/example/server/sortable-collections.js
+++ /dev/null
@@ -1,3 +0,0 @@
-'use strict';
-
-Sortable.collections = ['attributes'];
diff --git a/meteor/methods-client.js b/meteor/methods-client.js
deleted file mode 100644
index 52f4ebec2..000000000
--- a/meteor/methods-client.js
+++ /dev/null
@@ -1,16 +0,0 @@
-'use strict';
-
-Meteor.methods({
- /**
- * Update the sortField of documents with given ids in a collection, incrementing it by incDec
- * @param {String} collectionName - name of the collection to update
- * @param {String[]} ids - array of document ids
- * @param {String} orderField - the name of the order field, usually "order"
- * @param {Number} incDec - pass 1 or -1
- */
- 'rubaxa:sortable/collection-update': function (collectionName, ids, sortField, incDec) {
- var selector = {_id: {$in: ids}}, modifier = {$inc: {}};
- modifier.$inc[sortField] = incDec;
- Mongo.Collection.get(collectionName).update(selector, modifier, {multi: true});
- }
-});
diff --git a/meteor/methods-server.js b/meteor/methods-server.js
deleted file mode 100644
index 9598bfc99..000000000
--- a/meteor/methods-server.js
+++ /dev/null
@@ -1,31 +0,0 @@
-'use strict';
-
-Sortable = {};
-Sortable.collections = []; // array of collection names that the client is allowed to reorder
-
-Meteor.methods({
- /**
- * Update the sortField of documents with given ids in a collection, incrementing it by incDec
- * @param {String} collectionName - name of the collection to update
- * @param {String[]} ids - array of document ids
- * @param {String} orderField - the name of the order field, usually "order"
- * @param {Number} incDec - pass 1 or -1
- */
- 'rubaxa:sortable/collection-update': function (collectionName, ids, sortField, incDec) {
- check(collectionName, String);
- // don't allow the client to modify just any collection
- if (!Sortable || !Array.isArray(Sortable.collections)) {
- throw new Meteor.Error(500, 'Please define Sortable.collections');
- }
- if (Sortable.collections.indexOf(collectionName) === -1) {
- throw new Meteor.Error(403, 'Collection <' + collectionName + '> is not Sortable. Please add it to Sortable.collections in server code.');
- }
-
- check(ids, [String]);
- check(sortField, String);
- check(incDec, Number);
- var selector = {_id: {$in: ids}}, modifier = {$inc: {}};
- modifier.$inc[sortField] = incDec;
- Mongo.Collection.get(collectionName).update(selector, modifier, {multi: true});
- }
-});
diff --git a/meteor/package.js b/meteor/package.js
deleted file mode 100644
index 51bf04b14..000000000
--- a/meteor/package.js
+++ /dev/null
@@ -1,35 +0,0 @@
-// package metadata file for Meteor.js
-'use strict';
-
-var packageName = 'rubaxa:sortable'; // http://atmospherejs.com/rubaxa/sortable
-
-var packageJson = JSON.parse(Npm.require("fs").readFileSync('package.json'));
-
-Package.describe({
- name: packageName,
- summary: 'Sortable: reactive minimalist reorderable drag-and-drop lists on modern browsers and touch devices',
- version: packageJson.version,
- git: 'https://github.com/RubaXa/Sortable.git',
- documentation: 'meteor/README.md'
-});
-
-Package.onUse(function (api) {
- api.versionsFrom(['METEOR@0.9.0', 'METEOR@1.0']);
- api.use('templating', 'client');
- api.use('dburles:mongo-collection-instances@0.3.3'); // to watch collections getting created
- api.export('Sortable'); // exported on the server too, as a global to hold the array of sortable collections (for security)
- api.addFiles([
- 'Sortable.js',
- 'meteor/template.html', // the HTML comes first, so reactivize.js can refer to the template in it
- 'meteor/reactivize.js'
- ], 'client');
- api.addFiles('meteor/methods-client.js', 'client');
- api.addFiles('meteor/methods-server.js', 'server');
-});
-
-Package.onTest(function (api) {
- api.use(packageName, 'client');
- api.use('tinytest', 'client');
-
- api.addFiles('meteor/test.js', 'client');
-});
diff --git a/meteor/publish.sh b/meteor/publish.sh
deleted file mode 100755
index 56cd665ef..000000000
--- a/meteor/publish.sh
+++ /dev/null
@@ -1,40 +0,0 @@
-#!/bin/bash
-# Publish package to Meteor's repository, Atmospherejs.com
-
-# Make sure Meteor is installed, per https://www.meteor.com/install.
-# The curl'ed script is totally safe; takes 2 minutes to read its source and check.
-type meteor >/dev/null 2>&1 || { curl https://install.meteor.com/ | sh; }
-
-# sanity check: make sure we're in the root directory of the checkout
-cd "$( dirname "$0" )/.."
-
-ALL_EXIT_CODE=0
-
-# test any package*.js packages we may have, e.g. package.js, package-compat.js
-for PACKAGE_FILE in meteor/package*.js; do
-
- # Meteor expects package.js to be in the root directory of the checkout, so copy there our package file under that name, temporarily
- cp $PACKAGE_FILE ./package.js
-
- # publish package, creating it if it's the first time we're publishing
- PACKAGE_NAME=$(grep -i name package.js | head -1 | cut -d "'" -f 2)
-
- echo "Publishing $PACKAGE_NAME..."
-
- # Attempt to re-publish the package - the most common operation once the initial release has
- # been made. If the package name was changed (rare), you'll have to pass the --create flag.
- meteor publish "$@"; EXIT_CODE=$?
- ALL_EXIT_CODE=$(( $ALL_EXIT_CODE + $EXIT_CODE ))
- if (( $EXIT_CODE == 0 )); then
- echo "Thanks for releasing a new version. You can see it at"
- echo "https://atmospherejs.com/${PACKAGE_NAME/://}"
- else
- echo "We got an error. Please post it at https://github.com/raix/Meteor-community-discussions/issues/14"
- fi
-
- # rm the temporary build files and package.js
- rm -rf ".build.$PACKAGE_NAME" versions.json package.js
-
-done
-
-exit $ALL_EXIT_CODE
diff --git a/meteor/reactivize.js b/meteor/reactivize.js
deleted file mode 100644
index a068a5ebb..000000000
--- a/meteor/reactivize.js
+++ /dev/null
@@ -1,201 +0,0 @@
-/*
-Make a Sortable reactive by binding it to a Mongo.Collection.
-Calls `rubaxa:sortable/collection-update` on the server to update the sortField of affected records.
-
-TODO:
- * supply consecutive values if the `order` field doesn't have any
- * .get(DOMElement) - return the Sortable object of a DOMElement
- * create a new _id automatically onAdd if the event.from list had pull: 'clone'
- * support arrays
- * sparse arrays
- * tests
- * drop onto existing empty lists
- * insert back into lists emptied by dropping
- * performance on dragging into long list at the beginning
- * handle failures on Collection operations, e.g. add callback to .insert
- * when adding elements, update ranks just for the half closer to the start/end of the list
- * revisit http://programmers.stackexchange.com/questions/266451/maintain-ordered-collection-by-updating-as-few-order-fields-as-possible
- * reproduce the insidious bug where the list isn't always sorted (fiddle with dragging #1 over #2, then back, then #N before #1)
-
- */
-
-'use strict';
-
-Template.sortable.created = function () {
- var templateInstance = this;
- // `this` is a template instance that can store properties of our choice - http://docs.meteor.com/#/full/template_inst
- if (templateInstance.setupDone) return; // paranoid: only run setup once
- // this.data is the data context - http://docs.meteor.com/#/full/template_data
- // normalize all options into templateInstance.options, and remove them from .data
- templateInstance.options = templateInstance.data.options || {};
- Object.keys(templateInstance.data).forEach(function (key) {
- if (key === 'options' || key === 'items') return;
- templateInstance.options[key] = templateInstance.data[key];
- delete templateInstance.data[key];
- });
- templateInstance.options.sortField = templateInstance.options.sortField || 'order';
- // We can get the collection via the .collection property of the cursor, but changes made that way
- // will NOT be sent to the server - https://github.com/meteor/meteor/issues/3271#issuecomment-66656257
- // Thus we need to use dburles:mongo-collection-instances to get a *real* collection
- if (templateInstance.data.items && templateInstance.data.items.collection) {
- // cursor passed via items=; its .collection works client-only and has a .name property
- templateInstance.collectionName = templateInstance.data.items.collection.name;
- templateInstance.collection = Mongo.Collection.get(templateInstance.collectionName);
- } else if (templateInstance.data.items) {
- // collection passed via items=; does NOT have a .name property, but _name
- templateInstance.collection = templateInstance.data.items;
- templateInstance.collectionName = templateInstance.collection._name;
- } else if (templateInstance.data.collection) {
- // cursor passed directly
- templateInstance.collectionName = templateInstance.data.collection.name;
- templateInstance.collection = Mongo.Collection.get(templateInstance.collectionName);
- } else {
- templateInstance.collection = templateInstance.data; // collection passed directly
- templateInstance.collectionName = templateInstance.collection._name;
- }
-
- // TODO if (Array.isArray(templateInstance.collection))
-
- // What if user filters some of the items in the cursor, instead of ordering the entire collection?
- // Use case: reorder by preference movies of a given genre, a filter within all movies.
- // A: Modify all intervening items **that are on the client**, to preserve the overall order
- // TODO: update *all* orders via a server method that takes not ids, but start & end elements - mild security risk
- delete templateInstance.data.options;
-
- /**
- * When an element was moved, adjust its orders and possibly the order of
- * other elements, so as to maintain a consistent and correct order.
- *
- * There are three approaches to this:
- * 1) Using arbitrary precision arithmetic and setting only the order of the moved
- * element to the average of the orders of the elements around it -
- * http://programmers.stackexchange.com/questions/266451/maintain-ordered-collection-by-updating-as-few-order-fields-as-possible
- * The downside is that the order field in the DB will increase by one byte every
- * time an element is reordered.
- * 2) Adjust the orders of the intervening items. This keeps the orders sane (integers)
- * but is slower because we have to modify multiple documents.
- * TODO: we may be able to update fewer records by only altering the
- * order of the records between the newIndex/oldIndex and the start/end of the list.
- * 3) Use regular precision arithmetic, but when the difference between the orders of the
- * moved item and the one before/after it falls below a certain threshold, adjust
- * the order of that other item, and cascade doing so up or down the list.
- * This will keep the `order` field constant in size, and will only occasionally
- * require updating the `order` of other records.
- *
- * For now, we use approach #2.
- *
- * @param {String} itemId - the _id of the item that was moved
- * @param {Number} orderPrevItem - the order of the item before it, or null
- * @param {Number} orderNextItem - the order of the item after it, or null
- */
- templateInstance.adjustOrders = function adjustOrders(itemId, orderPrevItem, orderNextItem) {
- var orderField = templateInstance.options.sortField;
- var selector = {}, modifier = {$set: {}};
- var ids = [];
- var startOrder = templateInstance.collection.findOne(itemId)[orderField];
- if (orderPrevItem !== null) {
- // Element has a previous sibling, therefore it was moved down in the list.
- // Decrease the order of intervening elements.
- selector[orderField] = {$lte: orderPrevItem, $gt: startOrder};
- ids = _.pluck(templateInstance.collection.find(selector, {fields: {_id: 1}}).fetch(), '_id');
- Meteor.call('rubaxa:sortable/collection-update', templateInstance.collectionName, ids, orderField, -1);
-
- // Set the order of the dropped element to the order of its predecessor, whose order was decreased
- modifier.$set[orderField] = orderPrevItem;
- } else {
- // element moved up the list, increase order of intervening elements
- selector[orderField] = {$gte: orderNextItem, $lt: startOrder};
- ids = _.pluck(templateInstance.collection.find(selector, {fields: {_id: 1}}).fetch(), '_id');
- Meteor.call('rubaxa:sortable/collection-update', templateInstance.collectionName, ids, orderField, 1);
-
- // Set the order of the dropped element to the order of its successor, whose order was increased
- modifier.$set[orderField] = orderNextItem;
- }
- templateInstance.collection.update(itemId, modifier);
- };
-
- templateInstance.setupDone = true;
-};
-
-
-Template.sortable.rendered = function () {
- var templateInstance = this;
- var orderField = templateInstance.options.sortField;
-
- // sorting was changed within the list
- var optionsOnUpdate = templateInstance.options.onUpdate;
- templateInstance.options.onUpdate = function sortableUpdate(/**Event*/event) {
- var itemEl = event.item; // dragged HTMLElement
- event.data = Blaze.getData(itemEl);
- if (event.newIndex < event.oldIndex) {
- // Element moved up in the list. The dropped element has a next sibling for sure.
- var orderNextItem = Blaze.getData(itemEl.nextElementSibling)[orderField];
- templateInstance.adjustOrders(event.data._id, null, orderNextItem);
- } else if (event.newIndex > event.oldIndex) {
- // Element moved down in the list. The dropped element has a previous sibling for sure.
- var orderPrevItem = Blaze.getData(itemEl.previousElementSibling)[orderField];
- templateInstance.adjustOrders(event.data._id, orderPrevItem, null);
- } else {
- // do nothing - drag and drop in the same location
- }
- if (optionsOnUpdate) optionsOnUpdate(event);
- };
-
- // element was added from another list
- var optionsOnAdd = templateInstance.options.onAdd;
- templateInstance.options.onAdd = function sortableAdd(/**Event*/event) {
- var itemEl = event.item; // dragged HTMLElement
- event.data = Blaze.getData(itemEl);
- // let the user decorate the object with additional properties before insertion
- if (optionsOnAdd) optionsOnAdd(event);
-
- // Insert the new element at the end of the list and move it where it was dropped.
- // We could insert it at the beginning, but that would lead to negative orders.
- var sortSpecifier = {}; sortSpecifier[orderField] = -1;
- event.data.order = templateInstance.collection.findOne({}, { sort: sortSpecifier, limit: 1 }).order + 1;
- // TODO: this can obviously be optimized by setting the order directly as the arithmetic average, with the caveats described above
- var newElementId = templateInstance.collection.insert(event.data);
- event.data._id = newElementId;
- if (itemEl.nextElementSibling) {
- var orderNextItem = Blaze.getData(itemEl.nextElementSibling)[orderField];
- templateInstance.adjustOrders(newElementId, null, orderNextItem);
- } else {
- // do nothing - inserted after the last element
- }
- // remove the dropped HTMLElement from the list because we have inserted it in the collection, which will update the template
- itemEl.parentElement.removeChild(itemEl);
- };
-
- // element was removed by dragging into another list
- var optionsOnRemove = templateInstance.options.onRemove;
- templateInstance.options.onRemove = function sortableRemove(/**Event*/event) {
- var itemEl = event.item; // dragged HTMLElement
- event.data = Blaze.getData(itemEl);
- // don't remove from the collection if group.pull is clone or false
- if (typeof templateInstance.options.group === 'undefined'
- || typeof templateInstance.options.group.pull === 'undefined'
- || templateInstance.options.group.pull === true
- ) templateInstance.collection.remove(event.data._id);
- if (optionsOnRemove) optionsOnRemove(event);
- };
-
- // just compute the `data` context
- ['onStart', 'onEnd', 'onSort', 'onFilter'].forEach(function (eventHandler) {
- if (templateInstance.options[eventHandler]) {
- var userEventHandler = templateInstance.options[eventHandler];
- templateInstance.options[eventHandler] = function (/**Event*/event) {
- var itemEl = event.item; // dragged HTMLElement
- event.data = Blaze.getData(itemEl);
- userEventHandler(event);
- };
- }
- });
-
- templateInstance.sortable = Sortable.create(templateInstance.firstNode.parentElement, templateInstance.options);
- // TODO make the object accessible, e.g. via Sortable.getSortableById() or some such
-};
-
-
-Template.sortable.destroyed = function () {
- this.sortable.destroy();
-};
diff --git a/meteor/runtests.sh b/meteor/runtests.sh
deleted file mode 100755
index 94aaecf05..000000000
--- a/meteor/runtests.sh
+++ /dev/null
@@ -1,46 +0,0 @@
-#!/bin/sh
-# Test Meteor package before publishing to Atmospherejs.com
-
-# Make sure Meteor is installed, per https://www.meteor.com/install.
-# The curl'ed script is totally safe; takes 2 minutes to read its source and check.
-type meteor >/dev/null 2>&1 || { curl https://install.meteor.com/ | sh; }
-
-# sanity check: make sure we're in the root directory of the checkout
-cd "$( dirname "$0" )/.."
-
-
-# delete the temporary files even if Ctrl+C is pressed
-int_trap() {
- printf "\nTests interrupted. Cleaning up...\n\n"
-}
-trap int_trap INT
-
-
-ALL_EXIT_CODE=0
-
-# test any package*.js packages we may have, e.g. package.js, package-standalone.js
-for PACKAGE_FILE in meteor/package*.js; do
-
- # Meteor expects package.js in the root dir of the checkout, so copy there our package file under that name, temporarily
- cp $PACKAGE_FILE ./package.js
-
- PACKAGE_NAME=$(grep -i name package.js | head -1 | cut -d "'" -f 2)
-
- echo "### Testing $PACKAGE_NAME..."
-
- # provide an invalid MONGO_URL so Meteor doesn't bog us down with an empty Mongo database
- if [ $# -gt 0 ]; then
- # interpret any parameter to mean we want an interactive test
- MONGO_URL=mongodb:// meteor test-packages ./
- else
- # automated/CI test with phantomjs
- ./node_modules/.bin/spacejam --mongo-url mongodb:// test-packages ./
- ALL_EXIT_CODES=$(( $ALL_EXIT_CODES + $? ))
- fi
-
- # delete temporary build files and package.js
- rm -rf .build.* versions.json package.js
-
-done
-
-exit $ALL_EXIT_CODES
diff --git a/meteor/template.html b/meteor/template.html
deleted file mode 100644
index 3923d3d9c..000000000
--- a/meteor/template.html
+++ /dev/null
@@ -1,5 +0,0 @@
-
- {{#each items}}
- {{> Template.contentBlock this}}
- {{/each}}
-
diff --git a/meteor/test.js b/meteor/test.js
deleted file mode 100644
index f7c00a9fb..000000000
--- a/meteor/test.js
+++ /dev/null
@@ -1,9 +0,0 @@
-'use strict';
-
-Tinytest.add('Sortable.is', function (test) {
- var items = document.createElement('ul');
- items.innerHTML = 'item 1 item 2 item 3 ';
- var sortable = new Sortable(items);
- test.instanceOf(sortable, Sortable, 'Instantiation OK');
- test.length(sortable.toArray(), 3, 'Three elements');
-});
diff --git a/ng-sortable.js b/ng-sortable.js
deleted file mode 100644
index 4f0b8c58f..000000000
--- a/ng-sortable.js
+++ /dev/null
@@ -1,185 +0,0 @@
-/**
- * @author RubaXa
- * @licence MIT
- */
-(function (factory) {
- 'use strict';
-
- if (window.angular && window.Sortable) {
- factory(angular, Sortable);
- }
- else if (typeof define === 'function' && define.amd) {
- define(['angular', './Sortable'], factory);
- }
-})(function (angular, Sortable) {
- 'use strict';
-
-
- /**
- * @typedef {Object} ngSortEvent
- * @property {*} model List item
- * @property {Object|Array} models List of items
- * @property {number} oldIndex before sort
- * @property {number} newIndex after sort
- */
-
-
- angular.module('ng-sortable', [])
- .constant('ngSortableVersion', '0.3.7')
- .constant('ngSortableConfig', {})
- .directive('ngSortable', ['$parse', 'ngSortableConfig', function ($parse, ngSortableConfig) {
- var removed,
- nextSibling;
-
- function getSource(el) {
- var scope = angular.element(el).scope();
- var ngRepeat = [].filter.call(el.childNodes, function (node) {
- return (
- (node.nodeType === 8) &&
- (node.nodeValue.indexOf('ngRepeat:') !== -1)
- );
- })[0];
-
- if (!ngRepeat) {
- // Without ng-repeat
- return null;
- }
-
- // tests: http://jsbin.com/kosubutilo/1/edit?js,output
- ngRepeat = ngRepeat.nodeValue.match(/ngRepeat:\s*(?:\(.*?,\s*)?([^\s)]+)[\s)]+in\s+([^\s|]+)/);
-
- var itemExpr = $parse(ngRepeat[1]);
- var itemsExpr = $parse(ngRepeat[2]);
-
- return {
- item: function (el) {
- return itemExpr(angular.element(el).scope());
- },
- items: function () {
- return itemsExpr(scope);
- }
- };
- }
-
-
- // Export
- return {
- restrict: 'AC',
- scope: { ngSortable: "=?" },
- link: function (scope, $el, attrs) {
- var el = $el[0],
- options = angular.extend(scope.ngSortable || {}, ngSortableConfig),
- source = getSource(el),
- watchers = [],
- sortable
- ;
-
-
- function _emitEvent(/**Event*/evt, /*Mixed*/item) {
- var name = 'on' + evt.type.charAt(0).toUpperCase() + evt.type.substr(1);
-
- /* jshint expr:true */
- options[name] && options[name]({
- model: item || source && source.item(evt.item),
- models: source && source.items(),
- oldIndex: evt.oldIndex,
- newIndex: evt.newIndex
- });
- }
-
-
- function _sync(/**Event*/evt) {
- if (!source) {
- // Without ng-repeat
- return;
- }
-
- var oldIndex = evt.oldIndex,
- newIndex = evt.newIndex,
- items = source.items();
-
- if (el !== evt.from) {
- var prevSource = getSource(evt.from),
- prevItems = prevSource.items();
-
- oldIndex = prevItems.indexOf(prevSource.item(evt.item));
- removed = prevItems[oldIndex];
-
- if (evt.clone) {
- evt.from.removeChild(evt.clone);
- removed = angular.copy(removed);
- }
- else {
- prevItems.splice(oldIndex, 1);
- }
-
- items.splice(newIndex, 0, removed);
-
- evt.from.insertBefore(evt.item, nextSibling); // revert element
- }
- else {
- items.splice(newIndex, 0, items.splice(oldIndex, 1)[0]);
- }
-
- scope.$apply();
- }
-
-
- sortable = Sortable.create(el, Object.keys(options).reduce(function (opts, name) {
- opts[name] = opts[name] || options[name];
- return opts;
- }, {
- onStart: function (/**Event*/evt) {
- nextSibling = evt.item.nextSibling;
- _emitEvent(evt);
- scope.$apply();
- },
- onEnd: function (/**Event*/evt) {
- _emitEvent(evt, removed);
- scope.$apply();
- },
- onAdd: function (/**Event*/evt) {
- _sync(evt);
- _emitEvent(evt, removed);
- scope.$apply();
- },
- onUpdate: function (/**Event*/evt) {
- _sync(evt);
- _emitEvent(evt);
- },
- onRemove: function (/**Event*/evt) {
- _emitEvent(evt, removed);
- },
- onSort: function (/**Event*/evt) {
- _emitEvent(evt);
- }
- }));
-
- $el.on('$destroy', function () {
- angular.forEach(watchers, function (/** Function */unwatch) {
- unwatch();
- });
- sortable.destroy();
- watchers = null;
- sortable = null;
- nextSibling = null;
- });
-
- angular.forEach([
- 'sort', 'disabled', 'draggable', 'handle', 'animation',
- 'onStart', 'onEnd', 'onAdd', 'onUpdate', 'onRemove', 'onSort'
- ], function (name) {
- watchers.push(scope.$watch('ngSortable.' + name, function (value) {
- if (value !== void 0) {
- options[name] = value;
-
- if (!/^on[A-Z]/.test(name)) {
- sortable.option(name, value);
- }
- }
- }));
- });
- }
- };
- }]);
-});
diff --git a/package.json b/package.json
deleted file mode 100644
index 2a1c170af..000000000
--- a/package.json
+++ /dev/null
@@ -1,41 +0,0 @@
-{
- "name": "sortablejs",
- "exportName": "Sortable",
- "version": "1.2.1",
- "devDependencies": {
- "grunt": "*",
- "grunt-version": "*",
- "grunt-exec": "*",
- "grunt-contrib-jshint": "0.9.2",
- "grunt-contrib-uglify": "*",
- "spacejam": "*"
- },
- "description": "Minimalist JavaScript library for reorderable drag-and-drop lists on modern browsers and touch devices. No jQuery. Supports AngularJS and any CSS library, e.g. Bootstrap.",
- "main": "Sortable.js",
- "scripts": {
- "test": "grunt"
- },
- "repository": {
- "type": "git",
- "url": "git://github.com/rubaxa/Sortable.git"
- },
- "keywords": [
- "sortable",
- "reorder",
- "drag",
- "meteor",
- "angular",
- "ng-sortable",
- "react",
- "mixin"
- ],
- "author": "Konstantin Lebedev ",
- "license": "MIT",
- "spm": {
- "main": "Sortable.js",
- "ignore": [
- "meteor",
- "st"
- ]
- }
-}
diff --git a/react-sortable-mixin.js b/react-sortable-mixin.js
deleted file mode 100644
index 56ae93da7..000000000
--- a/react-sortable-mixin.js
+++ /dev/null
@@ -1,157 +0,0 @@
-/**
- * @author RubaXa
- * @licence MIT
- */
-
-(function (factory) {
- 'use strict';
-
- if (typeof module != 'undefined' && typeof module.exports != 'undefined') {
- module.exports = factory(require('./Sortable'));
- }
- else if (typeof define === 'function' && define.amd) {
- define(['./Sortable'], factory);
- }
- else {
- /* jshint sub:true */
- window['SortableMixin'] = factory(Sortable);
- }
-})(function (/** Sortable */Sortable) {
- 'use strict';
-
- var _nextSibling;
-
- var _activeComponent;
-
- var _defaultOptions = {
- ref: 'list',
- model: 'items',
-
- animation: 100,
- onStart: 'handleStart',
- onEnd: 'handleEnd',
- onAdd: 'handleAdd',
- onUpdate: 'handleUpdate',
- onRemove: 'handleRemove',
- onSort: 'handleSort',
- onFilter: 'handleFilter'
- };
-
-
- function _getModelName(component) {
- return component.sortableOptions && component.sortableOptions.model || _defaultOptions.model;
- }
-
-
- function _getModelItems(component) {
- var name = _getModelName(component),
- items = component.state && component.state[name] || component.props[name];
-
- return items.slice();
- }
-
-
- function _extend(dst, src) {
- for (var key in src) {
- if (src.hasOwnProperty(key)) {
- dst[key] = src[key];
- }
- }
-
- return dst;
- }
-
-
- /**
- * Simple and easy mixin-wrapper for rubaxa/Sortable library, in order to
- * make reorderable drag-and-drop lists on modern browsers and touch devices.
- *
- * @mixin
- */
- var SortableMixin = {
- sortableMixinVersion: '0.1.0',
-
-
- /**
- * @type {Sortable}
- * @private
- */
- _sortableInstance: null,
-
-
- componentDidMount: function () {
- var options = _extend(_extend({}, _defaultOptions), this.sortableOptions || {}),
- copyOptions = _extend({}, options),
-
- emitEvent = function (/** string */type, /** Event */evt) {
- var method = this[options[type]];
- method && method.call(this, evt, this._sortableInstance);
- }.bind(this);
-
-
- // Bind callbacks so that "this" refers to the component
- 'onStart onEnd onAdd onSort onUpdate onRemove onFilter'.split(' ').forEach(function (/** string */name) {
- copyOptions[name] = function (evt) {
- if (name === 'onStart') {
- _nextSibling = evt.item.nextElementSibling;
- _activeComponent = this;
- }
- else if (name === 'onAdd' || name === 'onUpdate') {
- evt.from.insertBefore(evt.item, _nextSibling);
-
- var newState = {},
- remoteState = {},
- oldIndex = evt.oldIndex,
- newIndex = evt.newIndex,
- items = _getModelItems(this),
- remoteItems,
- item;
-
- if (name === 'onAdd') {
- remoteItems = _getModelItems(_activeComponent);
- item = remoteItems.splice(oldIndex, 1)[0];
- items.splice(newIndex, 0, item);
-
- remoteState[_getModelName(_activeComponent)] = remoteItems;
- }
- else {
- items.splice(newIndex, 0, items.splice(oldIndex, 1)[0]);
- }
-
- newState[_getModelName(this)] = items;
- this.setState(newState);
- (this !== _activeComponent) && _activeComponent.setState(remoteState);
- }
-
- setTimeout(function () {
- emitEvent(name, evt);
- }, 0);
- }.bind(this);
- }, this);
-
-
- /** @namespace this.refs — http://facebook.github.io/react/docs/more-about-refs.html */
- this._sortableInstance = Sortable.create((this.refs[options.ref] || this).getDOMNode(), copyOptions);
- },
-
- componentWillReceiveProps: function (nextProps) {
- var newState = {},
- modelName = _getModelName(this),
- items = nextProps[modelName];
-
- if (items) {
- newState[modelName] = items;
- this.setState(newState);
- }
- },
-
- componentWillUnmount: function () {
- this._sortableInstance.destroy();
- this._sortableInstance = null;
- }
- };
-
-
- // Export
- return SortableMixin;
-});
diff --git a/st/app.css b/st/app.css
deleted file mode 100644
index 6a97f8e49..000000000
--- a/st/app.css
+++ /dev/null
@@ -1,239 +0,0 @@
-html {
- background-image: -webkit-linear-gradient(bottom, #F4E2C9 20%, #F4D7C9 100%);
- background-image: -ms-linear-gradient(bottom, #F4E2C9 20%, #F4D7C9 100%);
- background-image: linear-gradient(to bottom, #F4E2C9 20%, #F4D7C9 100%);
-}
-
-html, body {
- margin: 0;
- padding: 0;
- position: relative;
- color: #464637;
- min-height: 100%;
- font-size: 20px;
- font-family: 'Roboto', sans-serif;
- font-weight: 300;
-}
-
-
-h1 {
- color: #FF3F00;
- font-size: 20px;
- font-family: 'Roboto', sans-serif;
- font-weight: 300;
- text-align: center;
-}
-
-
-ul {
- margin: 0;
- padding: 0;
- list-style: none;
-}
-
-.container {
- width: 80%;
- margin: auto;
- min-width: 1100px;
- max-width: 1300px;
- position: relative;
-}
-
-@media (min-width: 750px) and (max-width: 970px){
- .container {
- width: 100%;
- min-width: 750px;
- }
-}
-
-
-.sortable-ghost {
- opacity: .2;
-}
-
-
-img {
- border: 0;
- vertical-align: middle;
-}
-
-
-.logo {
- top: 55px;
- left: 30px;
- position: absolute;
-}
-
-
-.title {
- color: #fff;
- padding: 3px 10px;
- display: inline-block;
- position: relative;
- background-color: #FF7373;
- z-index: 1000;
-}
- .title_xl {
- padding: 3px 15px;
- font-size: 40px;
- }
-
-
-
-.tile {
- width: 22%;
- min-width: 245px;
- color: #FF7270;
- padding: 10px 30px;
- text-align: center;
- margin-top: 15px;
- margin-left: 5px;
- margin-right: 30px;
- background-color: #fff;
- display: inline-block;
- vertical-align: top;
-}
- .tile__name {
- cursor: move;
- padding-bottom: 10px;
- border-bottom: 1px solid #FF7373;
- }
-
- .tile__list {
- margin-top: 10px;
- }
- .tile__list:last-child {
- margin-right: 0;
- min-height: 80px;
- }
-
- .tile__list img {
- cursor: move;
- margin: 10px;
- border-radius: 100%;
- }
-
-
-
-.block {
- opacity: 1;
- position: absolute;
-}
- .block__list {
- padding: 20px 0;
- max-width: 360px;
- margin-top: -8px;
- margin-left: 5px;
- background-color: #fff;
- }
- .block__list-title {
- margin: -20px 0 0;
- padding: 10px;
- text-align: center;
- background: #5F9EDF;
- }
- .block__list li { cursor: move; }
-
- .block__list_words li {
- background-color: #fff;
- padding: 10px 40px;
- }
- .block__list_words .sortable-ghost {
- opacity: 0.4;
- background-color: #F4E2C9;
- }
-
- .block__list_words li:first-letter {
- text-transform: uppercase;
- }
-
- .block__list_tags {
- padding-left: 30px;
- }
-
- .block__list_tags:after {
- clear: both;
- content: '';
- display: block;
- }
- .block__list_tags li {
- color: #fff;
- float: left;
- margin: 8px 20px 10px 0;
- padding: 5px 10px;
- min-width: 10px;
- background-color: #5F9EDF;
- text-align: center;
- }
- .block__list_tags li:first-child:first-letter {
- text-transform: uppercase;
- }
-
-
-
-#editable {}
- #editable li {
- position: relative;
- }
-
- #editable i {
- -webkit-transition: opacity .2s;
- transition: opacity .2s;
- opacity: 0;
- display: block;
- cursor: pointer;
- color: #c00;
- top: 10px;
- right: 40px;
- position: absolute;
- font-style: normal;
- }
-
- #editable li:hover i {
- opacity: 1;
- }
-
-
-#filter {}
- #filter button {
- color: #fff;
- width: 100%;
- border: none;
- outline: 0;
- opacity: .5;
- margin: 10px 0 0;
- transition: opacity .1s ease;
- cursor: pointer;
- background: #5F9EDF;
- padding: 10px 0;
- font-size: 20px;
- }
- #filter button:hover {
- opacity: 1;
- }
-
- #filter .block__list {
- padding-bottom: 0;
- }
-
-.drag-handle {
- margin-right: 10px;
- font: bold 20px Sans-Serif;
- color: #5F9EDF;
- display: inline-block;
- cursor: move;
- cursor: -webkit-grabbing; /* overrides 'move' */
-}
-
-#todos input {
- padding: 5px;
- font-size: 14px;
- font-family: 'Roboto', sans-serif;
- font-weight: 300;
-}
-
-
-
-#nested ul li {
- background-color: rgba(0,0,0,.05);
-}
diff --git a/st/app.js b/st/app.js
index 164270d9a..7316b90e7 100644
--- a/st/app.js
+++ b/st/app.js
@@ -1,226 +1,223 @@
-(function () {
- 'use strict';
+var example1 = document.getElementById('example1'),
+ example2Left = document.getElementById('example2-left'),
+ example2Right = document.getElementById('example2-right'),
+ example3Left = document.getElementById('example3-left'),
+ example3Right = document.getElementById('example3-right'),
+ example4Left = document.getElementById('example4-left'),
+ example4Right = document.getElementById('example4-right'),
+ example5 = document.getElementById('example5'),
+ example6 = document.getElementById('example6'),
+ example7 = document.getElementById('example7'),
+ gridDemo = document.getElementById('gridDemo'),
+ multiDragDemo = document.getElementById('multiDragDemo'),
+ swapDemo = document.getElementById('swapDemo');
+
+// Example 1 - Simple list
+new Sortable(example1, {
+ animation: 150,
+ ghostClass: 'blue-background-class'
+});
+
+
+// Example 2 - Shared lists
+new Sortable(example2Left, {
+ group: 'shared', // set both lists to same group
+ animation: 150
+});
+
+new Sortable(example2Right, {
+ group: 'shared',
+ animation: 150
+});
+
+// Example 3 - Cloning
+new Sortable(example3Left, {
+ group: {
+ name: 'shared',
+ pull: 'clone' // To clone: set pull to 'clone'
+ },
+ animation: 150
+});
- var byId = function (id) { return document.getElementById(id); },
+new Sortable(example3Right, {
+ group: {
+ name: 'shared',
+ pull: 'clone'
+ },
+ animation: 150
+});
- loadScripts = function (desc, callback) {
- var deps = [], key, idx = 0;
- for (key in desc) {
- deps.push(key);
- }
+// Example 4 - No Sorting
+new Sortable(example4Left, {
+ group: {
+ name: 'shared',
+ pull: 'clone',
+ put: false // Do not allow items to be put into this list
+ },
+ animation: 150,
+ sort: false // To disable sorting: set sort to false
+});
- (function _next() {
- var pid,
- name = deps[idx],
- script = document.createElement('script');
+new Sortable(example4Right, {
+ group: 'shared',
+ animation: 150
+});
- script.type = 'text/javascript';
- script.src = desc[deps[idx]];
- pid = setInterval(function () {
- if (window[name]) {
- clearTimeout(pid);
+// Example 5 - Handle
+new Sortable(example5, {
+ handle: '.handle', // handle class
+ animation: 150
+});
- deps[idx++] = window[name];
+// Example 6 - Filter
+new Sortable(example6, {
+ filter: '.filtered',
+ animation: 150
+});
- if (deps[idx]) {
- _next();
- } else {
- callback.apply(null, deps);
- }
- }
- }, 30);
+// Example 7 - Thresholds
+var example7Sortable = new Sortable(example7, {
+ animation: 150
+});
- document.getElementsByTagName('head')[0].appendChild(script);
- })()
- },
- console = window.console;
+var example7SwapThreshold = 1;
+var example7SwapThresholdInput = document.getElementById('example7SwapThresholdInput');
+var example7SwapThresholdCode = document.getElementById('example7SwapThresholdCode');
+var example7SwapThresholdIndicators = [].slice.call(document.querySelectorAll('.swap-threshold-indicator'));
+var example7InvertSwapInput = document.getElementById('example7InvertSwapInput');
+var example7InvertSwapCode = document.getElementById('example7InvertSwapCode');
+var example7InvertedSwapThresholdIndicators = [].slice.call(document.querySelectorAll('.inverted-swap-threshold-indicator'));
- if (!console.log) {
- console.log = function () {
- alert([].join.apply(arguments, ' '));
- };
- }
+var example7Squares = [].slice.call(document.querySelectorAll('.square'));
+var activeIndicators = example7SwapThresholdIndicators;
- Sortable.create(byId('foo'), {
- group: "words",
- animation: 150,
- store: {
- get: function (sortable) {
- var order = localStorage.getItem(sortable.options.group);
- return order ? order.split('|') : [];
- },
- set: function (sortable) {
- var order = sortable.toArray();
- localStorage.setItem(sortable.options.group, order.join('|'));
- }
- },
- onAdd: function (evt){ console.log('onAdd.foo:', [evt.item, evt.from]); },
- onUpdate: function (evt){ console.log('onUpdate.foo:', [evt.item, evt.from]); },
- onRemove: function (evt){ console.log('onRemove.foo:', [evt.item, evt.from]); },
- onStart:function(evt){ console.log('onStart.foo:', [evt.item, evt.from]);},
- onSort:function(evt){ console.log('onStart.foo:', [evt.item, evt.from]);},
- onEnd: function(evt){ console.log('onEnd.foo:', [evt.item, evt.from]);}
- });
+var example7DirectionInput = document.getElementById('example7DirectionInput');
+var example7SizeProperty = 'width';
- Sortable.create(byId('bar'), {
- group: "words",
- animation: 150,
- onAdd: function (evt){ console.log('onAdd.bar:', evt.item); },
- onUpdate: function (evt){ console.log('onUpdate.bar:', evt.item); },
- onRemove: function (evt){ console.log('onRemove.bar:', evt.item); },
- onStart:function(evt){ console.log('onStart.foo:', evt.item);},
- onEnd: function(evt){ console.log('onEnd.foo:', evt.item);}
- });
+function renderThresholdWidth(evt) {
+ example7SwapThreshold = Number(evt.target.value);
+ example7SwapThresholdCode.innerHTML = evt.target.value.indexOf('.') > -1 ? evt.target.value.padEnd(4, '0') : evt.target.value;
+ for (var i = 0; i < activeIndicators.length; i++) {
+ activeIndicators[i].style[example7SizeProperty] = (evt.target.value * 100) /
+ (activeIndicators == example7SwapThresholdIndicators ? 1 : 2) + '%';
+ }
- // Multi groups
- Sortable.create(byId('multi'), {
- animation: 150,
- draggable: '.tile',
- handle: '.tile__name'
- });
+ example7Sortable.option('swapThreshold', example7SwapThreshold);
+}
- [].forEach.call(byId('multi').getElementsByClassName('tile__list'), function (el){
- Sortable.create(el, {
- group: 'photo',
- animation: 150
- });
- });
+example7SwapThresholdInput.addEventListener('input', renderThresholdWidth);
+example7InvertSwapInput.addEventListener('input', function(evt) {
+ example7Sortable.option('invertSwap', evt.target.checked);
- // Editable list
- var editableList = Sortable.create(byId('editable'), {
- animation: 150,
- filter: '.js-remove',
- onFilter: function (evt) {
- evt.item.parentNode.removeChild(evt.item);
- }
- });
+ for (var i = 0; i < activeIndicators.length; i++) {
+ activeIndicators[i].style.display = 'none';
+ }
- byId('addUser').onclick = function () {
- Ply.dialog('prompt', {
- title: 'Add',
- form: { name: 'name' }
- }).done(function (ui) {
- var el = document.createElement('li');
- el.innerHTML = ui.data.name + '✖';
- editableList.el.appendChild(el);
- });
- };
+ if (evt.target.checked) {
+ example7InvertSwapCode.style.display = '';
- // Advanced groups
- [{
- name: 'advanced',
- pull: true,
- put: true
- },
- {
- name: 'advanced',
- pull: 'clone',
- put: false
- }, {
- name: 'advanced',
- pull: false,
- put: true
- }].forEach(function (groupOpts, i) {
- Sortable.create(byId('advanced-' + (i + 1)), {
- sort: (i != 1),
- group: groupOpts,
- animation: 150
- });
+ activeIndicators = example7InvertedSwapThresholdIndicators;
+ } else {
+ example7InvertSwapCode.style.display = 'none';
+ activeIndicators = example7SwapThresholdIndicators;
+ }
+
+ renderThresholdWidth({
+ target: example7SwapThresholdInput
});
+ for (i = 0; i < activeIndicators.length; i++) {
+ activeIndicators[i].style.display = '';
+ }
+});
- // 'handle' option
- Sortable.create(byId('handle-1'), {
- handle: '.drag-handle',
- animation: 150
- });
+function renderDirection(evt) {
+ for (var i = 0; i < example7Squares.length; i++) {
+ example7Squares[i].style.display = evt.target.value === 'h' ? 'inline-block' : 'block';
+ }
+
+ for (i = 0; i < example7InvertedSwapThresholdIndicators.length; i++) {
+ /* jshint expr:true */
+ evt.target.value === 'h' && (example7InvertedSwapThresholdIndicators[i].style.height = '100%');
+ evt.target.value === 'v' && (example7InvertedSwapThresholdIndicators[i].style.width = '100%');
+ }
+
+ for (i = 0; i < example7SwapThresholdIndicators.length; i++) {
+ if (evt.target.value === 'h') {
+ example7SwapThresholdIndicators[i].style.height = '100%';
+ example7SwapThresholdIndicators[i].style.marginLeft = '50%';
+ example7SwapThresholdIndicators[i].style.transform = 'translateX(-50%)';
+ example7SwapThresholdIndicators[i].style.marginTop = '0';
+ } else {
+ example7SwapThresholdIndicators[i].style.width = '100%';
+ example7SwapThresholdIndicators[i].style.marginTop = '50%';
+ example7SwapThresholdIndicators[i].style.transform = 'translateY(-50%)';
- // Angular example
- angular.module('todoApp', ['ng-sortable'])
- .constant('ngSortableConfig', {onEnd: function() {
- console.log('default onEnd()');
- }})
- .controller('TodoController', ['$scope', function ($scope) {
- $scope.todos = [
- {text: 'learn angular', done: true},
- {text: 'build an angular app', done: false}
- ];
-
- $scope.addTodo = function () {
- $scope.todos.push({text: $scope.todoText, done: false});
- $scope.todoText = '';
- };
-
- $scope.remaining = function () {
- var count = 0;
- angular.forEach($scope.todos, function (todo) {
- count += todo.done ? 0 : 1;
- });
- return count;
- };
-
- $scope.archive = function () {
- var oldTodos = $scope.todos;
- $scope.todos = [];
- angular.forEach(oldTodos, function (todo) {
- if (!todo.done) $scope.todos.push(todo);
- });
- };
- }])
- .controller('TodoControllerNext', ['$scope', function ($scope) {
- $scope.todos = [
- {text: 'learn Sortable', done: true},
- {text: 'use ng-sortable', done: false},
- {text: 'Enjoy', done: false}
- ];
-
- $scope.remaining = function () {
- var count = 0;
- angular.forEach($scope.todos, function (todo) {
- count += todo.done ? 0 : 1;
- });
- return count;
- };
-
- $scope.sortableConfig = { group: 'todo', animation: 150 };
- 'Start End Add Update Remove Sort'.split(' ').forEach(function (name) {
- $scope.sortableConfig['on' + name] = console.log.bind(console, name);
- });
- }]);
-})();
-
-
-
-// Background
-document.addEventListener("DOMContentLoaded", function () {
- function setNoiseBackground(el, width, height, opacity) {
- var canvas = document.createElement("canvas");
- var context = canvas.getContext("2d");
-
- canvas.width = width;
- canvas.height = height;
-
- for (var i = 0; i < width; i++) {
- for (var j = 0; j < height; j++) {
- var val = Math.floor(Math.random() * 255);
- context.fillStyle = "rgba(" + val + "," + val + "," + val + "," + opacity + ")";
- context.fillRect(i, j, 1, 1);
- }
+ example7SwapThresholdIndicators[i].style.marginLeft = '0';
}
+ }
- el.style.background = "url(" + canvas.toDataURL("image/png") + ")";
+ if (evt.target.value === 'h') {
+ example7SizeProperty = 'width';
+ example7Sortable.option('direction', 'horizontal');
+ } else {
+ example7SizeProperty = 'height';
+ example7Sortable.option('direction', 'vertical');
}
- setNoiseBackground(document.getElementsByTagName('body')[0], 50, 50, 0.02);
-}, false);
+ renderThresholdWidth({
+ target: example7SwapThresholdInput
+ });
+}
+example7DirectionInput.addEventListener('input', renderDirection);
+
+renderDirection({
+ target: example7DirectionInput
+});
+
+
+// Grid demo
+new Sortable(gridDemo, {
+ animation: 150,
+ ghostClass: 'blue-background-class'
+});
+
+// Nested demo
+var nestedSortables = [].slice.call(document.querySelectorAll('.nested-sortable'));
+
+// Loop through each nested sortable element
+for (var i = 0; i < nestedSortables.length; i++) {
+ new Sortable(nestedSortables[i], {
+ group: 'nested',
+ animation: 150,
+ fallbackOnBody: true,
+ swapThreshold: 0.65
+ });
+}
+
+// MultiDrag demo
+new Sortable(multiDragDemo, {
+ multiDrag: true,
+ selectedClass: 'selected',
+ fallbackTolerance: 3, // So that we can select items on mobile
+ animation: 150
+});
+
+
+// Swap demo
+new Sortable(swapDemo, {
+ swap: true,
+ swapClass: 'highlight',
+ animation: 150
+});
diff --git a/st/carbon.css b/st/carbon.css
new file mode 100644
index 000000000..d82803583
--- /dev/null
+++ b/st/carbon.css
@@ -0,0 +1,147 @@
+@media (min-width: 992px) {
+ #carbonads {
+ display: block;
+ overflow: hidden;
+ padding: 10px;
+ box-shadow: 0 1px 3px hsla(0, 0%, 0%, .05);
+ border-radius: 4px;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ line-height: 1.5;
+ max-width: 300px;
+ margin-top: 50px;
+ font-size: 12px;
+ position: absolute;
+ background-color: #fff;
+ }
+
+ #carbonads a {
+ text-decoration: none;
+ }
+
+ #carbonads span {
+ position: relative;
+ display: block;
+ overflow: hidden;
+ }
+
+ .carbon-img {
+ float: left;
+ margin-right: 1em;
+ }
+
+ .carbon-img img {
+ display: block;
+ }
+
+ .carbon-text {
+ display: block;
+ float: left;
+ max-width: calc(100% - 130px - 1em);
+ text-align: left;
+ color: #637381;
+ }
+
+ .carbon-poweredby {
+ position: absolute;
+ left: 142px;
+ bottom: 0;
+ display: block;
+ font-size: 8px;
+ color: #c5cdd0;
+ font-weight: 500;
+ text-transform: uppercase;
+ line-height: 1;
+ letter-spacing: 1px;
+ }
+}
+
+@media (max-width: 992px) {
+ #carbonads {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+ Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial,
+ sans-serif;
+ --width: 728px;
+ --font-size: 22px;
+ }
+
+ #carbonads {
+ display: block;
+ overflow: hidden;
+ max-width: var(--width);
+ position: relative;
+ background-color: hsl(0, 0%, 99%);
+ border: solid 1px #eee;
+ font-size: var(--font-size);
+ box-sizing: border-box;
+ }
+
+ .detail #carbonads {
+ margin-top: 12px;
+ }
+
+ #carbonads a {
+ color: inherit;
+ text-decoration: none;
+ }
+
+ #carbonads a:hover {
+ color: inherit;
+ }
+
+ .carbon-wrap {
+ display: flex;
+ align-items: center;
+ }
+
+ carbon-img {
+ display: block;
+ float: left;
+ margin: 0;
+ max-width: var(--width);
+ line-height: 1;
+ }
+
+ .carbon-img img {
+ display: block;
+ height: 90px;
+ width: auto;
+ }
+
+ .carbon-text {
+ display: block;
+ float: left;
+ padding: 0 1em;
+ line-height: 1.35;
+ max-width: calc(100% - 130px - 2em);
+ text-align: left;
+ }
+
+ .carbon-poweredby {
+ display: block;
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ padding: 6px 10px;
+ background: repeating-linear-gradient(
+ -45deg,
+ transparent,
+ transparent 5px,
+ hsla(0, 0%, 0%, 0.025) 5px,
+ hsla(0, 0%, 0%, 0.025) 10px
+ )
+ hsla(203, 11%, 95%, 0.8);
+ text-align: center;
+ text-transform: uppercase;
+ letter-spacing: 0.5px;
+ font-weight: 600;
+ font-size: 8px;
+ border-top-left-radius: 4px;
+ line-height: 1;
+ }
+
+ @media only screen and (min-width: 320px) and (max-width: 759px) {
+ .carbon-text {
+ font-size: 14px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/st/face-01.jpg b/st/face-01.jpg
deleted file mode 100644
index 06f9640b2..000000000
Binary files a/st/face-01.jpg and /dev/null differ
diff --git a/st/face-02.jpg b/st/face-02.jpg
deleted file mode 100644
index 9063724c8..000000000
Binary files a/st/face-02.jpg and /dev/null differ
diff --git a/st/face-03.jpg b/st/face-03.jpg
deleted file mode 100644
index 3e64a48bd..000000000
Binary files a/st/face-03.jpg and /dev/null differ
diff --git a/st/face-04.jpg b/st/face-04.jpg
deleted file mode 100644
index 0e5c73bcc..000000000
Binary files a/st/face-04.jpg and /dev/null differ
diff --git a/st/face-05.jpg b/st/face-05.jpg
deleted file mode 100644
index a8111224d..000000000
Binary files a/st/face-05.jpg and /dev/null differ
diff --git a/st/face-06.jpg b/st/face-06.jpg
deleted file mode 100644
index 063be7272..000000000
Binary files a/st/face-06.jpg and /dev/null differ
diff --git a/st/face-07.jpg b/st/face-07.jpg
deleted file mode 100644
index aebd0112e..000000000
Binary files a/st/face-07.jpg and /dev/null differ
diff --git a/st/face-08.jpg b/st/face-08.jpg
deleted file mode 100644
index b4e27f196..000000000
Binary files a/st/face-08.jpg and /dev/null differ
diff --git a/st/face-09.jpg b/st/face-09.jpg
deleted file mode 100644
index 8ecdef6e3..000000000
Binary files a/st/face-09.jpg and /dev/null differ
diff --git a/st/prettify/prettify.css b/st/prettify/prettify.css
new file mode 100644
index 000000000..e6fe342f2
--- /dev/null
+++ b/st/prettify/prettify.css
@@ -0,0 +1 @@
+.pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.clo,.opn,.pun{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.kwd,.tag,.typ{font-weight:700}.str{color:#060}.kwd{color:#006}.com{color:#600;font-style:italic}.typ{color:#404}.lit{color:#044}.clo,.opn,.pun{color:#440}.tag{color:#006}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}
\ No newline at end of file
diff --git a/st/prettify/prettify.js b/st/prettify/prettify.js
new file mode 100644
index 000000000..477f03d55
--- /dev/null
+++ b/st/prettify/prettify.js
@@ -0,0 +1,46 @@
+!function(){/*
+
+ Copyright (C) 2006 Google Inc.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+"undefined"!==typeof window&&(window.PR_SHOULD_USE_CONTINUATION=!0);
+(function(){function T(a){function d(e){var a=e.charCodeAt(0);if(92!==a)return a;var c=e.charAt(1);return(a=w[c])?a:"0"<=c&&"7">=c?parseInt(e.substring(1),8):"u"===c||"x"===c?parseInt(e.substring(2),16):e.charCodeAt(1)}function f(e){if(32>e)return(16>e?"\\x0":"\\x")+e.toString(16);e=String.fromCharCode(e);return"\\"===e||"-"===e||"]"===e||"^"===e?"\\"+e:e}function c(e){var c=e.substring(1,e.length-1).match(RegExp("\\\\u[0-9A-Fa-f]{4}|\\\\x[0-9A-Fa-f]{2}|\\\\[0-3][0-7]{0,2}|\\\\[0-7]{1,2}|\\\\[\\s\\S]|-|[^-\\\\]","g"));
+e=[];var a="^"===c[0],b=["["];a&&b.push("^");for(var a=a?1:0,g=c.length;ak||122k||90k||122h[0]&&(h[1]+1>h[0]&&b.push("-"),b.push(f(h[1])));b.push("]");return b.join("")}function m(e){for(var a=e.source.match(RegExp("(?:\\[(?:[^\\x5C\\x5D]|\\\\[\\s\\S])*\\]|\\\\u[A-Fa-f0-9]{4}|\\\\x[A-Fa-f0-9]{2}|\\\\[0-9]+|\\\\[^ux0-9]|\\(\\?[:!=]|[\\(\\)\\^]|[^\\x5B\\x5C\\(\\)\\^]+)","g")),b=a.length,d=[],g=0,h=0;g/,null])):d.push(["com",/^#[^\r\n]*/,null,"#"]));a.cStyleComments&&(f.push(["com",/^\/\/[^\r\n]*/,null]),f.push(["com",/^\/\*[\s\S]*?(?:\*\/|$)/,null]));if(c=a.regexLiterals){var m=(c=1|\\/=?|::?|<>?>?=?|,|;|\\?|@|\\[|~|{|\\^\\^?=?|\\|\\|?=?|break|case|continue|delete|do|else|finally|instanceof|return|throw|try|typeof)\\s*("+
+("/(?=[^/*"+c+"])(?:[^/\\x5B\\x5C"+c+"]|\\x5C"+m+"|\\x5B(?:[^\\x5C\\x5D"+c+"]|\\x5C"+m+")*(?:\\x5D|$))+/")+")")])}(c=a.types)&&f.push(["typ",c]);c=(""+a.keywords).replace(/^ | $/g,"");c.length&&f.push(["kwd",new RegExp("^(?:"+c.replace(/[\s,]+/g,"|")+")\\b"),null]);d.push(["pln",/^\s+/,null," \r\n\t\u00a0"]);c="^.[^\\s\\w.$@'\"`/\\\\]*";a.regexLiterals&&(c+="(?!s*/)");f.push(["lit",/^@[a-z_$][a-z_$@0-9]*/i,null],["typ",/^(?:[@_]?[A-Z]+[a-z][A-Za-z_$@0-9]*|\w+_t\b)/,null],["pln",/^[a-z_$][a-z_$@0-9]*/i,
+null],["lit",/^(?:0x[a-f0-9]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+\-]?\d+)?)[a-z]*/i,null,"0123456789"],["pln",/^\\[\s\S]?/,null],["pun",new RegExp(c),null]);return G(d,f)}function L(a,d,f){function c(a){var b=a.nodeType;if(1==b&&!t.test(a.className))if("br"===a.nodeName.toLowerCase())m(a),a.parentNode&&a.parentNode.removeChild(a);else for(a=a.firstChild;a;a=a.nextSibling)c(a);else if((3==b||4==b)&&f){var e=a.nodeValue,d=e.match(q);d&&(b=e.substring(0,d.index),a.nodeValue=b,(e=e.substring(d.index+
+d[0].length))&&a.parentNode.insertBefore(l.createTextNode(e),a.nextSibling),m(a),b||a.parentNode.removeChild(a))}}function m(a){function c(a,b){var e=b?a.cloneNode(!1):a,k=a.parentNode;if(k){var k=c(k,1),d=a.nextSibling;k.appendChild(e);for(var f=d;f;f=d)d=f.nextSibling,k.appendChild(f)}return e}for(;!a.nextSibling;)if(a=a.parentNode,!a)return;a=c(a.nextSibling,0);for(var e;(e=a.parentNode)&&1===e.nodeType;)a=e;b.push(a)}for(var t=/(?:^|\s)nocode(?:\s|$)/,q=/\r\n?|\n/,l=a.ownerDocument,n=l.createElement("li");a.firstChild;)n.appendChild(a.firstChild);
+for(var b=[n],p=0;p=+m[1],d=/\n/g,t=a.a,q=t.length,f=0,l=a.c,n=l.length,c=0,b=a.g,p=b.length,w=0;b[p]=q;var r,e;for(e=r=0;e=h&&(c+=2);f>=k&&(w+=2)}}finally{g&&(g.style.display=a)}}catch(y){D.console&&console.log(y&&y.stack||y)}}var D="undefined"!==typeof window?
+window:{},B=["break,continue,do,else,for,if,return,while"],F=[[B,"auto,case,char,const,default,double,enum,extern,float,goto,inline,int,long,register,restrict,short,signed,sizeof,static,struct,switch,typedef,union,unsigned,void,volatile"],"catch,class,delete,false,import,new,operator,private,protected,public,this,throw,true,try,typeof"],H=[F,"alignas,alignof,align_union,asm,axiom,bool,concept,concept_map,const_cast,constexpr,decltype,delegate,dynamic_cast,explicit,export,friend,generic,late_check,mutable,namespace,noexcept,noreturn,nullptr,property,reinterpret_cast,static_assert,static_cast,template,typeid,typename,using,virtual,where"],
+O=[F,"abstract,assert,boolean,byte,extends,finally,final,implements,import,instanceof,interface,null,native,package,strictfp,super,synchronized,throws,transient"],P=[F,"abstract,add,alias,as,ascending,async,await,base,bool,by,byte,checked,decimal,delegate,descending,dynamic,event,finally,fixed,foreach,from,get,global,group,implicit,in,interface,internal,into,is,join,let,lock,null,object,out,override,orderby,params,partial,readonly,ref,remove,sbyte,sealed,select,set,stackalloc,string,select,uint,ulong,unchecked,unsafe,ushort,value,var,virtual,where,yield"],
+F=[F,"abstract,async,await,constructor,debugger,enum,eval,export,from,function,get,import,implements,instanceof,interface,let,null,of,set,undefined,var,with,yield,Infinity,NaN"],Q=[B,"and,as,assert,class,def,del,elif,except,exec,finally,from,global,import,in,is,lambda,nonlocal,not,or,pass,print,raise,try,with,yield,False,True,None"],R=[B,"alias,and,begin,case,class,def,defined,elsif,end,ensure,false,in,module,next,nil,not,or,redo,rescue,retry,self,super,then,true,undef,unless,until,when,yield,BEGIN,END"],
+B=[B,"case,done,elif,esac,eval,fi,function,in,local,set,then,until"],S=/^(DIR|FILE|array|vector|(de|priority_)?queue|(forward_)?list|stack|(const_)?(reverse_)?iterator|(unordered_)?(multi)?(set|map)|bitset|u?(int|float)\d*)\b/,W=/\S/,X=x({keywords:[H,P,O,F,"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",Q,R,B],hashComments:!0,cStyleComments:!0,multiLineStrings:!0,regexLiterals:!0}),
+I={};t(X,["default-code"]);t(G([],[["pln",/^[^]*(?:>|$)/],["com",/^<\!--[\s\S]*?(?:-\->|$)/],["lang-",/^<\?([\s\S]+?)(?:\?>|$)/],["lang-",/^<%([\s\S]+?)(?:%>|$)/],["pun",/^(?:<[%?]|[%?]>)/],["lang-",/^]*>([\s\S]+?)<\/xmp\b[^>]*>/i],["lang-js",/^]*>([\s\S]*?)(<\/script\b[^>]*>)/i],["lang-css",/^]*>([\s\S]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),"default-markup htm html mxml xhtml xml xsl".split(" "));t(G([["pln",/^[\s]+/,
+null," \t\r\n"],["atv",/^(?:\"[^\"]*\"?|\'[^\']*\'?)/,null,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w.:-]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^>\'\"\s]*(?:[^>\'\"\s\/]|\/(?=\s)))/],["pun",/^[=<>\/]+/],["lang-js",/^on\w+\s*=\s*\"([^\"]+)\"/i],["lang-js",/^on\w+\s*=\s*\'([^\']+)\'/i],["lang-js",/^on\w+\s*=\s*([^\"\'>\s]+)/i],["lang-css",/^style\s*=\s*\"([^\"]+)\"/i],["lang-css",/^style\s*=\s*\'([^\']+)\'/i],["lang-css",/^style\s*=\s*([^\"\'>\s]+)/i]]),["in.tag"]);
+t(G([],[["atv",/^[\s\S]+/]]),["uq.val"]);t(x({keywords:H,hashComments:!0,cStyleComments:!0,types:S}),"c cc cpp cxx cyc m".split(" "));t(x({keywords:"null,true,false"}),["json"]);t(x({keywords:P,hashComments:!0,cStyleComments:!0,verbatimStrings:!0,types:S}),["cs"]);t(x({keywords:O,cStyleComments:!0}),["java"]);t(x({keywords:B,hashComments:!0,multiLineStrings:!0}),["bash","bsh","csh","sh"]);t(x({keywords:Q,hashComments:!0,multiLineStrings:!0,tripleQuotedStrings:!0}),["cv","py","python"]);t(x({keywords:"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",
+hashComments:!0,multiLineStrings:!0,regexLiterals:2}),["perl","pl","pm"]);t(x({keywords:R,hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["rb","ruby"]);t(x({keywords:F,cStyleComments:!0,regexLiterals:!0}),["javascript","js","ts","typescript"]);t(x({keywords:"all,and,by,catch,class,else,extends,false,finally,for,if,in,is,isnt,loop,new,no,not,null,of,off,on,or,return,super,then,throw,true,try,unless,until,when,while,yes",hashComments:3,cStyleComments:!0,multilineStrings:!0,tripleQuotedStrings:!0,
+regexLiterals:!0}),["coffee"]);t(G([],[["str",/^[\s\S]+/]]),["regex"]);var Y=D.PR={createSimpleLexer:G,registerLangHandler:t,sourceDecorator:x,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ",prettyPrintOne:D.prettyPrintOne=function(a,d,f){f=f||!1;d=d||null;var c=document.createElement("div");c.innerHTML=""+a+"
";
+c=c.firstChild;f&&L(c,f,!0);M({j:d,m:f,h:c,l:1,a:null,i:null,c:null,g:null});return c.innerHTML},prettyPrint:D.prettyPrint=function(a,d){function f(){for(var c=D.PR_SHOULD_USE_CONTINUATION?b.now()+250:Infinity;p=c?parseInt(e.substring(1),8):"u"===c||"x"===c?parseInt(e.substring(2),16):e.charCodeAt(1)}function f(e){if(32>e)return(16>e?"\\x0":"\\x")+e.toString(16);e=String.fromCharCode(e);
+return"\\"===e||"-"===e||"]"===e||"^"===e?"\\"+e:e}function c(e){var c=e.substring(1,e.length-1).match(RegExp("\\\\u[0-9A-Fa-f]{4}|\\\\x[0-9A-Fa-f]{2}|\\\\[0-3][0-7]{0,2}|\\\\[0-7]{1,2}|\\\\[\\s\\S]|-|[^-\\\\]","g"));e=[];var a="^"===c[0],b=["["];a&&b.push("^");for(var a=a?1:0,h=c.length;ap||122p||90p||122m[0]&&(m[1]+1>m[0]&&b.push("-"),b.push(f(m[1])));b.push("]");return b.join("")}function g(e){for(var a=e.source.match(RegExp("(?:\\[(?:[^\\x5C\\x5D]|\\\\[\\s\\S])*\\]|\\\\u[A-Fa-f0-9]{4}|\\\\x[A-Fa-f0-9]{2}|\\\\[0-9]+|\\\\[^ux0-9]|\\(\\?[:!=]|[\\(\\)\\^]|[^\\x5B\\x5C\\(\\)\\^]+)",
+"g")),b=a.length,d=[],h=0,m=0;h/,null])):d.push(["com",/^#[^\r\n]*/,null,"#"]));a.cStyleComments&&(f.push(["com",/^\/\/[^\r\n]*/,null]),f.push(["com",/^\/\*[\s\S]*?(?:\*\/|$)/,
+null]));if(c=a.regexLiterals){var g=(c=1|\\/=?|::?|<>?>?=?|,|;|\\?|@|\\[|~|{|\\^\\^?=?|\\|\\|?=?|break|case|continue|delete|do|else|finally|instanceof|return|throw|try|typeof)\\s*("+("/(?=[^/*"+c+"])(?:[^/\\x5B\\x5C"+c+"]|\\x5C"+g+"|\\x5B(?:[^\\x5C\\x5D"+c+"]|\\x5C"+g+")*(?:\\x5D|$))+/")+")")])}(c=a.types)&&f.push(["typ",c]);c=(""+a.keywords).replace(/^ | $/g,"");c.length&&f.push(["kwd",
+new RegExp("^(?:"+c.replace(/[\s,]+/g,"|")+")\\b"),null]);d.push(["pln",/^\s+/,null," \r\n\t\u00a0"]);c="^.[^\\s\\w.$@'\"`/\\\\]*";a.regexLiterals&&(c+="(?!s*/)");f.push(["lit",/^@[a-z_$][a-z_$@0-9]*/i,null],["typ",/^(?:[@_]?[A-Z]+[a-z][A-Za-z_$@0-9]*|\w+_t\b)/,null],["pln",/^[a-z_$][a-z_$@0-9]*/i,null],["lit",/^(?:0x[a-f0-9]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+\-]?\d+)?)[a-z]*/i,null,"0123456789"],["pln",/^\\[\s\S]?/,null],["pun",new RegExp(c),null]);return E(d,f)}function B(a,d,f){function c(a){var b=
+a.nodeType;if(1==b&&!r.test(a.className))if("br"===a.nodeName.toLowerCase())g(a),a.parentNode&&a.parentNode.removeChild(a);else for(a=a.firstChild;a;a=a.nextSibling)c(a);else if((3==b||4==b)&&f){var e=a.nodeValue,d=e.match(n);d&&(b=e.substring(0,d.index),a.nodeValue=b,(e=e.substring(d.index+d[0].length))&&a.parentNode.insertBefore(q.createTextNode(e),a.nextSibling),g(a),b||a.parentNode.removeChild(a))}}function g(a){function c(a,b){var e=b?a.cloneNode(!1):a,p=a.parentNode;if(p){var p=c(p,1),d=a.nextSibling;
+p.appendChild(e);for(var f=d;f;f=d)d=f.nextSibling,p.appendChild(f)}return e}for(;!a.nextSibling;)if(a=a.parentNode,!a)return;a=c(a.nextSibling,0);for(var e;(e=a.parentNode)&&1===e.nodeType;)a=e;b.push(a)}for(var r=/(?:^|\s)nocode(?:\s|$)/,n=/\r\n?|\n/,q=a.ownerDocument,k=q.createElement("li");a.firstChild;)k.appendChild(a.firstChild);for(var b=[k],t=0;t=+g[1],d=/\n/g,r=a.a,k=r.length,f=0,q=a.c,n=q.length,c=0,b=a.g,t=b.length,v=0;b[t]=k;var u,e;for(e=u=0;e=m&&(c+=2);f>=p&&(v+=2)}}finally{h&&(h.style.display=a)}}catch(y){Q.console&&console.log(y&&y.stack||y)}}var Q="undefined"!==typeof window?window:{},J=["break,continue,do,else,for,if,return,while"],K=[[J,"auto,case,char,const,default,double,enum,extern,float,goto,inline,int,long,register,restrict,short,signed,sizeof,static,struct,switch,typedef,union,unsigned,void,volatile"],
+"catch,class,delete,false,import,new,operator,private,protected,public,this,throw,true,try,typeof"],R=[K,"alignas,alignof,align_union,asm,axiom,bool,concept,concept_map,const_cast,constexpr,decltype,delegate,dynamic_cast,explicit,export,friend,generic,late_check,mutable,namespace,noexcept,noreturn,nullptr,property,reinterpret_cast,static_assert,static_cast,template,typeid,typename,using,virtual,where"],L=[K,"abstract,assert,boolean,byte,extends,finally,final,implements,import,instanceof,interface,null,native,package,strictfp,super,synchronized,throws,transient"],
+M=[K,"abstract,add,alias,as,ascending,async,await,base,bool,by,byte,checked,decimal,delegate,descending,dynamic,event,finally,fixed,foreach,from,get,global,group,implicit,in,interface,internal,into,is,join,let,lock,null,object,out,override,orderby,params,partial,readonly,ref,remove,sbyte,sealed,select,set,stackalloc,string,select,uint,ulong,unchecked,unsafe,ushort,value,var,virtual,where,yield"],K=[K,"abstract,async,await,constructor,debugger,enum,eval,export,from,function,get,import,implements,instanceof,interface,let,null,of,set,undefined,var,with,yield,Infinity,NaN"],
+N=[J,"and,as,assert,class,def,del,elif,except,exec,finally,from,global,import,in,is,lambda,nonlocal,not,or,pass,print,raise,try,with,yield,False,True,None"],O=[J,"alias,and,begin,case,class,def,defined,elsif,end,ensure,false,in,module,next,nil,not,or,redo,rescue,retry,self,super,then,true,undef,unless,until,when,yield,BEGIN,END"],J=[J,"case,done,elif,esac,eval,fi,function,in,local,set,then,until"],P=/^(DIR|FILE|array|vector|(de|priority_)?queue|(forward_)?list|stack|(const_)?(reverse_)?iterator|(unordered_)?(multi)?(set|map)|bitset|u?(int|float)\d*)\b/,
+S=/\S/,T=v({keywords:[R,M,L,K,"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",N,O,J],hashComments:!0,cStyleComments:!0,multiLineStrings:!0,regexLiterals:!0}),V={};n(T,["default-code"]);n(E([],[["pln",/^[^]*(?:>|$)/],["com",/^<\!--[\s\S]*?(?:-\->|$)/],["lang-",/^<\?([\s\S]+?)(?:\?>|$)/],["lang-",/^<%([\s\S]+?)(?:%>|$)/],["pun",/^(?:<[%?]|[%?]>)/],["lang-",
+/^]*>([\s\S]+?)<\/xmp\b[^>]*>/i],["lang-js",/^]*>([\s\S]*?)(<\/script\b[^>]*>)/i],["lang-css",/^]*>([\s\S]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),"default-markup htm html mxml xhtml xml xsl".split(" "));n(E([["pln",/^[\s]+/,null," \t\r\n"],["atv",/^(?:\"[^\"]*\"?|\'[^\']*\'?)/,null,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w.:-]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^>\'\"\s]*(?:[^>\'\"\s\/]|\/(?=\s)))/],
+["pun",/^[=<>\/]+/],["lang-js",/^on\w+\s*=\s*\"([^\"]+)\"/i],["lang-js",/^on\w+\s*=\s*\'([^\']+)\'/i],["lang-js",/^on\w+\s*=\s*([^\"\'>\s]+)/i],["lang-css",/^style\s*=\s*\"([^\"]+)\"/i],["lang-css",/^style\s*=\s*\'([^\']+)\'/i],["lang-css",/^style\s*=\s*([^\"\'>\s]+)/i]]),["in.tag"]);n(E([],[["atv",/^[\s\S]+/]]),["uq.val"]);n(v({keywords:R,hashComments:!0,cStyleComments:!0,types:P}),"c cc cpp cxx cyc m".split(" "));n(v({keywords:"null,true,false"}),["json"]);n(v({keywords:M,hashComments:!0,cStyleComments:!0,
+verbatimStrings:!0,types:P}),["cs"]);n(v({keywords:L,cStyleComments:!0}),["java"]);n(v({keywords:J,hashComments:!0,multiLineStrings:!0}),["bash","bsh","csh","sh"]);n(v({keywords:N,hashComments:!0,multiLineStrings:!0,tripleQuotedStrings:!0}),["cv","py","python"]);n(v({keywords:"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",hashComments:!0,multiLineStrings:!0,regexLiterals:2}),
+["perl","pl","pm"]);n(v({keywords:O,hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["rb","ruby"]);n(v({keywords:K,cStyleComments:!0,regexLiterals:!0}),["javascript","js","ts","typescript"]);n(v({keywords:"all,and,by,catch,class,else,extends,false,finally,for,if,in,is,isnt,loop,new,no,not,null,of,off,on,or,return,super,then,throw,true,try,unless,until,when,while,yes",hashComments:3,cStyleComments:!0,multilineStrings:!0,tripleQuotedStrings:!0,regexLiterals:!0}),["coffee"]);n(E([],[["str",/^[\s\S]+/]]),
+["regex"]);var U=Q.PR={createSimpleLexer:E,registerLangHandler:n,sourceDecorator:v,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ",prettyPrintOne:function(a,d,f){f=f||!1;d=d||null;var c=document.createElement("div");c.innerHTML=""+a+"
";c=c.firstChild;f&&B(c,f,!0);H({j:d,m:f,h:c,l:1,a:null,i:null,c:null,g:null});
+return c.innerHTML},prettyPrint:g=function(a,d){function f(){for(var c=Q.PR_SHOULD_USE_CONTINUATION?b.now()+250:Infinity;t