Changeset 28170

Timestamp:

01/08/09 21:28:21 (6 months ago)

Author:

suVene

Message:

resizable current textarea using a keymap

Files:

• lang/javascript/vimperator-plugins/trunk/resizable_textarea.js (modified) (6 diffs)

lang/javascript/vimperator-plugins/trunk/resizable_textarea.js

@@ -12 +12 @@
   <description lang="ja">テキストエリアをリサイズ可能にする。</description>
   <author mail="suvene@zeromemory.info" homepage="http://zeromemory.sblo.jp/">suVene</author>
-  <version>0.1.0</version>
+  <version>0.2.0</version>
   <license>MIT</license>
   <minVersion>2.0pre</minVersion>
   <maxVersion>2.0α2</maxVersion>
-  <updateURL>http://svn.coderepos.org/share/lang/javascript/vimperator-plugins/trunk/resizeble_textarea.js</updateURL>
+  <updateURL>http://svn.coderepos.org/share/lang/javascript/vimperator-plugins/trunk/resizable_textarea.js</updateURL>
   <detail><![CDATA[
 == Usage ==
+=== NORMAL MODE or VISUAL MODE or CARET MODE ===
 >||
-:textareaResize
-  or
-:tr
+:textareaResize or :tr
 ||<
+you can resize textareas by using a mouse.
+
+=== INSERT MODE or TEXTAREA MODE ===
+>||
+"<A-r>" or "<M-r>"
+||<
+you can resize current component by using a keyboad.
+=== keymap ===
+"k" or "up":
+  height more small.
+"j" or "down":
+  height more large.
+"h" or "left":
+  width more small.
+"l" or "right":
+  width more large.
+"escape" or "enter":
+  end of resize.
   ]]></detail>
 </VimperatorPlugin>;
@@ -38 +55 @@
       initResize: this._bind(this, this.initResize),
       resize: this._bind(this, this.resize),
-      stopResize: this._bind(this, this.stopResize)
+      stopResize: this._bind(this, this.stopResize),
+      currentResize: this._bind(this, this.currentResize)
     };
   },
-  resizable: function(args) {
+  resizable: function(focused) {
+    if (focused) {
+      this.initResize({ target: focused }, focused);
+      return;
+    }
     this.changeCursor(false);
     this.doc.addEventListener("mousedown", this.handler.initResize, false);
   },
-  initResize: function(event) {
+  initResize: function(event, focused) {
     var target = this.target = event.target;
     if (!target ||
@@ -52 +74 @@
       return;
 
+    if (focused) {
+      this.target.startBgColor = this.target.style.backgroundColor;
+      this.target.style.backgroundColor = "#F4BC14";
+      this.doc.addEventListener("keydown", this.handler.currentResize, false);
+      return;
+    }
+
     this.target.startWidth = this.target.clientWidth;
     this.target.startHeight = this.target.clientHeight;
-    this.target.startX = event.clientX;
-    this.target.startY = event.clientY;
+    this.target.startX = event.clientX || event.target.offsetLeft;
+    this.target.startY = event.clientY || event.target.offsetTop;
 
     this.doc.addEventListener("mousemove", this.handler.resize, false);
@@ -87 +116 @@
     }
   },
+  currentResize: function(event) {
+    var nodeName = this.target.nodeName.toLowerCase();
+    switch (event.keyCode) {
+    case KeyEvent.DOM_VK_UP: case KeyEvent.DOM_VK_K:
+      if (nodeName == "textarea")
+        this.target.style.height = this.target.clientHeight - 10 + "px";
+      break;
+    case KeyEvent.DOM_VK_DOWN: case KeyEvent.DOM_VK_J:
+      if (nodeName == "textarea")
+        this.target.style.height = this.target.clientHeight + 15 + "px";
+      break;
+    case KeyEvent.DOM_VK_LEFT: case KeyEvent.DOM_VK_H:
+      this.target.style.width = this.target.clientWidth - 10 + "px";
+      break;
+    case KeyEvent.DOM_VK_RIGHT: case KeyEvent.DOM_VK_L:
+      this.target.style.width = this.target.clientWidth + 15 + "px";
+      break;
+    case KeyEvent.DOM_VK_RETURN: case KeyEvent.DOM_VK_ENTER: case KeyEvent.DOM_VK_ESCAPE:
+      this.target.style.background = this.target.startBgColor;
+      setTimeout(function(self) {
+          self.doc.removeEventListener("keydown", self.handler.currentResize, false);
+          self.target.focus();
+        }, 10, this
+      );
+      break;
+    }
+    try{
+      event.preventDefault();
+    } catch (e) {}
+  },
   _bind: function() {
       var obj = Array.prototype.shift.apply(arguments);
@@ -99 +158 @@
 
 commands.addUserCommand(
-  [ "textareaResize", "tr" ], "resizable textarea.",
+  [ "textareaResize", "tr" ], "Allows you to resize textareas.",
   function() {
     var instance = new TextResizer(window.content.document);
-    instance.resizable.apply(instance, arguments);
+    instance.resizable.apply(instance);
   },
   null,
@@ -108 +167 @@
 );
 
+mappings.add(
+  [ modes.INSERT, modes.TEXTAREA ],
+  [ "<M-r>", "<A-r>" ],
+  "Allows you to resize current textarea.",
+  function() {
+    var instance = new TextResizer(window.content.document);
+    instance.resizable.apply(instance, [ document.commandDispatcher.focusedElement ]);
+  }
+);
+
 })();
 // vim: set fdm=marker sw=2 ts=2 sts=0 et: