Working on a HTML version of the editor

wise-doc/src/main/webapp/css/bubble.css

@@ -0,0 +1,242 @@
+.bubbleContainer {
+    position: absolute;
+    z-index: 50;
+    opacity: 0;
+    width: auto;
+    overflow: hidden;
+    padding: 20px;
+    -moz-border-radius: 5px;
+    border-radius: 5px;
+    background-color: #BCCCE1;
+    -moz-box-shadow: 5px 5px 5px #888;
+    -webkit-box-shadow: 5px 5px 5px #888;
+    box-shadow: 5px 5px 5px #888;
+    border: 1px solid black;
+}
+
+.bublePartContainer {
+    clear: both;
+}
+
+.bubblePart {
+    float: left;
+}
+
+.bubbleLeft {
+    background: transparent url(../images/bubbleTip_left.png) top left;
+    width: 12px;
+    height: 4px;
+}
+
+.bubbleCenter {
+    background-color: #362d2e;
+    text-align: center;
+    z-index: 60;
+}
+
+.bubbleRight {
+    background: transparent url(../images/bubbleTip_right.png) top left;
+    width: 23px;
+    height: 4px;
+}
+
+.bubbleTopLeft {
+    background: transparent url(../images/bubbleTip_corner_top_left.png) top left;
+    width: 12px;
+    height: 12px;
+}
+
+.bubbleHintTopLeft {
+    background: transparent url(../images/bubbleTip_pico_corner_top_left.png) top left;
+    width: 12px;
+    height: 57px;
+}
+
+.bubbleTopRight {
+    background: transparent url(../images/bubbleTip_corner_top_right.png) top left;
+    width: 23px;
+    height: 12px;
+}
+
+.bubbleHintTopRight {
+    background: transparent url(../images/bubbleTip_pico_corner_top_right.png) top left;
+    width: 23px;
+    height: 57px;
+}
+
+.bubbleTop {
+    background: transparent url(../images/bubbleTip_top.png) top left;
+    height: 12px;
+    width: 4px;
+}
+
+.bubbleHintTop {
+    background: transparent url(../images/bubbleTip_pico_top.png) top left;
+    height: 57px;
+    width: 4px;
+}
+
+.bubbleBottomLeft {
+    background: transparent url(../images/bubbleTip_corner_bottom_left.png) top left;
+    width: 12px;
+    height: 26px;
+}
+
+.bubbleHintBottomLeft {
+    background: transparent url(../images/bubbleTip_pico_corner_bottom_left.png) top left;
+    width: 12px;
+    height: 62px;
+}
+
+.bubbleBottomRight {
+    background: transparent url(../images/bubbleTip_corner_bottom_right.png) top left;
+    width: 23px;
+    height: 26px;
+}
+
+.bubbleHintBottomRight {
+    background: transparent url(../images/bubbleTip_pico_corner_bottom_right.png) top left;
+    width: 23px;
+    height: 62px;
+}
+
+.bubbleBottom {
+    background: transparent url(../images/bubbleTip_bottom.png) top left;
+    height: 26px;
+    width: 4px;
+}
+
+.bubbleHintBottom {
+    background: transparent url(../images/bubbleTip_pico_bottom.png) top left;
+    height: 62px;
+    width: 4px;
+}
+
+.bubbleBottomHint {
+    background: transparent url(../images/bubbleTip_bottom_pico.png) top left;
+    width: 58px;
+    height: 62px;
+}
+
+.bubbleTopHint {
+    background: transparent url(../images/bubbleTip_top_pico.png) top left;
+    width: 58px;
+    height: 57px;
+}
+
+.bubbleLeftBlue {
+    background: transparent url(../images/bubbleTip_left_blue.gif) top left;
+    width: 12px;
+    height: 4px;
+}
+
+.bubbleCenterBlue {
+    background-color: #BCCCE1;
+    z-index: 60;
+    overflow: hidden;
+}
+
+.bubbleRightBlue {
+    background: transparent url(../images/bubbleTip_right_blue.gif) top left;
+    width: 23px;
+    height: 3px;
+}
+
+.bubbleTopLeftBlue {
+    background: transparent url(../images/bubbleTip_corner_top_left_blue.gif) top left;
+    width: 12px;
+    height: 18px;
+}
+
+.bubbleHintTopLeftBlue {
+    background: transparent url(../images/bubbleTip_pico_corner_top_left_blue.gif) top left;
+    width: 13px;
+    height: 61px;
+}
+
+.bubbleTopRightBlue {
+    background: transparent url(../images/bubbleTip_corner_top_right_blue.gif) top left;
+    width: 23px;
+    height: 18px;
+}
+
+.bubbleHintTopRightBlue {
+    background: transparent url(../images/bubbleTip_pico_corner_top_right_blue.gif) top left;
+    width: 23px;
+    height: 61px;
+}
+
+.bubbleTopBlue {
+    background: transparent url(../images/bubbleTip_top_blue.gif) top left;
+    height: 18px;
+    width: 3px;
+}
+
+.bubbleHintTopBlue {
+    background: transparent url(../images/bubbleTip_pico_top_blue.gif) top left;
+    height: 61px;
+    width: 3px;
+}
+
+.bubbleBottomLeftBlue {
+    background: transparent url(../images/bubbleTip_corner_bottom_left_blue.gif) top left;
+    width: 13px;
+    height: 32px;
+}
+
+.bubbleHintBottomLeftBlue {
+    background: transparent url(../images/bubbleTip_pico_corner_bottom_left_blue.gif) top left;
+    width: 12px;
+    height: 62px;
+}
+
+.bubbleBottomRightBlue {
+    background: transparent url(../images/bubbleTip_corner_bottom_right_blue.gif) top left;
+    width: 23px;
+    height: 32px;
+}
+
+.bubbleHintBottomRightBlue {
+    background: transparent url(../images/bubbleTip_pico_corner_bottom_right_blue.gif) top left;
+    width: 23px;
+    height: 62px;
+}
+
+.bubbleBottomBlue {
+    background: transparent url(../images/bubbleTip_bottom_blue.gif) top left;
+    height: 32px;
+    width: 3px;
+}
+
+.bubbleHintBottomBlue {
+    background: transparent url(../images/bubbleTip_pico_bottom_blue.gif) top left;
+    height: 62px;
+    width: 3px;
+}
+
+.bubbleBottomHintBlue {
+    background: transparent url(../images/bubbleTip_bottom_pico_blue.png) top left;
+    width: 58px;
+    height: 62px;
+}
+
+.bubbleTopHintBlue {
+    background: transparent url(../images/bubbleTip_top_pico_blue.png) top left;
+    width: 58px;
+    height: 61px;
+}
+
+.btn-primary {
+    background: #3399CC;
+    border: 1px solid #006699;
+    color: #FFFFFF;
+    font-family: arial, helvetica, sans-serif;
+    font-size: 72%;
+    font-style: normal;
+    font-variant: normal;
+    font-weight: normal;
+    line-height: normal;
+    overflow: visible;
+    padding: 2px 8px 1px;
+    vertical-align: middle;
+}

wise-doc/src/main/webapp/css/common.css

