src/js/CanvasView.js
function CaptionEditor(view) {
    var self = this;
    var attached = false;

    // text input for node edits.
    var $editor = $("<textarea/>", {
      id : "caption-editor",
      "class" : "node-text-behaviour"
    }).bind("keydown", "esc", function() {
      self.stop();
    }).bind("keydown", "return", function() {
      commitText();
    }).mousedown(function(e) {
      // avoid premature canceling
      e.stopPropagation();
    }).blur(function() {
      commitText();
    }).bind(
        "input",
        function() {
          var metrics = textMetrics.getTextMetrics(self.node,
              view.zoomFactor, $editor.val());
          $editor.css(metrics);
          alignBranches();
        });

    function commitText() {
      if (attached && self.commit) {
        self.commit(self.node, $editor.val());
      }
    }

    function alignBranches() {
      // slightly defer execution for better performance on slow
      // browsers
      setTimeout(function() {
        view.redrawNodeConnectors(self.node);
      }, 1);
    }

    /**
     * Attaches the textarea to the node and temporarily removes the
     * original node caption.
     * 
     * @param {mindmaps.Node} node
     * @param {jQuery} $cancelArea
     */
    this.edit = function(node, $cancelArea) {
      if (attached) {
        return;
      }
      this.node = node;
      attached = true;

      // TODO put text into span and hide()
      this.$text = $getNodeCaption(node);
      this.$cancelArea = $cancelArea;

      this.text = this.$text.text();

      this.$text.css({
        width : "auto",
        height : "auto"
      }).empty().addClass("edit");

      // jquery ui prevents blur() event from happening when dragging a
      // draggable. need this
      // workaround to detect click on other draggable
      $cancelArea.bind("mousedown.editNodeCaption", function(e) {
        commitText();
      });

      var metrics = textMetrics.getTextMetrics(self.node,
          view.zoomFactor, this.text);
      $editor.attr({
        value : this.text
      }).css(metrics).appendTo(this.$text).select();

    };

    /**
     * Removes the editor from the node and restores its old text value.
     */
    this.stop = function() {
      if (attached) {
        attached = false;
        this.$text.removeClass("edit");
        $editor.detach();
        this.$cancelArea.unbind("mousedown.editNodeCaption");
        view.setNodeText(this.node, this.text);

        alignBranches();
      }
    };
  }
function CaptionEditor(view) {
    var self = this;
    var attached = false;

    // text input for node edits.
    var $editor = $("<textarea/>", {
      id : "caption-editor",
      "class" : "node-text-behaviour"
    }).bind("keydown", "esc", function() {
      self.stop();
    }).bind("keydown", "return", function() {
      commitText();
    }).mousedown(function(e) {
      // avoid premature canceling
      e.stopPropagation();
    }).blur(function() {
      commitText();
    }).bind(
        "input",
        function() {
          var metrics = textMetrics.getTextMetrics(self.node,
              view.zoomFactor, $editor.val());
          $editor.css(metrics);
          alignBranches();
        });

    function commitText() {
      if (attached && self.commit) {
        self.commit(self.node, $editor.val());
      }
    }

    function alignBranches() {
      // slightly defer execution for better performance on slow
      // browsers
      setTimeout(function() {
        view.redrawNodeConnectors(self.node);
      }, 1);
    }

    /**
     * Attaches the textarea to the node and temporarily removes the
     * original node caption.
     * 
     * @param {mindmaps.Node} node
     * @param {jQuery} $cancelArea
     */
    this.edit = function(node, $cancelArea) {
      if (attached) {
        return;
      }
      this.node = node;
      attached = true;

      // TODO put text into span and hide()
      this.$text = $getNodeCaption(node);
      this.$cancelArea = $cancelArea;

      this.text = this.$text.text();

      this.$text.css({
        width : "auto",
        height : "auto"
      }).empty().addClass("edit");

      // jquery ui prevents blur() event from happening when dragging a
      // draggable. need this
      // workaround to detect click on other draggable
      $cancelArea.bind("mousedown.editNodeCaption", function(e) {
        commitText();
      });

      var metrics = textMetrics.getTextMetrics(self.node,
          view.zoomFactor, this.text);
      $editor.attr({
        value : this.text
      }).css(metrics).appendTo(this.$text).select();

    };

    /**
     * Removes the editor from the node and restores its old text value.
     */
    this.stop = function() {
      if (attached) {
        attached = false;
        this.$text.removeClass("edit");
        $editor.detach();
        this.$cancelArea.unbind("mousedown.editNodeCaption");
        view.setNodeText(this.node, this.text);

        alignBranches();
      }
    };
  }
function CaptionEditor ( view ) { var self = this ; var attached = false ; // text input for node edits.
 var $editor = $ ( "<textarea/>" , { id : "caption-editor" , "class" : "node-text-behaviour" } ) . bind ( "keydown" , "esc" , function ( ) { self . stop ( ) ; } ) . bind ( "keydown" , "return" , function ( ) { commitText ( ) ; } ) . mousedown ( function ( e ) { // avoid premature canceling
 e . stopPropagation ( ) ; } ) . blur ( function ( ) { commitText ( ) ; } ) . bind ( "input" , function ( ) { var metrics = textMetrics . getTextMetrics ( self . node , view . zoomFactor , $editor . val ( ) ) ; $editor . css ( metrics ) ; alignBranches ( ) ; } ) ; function commitText ( ) { if ( attached && self . commit ) { self . commit ( self . node , $editor . val ( ) ) ; } } function alignBranches ( ) { // slightly defer execution for better performance on slow
 // browsers
 setTimeout ( function ( ) { view . redrawNodeConnectors ( self . node ) ; } , 1 ) ; } /**
     * Attaches the textarea to the node and temporarily removes the
     * original node caption.
     * 
     * @param {mindmaps.Node} node
     * @param {jQuery} $cancelArea
     */ this . edit = function ( node , $cancelArea ) { if ( attached ) { return ; } this . node = node ; attached = true ; // TODO put text into span and hide()
 this . $text = $getNodeCaption ( node ) ; this . $cancelArea = $cancelArea ; this . text = this . $text . text ( ) ; this . $text . css ( { width : "auto" , height : "auto" } ) . empty ( ) . addClass ( "edit" ) ; // jquery ui prevents blur() event from happening when dragging a
 // draggable. need this
 // workaround to detect click on other draggable
 $cancelArea . bind ( "mousedown.editNodeCaption" , function ( e ) { commitText ( ) ; } ) ; var metrics = textMetrics . getTextMetrics ( self . node , view . zoomFactor , this . text ) ; $editor . attr ( { value : this . text } ) . css ( metrics ) . appendTo ( this . $text ) . select ( ) ; } ; /**
     * Removes the editor from the node and restores its old text value.
     */ this . stop = function ( ) { if ( attached ) { attached = false ; this . $text . removeClass ( "edit" ) ; $editor . detach ( ) ; this . $cancelArea . unbind ( "mousedown.editNodeCaption" ) ; view . setNodeText ( this . node , this . text ) ; alignBranches ( ) ; } } ; }
Creates a new CaptionEditor. This tool offers an inline editor component
to change a node's caption.

@constructor
@param {mindmaps.CanvasView} view
Creates a new CaptionEditor . This tool offers an inline editor component to change a node s caption .