Better window resizing behavior.

static/js/Editor.js

@@ -237,17 +237,20 @@ Editor.prototype.claim_iframe = function ( position_after, click_position ) {
 
   // hide the iframe to make this transition appear seamless
   addElementClass( this.iframe, "invisible" );
-  var frame_height = elementDimensions( this.div ).h;
-  var frame_width = elementDimensions( this.div ).w;
 
-  // give the invisible iframe the exact same position as the div it will replace
-  setElementPosition( this.iframe, getElementPosition( this.div ) );
+  // give the invisible iframe the exact same position as the div it will replace. subtract the
+  // position of the center_content_area container, which is relatively positioned
+  position = getElementPosition( this.div );
+  container_position = getElementPosition( "center_content_area" );
+  position.x -= container_position.x;
+  position.y -= container_position.y;
+  setElementPosition( this.iframe, position );
 
   // give the iframe the note's current contents and then resize it based on the size of the div
   var range = this.add_selection_bookmark();
   this.set_iframe_contents( this.contents() );
   this.remove_selection_bookmark( range );
-  this.resize( frame_height, frame_width );
+  this.resize( true );
 
   // make the completed iframe visible and hide the static div
   addElementClass( this.iframe, "focused_note_frame" );
@@ -557,10 +560,17 @@ Editor.prototype.query_command_value = function ( command ) {
 }
 
 // resize the editor's frame to fit the dimensions of its content
-Editor.prototype.resize = function ( height, width ) {
+Editor.prototype.resize = function ( get_height_from_div ) {
   if ( !this.document ) return;
+  var height = null;
+  var width = elementDimensions( this.div.parentNode ).w;
 
-  if ( height ) {
+  var size = { "w": width };
+  setElementDimensions( this.iframe, size );
+  setElementDimensions( this.div, size );
+
+  if ( get_height_from_div ) {
+    height = elementDimensions( this.div ).h;
     height -= FRAME_BORDER_HEIGHT * 2; // 2 pixels at the top and 2 at the bottom
   // if no height is given, get the height from this editor's document body
   } else {
@@ -571,13 +581,9 @@ Editor.prototype.resize = function ( height, width ) {
     }
   }
 
-  var size = { "h": height };
-  if ( width ) {
-    width -= FRAME_BORDER_WIDTH * 2; // 2 pixels at the top and 2 at the bottom
-    size[ "w" ] = width;
-  }
-
+  size = { "h": height };
   setElementDimensions( this.iframe, size );
+  setElementDimensions( this.div, size );
 }
 
 Editor.prototype.key_pressed = function ( event ) {

static/js/Wiki.js

@@ -85,7 +85,7 @@ function Wiki( invoker ) {
   connect( "search_text", "onkeyup", this, "search_key_released" );
   connect( "html", "onclick", this, "background_clicked" );
   connect( "html", "onkeydown", this, "key_pressed" );
-  connect( window, "onresize", this, "resize_editors" );
+  connect( window, "onresize", this, "resize_editor" );
   connect( window, "onresize", this, "resize_toolbar" );
   connect( document, "onmouseover", this, "detect_font_resize" );
 
@@ -859,12 +859,9 @@ Wiki.prototype.create_editor = function ( id, note_text, deleted_from_id, revisi
   return editor;
 }
 
-Wiki.prototype.resize_editors = function () {
-  var iframes = getElementsByTagAndClassName( "iframe", "note_frame" );
-  for ( var i in iframes ) {
-    var editor = iframes[ i ].editor;
-    editor.resize();
-  }
+Wiki.prototype.resize_editor = function () {
+  if ( Editor.shared_iframe.editor )
+    Editor.shared_iframe.editor.resize();
 }
 
 Wiki.prototype.resize_toolbar = function () {
@@ -898,7 +895,7 @@ Wiki.prototype.detect_font_resize = function () {
     return;
 
   this.font_size = style.fontSize;
-  this.resize_editors();
+  this.resize_editor();
 }
 
 Wiki.prototype.editor_state_changed = function ( editor, link_clicked ) {

view/Main_page.py

@@ -276,6 +276,9 @@ class Main_page( Page ):
                 notebook_path, len( notes ), total_notes_count, start, count,
                 return_text = u"return to the discussion",
               ),
+              Div(
+                id = u"iframe_area",
+              ),
               id = u"notebook_background",
               corners = ( u"tl", ),
             ),
@@ -284,9 +287,6 @@ class Main_page( Page ):
           ),
           id = u"center_content_area",
         ),
-        Div(
-          id = u"iframe_area",
-        ),
         Div(
           Note_tree_area(
             notebook,