@@ -0,0 +1,596 @@
+body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
+    margin: 0;
+    padding: 0;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+fieldset, img {
+    border: 0;
+}
+
+address, caption, cite, code, dfn, em, strong, th, var {
+    font-style: normal;
+    font-weight: normal;
+}
+
+ol, ul {
+    list-style: none;
+}
+
+caption, th {
+    text-align: left;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    font-size: 100%;
+    font-weight: normal;
+}
+
+q:before, q:after {
+    content: '';
+}
+
+abbr, acronym {
+    border: 0;
+}
+
+/**
+ * Percents could work for IE, but for backCompat purposes, we are using keywords.
+ * x-small is for IE6/7 quirks mode.
+ *
+ */
+body {
+    font: 13px arial, helvetica, clean, sans-serif;
+    font-size: small;
+    font: x-small;
+}
+
+table {
+    font-size: inherit;
+    font-size: 100%;
+}
+
+/**
+ * 99% for safari; 100% is too large
+ */
+select, input, textarea {
+    font: 99% arial, helvetica, clean, sans-serif;
+}
+
+/**
+ * Bump up !IE to get to 13px equivalent
+ */
+pre, code {
+    font: 115% monospace;
+    font-size: 100%;
+}
+
+/**
+ * Default line-height based on font-size rather than "computed-value"
+ * see: http://www.w3.org/TR/CSS21/visudet.html#line-height
+ */
+
+body * {
+    line-height: 1.22em;
+}
+
+* {
+    margin: 0;
+    padding: 0;
+}
+
+body {
+    font: normal 80% "trebuchet ms", verdana, arial, helvetica, sans-serif;
+    background-color: #fff;
+}
+
+img {
+    border: 0;
+}
+
+form {
+    padding: 0px;
+    margin: 0px;
+}
+
+p {
+    margin: 5px 0 5px 0;
+}
+
+ul {
+    list-style-position: inside;
+}
+
+a:link, a:visited {
+    font: bold 100%;
+    text-decoration: underline;
+    color: black;
+}
+
+a:hover, a:active {
+    font: bold 100%;
+    text-decoration: underline;
+    color: black;
+}
+
+h2 {
+    font-size: 160%;
+    color: #8e9181;
+}
+
+h1 {
+    font-style: normal;
+    font-size: 180%;
+    color: white;
+    padding-bottom: 2px;
+}
+
+h3 {
+/* use as subhead on main body */
+    clear: left;
+    font-style: normal;
+    font-size: 130%;
+    color: #6b6f5b;
+}
+
+h4 {
+/* use as headers in footer */
+    font-weight: bold;
+    font-size: 120%;
+    border-bottom: 1px solid #8e9181;
+    color: #e2e3dd;
+    padding-bottom: 10px;
+    width: 400px;
+}
+
+#centerContent {
+    text-align: center;
+}
+
+/* HEADER STYLES */
+
+#header {
+    margin-top: 2px;
+    height: 78px;
+    width: 100%;
+    background: white;
+    border-bottom: 1px solid #bbb4d6;
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+#headerToolbar {
+    height: 25px;
+    width: 100%;
+    background-color: #171a17;
+    border-top: 1px solid #999999;
+    border-bottom: 1px solid #424141;
+    color: white;
+    font-size: small;
+    font-style: normal;
+}
+
+#headerContent {
+    width: 800px;
+    height: 78px;
+    position: relative;
+    top: 0;
+    left: 0;
+    margin: auto;
+}
+
+#headerLogo {
+    margin-top: 8px;
+    height: 80px;
+    width: 134px;
+    background: url("../images/logo-small.png") no-repeat;
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+#headerSlogan {
+    position: absolute;
+    border-left: 1px dashed gray;
+    margin-top: 8px;
+    height: 1em;
+    width: 100px;
+    top: 40px;
+    left: 137px;
+    white-space: nowrap;
+    padding-left: 7px;
+    font-weight: bold;
+    vertical-align: middle;
+}
+
+#headerButtons {
+    position: absolute;
+    top: 65px;
+    left: 150px;
+}
+
+#newsLink, #blogLink, #aboutLink, #newsLink, #faqLink, #feedbackLink, #supportLink, #logoutLink {
+    float: right;
+    z-index: 300;
+}
+
+div#headerButtons a {
+    float: left;
+    color: #6F6F6F;
+    padding: 0 10px;
+    text-decoration: none;
+    font-weight: bold;
+    font-size: 120%;
+    white-space: nowrap;
+}
+
+div#headerTitle {
+    float: left;
+    font-weight: bold;
+    font-size: 15px;
+    margin-right: 5px;
+    margin-left: 5px;
+}
+
+div#printHeader {
+    background-color: black;
+    height: 35px;
+    color: white;
+}
+
+span#headerSubTitle {
+    font-weight: lighter;
+    font-size: 12px;
+}
+
+div#headerButtons a:hover {
+/*text-decoration: underline;*/
+    color: #7e72ad;
+}
+
+div#headerButtons activelink a, div#headerButtons activelink a:hover {
+    text-decoration: none;
+    border-top: 0;
+    border-bottom: 0;
+}
+
+#signUpHeader {
+    padding-right: 8px;
+    padding-top: 4px;
+    position: absolute;
+    right: 0;
+    z-index: 50;
+    text-align: center;
+}
+
+#signUpHeader a, #signUpHeader a:hover {
+    font-size: 100%;
+    color: #BBB4D6;
+    text-decoration: underline;
+}
+
+#editorHeader {
+    height: 40px;
+    width: 100%;
+    background: white;
+    border-bottom: 1px solid #bbb4d6;
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+#editorHeader #headerToolbar {
+    height: 40px;
+    width: 100%;
+    background-color: #171a17;
+    border-top: 1px solid #999999;
+    border-bottom: 1px solid #424141;
+    color: white;
+    font-size: small;
+    font-style: normal;
+}
+
+div#editorHeader div#headerTitle {
+    float: left;
+    font-weight: bold;
+    font-size: 22px;
+    margin-right: 5px;
+    margin-left: 5px;
+}
+
+div#editorHeader span#headerSubTitle {
+    font-weight: lighter;
+    font-size: 12px;
+}
+
+div#editorHeader div#headerActions {
+    padding-right: 8px;
+    padding-top: 4px;
+    position: absolute;
+    right: 0;
+    top: 4px;
+    z-index: 50;
+}
+
+div#editorHeader div#headerActions a:hover, div#headerActions a:active, div#headerActions a:link, div#headerActions a:visited {
+    color: white;
+}
+
+#footer {
+    width: 100%;
+    border-top: 1px solid #8e9181;
+    text-align: center;
+    font-size: 90%;
+    background-color: white;
+    float: left;
+}
+
+div#printFooter {
+    height: 60px;
+    width: 100%;
+    background: #E5E5E5;
+    border-top: 1px solid #bbb4d6;
+}
+
+div#printLogo {
+    height: 50px;
+    width: 80px;
+    float: right;
+    margin: 1px;
+    background: url(../images/logo-vsmall.png) no-repeat right top;
+}
+
+.btn-primary {
+    background: #3399CC;
+    border: 1px solid #006699;
+    color: #FFFFFF;
+    font-family: arial, helvetica, sans-serif;
+    font-size: 92%;
+    font-style: normal;
+    font-variant: normal;
+    font-weight: bold;
+    line-height: normal;
+    overflow: visible;
+    padding: 2px 8px 1px;
+    vertical-align: middle;
+}
+
+div#paypal {
+    float: left;
+    margin: -29px;
+}
+
+.errorMsg {
+    color: #990000;
+    font-size: 90%;
+    font-weight: bold;
+    padding-left: 5px;
+}
+
+#headerLogo {
+    cursor: pointer;
+}
+
+#headerLoading {
+    padding-left: 40px;
+    background: url('../images/ajax-loader.gif') #BBB4D6 no-repeat left;
+    position: absolute;
+    right: 3px;
+    top: 5px;
+    width: 75px;
+    height: 20px;
+    color: white;
+    font-weight: bold;
+    border: 1px solid;
+    border-color: #f5f5f5;
+    background-position: 5px 2px;
+    visibility: hidden;
+}
+
+div#headerActions {
+    padding-right: 8px;
+    padding-top: 4px;
+    position: absolute;
+    right: 0;
+    z-index: 50;
+}
+
+div#headerActions a:hover, div#headerActions a:active, div#headerActions a:link, div#headerActions a:visited {
+    color: white;
+}
+
+div.header_languages {
+    position: absolute;
+    right: 0;
+    top: 30px;
+    width: 100px;
+    height: 20px;
+}
+
+div.header_language_flag {
+    float: left;
+    margin-right: 3px;
+}
+
+/*---   Modal Dialog Form  ---*/
+div.modalDialog {
+    padding: 15px 30px;
+}
+
+div.modalDialog td {
+    padding: 3px;
+}
+
+div.modalDialog h1 {
+    color: #093A9D;
+    font-size: 200%;
+    margin-bottom: 5px;
+    font-weight: bold;
+}
+
+div.modalDialog h2 {
+    color: gray;
+    font-size: 110%;
+    margin: 9px 0;
+}
+
+div.modalDialog h5 {
+    color: gray;
+    font-size: 90%; /*border-bottom: 1px dashed #BBB4D6;*/
+}
+
+/*---   End Modal Dialog Form  ---*/
+
+/*--   Main Page Style  -- */
+div.pageBody {
+    margin: 10px auto;
+    width: 800px;
+    min-height: 500px;
+}
+
+div.pageBodyContent {
+    padding-top: 30px;
+}
+
+div.pageBodyContent h1 {
+    color: #093A9D;
+    font-size: 200%;
+    margin-bottom: 5px;
+    font-weight: bold;
+}
+
+div.pageBodyContent h2 {
+    color: gray;
+    font-size: 150%;
+    border-bottom: 1px dashed #BBB4D6;
+    margin: 20px 0;
+}
+
+div.pageBodyContent ul {
+    padding: 5px;
+}
+
+div.pageBodyContent li {
+    list-style-type: disc;
+    margin-left: 12px;
+}
+
+/*--   End Main Page Style -- */
+
+/* Share Styles */
+#userEmails {
+    float: left;
+    width: 50%;
+    padding: 5px;
+}
+
+#userEmails textarea {
+    width: 100%;
+}
+
+#currentUsers {
+    float: left;
+    width: 40%;
+    height: 400px;
+    padding: 5px;
+    padding-left: 15px;
+    margin-left: 15px;
+    border-left: 1px dotted gray;
+}
+
+#currentUsers table {
+    width: 100%;
+}
+
+#invitation {
+    border: 1px dotted gray;
+}
+
+td.formLabel {
+    text-align: right;
+    padding: 2px 10px;
+    white-space: nowrap;
+    font-weight: bolder;
+    vertical-align: top;
+}
+
+span.fieldRequired {
+    font-weight: bold;
+    color: #ff4500;
+    margin: 0 4px;
+}
+
+#keyboardTable {
+    clear: both;
+    width: 100%;
+    height: 300px;
+    overflow: auto;
+    border: 0 solid gray;
+    background-color: white;
+    z-index: 2;
+    position: relative;
+}
+
+#keyboardTable table {
+    width: 100%;
+    border: 0 solid gray;
+}
+
+#keyboardTable thead {
+    background-color: #093A9D;
+    font-size: 12px;
+    font-weight: normal;
+    padding: 5px;
+}
+
+#keyboardTable td {
+    border-bottom: 1px solid #EEEEEE;
+    color: #5f5f5f;
+    font-size: 12px;
+    padding: 3px;
+}
+
+#keyboardTable th {
+    color: white;
+    border-right: 1px dotted #ffffff;
+    font-weight: bold;
+    text-align: center;
+    font-size: 12px;
+    padding: 5px;
+}
+
+#keyboardTable tbody tr:hover {
+    background-color: #E2f0f6;
+}
+
+#keyboardTable tr {
+    padding: 5px;
+}
+
+
+div.installCFG {
+    width:100%;
+    font-size:130%;
+}
+
+div.installCFG h1{
+    width:100%;
+    font-size:130%;
+}
+
+div.installCFG h2{
+    font-size:100%;
+    border-bottom:0 solid black;
+}
+
+.chromeFrameInstallDefaultStyle {
+    position:relative;
+    left:0;
+    top:0;
+    margin:0;
+}

