root/other-projects/nz-flag-design/trunk/main-form/my-design.jsp @ 29982

Revision 29982, 12.9 KB (checked in by davidb, 5 years ago)

Changes made during Fieldays event. Background colour remember between reloads (in localStorage) until published; more sophisticated support for handling JSON data

  • Property svn:executable set to *
Line 
1<%@ page contentType="text/html; charset=UTF-8" %>
2<!DOCTYPE html> 
3<html id="story">
4  <head>
5    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
6    <meta name="viewport" content="width=device-width, initial-scale=1"/>
7    <title>NZ Flag Design @ The University of Waikato (<%=request.getParameter("pub-name")%>)</title>
8   
9    <script src="css/source-sans-pro.js"></script>
10    <link href="css/styles.css" rel="stylesheet"/>
11    <link href="css/storystyle.css" rel="stylesheet"/>
12   
13   
14    <link rel="stylesheet"  href="lib-slider/css/jquery.mobile-1.3.0.css"/>
15    <link rel="stylesheet" href="lib-slider/css/jqm-demos.css"/>
16    <link rel="stylesheet" href="lib-slider/css/swipe-page.css"/>
17    <link rel="shortcut icon" href="lib-slider/nzflag-icon64-padded.png"/>
18
19    <script src="lib/jquery-1.8.2.min.js"></script>
20   
21    <script src="lib-slider/js/jquery.mobile.demos.js"></script>
22    <script src="lib-slider/js/jquery.mobile-1.3.0.js"></script>
23
24    <script>
25     window.addEventListener("beforeunload", function (event) {
26    console.log("beforeunload() called");
27    //var design_frame = document.getElementById('design-2d-iframe')
28        //var svgEditor = design_frame.contentWindow.svgEditor;
29
30    //var name = 'svgedit-' + svgEditor.curConfig.canvasName;
31    var name = 'svgedit-' + "default";
32
33    if (window.localStorage) {
34       console.log("Removing stored SVG picture");
35       window.localStorage.removeItem(name);
36       window.localStorage.removeItem("flagBackgroundColor");
37    }
38
39        event.preventDefault();
40    return;
41     });
42
43    </script>
44
45  <%@ page import="java.io.*,java.util.*,java.awt.image.*,javax.imageio.*,javax.xml.bind.DatatypeConverter,java.nio.file.*,org.json.*" %>
46
47  <%!
48
49 
50private static void copyFile(File source, File dest)
51        throws IOException {
52    InputStream input = null;
53    OutputStream output = null;
54    try {
55        input = new FileInputStream(source);
56        output = new FileOutputStream(dest);
57        byte[] buf = new byte[1024];
58        int bytesRead;
59        while ((bytesRead = input.read(buf)) > 0) {
60            output.write(buf, 0, bytesRead);
61        }
62    } finally {
63        input.close();
64        output.close();
65    }
66}
67/*
68    private static void copyFileChannels(File source, File dest)
69        throws IOException {
70      FileChannel inputChannel = null;
71      FileChannel outputChannel = null;
72      try {
73        inputChannel = new FileInputStream(source).getChannel();
74        outputChannel = new FileOutputStream(dest).getChannel();
75        outputChannel.transferFrom(inputChannel, 0, inputChannel.size());
76      } finally {
77        inputChannel.close();
78        outputChannel.close();
79      }
80    }
81
82*/
83/*
84     public static void copyFile_JAVA17( File from, File to ) throws IOException {
85       Files.copy( from.toPath(), to.toPath() );
86     }
87*/
88
89     public static void publishFile(File myFlagFile, File pubFlagFile)
90     {
91       try {
92         copyFile(myFlagFile,pubFlagFile);
93       }
94       catch (Exception e) {
95         e.printStackTrace();
96       }
97     }
98
99     public String publishFlag(HttpServletRequest request)
100     {
101       String doc_base = getServletContext().getRealPath("/");
102       File render_dir = new File(doc_base,"render-3d");
103       File render_images_dir = new File(render_dir,"images");
104
105       String png_filename = null;
106       String svg_filename = null;
107
108       String myid = request.getParameter("myid");
109       if (myid == null) {
110      png_filename = "flag.png";
111      svg_filename = "flag.svg";
112       }
113       else {     
114      png_filename = "flag-" + myid + ".png";
115      svg_filename = "flag-" + myid + ".svg";
116       }
117     
118       File full_my_png_file  = new File(render_images_dir,png_filename);
119       File full_my_svg_file  = new File(render_images_dir,svg_filename);
120
121       File pub_dir = new File(doc_base,"published");
122       String pub_name = request.getParameter("pub-name");
123       if (pub_name == null) {
124         pub_name = "tmp";
125       }
126
127       File my_pub_dir = new File(pub_dir,pub_name);
128       if (!my_pub_dir.exists()) {
129         my_pub_dir.mkdir();
130       }
131       File full_pub_my_png_file = new File(my_pub_dir,"myflag.png");
132       File full_pub_my_svg_file = new File(my_pub_dir,"myflag.svg");
133
134       publishFile(full_my_png_file,full_pub_my_png_file);
135       publishFile(full_my_svg_file,full_pub_my_svg_file);
136
137       return pub_name;
138     }
139
140
141     void savePubInfo(HttpServletRequest request, String pub_name)
142     {
143       String doc_base = getServletContext().getRealPath("/");
144       File pub_dir = new File(doc_base,"published");
145       File my_pub_dir = new File(pub_dir,pub_name);
146
147       File full_pub_json_file = new File(my_pub_dir,"pubinfo.json");
148
149       try {
150         String name  = request.getParameter("name");
151         String email = request.getParameter("email");
152         String desc  = request.getParameter("desc").replace("\n"," ").replace("\r"," ");
153
154     BufferedWriter bw = new BufferedWriter(new FileWriter(full_pub_json_file));
155
156
157     JSONObject obj = new JSONObject();
158     obj.append("pubName",pub_name);
159     obj.append("name",name);
160     obj.append("email",email);
161     obj.append("desc",desc);
162
163     obj.write(bw);
164         // bw.write("{ \"pubName\": \"" + pub_name + "\", \"name\": \"" + name + "\", \"email\": \"" + email + "\", \"desc\": \"" + desc + "\"}");
165         bw.close();
166
167       }
168       catch (Exception e) {
169         e.printStackTrace();
170       }
171     }
172
173   %>
174
175
176  <%
177     
178     String action = request.getParameter("action");
179
180     String my_flag_png = "myflag.png";
181     String my_flag_svg = "myflag.svg";
182
183     String pub_name = null;
184
185     String name  = null;
186     String email = null;
187     String desc  = null;
188
189
190     if ((action != null) && action.equals("publish")) {
191       pub_name = publishFlag(request);
192       savePubInfo(request,pub_name);
193       name  = request.getParameter("name");
194       email = request.getParameter("email");
195       desc  = request.getParameter("desc").replace("\n"," ").replace("\r"," ").replace("  "," ");
196     }
197     else {
198       // read in JSON file and get details
199       // set them up as Java variables for producing the page through Javascript
200
201       pub_name = request.getParameter("pub-name");
202       if (pub_name == null) {
203         pub_name = "tmp";
204       }
205
206       String doc_base = getServletContext().getRealPath("/");
207       File pub_dir = new File(doc_base,"published");
208       File my_pub_dir = new File(pub_dir,pub_name);       
209       File full_pub_json_file = new File(my_pub_dir,"pubinfo.json");
210
211       String everything = null;
212       BufferedReader br = new BufferedReader(new FileReader(full_pub_json_file));
213       try {
214
215         StringBuilder sb = new StringBuilder();
216         String line = br.readLine();
217
218     String line_sep = System.getProperty("line.separator");
219         while (line != null) {
220            sb.append(line);
221            sb.append(line_sep);
222            line = br.readLine();
223         }
224         everything = sb.toString();
225       }
226       catch (Exception e) {
227         e.printStackTrace();
228       }
229       finally {
230          br.close();
231       }
232
233       JSONObject obj = new JSONObject(everything);
234       try {
235           name  = obj.getString("name");
236       }
237       catch (Exception e) {
238           name  = obj.getJSONArray("name").getString(0);
239       }
240
241       try {
242           email = obj.getString("email");
243       }
244       catch (Exception e) {
245           email = obj.getJSONArray("email").getString(0);
246       }
247
248       try {
249           desc  = obj.getString("desc");
250       }
251       catch (Exception e) {
252           desc  = obj.getJSONArray("desc").getString(0);
253       }
254     }
255
256     // For use in Javascript
257     pub_name = pub_name.replace("\"","\\\"");
258     name  = name.replace("\"","\\\"");
259     email = email.replace("\"","\\\"");
260     desc  = desc.replace("\"","\\\"");     
261   %>
262
263    <style>
264      .vertical-align {
265        position: relative;
266        top: 50%;
267        -webkit-transform: translateY(-50%);
268        -ms-transform: translateY(-50%);
269        transform: translateY(-50%);
270      }
271    </style>
272
273  </head>
274
275  <body>
276
277  <%     
278     //String action = request.getParameter("action");
279     // only add FB like ability if visiting the item after it has been published
280
281     if (action == null) {
282  %>
283
284<div id="fb-root"></div>
285<script>(function(d, s, id) {
286
287    var js, fjs = d.getElementsByTagName(s)[0];
288    if (d.getElementById(id)) return;
289    js = d.createElement(s); js.id = id;
290    //js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3&appId=538218162984944";
291    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3&appId=1612166589021423";
292
293    fjs.parentNode.insertBefore(js, fjs);
294
295}(document, 'script', 'facebook-jssdk'));</script>
296
297  <%
298      }
299  %>
300
301    <div data-role="page" id="innovation-story-01" class="demo-page">
302     
303      <div data-role="content">
304     
305    <a target="_parent" href="../index.html" class="back-button back-left"></a>
306                                         
307    <div class="story-page" id="static-info-page">
308      <!-- put custom content here -->
309     
310      <div class="story-title" style="margin-left: 25px;">
311
312        <h1 class="center">My Design '<%=request.getParameter("pub-name")%>' @ The University of Waikato</h1>
313
314        <p class="center" style="margin: 6px;">&mdash; The New Zealand Flag Debate</p>
315       
316        <div class="center" style="height: 220px; position: relative;">
317          <div style="display: inline-block; position: relative;">
318        <img alt="" src="250px-Flag_of_New_Zealand.svg.png"
319             height="200" widthXX="350" />
320          </div>
321          <div style="height: 200px; font-size: 300%; display: inline-block;" class="vertical-alignXX">VS</div>
322          <div style="display: inline-block; position: relative">
323            <div>
324          <a id="myflag-svg" data-ajax="false" ><img id="myflag-png" title="Click on the image to see a larger SVG (Scalable Vector Graphic) version" height="200" style="border: none;"/></a>
325            </div>
326
327            <div class="fb-like"
328               style="position: absolute; left:10px; width:200px;"
329           data-href="http://www.greenstone.org/nz-flag-design/main-form/my-design.jsp?pub-name=<%=request.getParameter("pub-name")%>"
330           data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>
331
332            </div>
333          </div>
334
335        </div>
336
337
338<center>
339
340<script type="text/javascript">
341
342var published_id = "<%= pub_name %>";
343var name  = "<%= name %>";
344var email = "<%= email %>";
345var desc  = "<%= desc %>";
346
347document.write("  <div style=\"width: 500px; background: #181818; padding: 5px; margin: 10px;\">");
348document.write("    <p>Designer: " + name + "<p/>");
349//document.write("    <p>Email: " + email + "<p/>");
350document.write("    <p>Description: " + desc + "<p/>");
351document.write("  </div>");
352
353
354var a2a_config = a2a_config || {};
355a2a_config.linkname = "NZ Flag Design @ University of Waikato (" + published_id + ")";
356
357var base_url = location.protocol + '//' + location.host + location.pathname;
358
359a2a_config.linkurl = base_url + "?pub-name=" + published_id.replace(/ /g,"+");
360
361</script>
362
363
364</center>
365
366
367<div style="clear:both;"></div>
368
369
370
371<!-- AddToAny BEGIN -->
372<center>
373<p>
374  Share this design:
375</p>
376
377<div class="a2a_kit a2a_kit_size_32 a2a_default_style" style="width: 260px;">
378<a class="a2a_dd" href="https://www.addtoany.com/share_save"></a>
379<a class="a2a_button_email"></a>
380<a class="a2a_button_facebook"></a>
381<a class="a2a_button_google_plus"></a>
382<a class="a2a_button_google_gmail"></a>
383<a class="a2a_button_twitter"></a>
384<a class="a2a_button_tumblr"></a>
385</div>
386</center>
387
388<script type="text/javascript" src="//static.addtoany.com/menu/page.js"></script>
389<!-- AddToAny END -->
390
391
392
393    <center>
394    <p style="font-size: 220%;">
395      <i>
396    Or else view other flags designed at Fieldays through
397    <a target="_blank" href="http://www.greenstone.org/greenstone3/flag-library/collection/fieldays/page/about">
398      this link
399    </a>
400     </i>
401    </p>   
402    </center>
403
404    <center>
405    <p style="font-size: 200%;">
406      <i>
407      <a href="../index.html">Interactive Flag Design Website</a> by:
408       <a target="_blank" href="http://cosi.cms.waikato.ac.nz">The Centre for Open Source Innovation</a>
409       <a target="_blank" href="http://cosi.cms.waikato.ac.nz">(COSI)</a><br />
410       at the <a href="http://www.waikato.ac.nz">University of Waikato</a> 
411     </i>
412    </p>   
413    </center>
414
415
416      </div>
417      <!-- end of putting custom content -->
418
419    </div> <!-- end story-page-->       
420   
421      </div><!-- /content -->
422     
423    </div><!-- /page -->
424
425    <script>
426      $(document).ready( function() {
427     
428      var my_flag_png = "<%= "../published/" + pub_name + "/" + my_flag_png %>";
429      var my_flag_svg = "<%= "../published/" + pub_name + "/" + my_flag_svg %>";
430
431      $('#myflag-png').attr("src",  my_flag_png);
432      $('#myflag-svg').attr("href", my_flag_svg);
433
434      });
435
436    </script>
437
438  </body>
439</html>
440 
441
442
443
444
445
Note: See TracBrowser for help on using the browser.