Debounce text editing so you're not undoing/redoing one character at a time

diff --git a/dist/flowy.js b/dist/flowy.js
index aa43858a8158f9002c1ac5dcfde1381e9aa2e0a1..0d993dc033192fef1d2fc90371056f3eff9f3fc4 100644 (file)
--- a/dist/flowy.js
+++ b/dist/flowy.js
@@ -448,6 +448,7 @@ var TodoView = Backbone.View.extend({
     return this;
   },
   stopEditingText: function() {
+    this.model.flushText();
     this.$el.find("> .text").blur();
     return this;
   },
@@ -627,6 +628,7 @@ var TodoView = Backbone.View.extend({
         console.log("unexpected number of lines in textChange");
     } else if (lines.length === 1) {
         // Normal edit
+        // Debounce it.
         this.model.setText(this.decodeText(lines[0]));
 
     // If there's a line break in the text, they pressed "Enter", and it's more complicated.
@@ -721,10 +723,26 @@ var TodoModel = Backbone.Model.extend({
         this.save({collapsed: !this.get("collapsed")});
     },
     _setText: function(text) {
+        this._text = text;
         return this.save({text: text});
     },
-    setText: function(text) {
-        return Actions.App.act(new Actions.ChangeText(this, text));
+    setText: function(text, flush) {
+        this._text = text;
+        if (flush) {
+            this.flushText();
+        } else {
+            this._flushTextDebounced();
+        }
+        return this;
+    },
+    _flushTextDebounced: _.debounce(function() {
+        this.flushText();
+    }, 500),
+    flushText: function(text) {
+        if (!this._text || this.get("text") === this._text) {
+            return;
+        }
+        return Actions.App.act(new Actions.ChangeText(this, this._text));
     },
     hasChildren: function() {
         return this.get("bullets").length > 0;

diff --git a/dist/flowy.unwrapped.js b/dist/flowy.unwrapped.js
index 4765349888dc80196c38807acfe5fb8dcbfd6482..8a94f3bec2344aaaa4699aae7783ac2d73707ad2 100644 (file)
--- a/dist/flowy.unwrapped.js
+++ b/dist/flowy.unwrapped.js
@@ -447,6 +447,7 @@ var TodoView = Backbone.View.extend({
     return this;
   },
   stopEditingText: function() {
+    this.model.flushText();
     this.$el.find("> .text").blur();
     return this;
   },
@@ -626,6 +627,7 @@ var TodoView = Backbone.View.extend({
         console.log("unexpected number of lines in textChange");
     } else if (lines.length === 1) {
         // Normal edit
+        // Debounce it.
         this.model.setText(this.decodeText(lines[0]));
 
     // If there's a line break in the text, they pressed "Enter", and it's more complicated.
@@ -720,10 +722,26 @@ var TodoModel = Backbone.Model.extend({
         this.save({collapsed: !this.get("collapsed")});
     },
     _setText: function(text) {
+        this._text = text;
         return this.save({text: text});
     },
-    setText: function(text) {
-        return Actions.App.act(new Actions.ChangeText(this, text));
+    setText: function(text, flush) {
+        this._text = text;
+        if (flush) {
+            this.flushText();
+        } else {
+            this._flushTextDebounced();
+        }
+        return this;
+    },
+    _flushTextDebounced: _.debounce(function() {
+        this.flushText();
+    }, 500),
+    flushText: function(text) {
+        if (!this._text || this.get("text") === this._text) {
+            return;
+        }
+        return Actions.App.act(new Actions.ChangeText(this, this._text));
     },
     hasChildren: function() {
         return this.get("bullets").length > 0;

diff --git a/src/models/todo.js b/src/models/todo.js
index 79e9c743e8410ad4eadbf12cc1499487b9e431a0..a60ff721c0ac22bdff0008b1defbfba55fcace9c 100644 (file)
--- a/src/models/todo.js
+++ b/src/models/todo.js
@@ -15,10 +15,26 @@ var TodoModel = Backbone.Model.extend({
         this.save({collapsed: !this.get("collapsed")});
     },
     _setText: function(text) {
+        this._text = text;
         return this.save({text: text});
     },
-    setText: function(text) {
-        return Actions.App.act(new Actions.ChangeText(this, text));
+    setText: function(text, flush) {
+        this._text = text;
+        if (flush) {
+            this.flushText();
+        } else {
+            this._flushTextDebounced();
+        }
+        return this;
+    },
+    _flushTextDebounced: _.debounce(function() {
+        this.flushText();
+    }, 500),
+    flushText: function(text) {
+        if (!this._text || this.get("text") === this._text) {
+            return;
+        }
+        return Actions.App.act(new Actions.ChangeText(this, this._text));
     },
     hasChildren: function() {
         return this.get("bullets").length > 0;

diff --git a/src/views/todo.js b/src/views/todo.js
index 25619e19d8bb064af2336ce98a8094f1b36696a1..4d2e0d8c9212ffed39bab2212d434990f3d1456d 100644 (file)
--- a/src/views/todo.js
+++ b/src/views/todo.js
@@ -50,6 +50,7 @@ var TodoView = Backbone.View.extend({
     return this;
   },
   stopEditingText: function() {
+    this.model.flushText();
     this.$el.find("> .text").blur();
     return this;
   },
@@ -229,6 +230,7 @@ var TodoView = Backbone.View.extend({
         console.log("unexpected number of lines in textChange");
     } else if (lines.length === 1) {
         // Normal edit
+        // Debounce it.
         this.model.setText(this.decodeText(lines[0]));
 
     // If there's a line break in the text, they pressed "Enter", and it's more complicated.