upload image now has preview.

spa/404.html

@@ -43,11 +43,14 @@
         <!-- Materialize core JavaScript -->
         <!-- Placed at the end of the document so the pages load faster -->
         <script src="assets/js/jquery.min.js"></script>
+        <script src="assets/js/spa.js"></script>
         <script src="materialize/js/materialize.js"></script>
         <script src="index.js"></script>
         <script>
             $("#goback").click(function(){
                 history.back()
+ 				//WeixinJSBridge.call('closeWindow');
+                closeWechatBrowser();
             });
         </script>
     </body>

spa/assets/js/spa.js

@@ -0,0 +1,36 @@
+
+function readURL(input) {
+    if (input.files && input.files[0]) {
+        var reader = new FileReader();
+        reader.onload = function (e) {
+            $(input).closest("div.row").find("div.previewrapper > img.uploadpreview").attr('src', e.target.result)
+            $(input).closest("div.row").find("div.previewrapper").removeClass("hide");
+            $(input).closest("div.row").find("div.previewrapper").fadeIn(1000)
+        }
+        reader.readAsDataURL(input.files[0]);
+    }
+}
+
+$(".uploadimg").change(function(){
+    readURL(this);
+});
+
+$("div.previewrapper > img.removepreview").click(function(){
+    $(this).closest("div.row").find("input.uploadimg").val('');
+    $(this).closest("div.row").find("input.file-path").val('');
+                    $(this).closest("div.previewrapper").fadeOut(1000);
+});
+
+function isWeixinBrowser(){
+  var ua = navigator.userAgent.toLowerCase();
+  return (/micromessenger/.test(ua)) ? true : false ;
+}
+
+function closeWechatBrowser(){
+	if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
+    	WeixinJSBridge.call('closeWindow');
+	}     
+    $(document).on("WeixinJSBridgeReady", function(){
+        WeixinJSBridge.call('closeWindow');
+    });
+}

spa/edit.html

@@ -62,13 +62,19 @@
                     <div class="file-field input-field"> 
                         <div class="btn"> 
                             <span>头像</span> 
-                            <input id="avatar" name="avatar" type="file"> 
+                            <input id="avatar" name="avatar" class="uploadimg" type="file"> 
                         </div>                         
                         <div class="file-path-wrapper"> 
                             <input class="file-path validate" type="text"> 
                         </div>                         
                     </div>                     
                 </div>                 
+                <div class="col s12 valign center"> 
+                    <div class="previewrapper hide">
+                        <img id="preview" class="uploadpreview" src="data:image/jpeg;base64," alt="" />
+                        <img src="assets/img/close512x512.png" class="removepreview" height="48" width="48" /> 
+                    </div>
+                </div>                 
             </div>
             <div class="row">
                 <div id="save" class="col s12 m12 l12 valign left"> 
@@ -83,18 +89,21 @@
         <script src="assets/js/jquery.min.js"></script>
         <script src="materialize/js/materialize.js"></script>
         <script src="index.js"></script>
+        <script src="assets/js/spa.js"></script>
         <script type="text/javascript">
             $("#save").click(function(){
                 saved=localStorage.setItem("wechatleadsaved", "true");
             });
             $(function(){
                 saved = localStorage.getItem("wechatleadsaved");
+                localStorage.removeItem("wechatleadsaved");
                 if (saved == "true"){
-                    alert("{{.Name}}\n\n已保存\n\n {{.ModifiedAt}}");
+                    alert("{{.LastName}}\n\n已保存\n\n{{.ModifiedAt}}");
+                    closeWechatBrowser();
                 }
-                localStorage.removeItem("wechatleadsaved");
-                
             });
+            
+            
         </script>
     </body>
 </html>

spa/newevent.html