wise-doc/src/main/webapp/css/commonLibs.css

@@ -0,0 +1,73 @@
+/*Moodal Dialog styles*/
+
+/* moodalbox CSS */
+
+div#mb_overlay {
+    position: absolute;
+    left: 0;
+    width: 100%;
+    background-color: #000;
+    cursor: pointer;
+    z-index: 98;
+}
+
+div#mb_center, div#mb_bottom {
+    position: absolute;
+    left: 50%;
+    overflow: hidden;
+    background-color: #DDD;
+    z-index: 98;
+}
+
+div#mb_center {
+    background-color: #FFF;
+}
+
+div#mb_contents {
+    width: 400px;
+    height: 400px;
+    border: 10px solid #DDD;
+    overflow: auto;
+    background-color: #FFF;
+    visibility: hidden;
+}
+
+.mb_loading {
+    background: #DDD url( ../images/loading.gif ) no-repeat center center;
+}
+
+#mb_error {
+    font-size: 1.2em;
+    color: #CD0000;
+    font-weight: bold;
+    text-align: center;
+    padding: 0.5em;
+    font-family: Verdana, Helvetica, sans-serif;
+}
+
+#mb_error em {
+    font-size: 0.8em;
+}
+
+div#mb_bottom {
+    font-family: Verdana, Helvetica, sans-serif;
+    font-size: 10px;
+    color: #666;
+    line-height: 1.4em;
+    text-align: left;
+    border: 10px solid #DDD;
+    border-top-style: none;
+}
+
+a#mb_close_link {
+    display: block;
+    float: right;
+    width: 66px;
+    height: 22px;
+    background: transparent url( ../images/closelabel.gif ) no-repeat center;
+    margin: 5px 0;
+}
+
+div#mb_caption {
+    margin-right: 71px;
+}

wise-doc/src/main/webapp/css/editor.css

@@ -0,0 +1,742 @@
+@import "common.css";
+@import "commonLibs.css";
+@import "thirdparty.css";
+
+html {
+    overflow: hidden;
+}
+
+#waitDialog {
+    position: absolute;
+    top: 10px;
+    left: 10px;
+    height: 200px;
+}
+
+#firstHeader {
+    width: 100%;
+}
+
+#subHeader {
+    position: absolute;
+    width: 100%;
+    height: 55px;
+    top: 30px;
+}
+
+#waitingContainer,#errorContainer {
+    position: relative;
+    top: 80px;
+    height: 120px; /*background: whitesmoke;*/
+    background: #FEFEFE;
+    opacity: .99;
+    padding: 15px;
+    width: 100%;
+    border: 1px solid;
+    border-color:#a9a9a9;
+
+}
+
+#errorContainer {
+    width: 400px;
+    border: 1px solid red;
+}
+
+#waitingContainer .loadingText {
+    position: relative;
+    top: 50%;
+    margin-top: -35px;
+    font-size: 30px;
+    font-weight: bold;
+    vertical-align: text-bottom;
+    height: 30px;
+    float: left;
+}
+
+#errorContainer .loadingText {
+    position: relative;
+    top: 50%;
+    margin-top: -80px;
+    font-size: 15px;
+    font-weight: bold;
+    vertical-align: text-bottom;
+    height: 30px;
+    float: right;
+    padding-left:120px;
+}
+
+#waitingContainer .loadingIcon {
+    position: relative;
+    background: url(../images/loadingIcon.gif) no-repeat;
+    top: 50%;
+    margin-top: -65px;
+    height: 100px;
+    width: 121px;
+    float: left;
+    clear: both;
+}
+
+#errorContainer .loadingIcon {
+    position: relative;
+    background: url(../images/errorIcon.png) no-repeat;
+    top: 50%;
+    margin-top: -65px;
+    height: 100px;
+    width: 121px;
+    float: left;
+    clear: both;
+}
+
+#infoContainer {
+    float: left;
+}
+
+#infoContainer {
+    float: left;
+    padding-left: 5px;
+}
+
+#title {
+    position: relative;
+    left: 120px;
+    top: 80px;
+}
+
+#operationsContainer {
+    font-size: 12px;
+    float: right;
+    padding: 0 5px;
+}
+
+#operationsContainer a {
+    padding: 0 5px;
+}
+
+#user {
+    font-weight: bold;
+    margin-right: 5px;
+}
+
+#toolbar {
+    width: 100%;
+    height: 25px;
+    color: #ffffff;
+    border-bottom: 2px solid black;
+    position: absolute;
+    top: 35px;
+}
+
+div#toolbar .buttonContainer {
+    height: 44px;
+    float: left;
+    color: black;
+}
+
+.buttonContainer fieldset {
+    border: 1px solid #BBB4D6;
+    padding: 2px;
+    margin: 1px;
+    padding-bottom: 4px;
+}
+
+.buttonContainer legend {
+    padding: 0.2em 0.5em;
+    border: 1px solid #BBB4D6;
+    background-color: #F5F5F5;
+    color: #BBB4D6;
+    font-size: 11px;
+    text-align: right;
+    margin: 0;
+    -moz-margin-start: 7px;
+    -moz-margin-end: 7px;
+}
+
+div#toolbar .button {
+    width: 32px;
+    height: 36px;
+    float: left;
+    margin: 0 2px 2px 2px;
+    cursor: pointer;
+    text-align: center;
+}
+
+div#toolbar .comboButton {
+    width: 34px;
+}
+
+div#toolbar .button:hover {
+    width: 32px;
+    height: 36px;
+    float: left;
+    margin: 0 1px;
+    cursor: pointer;
+    border: 1px solid black;
+    border-top-color: white;
+    border-left-color: white;
+}
+
+div#toolbar .comboButton:hover {
+    width: 34px;
+}
+
+div#toolbar .button img {
+    width: 30px;
+    height: 30px;
+    border: 0;
+}
+
+div#toolbar .toolbarLabel {
+    position: relative;
+    top: 55%;
+    text-align: center;
+    width: 34px;
+    height: 36px;
+    font-size: 10px;
+}
+
+.mapSeparator {
+    width: 1px;
+    height: 20px;
+    background-color: #166D66;
+    float: left;
+    margin: 5px 3px;
+}
+
+div#file, div#zoom, div#node, div#font, div#share {
+    position: absolute;
+    top: -6px;
+    left: 3px;
+}
+
+div#zoom {
+    left: 229px;
+}
+
+div#node {
+    left: 311px;
+}
+
+div#font {
+    left: 679px; /*left:581px;*/
+}
+
+div#share {
+    left: 874px; /*left:777px;*/
+}
+
+div#saveButton {
+    background: url(../images/save.png) no-repeat center top;
+}
+
+div#discardButton {
+    background: url(../images/close.png) no-repeat center top;
+}
+
+div#history {
+    background: url(../images/history.png) no-repeat center top;
+}
+
+div#print {
+    background: url(../images/file_printer.png) no-repeat center top;
+}
+
+div#undoEdition {
+    background: url(../images/file_undo_dis.png) no-repeat center top;
+}
+
+div#redoEdition {
+    background: url(../images/file_redo_dis.png) no-repeat center top;
+}
+
+#export {
+    background: url(../images/file_export.png) no-repeat center top;
+    position:relative;
+}
+
+#exportAnchor {
+    position:absolute;
+    width:100%;
+    height:100%;
+    top:0;
+    left:0;
+}
+
+div#zoomIn {
+    background: url(../images/zoom_in.png) no-repeat center top;
+}
+
+#zoomOut {
+    background: url(../images/zoom_out.png) no-repeat center top;
+}
+
+#addTopic {
+    background: url(../images/topic_add.png) no-repeat center top;
+}
+
+#deleteTopic {
+    background: url(../images/topic_delete.png) no-repeat center top;
+}
+
+div#topicColor {
+    background: url(../images/topic_bgcolor.png) no-repeat center top;
+    z-index: 4;
+}
+
+div#topicIcon {
+    background: url(../images/topic_icon.png) no-repeat center top;
+    z-index: 4;
+}
+
+div#topicNote {
+    background: url(../images/note.png) no-repeat center top;
+    z-index: 4;
+}
+
+div#topicLink {
+    background: url(../images/topic_link.png) no-repeat center top;
+    z-index: 4;
+}
+
+div#topicNote {
+    background-image: url(../images/note.png);
+    z-index: 4;
+}
+
+#topicBorder {
+    background: url(../images/topic_border.png) no-repeat center top;
+    width: 30px;
+}
+
+#fontFamily {
+    background: url(../images/font_type.png) no-repeat center top;
+}
+
+#topicShape {
+    background: url(../images/topic_shape.png) no-repeat center top;
+    width: 30px;
+}
+
+#fontBold {
+    background: url(../images/font_bold.png) no-repeat center top;
+}
+
+#fontItalic {
+    background: url(../images/font_italic.png) no-repeat center top;
+}
+
+div#fontColor {
+    background: url(../images/font_color.png) no-repeat center top;
+    z-index: 4;
+}
+
+#fontSize {
+    float: left;
+    background: url(../images/font_size.png) no-repeat center top;
+}
+
+#font-size {
+    font-size: 10px;
+}
+
+.wiseToolbarButton {
+    float: left;
+    height: 16px;
+    cursor: pointer;
+    font-size: 10px;
+    font-weight: bold;
+    margin-right: 15px;
+}
+
+#shareIt {
+    background: url(../images/collab_share.png) no-repeat center top;
+}
+
+#publishIt {
+    background: url(../images/collab_publish.png) no-repeat center top;
+}
+
+#tagIt {
+    background: url(../images/collab_tag.png) no-repeat center top;
+}
+
+#colorPalette {
+    border: 1px solid #bbb4d6;
+    display: none;
+    position: absolute;
+    z-index: 4;
+    width: 160px;
+    top: 89px;
+}
+
+#paletteHeader {
+    background-color: #E5E5E5;
+    height: 4px;
+}
+
+.toolbarPanel {
+    color: black;
+    border: 1px solid #bbb4d6;
+    background: #E5E5E5;
+    display: none;
+    position: absolute;
+    z-index: 4;
+    top: 71px;
+}
+
+div.toolbarPanelLink {
+    cursor: pointer;
+    font-size: 14px;
+    color: black;
+    font-weight: bold;
+    padding: 0 3px 0 4px;
+    margin: 1px;
+}
+
+div.toolbarPanelLink {
+    cursor: pointer;
+    font-size: 12px;
+    font-weight: bold;
+    padding: 0 3px 0 4px;
+    margin: 1px;
+}
+
+div.toolbarPanelLink:hover {
+    cursor: pointer;
+    font-weight: bold;
+    background-color: #c3def5;
+}
+
+div.toolbarPanelLinkSelectedLink {
+    cursor: pointer;
+    color: white;
+    font-weight: bold;
+    padding: 0 3px 0 4px;
+    margin: 1px;
+    background-color: #c3def5;
+}
+
+div#actionsContainer {
+    position: absolute;
+    z-index: 50;
+    top: 35px;
+    width: 190px;
+    right: 0;
+    margin: 10px;
+    float: left;
+}
+
+#actionsContainer .button {
+    float: right;
+    font-size: 12px;
+    font-weight: bold;
+    white-space: nowrap;
+    color: #ffffff;
+    cursor: pointer;
+    margin: 2px;
+    z-index: 4;
+}
+
+#actionsContainer .button:hover {
+    color: blue;
+}
+
+#actionsContainer .mainButton {
+    float: right;
+    font-size: 12px;
+    font-weight: bold;
+    white-space: nowrap;
+    color: #ffffff;
+    cursor: pointer;
+    margin: 2px;
+    z-index: 4;
+}
+
+#actionsContainer a {
+    text-decoration: none;
+}
+
+#actionsContainer .buttonStart {
+    width: 6px;
+    height: 25px;
+    background: url(../images/btnStart2.png) no-repeat left top;
+    float: left;
+}
+
+#actionsContainer .buttonBody {
+    background: url(../images/btnBody2.png);
+    float: left;
+    height: 18px;
+    padding: 5px 5px 0;
+    text-align: center;
+    color: black;
+}
+
+#actionsContainer .buttonEnd {
+    width: 7px;
+    height: 23px;
+    background: url(../images/btnEnd2.png) no-repeat right top;
+    float: left;
+}
+
+/* ------------- Footer Styles -------------------------*/
+div#footerEditor {
+    position: absolute;
+    height: 60px;
+    width: 100%;
+    background: #E5E5E5;
+    border-top: 1px solid #bbb4d6;
+    bottom: 0;
+}
+
+#logo {
+    height: 50px;
+    width: 80px;
+    float: right;
+    margin: 5px;
+    background: url(../images/logo-vsmall.png) no-repeat right top;
+}
+
+#footerEditor .msgLoggerContainer {
+    position: relative;
+    width: 550px;
+    height: 36px;
+    left: 50%;
+    margin-left: -300px;
+    top: 10px;
+    opacity: 0;
+    visibility: hidden;
+}
+
+div#msgStart {
+    float: left;
+    height: 36px;
+    width: 16px;
+    background: url(../images/footerStart.png) no-repeat right top;
+}
+
+div#msgEnd {
+    float: left;
+    height: 36px;
+    width: 16px;
+    background: url(../images/footerEnd.png) no-repeat right top;
+
+}
+
+div#msgLogger {
+    float: left;
+    height: 36px;
+    width: 500px;
+    background: url(../images/footerBody.png) repeat-x right top;
+    text-align: center;
+    white-space: nowrap;
+    padding: 5px;
+    font-size: 13px;
+    font-weight: bold;
+}
+
+/** Tab labels */
+div#tabsHolder {
+    width: 100%;
+    height: 20px;
+}
+
+div#tabs {
+    float: left;
+}
+
+div.tabContent {
+    clear: left;
+    width: 100%;
+    height: 63px;
+    border-bottom: 1px solid #bbb4d6;
+    border-top: 1px solid #bbb4d6;
+    background: #E5E5E5;
+    display: none;
+    position: absolute;
+    left: 0;
+}
+
+ol#toc {
+    height: 2em;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+ol#toc li {
+    float: left;
+    margin: 0 1px 0 0;
+    border: 0;
+}
+
+ol#toc a {
+    background: #fff url(../images/tab4.png);
+    color: #008;
+    display: block;
+    float: left;
+    height: 25px;
+    padding-left: 10px;
+    text-decoration: none;
+}
+
+ol#toc a:hover {
+    background-color: #fff;
+    background-position: 0 -121px;
+}
+
+ol#toc a:hover span {
+    background-position: 100% -121px;
+}
+
+ol#toc li.current a {
+    background-color: #fff;
+    background-position: 0 -61px;
+    color: #008;
+    font-weight: bold;
+}
+
+ol#toc li.current span {
+    background-position: 100% -61px;
+}
+
+ol#toc span {
+    background: #fff url(../images/tab4.png) 100% 0;
+    display: block;
+    line-height: 2em;
+    padding-right: 10px;
+}
+
+#mindplot {
+    position: relative;
+    top: 103px;
+    left: 0;
+    width: 100%;
+    border: 0;
+}
+
+#workspaceContainer {
+    background: url(../images/grid.gif) bottom left repeat !important;
+}
+
+div#mapInfo {
+    float: right;
+    color: #008;
+    padding-right: 5px;
+    height: 25px;
+    white-space: nowrap;
+}
+
+span#mapName {
+    font-size: 15px;
+    font-weight: bold;
+}
+
+span#lastSaved {
+    font-size: 10px;
+}
+
+.label {
+    border: none;
+    color: #ffffff;
+    font-weight: bold;
+}
+
+.label :hover {
+    cursor: pointer;
+}
+
+#tryEditorWarning {
+    position: absolute;
+    margin: 20px auto;
+    width: 300px;
+    right: 10px;
+    top: 100px;
+    padding: 20px;
+    opacity: 0.9;
+    cursor: move;
+    background-color: #69686F;
+    filter: alpha(opacity = 90);
+    color: #000c8f;
+}
+
+#tryEditorWarning a {
+    color: white;
+    font-weight: bold;
+}
+
+#tryEditorWarning h1 {
+    color: #f5f5f5;
+    font-weight: bold;
+    margin-bottom: 5px;
+    font-size: 15px;
+}
+
+div#helpContainer {
+    position: absolute;
+    margin: 20px auto;
+    z-index: 3;
+    opacity: 0.9;
+    width: 220px;
+    top: 100px;
+    left: 10px;
+    color: #000c8f;
+    padding: 20px;
+    cursor: move;
+    background-color: #69686F;
+    filter: alpha(opacity = 90);
+}
+
+div#helpContent h1 {
+    font-weight: bold;
+    color: #f5f5f5;
+    font-size: 15px;
+}
+
+div#helpContent h2 {
+    font-weight: bold;
+    padding: 20px 0 10px 0;
+    color: #bfbfbf;
+}
+
+div.close {
+    position: absolute;
+    height: 12px;
+    width: 12px;
+    top: 7px;
+    right: 10px;
+    cursor: pointer;
+    background: url(../images/close12_1.gif) bottom left no-repeat !important;
+}
+
+div#helpContent li {
+    font-family: arial, helvetica, sans-serif;
+    list-style-type: disc;
+    margin-left: 12px;
+    font-size: 11px;
+}
+
+div#small_error_icon {
+    padding-left: 18px;
+    min-height: 16px;
+    background: url(../images/error_icon.png) bottom left no-repeat !important;
+}
+
+div#toolbar .topicRelation {
+    width:56px;
+    background: url(../images/topic_relationship.png) no-repeat center top;
+    z-index: 4;
+}
+
+div#toolbar .topicRelation:hover {
+    width:56px;
+    background: url(../images/topic_relationship.png) no-repeat center top;
+    z-index: 4;
+}
+
+div#toolbar .relationshiplabel{
+    width:56px;
+}
+
+.nicEdit-main {
+    outline:none;
+}

wise-doc/src/main/webapp/css/thirdparty.css

@@ -0,0 +1,800 @@
+/************************************************************************************
+*  Windoo Wise CSS
+******************************************/
+div.windoo {
+    position: absolute;
+    overflow: hidden;
+}
+
+div.windoo .windoo-drag {
+    cursor: move;
+}
+
+div.windoo div.windoo-body {
+    position: relative;
+    overflow: auto;
+    width: auto;
+    padding: 0;
+    text-align: left;
+}
+
+div.windoo
+{
+    border: 8px solid #dddddd;
+}
+
+div.windoo div.windoo-frame {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    line-height: 0;
+    background:white;
+}
+
+div.windoo div.windoo-frame .strut {
+    line-height: 0;
+    font-size: 0px;
+}
+
+div.windoo div.windoo-frame .title {
+    overflow: hidden;
+}
+
+div.windoo div.windoo-frame .title .title-text {
+    width: 100%;
+    overflow: hidden;
+}
+
+/* Windoo buttons */
+div.windoo a.windoo-button {
+    position: absolute;
+    display: block;
+    text-align: center;
+    text-decoration: none;
+    overflow: hidden;
+    text-indent: -1000em;
+    outline: none;
+    z-index: 10;
+}
+
+/* Minimized and maximazed states */
+div.windoo-maximized .windoo-sizer, div.windoo-minimized .windoo-sizer, div.windoo-rolled .windoo-sizer, div.windoo-minimized a.windoo-button {
+    display: none !important;
+}
+
+div.windoo-minimized a.windoo-restore {
+    display: block !important;
+}
+
+div.windoo-minimized div.windoo-body, div.windoo-minimized .windoo-pane,
+    div.windoo-rolled div.windoo-body, div.windoo-rolled .windoo-pane {
+    display: none !important;
+}
+
+/* Windoo sizers */
+div.windoo .windoo-sizer {
+    position: absolute;
+    overflow: hidden;
+    background: url( '../images/s.gif' );
+    z-index: 5;
+    -moz-user-select: none;
+}
+
+div.windoo .windoo-north {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 6px;
+    cursor: n-resize;
+}
+
+div.windoo .windoo-south {
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 6px;
+    cursor: s-resize;
+}
+
+div.windoo .windoo-west {
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 6px;
+    cursor: w-resize;
+}
+
+div.windoo .windoo-east {
+    top: 0;
+    right: 0;
+    height: 100%;
+    width: 6px;
+    cursor: e-resize;
+}
+
+div.windoo .windoo-nw,
+    div.windoo .windoo-ne,
+    div.windoo .windoo-sw,
+    div.windoo .windoo-se {
+    width: 9px;
+    height: 9px;
+}
+
+div.windoo .windoo-nw {
+    top: 0;
+    left: 0;
+    cursor: nw-resize;
+}
+
+div.windoo .windoo-ne {
+    top: 0;
+    right: 0;
+    cursor: ne-resize;
+}
+
+div.windoo .windoo-sw {
+    bottom: 0;
+    left: 0;
+    cursor: sw-resize;
+}
+
+div.windoo .windoo-se {
+    bottom: 0;
+    right: 0;
+    cursor: se-resize;
+}
+
+/* Windoo ghost sizer */
+div.windoo-ghost {
+    border: dotted #0d0 2px;
+    position: absolute;
+    -moz-user-select: none;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    background: transparent url( '../images/s.gif' );
+}
+
+/* Windoo simple shadow */
+div.windoo-shadow-simple {
+    /*position: absolute;*/
+    /*padding: 0;*/
+    /*overflow: hidden;*/
+}
+
+div.windoo-shadow-simple div.c {
+    /*width: 100%;*/
+    /*height: 100%;*/
+    /*opacity: .4;*/
+    /*filter: Alpha( opacity = 40 );*/
+    /*-moz-border-radius: 4px;*/
+    /*-khtml-border-radius: 4px;*/
+    /*-webkit-border-radius: 4px;*/
+    /*border-radius: 4px;*/
+    /*background: #ccc;*/
+}
+
+/* Modal window shadow overlay */
+div.windoo-modal-overlay {
+    background: #000;
+    opacity: .6;
+    filter: Alpha( opacity = 60 );
+}
+
+/*        *********  wise Styles   **********    */
+
+div.windoo-wise div.windoo-body {
+    margin: 50px 20px 0;
+    padding: 0;
+}
+
+div.windoo-wise-ie .windoo-body {
+    top: 28px;
+}
+
+div.windoo-wise-ghost {
+    border: dotted #00a 2px;
+}
+
+div.windoo-wise .windoo-se {
+    bottom: 0;
+    right: 0;
+    width: 11px;
+    height: 11px;
+    cursor: se-resize;
+    /*background: url( ../images/se-handle.gif ) no-repeat left top;*/
+}
+
+div.windoo-wise div.windoo-frame {
+}
+
+div.windoo-wise div.windoo-frame .top-left {
+    /*padding: 0 0 0 3px;*/
+    /*background: transparent url( ../images/hd-sprite.gif ) no-repeat scroll left -41px;*/
+}
+
+div.windoo-wise div.windoo-frame .top-right {
+    padding: 0 3px 0 0;
+    /*background: transparent url( ../images/hd-sprite.gif ) no-repeat scroll right 0;*/
+}
+
+div.windoo-wise div.windoo-frame .title {
+    /*background: #AABACA url( ../images/hd-sprite.gif ) repeat-x scroll 0 -82px;*/
+    color: #15428B;
+    height: 28px;
+    padding: 0 40px 0 .5em;
+    font: bold 13px "Sans Serif", Tahoma, Verdana, Helvetica;
+}
+
+div.windoo-wise div.windoo-frame .title-text {
+    padding-top: 7px;
+    /*line-height: 13px;*/
+    height: 13px;
+    text-align: left;
+}
+
+div.windoo-wise div.windoo-frame .bot-left {
+    padding: 0 0 0 7px;
+    /*background: transparent url( ../images/bg-left.gif ) no-repeat scroll left bottom;*/
+}
+
+div.windoo-wise div.windoo-frame .bot-right {
+    padding: 0 7px 0 0;
+    /*background: transparent url( ../images/bg-right.gif ) no-repeat scroll right bottom;*/
+}
+
+div.windoo-wise div.windoo-frame .strut {
+    /*background: transparent url( ../images/bg-center.gif ) repeat-x scroll center bottom;*/
+    text-align: left;
+}
+
+div.windoo-wise a.windoo-button {
+    width: 23px;
+    height: 19px;
+    /*line-height: 19px;*/
+    font-size: 9pt;
+    text-indent: -1000em;
+    background: url( '../images/buttons.gif' ) no-repeat scroll 0 0;
+}
+
+div.windoo-wise a.windoo-close {
+    top: 0px;
+    right: 10px;
+    background-position: -69px 0;
+}
+
+div.windoo-wise a.windoo-close:hover {
+    background-position: -69px -19px;
+}
+
+div.windoo-wise a.windoo-close-disabled, div.windoo-wise a.windoo-close-disabled:hover {
+    background-position: -69px 0;
+    opacity: .3;
+    filter: Alpha( opacity = 30 );
+}
+
+div.windoo-wise a.windoo-maximize {
+    top: 0px;
+    right: 33px;
+    background-position: -46px 0;
+}
+
+div.windoo-wise a.windoo-maximize:hover {
+    background-position: -46px -19px;
+}
+
+div.windoo-wise a.windoo-maximize-disabled, div.windoo-wise a.windoo-maximize-disabled:hover {
+    background-position: -46px 0;
+    opacity: .3;
+    filter: Alpha( opacity = 30 );
+}
+
+div.windoo-wise a.windoo-minimize {
+    top: 0;
+    right: 56px;
+    background-position: 0 0;
+}
+
+div.windoo-wise a.windoo-minimize:hover {
+    background-position: 0 -19px;
+}
+
+div.windoo-wise a.windoo-minimize-disabled, div.windoo-wise a.windoo-minimize-disabled:hover {
+    background-position: 0 0;
+    opacity: .3;
+    filter: Alpha( opacity = 30 );
+}
+
+div.windoo-wise a.windoo-restore {
+    display: none;
+    top: 0;
+    right: 15px;
+    background-position: -46px 0;
+}
+
+div.windoo-wise a.windoo-restore:hover {
+    background-position: -46px -19px;
+}
+
+div.windoo-wise a.windoo-restore-disabled, div.windoo-wise a.windoo-restore-disabled:hover {
+    background-position: -46px 0;
+    opacity: .3;
+    filter: Alpha( opacity = 30 );
+}
+
+div.windoo-wise a.windoo-menu {
+    display: none;
+}
+
+div.windoo-wise-minimized {
+    width: 165px !important;
+}
+
+div.windoo-shadow-wise-maximized {
+    display: none !important;
+}
+
+div.windoo-wise-alert-message {
+}
+
+div.windoo-wise-confirm-message {
+}
+
+div.windoo-wise-alert-pane, div.windoo-wise-confirm-pane {
+    text-align: center;
+}
+
+div.windoo-wise-alert-pane input, div.windoo-wise-confirm-pane input {
+    margin: 0 .5em;
+    width: 4em;
+}
+
+
+div.windoo-wise-confirm-pane input {
+    background: #3399CC;
+    border: 1px solid #006699;
+    color: #FFFFFF;
+    font-family: arial, helvetica, sans-serif;
+    font-size: 92%;
+    font-style: normal;
+    font-variant: normal;
+    font-weight: bold;
+    /*line-height: normal;*/
+    overflow: visible;
+    padding: 2px 8px 1px;
+    vertical-align: middle;
+}
+
+/************************************************************************************
+ *  - mooRainbow: defaultCSS
+ * author: w00fz <w00fzPuppy@gmail.com>
+*******************************************/
+
+#mooRainbow {
+    font-size: 11px;
+    color: #000;
+}
+
+.moor-box {
+    width: 125px;
+    height: 110px;
+    border: 1px solid #636163;
+    background-color: #e5e5e5;
+}
+
+.moor-overlayBox {
+    width: 80px; /* Width and Height of the overlay must be setted here: default 256x256 */
+    height: 80px;
+    margin-top: 3px;
+    margin-left: 3px;
+    border: 1px solid #000;
+}
+
+.moor-slider {
+    border: 1px solid #000;
+    margin-top: 3px;
+    margin-left: 86px;
+    width: 10px; /* if you want a bigger or smaller slider... */
+    height: 80px;
+}
+
+.moor-colorBox {
+/*display: none;*/
+    visibility: hidden;
+    border: 1px solid #000;
+    width: 59px;
+    height: 68px;
+    margin-top: 20px;
+    margin-left: 315px;
+}
+
+.moor-currentColor {
+/* Bottom Box Color, the backup one */
+/*display: none;*/
+    visibility: hidden;
+    margin-top: 55px;
+    margin-left: 316px;
+    width: 59px;
+    height: 34px;
+}
+
+.moor-okButton {
+    font-family: Tahoma;
+    font-weight: bold;
+    font-size: 8px;
+    margin-top: 90px;
+    margin-left: 3px;
+    background: #e6e6e6;
+    height: 15px;
+    border: 1px solid #d6d6d6;
+    border-left-color: #f5f5f5;
+    border-top-color: #f5f5f5;
+}
+
+label {
+    font-family: mono;
+}
+
+/* Following are just <label> */
+.moor-rLabel {
+/*display: none;*/
+    visibility: hidden;
+    margin-top: 100px;
+    margin-left: 315px;
+}
+
+.moor-gLabel {
+/*display: none;*/
+    visibility: hidden;
+    margin-top: 125px;
+    margin-left: 315px;
+}
+
+.moor-bLabel {
+/*display: none;*/
+    visibility: hidden;
+    margin-top: 150px;
+    margin-left: 315px;
+}
+
+.moor-HueLabel {
+/*display: none;*/
+    visibility: hidden;
+    margin-top: 190px;
+    margin-left: 315px;
+}
+
+span.moor-ballino {
+/* Style hue ? (degree) !! */
+/*display: none;*/
+    visibility: hidden;
+    margin-top: 190px;
+    margin-left: 370px;
+}
+
+.moor-SatuLabel {
+/*display: none;*/
+    visibility: hidden;
+    margin-top: 215px;
+    margin-left: 315px;
+}
+
+.moor-BrighLabel {
+    display: none;
+    margin-top: 240px;
+    margin-left: 315px;
+}
+
+.moor-hexLabel {
+    font-size: 0px;
+    margin-top: 90px;
+    margin-left: 70px;
+}
+
+/* <input> */
+.moor-rInput, .moor-gInput, .moor-bInput, .moor-HueInput, .moor-SatuInput, .moor-BrighInput {
+/*display: none;*/
+    visibility: hidden;
+    width: 30px;
+}
+
+.moor-hexInput {
+    font-size: 9px;
+    width: 45px;
+}
+
+.moor-cursor {
+    background-image: url( ../images/moor_cursor.gif );
+    width: 12px;
+    height: 12px;
+}
+
+.moor-arrows {
+/*display: none;*/
+    visibility: hidden; /*background-image: url(images/moor_arrows.gif);*/
+    top: 9px;
+    left: 270px;
+    width: 41px;
+    height: 9px;
+}
+
+.moor-chooseColor {
+    margin-left: 100px;
+    margin-top: 3px;
+    width: 20px;
+    height: 82px;
+}
+
+/***************************************************************************************************
+Title : Lightbox CSS
+Author : Kevin Hale
+URL : http://particletree.com/features/lightbox-gone-wild/
+
+Created : January 13, 2006
+Modified : February 1, 2006
+
+/*******************************************/
+
+#lightbox {
+    display: none;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    z-index: 9999;
+    width: 300px;
+    height: 300px;
+    margin: -150px 0 0 -150px;
+}
+
+#lightbox[id] {
+    position: fixed;
+}
+
+#overlay {
+    display: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 3000px; /* IE hack */
+    height: 3000px; /* IE hack */
+    z-index: 5000;
+    background-color: snow;
+    -moz-opacity: 0.8;
+    opacity: .80;
+    filter: alpha( opacity = 80 );
+}
+
+#overlay[id] {
+    position: fixed;
+}
+
+#lightbox.done #lbLoadMessage {
+    display: none;
+}
+
+#lightbox.done #lbContent {
+    display: block;
+}
+
+#lightbox.loading #lbContent {
+    display: none;
+}
+
+#lightbox.loading #lbLoadMessage {
+    display: block;
+}
+
+/*Pop Up Menu*/
+.leftMenu {
+    float: left;
+}
+
+.subMenu2 {
+    visibility: hidden;
+    position: absolute;
+    z-index: 4;
+    background-color: white;
+    border: 1px solid black;
+    clear: both;
+    text-align:left;
+    width: 90px;
+}
+
+.subMenu2 {
+
+    border: 1px solid #093a9d;
+    background-color: #E2F0F6;
+}
+
+.subMenu2 a {
+    display: block;
+    text-decoration: none; /*margin: 4px;*/
+    font-size: 13px;
+    padding: 3px;
+}
+
+.subMenu2Sep {
+
+    border-bottom: 1px solid  #093a9d;
+}
+
+.subMenu2 a:hover, .subMenu2 .menuButton:hover {
+    background-color: #4D79CF;
+    color: white;
+}
+
+.subMenu .menuLink {
+    padding: 4px;
+}
+
+.subMenu2 .menuButton {
+    cursor: pointer;
+    font-size: 13px;
+    padding: 5px;
+    color: black;
+}
+
+/* Windoo main window and frames */
+div.windoo {
+    position: absolute;
+    /*overflow: hidden;*/
+}
+
+div.windoo .windoo-drag {
+    cursor: move;
+}
+
+div.windoo div.windoo-body {
+    position: relative;
+    overflow: auto;
+    width: auto;
+    padding: 0;
+    text-align: left;
+}
+
+div.windoo div.windoo-frame {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    line-height: 0;
+}
+
+div.windoo div.windoo-frame .strut {
+    line-height: 0;
+    font-size: 0px;
+}
+
+div.windoo div.windoo-frame .title {
+    overflow: hidden;
+}
+
+div.windoo div.windoo-frame .title .title-text {
+    width: 100%;
+    overflow: hidden;
+}
+
+/* Windoo buttons */
+div.windoo a.windoo-button {
+    position: absolute;
+    display: block;
+    text-align: center;
+    text-decoration: none;
+    overflow: hidden;
+    text-indent: -1000em;
+    outline: none;
+    z-index: 10;
+}
+
+/* Minimized and maximazed states */
+div.windoo-maximized .windoo-sizer, div.windoo-minimized .windoo-sizer, div.windoo-rolled .windoo-sizer, div.windoo-minimized a.windoo-button {
+    display: none !important;
+}
+
+div.windoo-minimized a.windoo-restore {
+    display: block !important;
+}
+
+div.windoo-minimized div.windoo-body, div.windoo-minimized .windoo-pane,
+    div.windoo-rolled div.windoo-body, div.windoo-rolled .windoo-pane {
+    display: none !important;
+}
+
+/* Windoo sizers */
+div.windoo .windoo-sizer {
+    position: absolute;
+    overflow: hidden;
+    background: url( '../images/s.gif' );
+    z-index: 5;
+    -moz-user-select: none;
+}
+
+div.windoo .windoo-north {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 6px;
+    cursor: n-resize;
+}
+
+div.windoo .windoo-south {
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 6px;
+    cursor: s-resize;
+}
+
+div.windoo .windoo-west {
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 6px;
+    cursor: w-resize;
+}
+
+div.windoo .windoo-east {
+    top: 0;
+    right: 0;
+    height: 100%;
+    width: 6px;
+    cursor: e-resize;
+}
+
+div.windoo .windoo-nw,
+    div.windoo .windoo-ne,
+    div.windoo .windoo-sw,
+    div.windoo .windoo-se {
+    width: 9px;
+    height: 9px;
+}
+
+div.windoo .windoo-nw {
+    top: 0;
+    left: 0;
+    cursor: nw-resize;
+}
+
+div.windoo .windoo-ne {
+    top: 0;
+    right: 0;
+    cursor: ne-resize;
+}
+
+div.windoo .windoo-sw {
+    bottom: 0;
+    left: 0;
+    cursor: sw-resize;
+}
+
+div.windoo .windoo-se {
+    bottom: 0;
+    right: 0;
+    cursor: se-resize;
+}
+
+/* Windoo ghost sizer */
+div.windoo-ghost {
+    border: dotted #0d0 2px;
+    position: absolute;
+    -moz-user-select: none;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    background: transparent url( '../images/s.gif' );
+}
+
+/* Windoo simple shadow */
+div.windoo-shadow-simple {
+    position: absolute;
+    padding: 0;
+    overflow: hidden;
+}
+
+div.windoo-shadow-simple div.c {
+}
+
+/* Modal window shadow overlay */
+div.windoo-modal-overlay {
+}

