java: create empty sample, new upload style

web/documentserver-example/java/src/main/java/controllers/EditorServlet.java

@@ -24,12 +24,13 @@
  *
 */
 
-
 package controllers;
 
 import helpers.ConfigManager;
 import helpers.DocumentManager;
 import java.io.IOException;
+import java.net.URLEncoder;
+
 import javax.servlet.ServletException;
 import javax.servlet.annotation.WebServlet;
 import javax.servlet.http.HttpServlet;
@@ -47,12 +48,17 @@ public class EditorServlet extends HttpServlet
 
         String fileName = request.getParameter("fileName");
         String fileExt = request.getParameter("fileExt");
+        String sample = request.getParameter("sample");
+
+        Boolean sampleData = (sample == null || sample.isEmpty()) ? false : sample.toLowerCase().equals("true");
 
         if (fileExt != null)
         {
             try
             {
-                fileName = DocumentManager.CreateDemo(fileExt);
+                fileName = DocumentManager.CreateDemo(fileExt, sampleData);
+                response.sendRedirect("EditorServlet?fileName=" + URLEncoder.encode(fileName, "UTF-8"));
+                return;
             }
             catch (Exception ex)
             {

web/documentserver-example/java/src/main/java/controllers/IndexServlet.java

@@ -289,7 +289,7 @@ public class IndexServlet extends HttpServlet
         }
         else
         {
-            status = (int) jsonObj.get("status");
+            status = Math.toIntExact((long) jsonObj.get("status"));
             downloadUri = (String) jsonObj.get("url");
         }
 

web/documentserver-example/java/src/main/java/helpers/DocumentManager.java

@@ -159,9 +159,9 @@ public class DocumentManager
         return name;
     }
 