@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <meta name="description" content="">
+        <meta name="author" content="">
+        <!-- Favicons-->
+        <link rel="apple-touch-icon-precomposed" href="images/favicon/apple-touch-icon-152x152.png">
+        <meta name="msapplication-TileColor" content="#FFFFFF">
+        <meta name="msapplication-TileImage" content="images/favicon/mstile-144x144.png">
+        <link rel="icon" href="images/favicon/favicon-32x32.png" sizes="32x32">
+        <title>发起新活动</title>
+        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+        <!-- Materialize core CSS -->
+        <link href="materialize/css/materialize.css" rel="stylesheet">
+        <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+        <!--[if lt IE 9]>
+            <script src="assets/js/html5shiv.js"></script>
+            <script src="assets/js/respond.min.js"></script>
+        <![endif]-->
+        <link href="style.css" rel="stylesheet">
+    </head>
+    <body>
+        <div class="row valign center">
+            <h3 class="flow-text truncate accent-1 waves-effect">校友会活动信息</h3>
+        </div>
+        <form method="post" enctype="multipart/form-data"> 
+            <div class="row">
+                <div class="input-field col s12">
+                    <i class="mdi-action-loyalty small prefix"></i> 
+                    <input name="meetingname" id="meetingname" type="text" class="validate"> 
+                    <label for="meetingname"> 活动主题/标题   </label>                     
+                </div>                 
+            </div>
+            <div class="row"> 
+                <div class="input-field col s12">
+                    <i class="mdi-action-list small prefix"></i> 
+                    <textarea id="description" class="materialize-textarea"></textarea>                     
+                    <label for="description"> 
+                        活动描述 200字左右
+</label>                     
+                </div>                 
+            </div>
+            <div class="row" i>
+                <div class="col s12 "> 
+                    <div class="file-field input-field"> 
+                        <div class="btn"> 
+                            <span>封面图片</span> 
+                            <input type="file" class="uploadimg" id="cover" name="cover" prev> 
+                        </div>                         
+                        <div class="file-path-wrapper"> 
+                            <input class="file-path validate" type="text"> 
+                        </div>                         
+                    </div>                     
+                </div>
+                <div class="col s12 valign center"> 
+                    <div class="previewrapper hide">
+                        <img id="preview" class="uploadpreview" src="data:image/jpeg;base64," alt="" />
+                        <img src="assets/img/close512x512.png" class="removepreview" height="48" width="48" /> 
+                    </div>
+                </div>
+            </div>             
+            <div class="row">
+</div>
+            <input type="submit" class="btn waves-effect waves-light orange fullwidth" value="发起活动"> 
+        </form>
+        <!-- Materialize core JavaScript -->
+        <!-- Placed at the end of the document so the pages load faster -->
+        <script src="assets/js/jquery.min.js"></script>
+        <script src="materialize/js/materialize.js"></script>
+        <script src="index.js"></script>
+        <script src="assets/js/spa.js"></script>
+    </body>

spa/pinegrow.json

@@ -1 +1 @@
-{"files":{"edit.html":{"frameworks":["spa","pg.insight.events","pg.code-validator","pg.asset.manager","pg.project.items","mat0.97.5","pg.html","pg.components"],"last_page_width":896},"404.html":{"frameworks":["spa","pg.insight.events","pg.code-validator","pg.project.items","pg.asset.manager","mat0.97.5","pg.html","pg.components"],"last_page_width":1024},"livecast.html":{"frameworks":["spa","pg.insight.events","pg.code-validator","pg.project.items","pg.asset.manager","mat0.97.5","pg.html","pg.components"],"last_page_width":1024}},"breakpoints":["28.875em","33.875em","35.875em","38.875em","40.125em","46.75em","360px","390px","420px","450px","480px","510px","540px","570px","601px","630px","660px","690px","720px","750px","780px","810px","840px","870px","900px","930px","960px","993px","1200px"],"frameworks":["spa","pg.insight.events","pg.code-validator","pg.project.items","pg.asset.manager","mat0.97.5","pg.html","pg.components"],"template_framework_id":"materialize"}
+{"files":{"edit.html":{"frameworks":["spa","pg.insight.events","pg.code-validator","pg.asset.manager","pg.project.items","mat0.97.5","pg.html","pg.components"],"last_page_width":896},"404.html":{"frameworks":["spa","pg.insight.events","pg.code-validator","pg.asset.manager","pg.project.items","mat0.97.5","pg.html","pg.components"],"last_page_width":1024},"livecast.html":{"frameworks":["spa","pg.insight.events","pg.code-validator","pg.project.items","pg.asset.manager","mat0.97.5","pg.html","pg.components"],"last_page_width":1024},"newEvents.html":{"frameworks":["spa","pg.insight.events","pg.code-validator","pg.project.items","pg.asset.manager","mat0.97.5","pg.html","pg.components"],"last_page_width":1024},"newevent.html":{"frameworks":["spa","userlib7784","pg.insight.events","pg.code-validator","pg.asset.manager","pg.project.items","mat0.97.5","pg.html","pg.components"],"last_page_width":1024}},"breakpoints":["28.875em","33.875em","35.875em","38.875em","40.125em","46.75em","360px","390px","420px","450px","480px","510px","540px","570px","601px","630px","660px","690px","720px","750px","780px","810px","840px","870px","900px","930px","960px","993px","1200px"],"frameworks":["spa","userlib7784","pg.insight.events","pg.code-validator","pg.asset.manager","pg.project.items","mat0.97.5","pg.html","pg.components"],"template_framework_id":"materialize"}

spa/style.css

@@ -5,3 +5,31 @@
     font-size: 100px;
 }
 
+.fullwidth
+{
+    width: 100%;
+}
+
+div.previewrapper
+{
+    position: relative;
+}
+
+div.previewrapper > img.removepreview
+{
+    position: absolute;
+    top: -9px;
+    right: -9px;
+    color: red;
+    cursor: pointer;
+    text-decoration: blink;
+    font-weight: bold;
+    font-style: normal;
+    border-radius: 10px;
+}
+
+img.uploadpreview
+{
+    width: 100%;
+}
+