Working version of progress bar

jwswj · Nov 6, 2011 · ce87291 · ce87291
1 parent c47d1a1
commit ce87291
Show file tree

Hide file tree

Showing 10 changed files with 367 additions and 4 deletions.
diff --git a/public/css/burgues_script-webfont.eot b/public/css/burgues_script-webfont.eot
diff --git a/public/css/burgues_script-webfont.svg b/public/css/burgues_script-webfont.svg
diff --git a/public/css/burgues_script-webfont.ttf b/public/css/burgues_script-webfont.ttf
diff --git a/public/css/burgues_script-webfont.woff b/public/css/burgues_script-webfont.woff
diff --git a/public/css/style.css b/public/css/style.css
@@ -0,0 +1,46 @@
+@font-face {
+    font-family: 'BurguesScriptRegular';
+    src: url('burgues_script-webfont.eot');
+    src: url('burgues_script-webfont.eot?#iefix') format('embedded-opentype'),
+         url('burgues_script-webfont.woff') format('woff'),
+         url('burgues_script-webfont.ttf') format('truetype'),
+         url('burgues_script-webfont.svg#BurguesScriptRegular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+
+}
+
+em {
+	font-style: italic;
+}
+strong {
+	font-weight: bold;
+}
+
+/* Links */
+a {
+	color: #574319;
+
+}
+
+/* Main Section */
+html {
+    background: #F4F1ED;
+    text-align: center;
+    color: #574319;
+}
+
+h1 {
+	font-size: 44px;
+	line-height: 40px;
+	font-family: 'BurguesScriptRegular', sans-serif;
+	text-indent: 30px;
+	position: relative;
+}
+
+
+#contentWrapper {	
+	width: 620px;
+	margin-left: 190px;
+	text-align: left;
+}
diff --git a/public/js/jquery.min.js b/public/js/jquery.min.js
diff --git a/public/js/jquery.transloadit2.js b/public/js/jquery.transloadit2.js
diff --git a/views/event/add.ejs → views/events/add.ejs b/views/event/add.ejs → views/events/add.ejs
diff --git a/views/fake.ejs b/views/fake.ejs
@@ -1,7 +1,45 @@
 <h1>Pretend to post a photo</h1>
 
-<form id="photo" name="photo" method="post" action="/fake">
+<script type="text/javascript" src="//assets.transloadit.com/js/jquery.transloadit2.js"></script>
+<script type="text/javascript">
+   	// We call .transloadit() after the DOM is initialized:
+   	$(document).ready(function() {
+    	// Don't forget this goes inside your document.ready
+		$('#newpicture').transloadit({
+		  modal: false,
+		  autoSubmit: false,
+		  wait: true,
+		  onProgress: function(bytesReceived, bytesExpected) {
+		    // render your own progress bar!
+		    $('#progress')
+		      .text((bytesReceived / bytesExpected * 100).toFixed(2)+'%');
+		  },
+		  onError: function(assembly) {
+		    alert(assembly.error+': '+assembly.message);
+		  },
+		  onSuccess: function(assembly) {
+		  	console.log(assembly);
+		  }
+		});
+
+		// Event handler to submit form
+		$('#button').click(function(){
+			$('#newpicture').submit();
+			return false;
+		});
+   });
+</script>
+
+<div id="progress"></div>
+
+<form id="newpicture" name="newpicture" method="POST" action="http://api2.transloadit.com/assemblies" enctype="multipart/form-data">
+	<input type="hidden" name="params" value="{&quot;auth&quot;:{&quot;key&quot;:&quot;121f5af949ab45b6a29924e5aa4e9520&quot;},&quot;template_id&quot;:&quot;0a31cdf7aa7b4acfa1508da329d0075d&quot;,&quot;redirect_url&quot;:&quot;/fake&quot;}" />
 	<label for="name">Name</label>
-	<input id="name" name="name" type="text">
+	<input id="name" name="name" type="text" value="SianJason">
+	<label for="photo">Photo</label>
+	<input id="photo" type="file" name="photo">
+	<label for="caption">Caption</label>
+	<input id="caption" name="caption" type="text">
 	<button type="submit">Add</button>
-</form>
+</form>
+<a id="button" href="">Submit form</a>
diff --git a/views/layout.ejs b/views/layout.ejs
@@ -1,7 +1,7 @@
 <!doctype html>
 <html>
     <head>
-		<title>Sian & Jason's Wedding 11-11-11</title>
+		<title>Weddings Pics</title>
 
 		<meta charset="utf-8">
 		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />