Add publish map on editor.

2012-05-27 18:15:46 -03:00
parent 2b4953ea11
commit 5d1399017f
27 changed files with 343 additions and 335 deletions
--- a/wise-webapp/src/main/webapp/jsp/dialogFullTemplate.jsp
+++ b/wise-webapp/src/main/webapp/jsp/dialogFullTemplate.jsp
@@ -0,0 +1,23 @@
+<%@ taglib prefix="tiles" uri="http://struts.apache.org/tags-tiles" %>
+<%@ include file="/jsp/init.jsp" %>
+
+<tiles:importAttribute name="title" scope="page"/>
+<tiles:importAttribute name="details" scope="page"/>
+
+<html>
+<head>
+    <base href="${pageContext.request.contextPath}/"/>
+    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
+
+    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css"/>
+    <script type="text/javascript" language="javascript" src="js/jquery-1.7.2.min.js"></script>
+    <script type="text/javascript" language="javascript" src="bootstrap/js/bootstrap.js"></script>
+    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-responsive.min.css"/>
+
+
+<body>
+<div style="padding-top:20px">
+    <tiles:insert name="body"/>
+</div>
+</body>
+</html>
--- a/wise-webapp/src/main/webapp/jsp/formDialogTemplate.jsp
+++ b/wise-webapp/src/main/webapp/jsp/formDialogTemplate.jsp
@@ -5,7 +5,7 @@
 <tiles:importAttribute name="title" scope="page"/>
 <tiles:importAttribute name="details" scope="page"/>

-<div class="modalDialog">
+<div>
    <!--  Header can be customized -->
    <tiles:insert name="body"/>
 </div>
--- a/wise-webapp/src/main/webapp/jsp/embeddedView.jsp
+++ b/wise-webapp/src/main/webapp/jsp/embeddedView.jsp
@@ -28,7 +28,9 @@
                var editorProperties = {zoom:${zoom},saveOnLoad:true,collab:'standalone',readOnly:true};
                designer = buildDesigner(editorProperties);

-                var domDocument = core.Utils.createDocumentFromText(mapXml);
+                var parser = new DOMParser();
+                var domDocument = parser.parseFromString(mapXml, "text/xml");
+
                var serializer = mindplot.persistence.XMLSerializerFactory.getSerializerFromDocument(domDocument);
                var mindmap = serializer.loadFromDom(domDocument, mapId);

--- a/wise-webapp/src/main/webapp/jsp/iframeWrapper.jsp
+++ b/wise-webapp/src/main/webapp/jsp/iframeWrapper.jsp
@@ -0,0 +1,27 @@
+<%@ taglib prefix="tiles" uri="http://struts.apache.org/tags-tiles" %>
+<%@ include file="/jsp/init.jsp" %>
+
+<div>
+    <iframe src='${url}' style="border: 0;width: 100%;height:100%" id="dialogContentIframe"></iframe>
+    <div style="float: right;margin-right: 25px">
+        <input type="button" class="btn-primary" value="Accept" id="submitBtn"/>
+        <input type="button" class="btn-secondary" value="Cancel" id="cancelBtn"/>
+    </div>
+</div>
+
+<script type="text/javascript">
+    $('submitBtn').addEvent('click', function() {
+        var iframeWindow = $('dialogContentIframe').contentWindow;
+        iframeWindow.submitDialogForm();
+
+        if (MooDialog.Request.active) {
+            MooDialog.Request.active.close();
+        }
+    });
+
+    $('cancelBtn').addEvent('click', function() {
+        if (MooDialog.Request.active) {
+            MooDialog.Request.active.close();
+        }
+    });
+</script>
--- a/wise-webapp/src/main/webapp/jsp/mindmapEditor.jsp
+++ b/wise-webapp/src/main/webapp/jsp/mindmapEditor.jsp
@@ -48,7 +48,9 @@
            var designer = buildDesigner(options);

            // Load map from XML ...