-    public static String CreateDemo(String fileExt) throws Exception
+    public static String CreateDemo(String fileExt, Boolean sample) throws Exception
     {
-        String demoName = "sample." + fileExt;
+        String demoName = (sample ? "sample." : "new.") + fileExt;
         String fileName = GetCorrectName(demoName);
 
         InputStream stream = Thread.currentThread().getContextClassLoader().getResourceAsStream(demoName);

web/documentserver-example/java/src/main/webapp/css/stylesheet.css

@@ -112,13 +112,14 @@ label .checkbox {
 
 .try-editor-list {
     list-style: none;
-    margin: 0;
+    margin: 0 0 16px;
     padding: 0;
 }
 .try-editor-list li {
     float: left;
-    margin: 25px;
-    width: 150px;
+    margin: 0 15px;
+    width: 100px;
+    cursor: pointer;
 }
 .try-editor {
     background-color: transparent;
@@ -142,6 +143,11 @@ label .checkbox {
     background-image: url("img/file_pptx.png");
 }
 
+.create-sample {
+    display: inline-block;
+    margin-left: 75px;
+}
+
 .button, .button:visited, .button:hover, .button:active {
     display: inline-block;
     font-weight: normal;
@@ -184,27 +190,46 @@ label .checkbox {
     border: 1px solid #E9EAEA;
 }
 
+.upload-panel {
+    border-right: 1px solid #D1D1D1;
+    float: left;
+    margin-right: 25px;
+}
+
 .file-upload {
+    background: url("img/file_upload.png") no-repeat center 0 transparent;
     cursor: pointer;
-    margin-bottom: 8px;
-    padding: 0 !important;
+    display: inline-block;
+    font-size: 14px;
+    font-weight: bold;
+    height: 45px;
+    margin: 0 40px 16px;
     overflow: hidden;
+    padding-top: 100px;
     position: relative;
+    text-align: center;
+    width: 100px;
 }
-.file-upload span {
-    line-height: 21px;
-    margin: 2px 12px;
+
+    .file-upload input {
+        cursor: pointer;
+        opacity: 0;
+        position: absolute;
+        right: 0;
+        top: 0;
+        transform: translate(555px, 60px) scale(8);
+    }
+
+.create-panel {
+    float: left;
 }
-.file-upload input {
-    cursor: pointer;
-    font-size: 23px;
-    opacity: 0;
-    position: absolute;
-    right: 0;
-    top: 0;
-    transform: translate(-300px, 0) scale(4);
+
+.upload-panel,
+.create-panel {
+    padding: 10px 0;
 }
 
+
 #mainProgress {
     color: #979b9f;
     display: none;
@@ -311,4 +336,11 @@ label .checkbox {
     -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
     -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.5);
     padding: 0 !important;
+}
+.clearFix:after {
+    content: ".";
+    display: block;
+    height: 0;
+    clear: both;
+    visibility: hidden;
 }

web/documentserver-example/java/src/main/webapp/index.jsp

@@ -47,41 +47,35 @@
             <span class="portal-name">ONLYOFFICE Document Editors</span>
             <br />
             <br />
-            <span class="portal-descr">Get started with a demo-sample of ONLYOFFICE Document Editors, the first html5-based editors. You may upload your own documents for testing using the "Choose file" button and selecting the necessary files on your PC.</span>
+            <span class="portal-descr">Get started with a demo-sample of ONLYOFFICE Document Editors, the first html5-based editors. You may upload your own documents for testing using the "Upload file" button and selecting the necessary files on your PC.</span>
 
-            <div class="file-upload button gray">
-                <span>Choose file</span>
-                <form class="fileupload" action="server/php/" method="POST" enctype="multipart/form-data">
-
-                </form>
-                <input type="file" id="fileupload" name="file" data-url="IndexServlet?type=upload" />
+            <div class="help-block">
+                <span class="try-descr">Upload your file or create new file</span>
+                <br />
+                <br />
+                <div class="clearFix">
+                    <div class="upload-panel clearFix">
+                        <a class="file-upload">
+                            Upload
+                            <br />
+                            File
+                            <input type="file" id="fileupload" name="file" data-url="IndexServlet?type=upload" />
+                        </a>
+                    </div>
+                    <div class="create-panel">
+                        <ul class="try-editor-list clearFix">
+                            <li><a class="try-editor document" data-type="docx">Create<br />Document</a></li>
+                            <li><a class="try-editor spreadsheet" data-type="xlsx">Create<br />Spreadsheet</a></li>
+                            <li><a class="try-editor presentation" data-type="pptx">Create<br />Presentation</a></li>
+                        </ul>
+                        <label class="create-sample">
+                            <input id="createSample" class="checkbox" type="checkbox" />
+                            Create a file filled with sample content
+                        </label>
+                    </div>
+                </div>
             </div>
-            <label class="save-original">
-                <input type="checkbox" id="checkOriginalFormat" class="checkbox" />Save document in original format
-            </label>
-            <span class="question"></span>
-            <br />
-            <br />
-            <br />
-            <span class="try-descr">You are also enabled to view and edit documents pre-uploaded to the portal.</span>
 
-            <ul class="try-editor-list">
-                <li>
-                    <a href="EditorServlet?fileExt=docx" class="try-editor document" target="_blank">
-                        Create<br />Sample Document
-                    </a>
-                </li>
-                <li>
-                    <a href="EditorServlet?fileExt=xlsx" class="try-editor spreadsheet" target="_blank">
-                        Create<br />Sample Spreadsheet
-                    </a>
-                </li>
-                <li>
-                    <a href="EditorServlet?fileExt=pptx" class="try-editor presentation" target="_blank">
-                        Create<br />Sample Presentation
-                    </a>
-                </li>
-            </ul>
 
             <br />
             <br />

web/documentserver-example/java/src/main/webapp/scripts/jscript.js

@@ -91,11 +91,6 @@ if (typeof jQuery !== "undefined") {
             return;
         }
 
-        if (jq("#checkOriginalFormat").is(":checked")) {
-            loadScripts();
-            return;
-        }
-
         timer = setTimeout(function () {
             var requestAddress = UrlConverter
                 + "&filename=" + encodeURIComponent(jq("#hiddenFileName").val());
@@ -194,6 +189,17 @@ if (typeof jQuery !== "undefined") {
         jq.unblockUI();
     });
 
+    jq(document).on("click", ".try-editor", function (e) {
+        var url = "EditorServlet?fileExt=" + e.target.attributes["data-type"].value;
+        if (jq("#createSample").is(":checked")) {
+            url += "&sample=true";
+        }
+        var w = window.open(url, "_blank");
+        w.onload = function () {
+            window.location.reload();
+        }
+    });
+
     jq.dropdownToggle({
         switcherSelector: ".question",
         dropdownID: "hint"