Uppladdning av foton

app/templates/admin.html

@@ -103,12 +103,22 @@
       </div>
       <div class="panel-body">
         <div class="panel panel-primary">
+          <div class="panel-heading">
+            Ladda upp foto
+          </div>
           <div class="panel-body">
-            <form class="form-inline">
-              <div class="form-group">
-                <input type="file">
+            <form method="post" action="{{url_for('upload')}}" class="form-inline" enctype="multipart/form-data">
+              <div class="input-group">
+                <label class="input-group-btn">
+                  <span class="btn btn-primary">
+                    <span class="glyphicon glyphicon-folder-open"></span>
+                    <span class="glyphicon glyphicon-option-horizontal"></span>
+                    <input name="photo" type="file" style="display: none;" id="photo-upload">
+                  </span>
+                </label>
+                <input type="text" class="form-control" readonly id="photo-name">
               </div>
-              <button type="submit" class="btn btn-default">Ladda upp foto</button>
+              <button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-upload"></button>
             </form>
           </div>
         </div>
@@ -149,5 +159,13 @@ $('#deletemodal').on('show.bs.modal', function (event) {
   modal.find('.modal-body p').text(message)
   modal.find('.modal-footer a').attr('href', href)
 })
+
+$('#photo-upload').on('change', function (event) {
+  var filename = $(this).val()
+  filename = filename.replace(/\\/g, "/")
+  filename = filename.replace(/.*\//, "")
+  $('#photo-name').val(filename)
+});
+
 </script>
 {% endblock %}