-            var domDocument = core.Utils.createDocumentFromText(mapXml);
+            var parser = new DOMParser();
+            var domDocument = parser.parseFromString(mapXml, "text/xml");
+
            var persistence = mindplot.PersistenceManager.getInstance();
            var mindmap = persistence.loadFromDom(mapId, domDocument);
            designer.loadMap(mindmap);
--- a/wise-webapp/src/main/webapp/jsp/mindmapList.jsp
+++ b/wise-webapp/src/main/webapp/jsp/mindmapList.jsp
@@ -49,7 +49,7 @@
                    bUseRendered : false,
                    mDataProp: "title",
                    fnRender : function(obj) {
-                        return '<a href="c/map/' + obj.aData.id + '/edit.htm">' + obj.aData.title + '</a>';
+                        return '<a href="c/maps/' + obj.aData.id + '/edit.htm">' + obj.aData.title + '</a>';
                    }
                },
                {
@@ -110,13 +110,13 @@
        $("#newBtn").click(
                function() {
                    $("#new-dialog-modal").dialogForm({
-                        redirect: "c/map/{header.resourceId}/edit.htm",
+                        redirect: "c/maps/{header.resourceId}/edit.htm",
                        url :  "../service/maps"
                    });
                });

        $("#importBtn").click(function() {
-            window.open('c/map/import.htm');
+            window.open('c/maps/import.htm');
        });

        $("#duplicateBtn").click(function() {
@@ -134,7 +134,7 @@

                // Initialize dialog ...
                $("#duplicate-dialog-modal").dialogForm({
-                    redirect: "c/map/{header.resourceId}/edit.htm",
+                    redirect: "c/maps/{header.resourceId}/edit.htm",
                    url :  "../service/maps/" + mapId
                });
            }
@@ -194,14 +194,14 @@
        $("#printBtn").click(function() {
            var mapIds = $('#mindmapListTable').dataTableExt.getSelectedMapsIds();
            if (mapIds.length > 0) {
-                window.open('c/map/' + mapIds[0] + '/print.htm');
+                window.open('c/maps/' + mapIds[0] + '/print.htm');
            }
        });

        $("#infoBtn").click(function() {
            var mapIds = $('#mindmapListTable').dataTableExt.getSelectedMapsIds();
            if (mapIds.length > 0) {
-                $('#info-dialog-modal .modal-body').load("c/map/" + mapIds[0] + "/details.htm", function() {
+                $('#info-dialog-modal .modal-body').load("c/maps/" + mapIds[0] + "/details.htm", function() {
                    $('#info-dialog-modal').modal();
                });

@@ -211,7 +211,7 @@
        $("#publishBtn").click(function() {
            var mapIds = $('#mindmapListTable').dataTableExt.getSelectedMapsIds();
            if (mapIds.length > 0) {
-                $('#publish-dialog-modal .modal-body').load("c/map/" + mapIds[0] + "/publish.htm",
+                $('#publish-dialog-modal .modal-body').load("c/maps/" + mapIds[0] + "/publish.htm",
                        function() {
                            $('#publish-dialog-modal .btn-accept').click(function() {
                                $('#publish-dialog-modal #publishForm').submit();
@@ -309,10 +309,12 @@
                            Duplicate</a></li>
                        <li id="renameBtn"><a href="#" onclick="return false"><i class="icon-edit"></i> Rename</a></li>
                        <li id="printBtn"><a href="#" onclick="return false"><i class="icon-print"></i> Print</a></li>
-                        <li id="publishBtn"><a href="#" onclick="return false"><i class="icon-globe"></i>Publish</a></li>
+                        <li id="publishBtn"><a href="#" onclick="return false"><i class="icon-globe"></i>Publish</a>
+                        </li>
                        <li id="shareBtn"><a href="#" onclick="return false"><i class="icon-share"></i> Share</a></li>
                        <li id="tagBtn"><a href="#" onclick="return false"><i class="icon-tags"></i> Tag</a></li>
-                        <li id="historyBtn"><a href="#" onclick="return false"><i class="icon-time"></i> History</a></li>
+                        <li id="historyBtn"><a href="#" onclick="return false"><i class="icon-time"></i> History</a>
+                        </li>
                    </ul>
                </div>

@@ -470,5 +472,6 @@
            <button class="btn btn-cancel" data-dismiss="modal">Cancel</button>
        </div>
    </div>
+</div>
 </body>
 </html>
--- a/wise-webapp/src/main/webapp/jsp/mindmapPrint.jsp
+++ b/wise-webapp/src/main/webapp/jsp/mindmapPrint.jsp
@@ -87,7 +87,9 @@
            var designer = buildDesigner(options);

            // Load map from XML ...
-            var domDocument = core.Utils.createDocumentFromText(mapXml);
+            var parser = new DOMParser();
+            var domDocument = parser.parseFromString(mapXml, "text/xml");
+
            var persistence = mindplot.PersistenceManager.getInstance();
            var mindmap = persistence.loadFromDom(mapId, domDocument);
            designer.loadMap(mindmap);
--- a/wise-webapp/src/main/webapp/jsp/mindmapPublish.jsp
+++ b/wise-webapp/src/main/webapp/jsp/mindmapPublish.jsp
@@ -1,22 +1,24 @@
 <%@ include file="/jsp/init.jsp" %>
+<style type="text/css">
+    #wizardContainer input {
+        width: 50px;
+        height: 25px;
+        display: inline-block;
+    }
+</style>

-
-<form method="post" id="publishForm" action="#" class="form-horizontal">
-    <fieldset>
-        <div class="control-group">
-            <label for="enablePublicView" class="control-label">Enable Sharing:
-                <input type="checkbox" id="enablePublicView" name="publicView" class="control"
-                        <c:if test="${mindmap.public}">
-                            checked="checked"
-                        </c:if>/>
-            </label>
-        </div>
-    </fieldset>
+<form method="post" id="dialogMainForm" action="#" class="well form-inline">
+    <label for="enablePublicView" class="control-label">Enable Sharing:
+        <input type="checkbox" id="enablePublicView" name="publicView"
+                <c:if test="${mindmap.public}">
+                    checked="checked"
+                </c:if> />
+    </label>
 </form>

 <p><span class="label label-important">Warning</span> <spring:message code="PUBLISH_DETAILS"/></p>

-<div id="sharingPanel">
+<div id="publishPanel">

    <ul class="nav nav-tabs">
        <li class="active"><a href="#embedTab" data-toggle="pill">Embed</a></li>
@@ -25,23 +27,22 @@

    <div class="tab-content">
        <div class="tab-pane fade active in" id="embedTab">
-
            <spring:message code="BLOG_INCLUSION"/>
-
-            <form class="form-inline" action="#" style="text-align: center">
-                <fieldset>
-
+            <div id="wizardContainer">
+                <form class="form-inline" action="#">
                    <label for="frameWith">Frame width:</label>
-                    <input type="number" id="frameWith" name="frameWith" value="600" class="span1" min="0"/>
+                    <input type="number" id="frameWith" name="frameWith" value="600" class="span2"
+                           min="0"/>

-                    <label for="frameHeight" class="control-label">Frame height:</label>
-                    <input type="number" id="frameHeight" name="frameHeight" value="400" class="span1" min="0"/>
+                    <label for="frameHeight">Frame height:</label>
+                    <input type="number" id="frameHeight" name="frameHeight" value="400" class="span2" min="0"/>

                    <label for="mapZoom">Zoom %:</label>
-                    <input type="number" id="mapZoom" name="mapZoom" value="80" class="span1" min="10"
-                           max="200" step="10"/>
-                </fieldset>
-            </form>
+                    <input type="number" id="mapZoom"
+                           name="mapZoom" value="80"
+                           class="span2" min="10" max="200" step="10"/>
+                </form>
+            </div>
            <label><spring:message code="BLOG_SNIPPET"/></label>
                <pre id="embedCode">&lt;iframe style="width:600px;height:400px;border: 1px
 solid black" src="http://www.wisemapping.com/c/embeddedView.htm?mapId=${mindmap.id}&zoom=1"&gt; &lt;/iframe&gt;</pre>
@@ -58,9 +59,9 @@ solid black" src="http://www.wisemapping.com/c/embeddedView.htm?mapId=${mindmap.

 <script type="text/javascript">
    // Update tabs display status ...
-    var checkboxElems = $('#publishForm input:checkbox');
+    var checkboxElems = $('#dialogMainForm input:checkbox');
    var updateTabsDisplay = function() {
-        var divElem = $('#sharingPanel');
+        var divElem = $('#publishPanel');
        checkboxElems[0].checked ? divElem.show() : divElem.hide();
    };
    checkboxElems.change(updateTabsDisplay);
@@ -68,7 +69,7 @@ solid black" src="http://www.wisemapping.com/c/embeddedView.htm?mapId=${mindmap.

    // Change snippet code based on the user options ...
    var replaceCode = function(regExpr, strReplace, factor) {
-        var preElem = $('#sharingPanel #embedCode')[0];
+        var preElem = $('#publishPanel #embedCode')[0];
        var fieldValue = this.value;
        if (!isNaN(fieldValue) && fieldValue.length > 0) {
            var textVal = $(preElem).text().replace(regExpr, strReplace.replace('%s', fieldValue * factor));
@@ -76,37 +77,37 @@ solid black" src="http://www.wisemapping.com/c/embeddedView.htm?mapId=${mindmap.
        }
    };

-    $('#sharingPanel #frameWith').keyup(function() {
+    $('#publishPanel #frameWith').keyup(function() {
        replaceCode.bind(this)(/width:[0-9]+px/g, "width:%spx", 1);
    });

-    $('#sharingPanel #frameWith').change(function() {
+    $('#publishPanel #frameWith').change(function() {
        replaceCode.bind(this)(/width:[0-9]+px/g, "width:%spx", 1);
    });

-    $('#sharingPanel #frameHeight').keyup(function() {
+    $('#publishPanel #frameHeight').keyup(function() {
        replaceCode.bind(this)(/height:[0-9]+px/g, "height:%spx", 1);
    });

-    $('#sharingPanel #frameHeight').change(function() {
+    $('#publishPanel #frameHeight').change(function() {
        replaceCode.bind(this)(/height:[0-9]+px/g, "height:%spx", 1);
    });

-    $('#sharingPanel #mapZoom').keyup(function() {
+    $('#publishPanel #mapZoom').keyup(function() {
        replaceCode.bind(this)(/zoom=.+\"/g, "zoom=%s\"", 0.1);
    });

-    $('#sharingPanel #mapZoom').change(function() {
+    $('#publishPanel #mapZoom').change(function() {
        replaceCode.bind(this)(/zoom=.+\"/g, "zoom=%s\"", 0.01);
    });


    // Save status on click ...
-    $('#publishForm').submit(function(event) {
+    $('#dialogMainForm').submit(function(event) {
        jQuery.ajax("service/maps/${mindmap.id}/publish", {
            async:false,
            dataType: 'json',
-            data: $('#publishForm #enablePublicView')[0].checked ? 'true' : 'false',
+            data: $('#dialogMainForm #enablePublicView')[0].checked ? 'true' : 'false',
            type: 'PUT',
            contentType:"text/plain",
            success : function(data, textStatus, jqXHR) {
@@ -119,5 +120,9 @@ solid black" src="http://www.wisemapping.com/c/embeddedView.htm?mapId=${mindmap.
        event.preventDefault();
    });

+    // Hook for interaction with the main parent window ...
+    var submitDialogForm = function() {
+        $('#dialogMainForm').submit();
+    }
 </script>