diff --git a/examples/example4.html b/examples/example4.html
new file mode 100755
index 0000000..c8dc82e
--- /dev/null
+++ b/examples/example4.html
@@ -0,0 +1,96 @@
+
+
+
+
+ Mergely - Simple Example
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/lib/mergely.js b/lib/mergely.js
index b611cdb..64e4675 100644
--- a/lib/mergely.js
+++ b/lib/mergely.js
@@ -369,13 +369,25 @@ jQuery.extend(Mgly.mergely.prototype, {
lhs: function(setValue) { },
rhs: function(setValue) { },
loaded: function() { },
- height: function(h) { return h - 20; },
- width: function(w) { return w; },
+ _auto_height: function(h) { return h - 20; },
+ _auto_width: function(w) { return w; },
resize: function() {
var w = jQuery(el).parent().width();
var h = jQuery(window).height();
- if (this.width) w = this.width(w);
- if (this.height) h = this.height(h);
+ if (this.width == 'auto') {
+ w = this._auto_width(w);
+ }
+ else {
+ w = this.width;
+ this.editor_width = w;
+ }
+ if (this.height == 'auto') {
+ h = this._auto_height(h);
+ }
+ else {
+ h = this.height;
+ this.editor_height = h;
+ }
var content_width = w / 2.0 - 2 * 8 - 8;
var content_height = h;
var self = jQuery(el);
@@ -383,7 +395,7 @@ jQuery.extend(Mgly.mergely.prototype, {
self.find('.mergely-column, .mergely-canvas, .mergely-margin, .mergely-column textarea, .CodeMirror-scroll, .cm-s-default').css({ 'height': content_height + 'px' });
self.find('.mergely-canvas').css({ 'height': content_height + 'px' });
self.find('.mergely-column textarea').css({ 'width': content_width + 'px' });
- self.css({ 'width': w + 'px', 'height': h + 'px' });
+ self.css({ width: w, height: h, clear: 'both' });
if (self.css('display') == 'none') {
if (this.fadein != false) self.fadeIn(this.fadein);
else self.show();
@@ -1190,7 +1202,7 @@ jQuery.extend(Mgly.mergely.prototype, {
var dcanvas = document.getElementById(editor_name1 + '-' + editor_name2 + '-canvas');
if (dcanvas == undefined) throw 'Failed to find: ' + editor_name1 + '-' + editor_name2 + '-canvas';
- jQuery.each(jQuery('canvas'), function () {
+ jQuery.each(jQuery.find('#' + this.id + ' canvas'), function () {
jQuery(this).get(0).height = visible_page_height;
});
var clhs = jQuery('#' + this.id + '-lhs-margin');