New layout, yay

main.py

@@ -117,7 +117,12 @@ def create_project_old():
             flash(u'Vous devez spécifier un nom.', 'error')
     return render_template('create_project.html')
 
-@app.route('/create', methods=['GET', 'POST'])
+@app.route('/add-my-project', methods=['GET'])
+def add_project():
+    return render_template('add_project.html')
+
+
+@app.route('/create/form', methods=['GET', 'POST'])
 def create_project():
     form = forms.ProjectForm()
     if form.validate_on_submit():
@@ -125,12 +130,14 @@ def create_project():
         return redirect('/')
     return render_template('project_form.html', form=form)
 
+
 @app.route('/search', methods=['GET', 'POST'])
 def search():
     if request.method == 'POST':
         pass
     return render_template('search.html')
 
+
 @app.route('/api/<projects>.json')
 def projects_json(projects):
     if projects == 'projects':

settings.py

@@ -1,7 +1,7 @@
 #!/usr/bin/env python
 # -*- coding: utf-8 -*-
 
-DATABASE = '/tmp/cavote.db'
+DATABASE = './ffdn-db.sqlite'
 #PASSWD_SALT = 'change this value to some random chars!'
 SECRET_KEY = '{J@uRKO,xO-PK7B,jF?>iHbxLasF9s#zjOoy=+:'
 DEBUG = True

static/css/style.css

