source: other-projects/the-macronizer/trunk/web/jsp/mi/main.jsp@ 33866

Last change on this file since 33866 was 33866, checked in by ak19, 4 years ago

Dr Bainbridge's fix to Android mobile macronizer user (on Chrome 79.0.3945.116 running on Samsung S9 with Android 8.0.0; SM-G960U Build.R16NW) sent us a screenshot of text typed into the macronizer text area showing the textarea box obscuring the Add Macrons button. Investigating it showed that when text was typed, this text box enlarged. Although our tests in the chrome browser's responsive/mobile emulation (in web developer's tools) did not show the button itself going behind the text box but floating above it, the fix in this commit seems to prevent the box getting automatically enlarged when typing. The user can still manually expand the box by dragging its bottom right corner.

File size: 11.6 KB
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
28 <!-- Text area used to keep getting bigger when user started to type in it, but then also obscured the button underneath.
29 The solution referring to a meta viewport tag with "maximum-scale" suggested below seemed to work when testing in browser:
30 https://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone
31 However, just setting the meta viewport tag with only initial-scale seems to work too:
32 https://www.w3schools.com/css/css_rwd_viewport.asp
33 -->
34 <meta name="viewport" content="width=device-width, initial-scale=1.0">
35
36 <title>The Māori Macron Restoration Service</title>
37 <link href="../../css/css.css" rel="stylesheet" type="text/css" />
38 <script src="../../js/js.js" type="text/javascript"></script>
39
40 <style type="text/css">
41 <% if (request.getAttribute("file") != null) {%>
42 fieldset#download-file, li#download-tab {
43 display: block;
44 visibility: visible;
45 }
46 fieldset#restore-by-input, fieldset#restore-by-upload {
47 display: none;
48 visibility: hidden;
49 }
50 <% } else {%>
51 fieldset#restore-by-input {
52 display: block;
53 visibility: visible;
54 }
55 fieldset#restore-by-upload, fieldset#download-file, li#download-tab {
56 display: none;
57 visibility: hidden;
58 }
59 <% }%>
60
61
62
63
64 </style>
65
66 </head>
67
68 <body>
69 <jsp:include page="header.jsp" />
70
71 <div id="content">
72 <ul id="tabset_tabs">
73 <%
74 String inputTabClass, uploadTabClass, downloadTabClass;
75 inputTabClass = uploadTabClass = downloadTabClass = "";
76 if (request.getAttribute("file") != null) {
77 downloadTabClass = "selected";
78 } else {
79 inputTabClass = "selected";
80 }
81 %>
82 <li id="input-tab" class="<%=inputTabClass%>"> <a href="javascript:toggleTabs('restore-by-input');"> <span>Tāpiri Tohutō i te</span> Tāurunga</a> </li>
83 <li id="upload-tab" class="<%=uploadTabClass%>"> <a href="javascript:toggleTabs('restore-by-upload');"> <span>Tāpiri Tohutō i te</span> Kōnae Tuku Atu</a> </li>
84 <li id="download-tab" class="<%=downloadTabClass%>"> <a href="javascript:void()"> <span>Whakaora ki te</span> Kōnae Tukuake</a> </li>
85 </ul>
86
87 <div id="fields">
88 <fieldset id="restore-by-input">
89 <legend class="tabset_label">Tāpiri Tohutō i te Tāurunga</legend>
90 <form action="../servlet/DirectInput" method="post" >
91 <p class="instructions">Tuhia ngā kōrero</p>
92 <div class="workspace">
93 <textarea name="fragment" cols="60" rows="18" id="fragment"><%= request.getAttribute("old") != null ? request.getAttribute("old") : ""%></textarea>
94 <div class="results" ><%= request.getAttribute("fragment2") != null ? request.getAttribute("fragment2") : ""%></div>
95 </div>
96 <fieldset>
97 <legend class="more-options">
98 <a href="javascript:toggleOptions();">
99 <img id="input-more-options-icon" src="../../images/arrow-closed.png" alt="Advanced Options Icon"></img>
100 Ngā Kōwhiringa Arā Atu Anō
101 </a>
102 </legend>
103 <div id="input-options" class="options" style="display: <%=inputOptionsDisplay%>; visibility: <%=inputOptionsVisibility%>;">
104 <table>
105 <tr>
106 <td>
107 <input name="preserveExistingMacrons" type="checkbox" value="true" <%=checkPreserveMacrons%>></input>
108 <label>Pupuritia ngā tohutō tīariari</label>
109 </td>
110 </tr>
111 </table>
112 </div>
113 </fieldset>
114 <input type="hidden" name="lang" value="mi" />
115 <input id="hidden-input-options" type="hidden" name="options" value="<%= hiddenInputOptions%>" />
116 <p class="submit_button">
117 <input title="Submit to add macrons" type="submit" value="Tāpiri Tohutō" />
118 </p>
119 </form>
120 </fieldset>
121
122 <fieldset id="restore-by-upload">
123 <legend class="tabset_label">Tāpiri tohutō i te kōnae tuku atu</legend>
124 <form action="../servlet/FileUpload" method="post" enctype="multipart/form-data">
125 <p class="instructions">Kōwhiritia tētehi kōnae hei tukuake</p>
126 <p>
127 <label>Kōnae:</label>
128 <input type="file" id="uploaded_file" name="file" />
129 </p>
130 <fieldset>
131 <legend class="more-options">
132 <a href="javascript:toggleOptions();">
133 <img id="upload-more-options-icon" src="../../images/arrow-closed.png" alt="Advanced Options Icon"></img>
134 Ngā Kōwhiringa Arā Atu Anō
135 </a>
136 </legend>
137 <div id="upload-options" class="options" style="display: <%=inputOptionsDisplay%>; visibility: <%=inputOptionsVisibility%>;">
138 <table>
139 <tr>
140 <th><label>Whakawaehere Pūāhua:</label></th>
141 <td><select id="upload-charset" name="charsetEncoding">
142 <option value="(detect automatically)" selected="selected">(kimi aunoa)</option>
143 <option value="utf-8">utf-8 (Unicode)</option>
144 <option value="utf-16">utf-16 (Unicode)</option>
145 </select></td>
146 </tr>
147 <tr>
148 <th><label>Momo Tuhinga:</label></th>
149 <td><select id="upload-doctype" name="fileType">
150 <option value="(detect automatically)" selected="selected">(kimi aunoa)</option>
151 <option value=".docx">Microsoft Office Word 2007 (.docx)</option>
152 <option value=".odt">Open Office Word (.odt)</option>
153 <option value=".txt">Text (.txt)</option>
154 </select></td>
155 </tr>
156 <tr>
157 <td>
158 <input name="preserveExistingMacrons" type="checkbox" value="true" <%=checkPreserveMacrons%>></input>
159 <label>Pupuritia ngā tohutō tīariari</label>
160 </td>
161 </tr>
162 </table>
163 </div>
164 </fieldset>
165 <input type="hidden" name="lang" value="mi" />
166 <input id="hidden-upload-options" type="hidden" name="options" value="<%= hiddenInputOptions%>" />
167 <p class="submit_button">
168 <input title="Submit to add macrons" type="submit" value="Tiki Kōnae" />
169 </p>
170 <p class="notes">Hei whakamōhio: E āhei ana ngā tuhinga Microsoft Word 2007, ngā tuhinga Open Office Text me ngā tuhinga kuputuhi hoki.</p>
171 </form>
172 </fieldset>
173
174 <fieldset id="download-file">
175 <legend class="tabset_label">Whakaora ki te Kōnae Tukuake</legend>
176 <form action="../servlet/Download" method="post" >
177 <p class="instructions">Tāputa:</p>
178 <div id="options" class="options">
179 <table>
180 <tr>
181 <th><label>Kōnae:</label></th>
182 <td><label><%= request.getAttribute("filename")%></label></td>
183 </tr>
184 <tr>
185 <th><label>Whakawaehere Pūāhua:</label></th>
186 <td><label><%= request.getAttribute("charsetEncoding")%></label></td>
187 </tr>
188 <tr>
189 <th><label>Momo Tuhinga:</label></th>
190 <td><label><%= request.getAttribute("fileType")%></label></td>
191 </tr>
192 </table>
193 </div>
194 <%
195 String downloadFilePath = request.getAttribute("file") != null ? ((java.io.File) request.getAttribute("file")).getAbsolutePath() : null;
196 %>
197 <input type="hidden" id="filepath" name="filepath" value="<%=downloadFilePath%>" />
198 <input type="hidden" id="filename" name="filename" value="<%= request.getAttribute("filename")%>" />
199 <p class="submit_button">
200 <input title="Download File" type="submit" value="Tikiake Kōnae" />
201 </p>
202 </form>
203 </fieldset>
204 </div>
205 </div>
206
207 <jsp:include page="footer.jsp" />
208 </body>
209</html>
Note: See TracBrowser for help on using the repository browser.