root/other-projects/the-macronizer/trunk/web/jsp/en/main.jsp @ 30594

Revision 30594, 10.9 KB (checked in by kjdon, 4 years ago)

modifying the input and results areas to get it looking the same in chrome as it does in firefox

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<%
3            String inputOptionsDisplay;
4            String inputOptionsVisibility;
5            String hiddenInputOptions;
6            if (request.getAttribute("options") != null && request.getAttribute("options").equals("true")) {
7                inputOptionsDisplay = "block";
8                inputOptionsVisibility = "visible";
9                hiddenInputOptions = "true";
10            } else {
11                inputOptionsDisplay = "none";
12                inputOptionsVisibility = "hidden";
13                hiddenInputOptions = "false";
14            }
15            String checkPreserveMacrons;
16            if (request.getAttribute("preserveMacrons") != null && !request.getAttribute("preserveMacrons").equals("true")) {
17                checkPreserveMacrons = "";
18            } else {
19                checkPreserveMacrons = "checked";
20            }
21%>
22
23<html>
24    <head>
25        <%@page contentType="text/html" pageEncoding="UTF-8"%>
26        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
27        <title>The Māori Macron Restoration Service</title>
28        <link href="../../css/css.css" rel="stylesheet" type="text/css" />
29        <script src="../../js/js.js" type="text/javascript"></script>
30
31        <style type="text/css">
32            <% if (request.getAttribute("file") != null) {%>
33            fieldset#download-file, li#download-tab {
34                display: block;
35                visibility: visible;
36            }
37            fieldset#restore-by-input, fieldset#restore-by-upload {
38                display: none;
39                visibility: hidden;
40            }
41            <% } else {%>
42            fieldset#restore-by-input {
43                display: block;
44                visibility: visible;
45            }
46            fieldset#restore-by-upload, fieldset#download-file, li#download-tab {
47                display: none;
48                visibility: hidden;
49            }
50            <% }%>
51
52
53
54
55        </style>
56
57    </head>
58
59    <body>
60        <jsp:include page="header.jsp" />
61
62        <div id="content">
63            <ul id="tabset_tabs">
64                <%
65                            String inputTabClass, uploadTabClass, downloadTabClass;
66                            inputTabClass = uploadTabClass = downloadTabClass = "";
67                            if (request.getAttribute("file") != null) {
68                                downloadTabClass = "selected";
69                            } else {
70                                inputTabClass = "selected";
71                            }
72                %>
73                <li id="input-tab" class="<%=inputTabClass%>"> <a href="javascript:toggleTabs('restore-by-input');"> <span>Add Macrons by</span> Direct Input </a> </li>
74                <li id="upload-tab" class="<%=uploadTabClass%>"> <a href="javascript:toggleTabs('restore-by-upload');"> <span>Add Macrons by</span> File Upload </a> </li>
75                <li id="download-tab" class="<%=downloadTabClass%>"> <a href="javascript:void()"> <span>Macronised File</span> Download</a> </li>
76            </ul>
77
78            <div id="fields">
79                <fieldset id="restore-by-input">
80                    <legend class="tabset_label">Add Macrons by Direct Input</legend>
81                    <form action="../servlet/DirectInput" method="post" >
82                        <p class="instructions">Enter the Text</p>
83            <div class="workspace">
84              <textarea name="fragment" cols="60" rows="18" id="fragment"><%= request.getAttribute("old") != null ? request.getAttribute("old") : ""%></textarea>
85              <div class="results" ><%= request.getAttribute("fragment2") != null ? request.getAttribute("fragment2") : ""%></div>
86            </div>
87                        <fieldset>
88                            <legend class="more-options">
89                                <a href="javascript:toggleOptions();">
90                                    <img id="input-more-options-icon" src="../../images/arrow-closed.png" alt="Advanced Options Icon"></img>
91                                    Advanced Options
92                                </a>
93                            </legend>
94                            <div id="input-options" class="options" style="display: <%=inputOptionsDisplay%>; visibility: <%=inputOptionsVisibility%>;">
95                                <table>
96                                    <tr>
97                                        <td>
98                                            <input name="preserveExistingMacrons" type="checkbox" value="true" <%=checkPreserveMacrons%>></input>
99                                            <label>Preserve existing macrons</label>
100                                        </td>
101                                    </tr>
102                                </table>
103                            </div>
104                        </fieldset>
105                        <input type="hidden" name="lang" value="en" />
106                        <input id="hidden-input-options" type="hidden" name="options" value="<%= hiddenInputOptions%>" />
107                        <p class="submit_button">
108                            <input title="Submit to add macrons" type="submit" value="Add Macrons" />
109                        </p>
110                    </form>
111                </fieldset>
112
113                <fieldset id="restore-by-upload">
114                    <legend class="tabset_label">Add Macrons by File Upload</legend>
115                    <form action="../servlet/FileUpload" method="post" enctype="multipart/form-data">
116                        <p class="instructions">Choose an existing document to upload</p>
117                        <p>
118                            <label>File:</label>
119                            <input type="file" id="uploaded_file" name="file" />
120                        </p>
121                        <fieldset>
122                            <legend class="more-options">
123                                <a href="javascript:toggleOptions();">
124                                    <img id="upload-more-options-icon" src="../../images/arrow-closed.png" alt="Advanced Options Icon"></img>
125                                    Advanced Options
126                                </a>
127                            </legend>
128                            <div id="upload-options" class="options" style="display: <%=inputOptionsDisplay%>; visibility: <%=inputOptionsVisibility%>;">
129                                <table>
130                                    <tr>
131                                        <th><label>Character Encoding:</label></th>
132                                        <td><select id="upload-charset" name="charsetEncoding">
133                                                <option value="(detect automatically)" selected="selected">(detect automatically)</option>
134                                                <option value="utf-8">utf-8 (Unicode)</option>
135                                                <option value="utf-16">utf-16 (Unicode)</option>
136                                            </select></td>
137                                    </tr>
138                                    <tr>
139                                        <th><label>Document Type:</label></th>
140                                        <td><select id="upload-doctype" name="fileType">
141                                                <option value="(detect automatically)" selected="selected">(detect automatically)</option>
142                                                <option value=".docx">Microsoft Office Word 2007 (.docx)</option>
143                                                <option value=".odt">Open Office Word (.odt)</option>
144                                                <option value=".txt">Text (.txt)</option>
145                                            </select></td>
146                                    </tr>
147                                    <tr>
148                                        <td>
149                                            <input name="preserveExistingMacrons" type="checkbox" value="true" <%=checkPreserveMacrons%>></input>
150                                            <label>Preserve existing macrons</label>
151                                        </td>
152                                    </tr>
153                                </table>
154                            </div>
155                        </fieldset>
156                        <input type="hidden" name="lang" value="en" />
157                        <input id="hidden-upload-options" type="hidden" name="options" value="<%= hiddenInputOptions%>" />
158                        <p class="submit_button">
159                            <input title="Submit to add macrons" type="submit" value="Upload File" />
160                        </p>
161                        <p class="notes">Note: Supports Microsoft Word 2007 documents, Open Office Text documents and text files.</p>
162                    </form>
163                </fieldset>
164
165                <fieldset id="download-file">
166                    <legend class="tabset_label">Restored by File Upload</legend>
167                    <form action="../servlet/Download" method="post" >
168                        <p class="instructions">Output:</p>
169                        <div id="options" class="options">
170                            <table>
171                                <tr>
172                                    <th><label>File:</label></th>
173                                    <td><label><%= request.getAttribute("filename")%></label></td>
174                                </tr>
175                                <tr>
176                                    <th><label>Character Encoding:</label></th>
177                                    <td><label><%= request.getAttribute("charsetEncoding")%></label></td>
178                                </tr>
179                                <tr>
180                                    <th><label>Document Type:</label></th>
181                                    <td><label><%= request.getAttribute("fileType")%></label></td>
182                                </tr>
183                            </table>
184                        </div>
185                        <%
186                                    String downloadFilePath = request.getAttribute("file") != null ? ((java.io.File) request.getAttribute("file")).getAbsolutePath() : null;
187                        %>
188                        <input type="hidden" id="filepath" name="filepath" value="<%=downloadFilePath%>" />
189                        <input type="hidden" id="filename" name="filename" value="<%= request.getAttribute("filename")%>" />
190                        <p class="submit_button">
191                            <input title="Download File" type="submit" value="Download File" />
192                        </p>
193                    </form>
194                </fieldset>
195            </div>
196        </div>
197
198        <jsp:include page="footer.jsp" />
199    </body>
200</html>
Note: See TracBrowser for help on using the browser.