@@ -1,3 +1,36 @@
+
+@font-face {
+    font-family: 'ffdn';
+    src: url('../fonts/ffdn.eot');
+    src: url('../fonts/ffdn.eot?#iefix') format('embedded-opentype'),
+         url('../fonts/ffdn.woff') format('woff'),
+         url('../fonts/ffdn.ttf') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+}
+
+#ffdn-header {
+    font-family: ffdn;
+    font-size: 24px;
+    letter-spacing: 1px;
+    display: inline-block;
+}
+
+.brand:hover #ffdn-header {
+    animation-duration: 0.6s;
+    animation-name: lulz;
+}
+
+@keyframes lulz {
+    0% {
+        transform: scaleX(1);
+        transform: scaleY(0.5);
+    }
+    50% {
+        transform: scaleX(1.5);
+    }
+}
+
 .control-group.required label:before {
     content: '*';
     color: red;

static/js/site.js

@@ -1,55 +1,53 @@
 
 "use strict";
 
-!function($) {
-    $(function () {
-        $('.fieldlist').each(function() {
-            var $this=$(this);
-            var lis=$this.children('li');
-            lis.first().children(':first').after(' <button class="btn btn-mini" type="button"><i class="icon-plus"></i></button>');
-            lis.first().children('button').click(function() {
-                clone_fieldlist($this.children('li:last'));
-            });
-            lis=lis.slice(1);
-            lis.each(function() {
-                append_remove_button($(this));
-            });
+$(function () {
+    $('.fieldlist').each(function() {
+        var $this=$(this);
+        var lis=$this.children('li');
+        lis.first().children(':first').after(' <button class="btn btn-mini" type="button"><i class="icon-plus"></i></button>');
+        lis.first().children('button').click(function() {
+            clone_fieldlist($this.children('li:last'));
+        });
+        lis=lis.slice(1);
+        lis.each(function() {
+            append_remove_button($(this));
         });
-        $('.selectpicker').selectpicker();
     });
+    $('.selectpicker').selectpicker();
+});
 
-    function change_input_num(li, new_num, reset=false) {
-        li.find('input,select').each(function() {
-            var id = $(this).attr('id').replace(/^(.*)-\d{1,4}/, '$1-'+new_num);
-            $(this).attr({'name': id, 'id': id});
-            if(reset)
-                $(this).val('').removeAttr('checked');
-        });
-    }
+function change_input_num(li, new_num, reset=false) {
+    li.find('input,select').each(function() {
+        var id = $(this).attr('id').replace(/^(.*)-\d{1,4}/, '$1-'+new_num);
+        $(this).attr({'name': id, 'id': id});
+        if(reset)
+            $(this).val('').removeAttr('checked');
+    });
+}
 
-    function append_remove_button(li) {
-        li.children(':first').after(' <button class="btn btn-mini" type="button"><i class="icon-minus"></i></button>');
-        li.children('button').click(function() {
-            var ul=li.parent();
-            li.remove();
-            var i=0;
-            ul.children('li').each(function() {
-                change_input_num($(this), i);
-                i++;
-            });
+function append_remove_button(li) {
+    li.children(':first').after(' <button class="btn btn-mini" type="button"><i class="icon-minus"></i></button>');
+    li.children('button').click(function() {
+        var ul=li.parent();
+        li.remove();
+        var i=0;
+        ul.children('li').each(function() {
+            change_input_num($(this), i);
+            i++;
         });
-    };
+    });
+};
 
-    function clone_fieldlist(el) {
-        var new_element = el.clone(true);
-        var elem_id = new_element.find(':input')[0].id;
-        var elem_num = parseInt(elem_id.replace(/^.*-(\d{1,4})/, '$1')) + 1;
-        change_input_num(new_element, elem_num, true);
-        new_element.children('button').remove();
-        new_element.children('.help-inline.error-list').remove();
-        new_element.find('.bootstrap-select').remove();
-        append_remove_button(new_element);
-        new_element.find('.selectpicker').data('selectpicker', null).selectpicker();
-        el.after(new_element);
-    }
-}(window.jQuery);
+function clone_fieldlist(el) {
+    var new_element = el.clone(true);
+    var elem_id = new_element.find(':input')[0].id;
+    var elem_num = parseInt(elem_id.replace(/^.*-(\d{1,4})/, '$1')) + 1;
+    change_input_num(new_element, elem_num, true);
+    new_element.children('button').remove();
+    new_element.children('.help-inline.error-list').remove();
+    new_element.find('.bootstrap-select').remove();
+    append_remove_button(new_element);
+    new_element.find('.selectpicker').data('selectpicker', null).selectpicker();
+    el.after(new_element);
+}

templates/index.html

@@ -5,5 +5,6 @@
   <ul>
     <li><a href="/members">Liste des membres de la fédération</a> (<a href="/api/members.json">JSON</a>)</li>
     <li><a href="/projects">Liste des projets recencés</a> (<a href="/api/projects.json">JSON</a>)</li>
+  </ul>
   </p>
 {% endblock %}

templates/layout.html

@@ -11,16 +11,35 @@
     <link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/jquery.ui.all.css') }}">
     <link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/bootstrap-select.min.css') }}">
     <link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/style.css') }}">
-    <!-- javascript -->
-    <script type="text/javascript" src="{{ url_for('static', filename='js/jquery.js') }}"></script>
-    <script type="text/javascript" src="{{ url_for('static', filename='js/bootstrap-select.min.js') }}"></script>
-    <script type="text/javascript" src="{{ url_for('static', filename='js/site.js') }}"></script>
   </head>
 <body>
 
-<div class="container-fluid">
+<div class="navbar navbar-static-top">
+  <div class="navbar-inner">
+    <div class="container">
+      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </a>
+      <a class="brand" href="/"><span id="ffdn-header">FFDN</span> Database</a>
+      <div class="nav-collapse collapse">
+        <ul class="nav pull-right">
+          <li class="active">
+          <a href="/">Home</a>
+          </li>
+          <li><a href="#">Add Project</a></li>
+          <li><a href="#">Project List</a></li>
+          <li><a href="#">Schema</a></li>
+          <li><a href="#">API</a></li>
+        </ul>
+        </div>
+    </div>
+  </div>
+</div>
 
-<h1 class="page-header"><a href="/">Fédéral Database</a> <small>{% block subtitle %}{% endblock %}</small></h1>
+<div class="container">
+<h2 class="page-header">{% block subtitle %}{% endblock %}</h2>
 {% with messages = get_flashed_messages(with_categories="true") %}
   {% if messages %}
     {% for category, message in messages %}
@@ -37,8 +56,10 @@
 </div>
 
 </div> <!-- container -->   
-  <script src="{{ url_for('static', filename='js/jquery.js') }}"></script>
-  <script src="{{ url_for('static', filename='js/bootstrap.js') }}"></script>
+  <script type="text/javascript" src="{{ url_for('static', filename='js/jquery.js') }}"></script>
+  <script type="text/javascript" src="{{ url_for('static', filename='js/bootstrap.js') }}"></script>
+  <script type="text/javascript" src="{{ url_for('static', filename='js/bootstrap-select.min.js') }}"></script>
+  <script type="text/javascript" src="{{ url_for('static', filename='js/site.js') }}"></script>
   <script type="text/javascript">
     $(document).ready(function () {
       $("[rel=tooltip]").tooltip();