From fa33718d925fe0c456323354da71ca2bf491765c Mon Sep 17 00:00:00 2001
From: ChiefORZ <seb.schaffernak@live.at>
Date: Thu, 24 Sep 2015 11:42:16 +0200
Subject: [PATCH] more reliable way to get the DOM Node

with React v0.14 this.refs.*.getDOMNode() is deprecated,
we have to use this.refs.* instead, to reference the DOM Node.

this is a implementation, that is backward compatible

* misspelled ref in README fixed
* fixed Demo of forceFallback
---
 README.md               |  4 ++--
 react-sortable-mixin.js | 11 ++++-------
 2 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index 55f2275..91aed93 100644
--- a/README.md
+++ b/README.md
@@ -287,7 +287,7 @@ This gives us the possiblity to test the behaviour for older Browsers even in ne
 
 On top of that, the Fallback always generates a copy of that DOM Element and appends the class `fallbackClass` definied in the options. This behaviour controls the look of this 'dragged' Element.
 
-Demo: http://jsbin.com/xinuyenabi/edit?html,css,js,output
+Demo: http://jsbin.com/pucurizace/edit?html,css,js,output
 
 
 ---
@@ -410,7 +410,7 @@ var AllUsers = React.createClass({
 	render: function() {
 		return (
 			<h1>Users</h1>
-			<ul ref="users">{
+			<ul ref="user">{
 				this.state.users.map(function (text) {
 					return <li>{text}</li>
 				})
diff --git a/react-sortable-mixin.js b/react-sortable-mixin.js
index 97ef806..4fbe731 100644
--- a/react-sortable-mixin.js
+++ b/react-sortable-mixin.js
@@ -35,11 +35,7 @@
 		onRemove: 'handleRemove',
 		onSort: 'handleSort',
 		onFilter: 'handleFilter',
-		onMove: 'handleMove',
-		getContainer: function(component){
-			/** @namespace this.refs — http://facebook.github.io/react/docs/more-about-refs.html */
-			return (component.refs[options.ref] || component).getDOMNode()
-		}
+		onMove: 'handleMove'
 	};
 
 
@@ -85,7 +81,7 @@
 
 
 		componentDidMount: function () {
-			var options = _extend(_extend({}, _defaultOptions), this.sortableOptions || {}),
+			var DOMNode, options = _extend(_extend({}, _defaultOptions), this.sortableOptions || {}),
 				copyOptions = _extend({}, options),
 
 				emitEvent = function (/** string */type, /** Event */evt) {
@@ -134,9 +130,10 @@
 				}.bind(this);
 			}, this);
 
+			DOMNode = this.getDOMNode() ? (this.refs[options.ref] || this).getDOMNode() : this.refs[options.ref] || this;
 
 			/** @namespace this.refs — http://facebook.github.io/react/docs/more-about-refs.html */
-			this._sortableInstance = Sortable.create(copyOptions.getContainer(this), copyOptions);
+			this._sortableInstance = Sortable.create(DOMNode, copyOptions);
 		},
 
 		componentWillReceiveProps: function (nextProps) {