Improve node editor

mindplot/src/main/javascript/libraries/moodialog/Overlay.js

@@ -24,7 +24,7 @@ var Overlay = new Class({
 		id: 'overlay',
 		color: '#000',
 		duration: 500,
-		opacity: 0.5,
+		opacity: 0.8,
 		zIndex: 5000/*,
 		onClick: $empty,
 		onClose: $empty,

mindplot/src/main/javascript/libraries/moodialog/css/MooDialog.css

@@ -1,95 +1,95 @@
 /* Created by Arian Stolwijk <http://www.aryweb.nl> */
 
 .MooDialog {
-/*	position: fixed;*/
-	width: 300px;
-	height: 100px;
-	position: fixed;
-	margin: -150px 0 0 -150px;
-	top: 50%;
-	left: 50%;
-	z-index: 50000;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    z-index: 11000;
+    width: 400px;
+    margin: -250px 0 0 -250px;
+    background-color: #ffffff;
+    border: 1px solid #999;
+    border: 1px solid rgba(0, 0, 0, 0.3);
+    *border: 1px solid #999;
+    /* IE6-7 */
 
-	background: #eef5f8;
-	color: black;
-	padding: 10px;
-	border-radius: 7px;
-	-moz-border-radius: 7px;
-	-webkit-border-radius: 7px;
-	border-radius: 7px;
-	-moz-box-shadow: 1px 1px 5px rgba(0,0,0,0.8);
-	-webkit-box-shadow: 1px 1px 5px rgba(0,0,0,0.8);
-	box-shadow: 1px 1px 5px rgba(0,0,0,0.8);
+    -webkit-border-radius: 6px;
+    -moz-border-radius: 6px;
+    border-radius: 6px;
+    -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
+    -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
+    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
+    -webkit-background-clip: padding-box;
+    -moz-background-clip: padding-box;
+    background-clip: padding-box;
+    padding: 30px;
 }
 
 .MooDialogTitle {
-	padding-top: 30px;
+    padding-top: 50px;
 }
 
 .MooDialog .content {
-	height: 100px;
+    height: 100px;
 }
 
 .MooDialog .title {
-	position: absolute;
-	top: 0;
-	left: 0;
-	right: 0;
-	padding: 3px 20px;
-	background: #b7c4dc;
-	border-bottom: 1px solid #a1aec5;
-	font-weight: bold;
-	text-shadow: 1px 1px 0 #fff;
-	color: black;
-	border-radius: 7px;
-	-moz-border-radius: 7px;
-	-webkit-border-radius: 7px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    border-bottom: 1px solid #a1aec5;
+    font-weight: bold;
+    text-shadow: 1px 1px 0 #fff;
+    /*color: black;*/
+    border-bottom: 1px solid #eee;
+    padding: 5px 30px;
+    font-size: 18px
 }
 
 .MooDialog .close {
-	background: url(dialog-close.png) no-repeat;
-	width: 16px;
-	height: 16px;
-	display: block;
-	cursor: pointer;
-	top: -5px;
-	left: -5px;
-	position: absolute;
+    background: url(dialog-close.png) no-repeat;
+    width: 16px;
+    height: 16px;
+    display: block;
+    cursor: pointer;
+    top: 8px;
+    left: 420px;
+    position: absolute;
 }
 
 .MooDialog .buttons {
-	text-align: right;
-	margin: 0;
-	padding: 0;
-	border: 0;
-	background: none;
+    text-align: right;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    background: none;
 }
 
 .MooDialog .iframe {
-	width: 100%;
-	height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 .MooDialog .textInput {
-	width: 200px;
-	float: left;
+    width: 200px;
+    float: left;
 }
 
 .MooDialog .MooDialogAlert,
 .MooDialog .MooDialogConfirm,
 .MooDialog .MooDialogPrompt,
 .MooDialog .MooDialogError {
-	background: url(dialog-warning.png) no-repeat;
-	padding-left: 40px;
-	min-height: 40px;
+    background: url(dialog-warning.png) no-repeat;
+    padding-left: 40px;
+    min-height: 40px;
 }
 
 .MooDialog .MooDialogConfirm,
 .MooDialog .MooDialogPromt {
-	background: url(dialog-question.png) no-repeat;
+    background: url(dialog-question.png) no-repeat;
 }
 
 .MooDialog .MooDialogError {
-	background: url(dialog-error.png) no-repeat;
+    background: url(dialog-error.png) no-repeat;
 }
-

mindplot/src/main/javascript/widget/Menu.js

@@ -386,4 +386,4 @@ mindplot.widget.Menu = new Class({
             elem.hide();
         });
     }
-});
+});

mindplot/src/main/javascript/widget/NoteEditor.js

@@ -22,7 +22,7 @@ mindplot.widget.NoteEditor = new Class({
         $assert(model, "model can not be null");
         var panel = this._buildPanel(model);
         this.parent({
-            closeButton:false,
+            closeButton:true,
             destroyOnClose:true,
             title:'Note',
             onInitialize: function(wrapper) {
@@ -69,7 +69,8 @@ mindplot.widget.NoteEditor = new Class({
         if (model.getValue() != null)
             textArea.value = model.getValue();
 
-        textArea.setStyles({'width':280, 'height':65});
+        textArea.setStyles({'width':'100%', 'height':80,resize: 'none'
+        });
         textArea.inject(form);
 
         // Add buttons ...