wise-doc/src/main/webapp/html/editor.html

@@ -0,0 +1,453 @@
+<!DOCTYPE HTML>
+
+<html>
+<head>
+    <!--[if lt IE 9]>
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <![endif]-->
+
+    <!-- Internet Explorer 8 Hack -->
+    <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
+    <title>WiseMapping - Editor </title>
+    <link rel="stylesheet" type="text/css" href="../css/editor.css"/>
+    <link rel="stylesheet" type="text/css" href="../css/bubble.css"/>
+
+    <!--<script type='text/javascript' src='../js/wiseLibrary.js'></script>-->
+    <script type='text/javascript' src='../../../../../wise-webapp/src/main/webapp/js/mootools.js'></script>
+    <script type='text/javascript' src='../../../../../wise-webapp/src/main/webapp/js/common.js'></script>
+    <script type='text/javascript' src='../../../../../wise-webapp/src/main/webapp/js/windoo.js'></script>
+
+    <!--<script type='text/javascript' src='../js/wiseEditorLibrary.js'></script>-->
+    <script type='text/javascript' src='../../../../../wise-webapp/src/main/webapp/js/IconPanel.js'></script>
+
+
+    <script type='text/javascript' src='../../../../../core-js/target/classes/core.js'></script>
+
+    <link rel="icon" href="../images/favicon.ico" type="image/x-icon">
+    <link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon">
+</head>
+<body>
+
+
+<form method="post" id="printForm" name="printForm" action='<c:url value="export.htm"/>' style="height:100%;"
+      target="${mindmap.title}">
+    <input type="hidden" name="action" value="print">
+    <input type="hidden" name="mapId" value="${mindmap.id}">
+    <input type="hidden" name="mapSvg" value="">
+</form>
+
+<div id="waitDialog" style="display:none">
+    <div id="waitingContainer">
+        <div class="loadingIcon"></div>
+        <div class="loadingText">
+            <spring:message code="EDITOR.LOADING"/>
+        </div>
+    </div>
+</div>
+
+<div id="errorDialog" style="display:none">
+    <div id="errorContainer">
+        <div class="loadingIcon"></div>
+        <div class="loadingText">
+            <spring:message code="EDITOR.ERROR_LOADING"/>
+        </div>
+    </div>
+</div>
+
+<script type="text/javascript">
+
+    var waitDialog = new core.WaitDialog();
+    waitDialog.activate(true, $("waitDialog"));
+    $(window).addEvent("error", function(event) {
+
+        // Show error dialog ...
+        waitDialog.changeContent($("errorDialog"), false);
+        return false;
+    });
+
+
+    var mapId = '${mindmap.id}';
+    var mapXml = '${mapXml}';
+    var editorProperties = ${mindmap.properties};
+    var isTryMode = ${editorTryMode};
+
+    function printMap() {
+        document.printForm.mapSvg.value = $("workspaceContainer").innerHTML;
+        document.printForm.submit();
+    }
+</script>
+
+<div id="colorPalette">
+    <div id="paletteHeader"></div>
+</div>
+
+<div id="fontFamilyPanel" class="toolbarPanel">
+    <div id="times" class="toolbarPanelLink" style="font-family:times;">Times</div>
+    <div id="arial" class="toolbarPanelLink" style="font-family:arial;">Arial</div>
+    <div id="tahoma" class="toolbarPanelLink" style="font-family:tahoma;">Tahoma</div>
+    <div id="verdana" class="toolbarPanelLink" style="font-family:verdana;">Verdana</div>
+</div>
+
+<div id="fontSizePanel" class="toolbarPanel">
+    <div id="small" class="toolbarPanelLink" style="font-size:8px">Small</div>
+    <div id="normal" class="toolbarPanelLink" style="font-size:12px">Normal</div>
+    <div id="large" class="toolbarPanelLink" style="font-size:15px">Large</div>
+    <div id="huge" class="toolbarPanelLink" style="font-size:24px">Huge</div>
+</div>
+
+<div id="topicShapePanel" class="toolbarPanel">
+    <!--<div id="automatic" class="toolbarPanelLink">Automatic</div>-->
+    <div id="rectagle" class="toolbarPanelLink"><img src="../images/shape-rectangle.png" alt="Rectangle" width="40"
+                                                     height="25"></div>
+    <div id="rounded_rectagle" class="toolbarPanelLink"><img src="../images/shape-rectangle-rounded.png"
+                                                             alt="Rounded Rectangle" width="40" height="25"></div>
+    <div id="line" class="toolbarPanelLink"><img src="../images/shape-line.png" alt="Line" width="40" height="7"></div>
+    <div id="elipse" class="toolbarPanelLink"><img src="../images/shape-elipse.png" alt="Elipse" width="40" height="25">
+    </div>
+</div>
+
+<div id="actionsContainer"></div>
+<div>
+    <c:url value="mymaps.htm" var="shareMap">
+        <c:param name="action" value="collaborator"/>
+        <c:param name="userEmail" value="${pageContext.request.userPrincipal.name}"/>
+    </c:url>
+</div>
+
+<div id="toolbar">
+    <div id="editTab" class="tabContent">
+        <div id="file" class="buttonContainer" title="FILE">
+        <fieldset>
+            <legend>
+                FILE>
+            </legend>
+            <div id="saveButton" class="button" title="SAVE">
+            <div class="toolbarLabel">
+                <p>
+                    SAVE
+                </p>
+            </div>
+    </div>
+    <div id="discardButton" class="button" title="CLOSE">
+    <div class="toolbarLabel">
+        <p>
+            CLOSE
+        </p>
+    </div>
+</div>
+<div id="undoEdition" class="button" title="<spring:message code=" UNDO_EDITION
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="UNDO"/>
+    </p>
+</div>
+</div>
+<div id="redoEdition" class="button" title="<spring:message code=" REDO_EDITION
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="REDO"/>
+    </p>
+</div>
+</div>
+
+<div id="print" class="button" title="<spring:message code=" PRINT
+"/>" onclick="printMap();">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="PRINT"/>
+    </p>
+</div>
+</div>
+
+<div id="export" class="button" title="<spring:message code=" EXPORT
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="EXPORT"/>
+    </p>
+</div>
+<a id="exportAnchor" href="export.htm?mapId=${mindmap.id}" rel="moodalbox 600px 400px"
+   title="<spring:message code=" EXPORT_DETAILS"/>">
+</a>
+</div>
+</fieldset>
+</div>
+<div id="zoom" class="buttonContainer" title="Zoom In">
+    <fieldset>
+        <legend>
+            <spring:message code="ZOOM"/>
+        </legend>
+        <div id="zoomIn" class="button" title="<spring:message code=" ZOOM_IN
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="IN"/>
+            </p>
+        </div>
+</div>
+<div id="zoomOut" class="button" title="<spring:message code=" ZOOM_OUT
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="OUT"/>
+    </p>
+</div>
+</div>
+</fieldset>
+</div>
+<div id="node" class="buttonContainer" title="Node Properties">
+    <fieldset>
+        <legend>
+            <spring:message code="TOPIC"/>
+        </legend>
+        <div id="topicShape" class="button comboButton" title="<spring:message code=" TOPIC_SHAPE
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="SHAPE"/>
+            </p>
+        </div>
+</div>
+<div id="addTopic" class="button" title="<spring:message code=" TOPIC_ADD
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="ADD"/>
+    </p>
+</div>
+</div>
+<div id="deleteTopic" class="button" title="<spring:message code=" TOPIC_DELETE
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="DELETE"/>
+    </p>
+</div>
+</div>
+<div id="topicBorder" class="button comboButton" title="<spring:message code=" TOPIC_BORDER_COLOR
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="BORDER"/>
+    </p>
+</div>
+</div>
+<div id="topicColor" class="button comboButton" title="<spring:message code=" TOPIC_BACKGROUND_COLOR
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="COLOR"/>
+    </p>
+</div>
+</div>
+<div id="topicIcon" class="button comboButton" title="<spring:message code=" TOPIC_ICON
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="ICON"/>
+    </p>
+</div>
+</div>
+<div id="topicNote" class="button comboButton" title="<spring:message code=" TOPIC_NOTE
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="NOTE"/>
+    </p>
+</div>
+</div>
+<div id="topicLink" class="button" title="<spring:message code=" TOPIC_LINK
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="LINK"/>
+    </p>
+</div>
+</div>
+<div id="topicRelation" class="topicRelation button" title="<spring:message code=" TOPIC_RELATIONSHIP
+"/>">
+<div class="relationshiplabel toolbarLabel">
+    <p>
+        <spring:message code="TOPIC_RELATIONSHIP"/>
+    </p>
+</div>
+</div>
+</fieldset>
+</div>
+<div id="font" class="buttonContainer" title="Font Properties">
+    <fieldset>
+        <legend>
+            <spring:message code="FONT"/>
+        </legend>
+        <div id="fontFamily" class="button comboButton" title="<spring:message code=" FONT_TYPE
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="TYPE"/>
+            </p>
+        </div>
+</div>
+<div id="fontSize" class="button comboButton" title="<spring:message code=" FONT_SIZE
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="SIZE"/>
+    </p>
+</div>
+</div>
+<div id="fontBold" class="button" title="<spring:message code=" FONT_BOLD
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="BOLD"/>
+    </p>
+</div>
+</div>
+<div id="fontItalic" class="button" title="<spring:message code=" FONT_ITALIC
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="ITALIC"/>
+    </p>
+</div>
+</div>
+<div id="fontColor" class="button comboButton" title="<spring:message code=" FONT_COLOR
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="COLOR"/>
+    </p>
+</div>
+</div>
+</fieldset>
+</div>
+<div id="share" class="buttonContainer" title="Share Properties">
+    <c:choose>
+        <c:when test="${editorTryMode==false}">
+            <fieldset>
+                <legend>
+                    <spring:message code="COLLABORATION"/>
+                </legend>
+                <a id="tagAnchor" href="tags.htm?mapId=${mindmap.id}" rel="moodalbox 400px 200px wizard"
+                   title="<spring:message code=" TAGS_DETAILS"/>">
+                <div id="tagIt" class="button" title="<spring:message code=" TAG
+                "/>">
+                <div class="toolbarLabel">
+                    <p>
+                        <spring:message code="TAG"/>
+                    </p>
+                </div>
+</div>
+</a>
+<c:choose>
+    <c:when test="${mindmap.owner==user}">
+        <a id="shareAnchor" href="<c:out value="${shareMap}"/>&amp;mapId=${mindmap.id}"
+        rel="moodalbox 780px 530px wizard" title="
+        <spring:message code="SHARE_DETAILS"/>
+        ">
+        <div id="shareIt" class="button" title="<spring:message code=" COLLABORATION
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="SHARE"/>
+            </p>
+        </div>
+        </div>
+        </a>
+        <a id="publishAnchor" href="publish.htm?mapId=${mindmap.id}"
+           rel="moodalbox 600px 400px wizard"
+           title="<spring:message code=" PUBLISH_MSG"/>">
+        <div id="publishIt" class="button" title="<spring:message code=" PUBLISH
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="PUBLISH"/>
+            </p>
+        </div>
+        </div>
+        </a>
+    </c:when>
+</c:choose>
+<a id="historyAnchor" href="history.htm?action=list&amp;mapId=${mindmap.id}"
+   rel="moodalbox 600px 400px wizard" title="<spring:message code=" HISTORY_MSG"/>">
+<div id="history" class="button" title="<spring:message code=" HISTORY_MSG
+"/>">
+<div class="toolbarLabel">
+    <p>
+        <spring:message code="HISTORY"/>
+    </p>
+</div>
+</div>
+</a>
+</fieldset>
+</c:when>
+<c:otherwise>
+    <fieldset>
+        <legend>
+            <spring:message code="COLLABORATION"/>
+        </legend>
+        <div id="tagIt" class="button" title="<spring:message code=" TAG
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="TAG"/>
+            </p>
+        </div>
+        </div>
+        <div id="shareIt" class="button" title="<spring:message code=" COLLABORATE
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="SHARE"/>
+            </p>
+        </div>
+        </div>
+        <div id="publishIt" class="button" title="<spring:message code=" PUBLISH
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="PUBLISH"/>
+            </p>
+        </div>
+        </div>
+        <div id="history" class="button" title="<spring:message code=" HISTORY_MSG
+        "/>">
+        <div class="toolbarLabel">
+            <p>
+                <spring:message code="HISTORY"/>
+            </p>
+        </div>
+        </div>
+    </fieldset>
+</c:otherwise>
+</c:choose>
+</div>
+</div>
+</div>
+
+<div id="mindplot"></div>
+
+<div id="footerEditor">
+    <div style="position:absolute; top:0px; width:100%">
+        <a href="${pageContext.request.contextPath}/c/home.htm">
+            <div id="logo"></div>
+        </a>
+
+        <div id='msgLoggerContainer' class="msgLoggerContainer">
+            <div id="msgStart"></div>
+            <div id='msgLogger'></div>
+            <div id="msgEnd"></div>
+        </div>
+    </div>
+    <div id="helpButtonKeyboard"
+         style="text-align:center; width:100px; height:20px; background-color:#f5f5f5; border: 1px solid #BBB6D6; cursor:pointer; padding-left:5px; margin-left:3px;float:left;">
+        <div style="float:left; position:relative; top:50%; margin-top:-8px; margin-left:5px;"><img
+                src="../images/help.png"/></div>
+        <div style="float:left; position:relative; top:50%; margin-top:-8px; margin-left:4px;">Shortcuts</div>
+    </div>
+</div>
+<script type="text/javascript" src="../js/editor.js"></script>
+</body>
+</html>