playground
/
Sortable
mirror of https://github.com/RubaXa/Sortable.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Added manuallyHandleUpdateEvents and documented usage.

pull/881/head
Daniel Persson 9 years ago
parent
babcc09e22
commit
35a8a14115
2 changed files with 39 additions and 34 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      README.md
  2. 49
      Sortable.html

2
README.md
Unescape View File

@ -526,7 +526,7 @@ The sortable/draggable bindingHandlers supports the same syntax as Knockouts bui
Other attributes are: Other attributes are:
* options: an object that contains settings for the underlaying sortable, ie `group`,`handle`, events etc. * options: an object that contains settings for the underlaying sortable, ie `group`,`handle`, events etc.
* collection: if your `foreach` array is a computed then you would supply the underlaying observableArray that you would like to sort here. * collection: if your `foreach` array is a computed then you would supply the underlaying observableArray that you would like to sort here.
* manuallyHandleUpdateEvents: a boolean to turn off the change events on update that other polymer elements listen to.
--- ---

49
Sortable.html
Unescape View File

@ -11,27 +11,28 @@
is: "sortable-js", is: "sortable-js",
properties: { properties: {
group : { type: String, value: () => Math.random(), observer: "groupChanged" }, group : { type: String, value: () => Math.random(), observer: "groupChanged" },
sort : { type: Boolean, value: true, observer: "sortChanged" }, sort : { type: Boolean, value: true, observer: "sortChanged" },
disabled : { type: Boolean, value: false, observer: "disabledChanged" }, disabled : { type: Boolean, value: false, observer: "disabledChanged" },
store : { type: Object, value: null, observer: "storeChanged" }, store : { type: Object, value: null, observer: "storeChanged" },
handle : { type: String, value: null, observer: "handleChanged" }, handle : { type: String, value: null, observer: "handleChanged" },
scrollSensitivity : { type: Number, value: 30, observer: "scrollSensitivityChanged" }, scrollSensitivity : { type: Number, value: 30, observer: "scrollSensitivityChanged" },
scrollSpeed : { type: Number, value: 10, observer: "scrollSpeedChanged" }, scrollSpeed : { type: Number, value: 10, observer: "scrollSpeedChanged" },
ghostClass : { type: String, value: "sortable-ghost", observer: "ghostClassChanged" }, ghostClass : { type: String, value: "sortable-ghost", observer: "ghostClassChanged" },
chosenClass : { type: String, value: "sortable-chosen", observer: "chosenClassChanged" }, chosenClass : { type: String, value: "sortable-chosen", observer: "chosenClassChanged" },
ignore : { type: String, value: "a, img", observer: "ignoreChanged" }, ignore : { type: String, value: "a, img", observer: "ignoreChanged" },
filter : { type: Object, value: null, observer: "filterChanged" }, filter : { type: Object, value: null, observer: "filterChanged" },
animation : { type: Number, value: 0, observer: "animationChanged" }, animation : { type: Number, value: 0, observer: "animationChanged" },
dropBubble : { type: Boolean, value: false, observer: "dropBubbleChanged" }, dropBubble : { type: Boolean, value: false, observer: "dropBubbleChanged" },
dragoverBubble : { type: Boolean, value: false, observer: "dragoverBubbleChanged" }, dragoverBubble : { type: Boolean, value: false, observer: "dragoverBubbleChanged" },
dataIdAttr : { type: String, value: "data-id", observer: "dataIdAttrChanged" }, dataIdAttr : { type: String, value: "data-id", observer: "dataIdAttrChanged" },
delay : { type: Number, value: 0, observer: "delayChanged" }, delay : { type: Number, value: 0, observer: "delayChanged" },
forceFallback : { type: Boolean, value: false, observer: "forceFallbackChanged" }, forceFallback : { type: Boolean, value: false, observer: "forceFallbackChanged" },
fallbackClass : { type: String, value: "sortable-fallback", observer: "fallbackClassChanged" }, fallbackClass : { type: String, value: "sortable-fallback", observer: "fallbackClassChanged" },
fallbackOnBody : { type: Boolean, value: false, observer: "fallbackOnBodyChanged" }, fallbackOnBody : { type: Boolean, value: false, observer: "fallbackOnBodyChanged" },
draggable : {}, manuallyHandleUpdateEvents : { type: Boolean, value: false },
scroll : {} draggable : {},
scroll : {}
}, },
created() { created() {
@ -78,7 +79,11 @@
this.sortable = Sortable.create(this, Object.assign(options, { this.sortable = Sortable.create(this, Object.assign(options, {
onUpdate: e => { onUpdate: e => {
if (template) { if (template) {
template.items.splice(e.newIndex, 0, template.items.splice(e.oldIndex, 1)[0]); if(manuallyHandleUpdateEvents) {
template.items.splice(e.newIndex, 0, template.items.splice(e.oldIndex, 1)[0]);
} else {
template.splice("items", e.newIndex, 0, template.splice("items", e.oldIndex, 1)[0])
}
} }
this.fire("update", e) this.fire("update", e)
}, },

Write Preview
Loading…
Cancel
Save