Added tags, jquery UI

author: Filipp Lepalaan <f@230.to> 2014-02-19 18:02:09 +0200
committer: Filipp Lepalaan <f@230.to> 2014-02-19 18:02:09 +0200
commit: 75ad7e4bd7d69243e7e5281c2642f00478fb072d (patch)
tree: eaaaf360902d369f42d94778aac8803db7973ce0 /apps/it/templates
parent: cfc7c3f52544af8a71d3fa3988a06fee200d2c24 (diff)
download: pudding-75ad7e4bd7d69243e7e5281c2642f00478fb072d.tar.gz
pudding-75ad7e4bd7d69243e7e5281c2642f00478fb072d.tar.bz2
pudding-75ad7e4bd7d69243e7e5281c2642f00478fb072d.zip
4 files changed, 111 insertions, 54 deletions
diff --git a/apps/it/templates/default.html b/apps/it/templates/default.html
index 49b818b..08bde0f 100755
--- a/apps/it/templates/default.html
+++ b/apps/it/templates/default.html
@@ -1,3 +1,5 @@
+{% load i18n %}
+{% load it_tags %}
 {% load bootstrap3 %}
 <!DOCTYPE html>
 <html>
@@ -8,6 +10,7 @@
   <title>IT</title>
 
   <!-- Core CSS - Include with every page -->
+  <link href="{{ STATIC_URL }}js/ui/themes/base/jquery-ui.css" rel="stylesheet">
   <link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet">
   <link href="{{ STATIC_URL }}font-awesome/css/font-awesome.css" rel="stylesheet">
 
@@ -17,16 +20,37 @@
   <!-- SB Admin CSS - Include with every page -->
   <link href="{{ STATIC_URL }}css/sb-admin.css" rel="stylesheet">
   <style type="text/css">
+    .page-header {
+      margin-top: 0;
+    }
+    .media-object {
+      width: 64px;
+    }
+    .media .btn-group {
+      position: absolute;
+      right: 25px;
+    }
+    .hidden {
+      visibility: hidden;
+      height: 1px;
+    }
+    .dragarea {
+      padding: 8px;
+      margin-top: 10px;
+      border: 1px dashed #ccc;
+    }
+    .label .close {
+      float: none;
+      font-size: 14pt;
+      line-height: 20px;
+    }
     .dropzone {
-      height: 100px;
+      height: 80px;
       width: 100%;
       padding: 10px;
-      border: 1px #ccc dashed;
-      border-radius: 13px;
-      background: url({{ STATIC_URL }}images/arrow-down-512.png) no-repeat;
+      background-image: url({{ STATIC_URL }}images/arrow-down-512.png) no-repeat;
       background-size: 80px 80px;
       background-position: center;
-      background-color: #eee;
     }
     #page-wrapper {
       margin-right: 300px;
@@ -43,6 +67,9 @@
       margin: 0;
       padding: 0;
     }
+    .nav-tabs {
+      margin-top: 15px;
+    }
   </style>
 </head>
 
@@ -229,10 +256,10 @@
             <!-- /input-group -->
           </li>
           <li class="active">
-            <a href="{% url 'home' %}?state=NEW"><i class="fa fa-dashboard fa-fw"></i> Issues <span class="badge pull-right">{{ issue_count }}</span></a>
+            <a href="{% url 'home' %}?state=NEW"><i class="fa fa-dashboard fa-fw"></i> {% trans "Issues" %} <span class="badge pull-right">{% new_issue_count request %}</span></a>
           </li>
-          <li><a href="{% url 'list_stuff' %}?kind=SERVER"><i class="fa fa-hdd-o fa-fw"></i> Assets</a></li>
-          <li><a href="{% url 'home' %}"><i class="fa fa-book fa-fw"></i> Documentation</a></li>
+          <li><a href="{% url 'list_stuff' %}?kind=SERVER"><i class="fa fa-hdd-o fa-fw"></i> {% trans "Assets" %} <span class="badge pull-right">{% new_asset_count request %}</span></a></li>
+          <li><a href="{% url 'home' %}"><i class="fa fa-book fa-fw"></i> {% trans "Documentation" %}</a></li>
           <li><a href="{% url 'home' %}"><i class="fa fa-users fa-fw"></i> Users</a></li>
         </ul>
         <!-- /#side-menu -->
@@ -243,9 +270,9 @@
 
     <div id="page-wrapper">
       <div class="row">
-        <div class="col-lg-12">
+        <div class="col-lg-12" style="padding:0">
+          {% bootstrap_messages %}
           {% block main %}
-          <h1 class="page-header">Blank</h1>
           {% endblock main %}
         </div>
         <!-- /.col-lg-12 -->
@@ -253,7 +280,6 @@
       <!-- /.row -->
       <nav class="navbar-default navbar-static-side sidebar-right" role="navigation">
         <div class="sidebar-collapse">
-        {% bootstrap_messages %}
         {% block inspector %}
           INSPECTOR CONTENT
         {% endblock inspector %}
@@ -272,6 +298,7 @@
   <script src="{{ STATIC_URL }}js/dropzone.js"></script>
   <script src="{{ STATIC_URL }}js/bootstrap.min.js"></script>
   <script src="{{ STATIC_URL }}js/plugins/metisMenu/jquery.metisMenu.js"></script>
+  <script src="{{ STATIC_URL }}js/ui/ui/minified/jquery-ui.min.js"></script>
 
   <!-- Page-Level Plugin Scripts - Blank -->
 
@@ -280,6 +307,13 @@
 
   <!-- Page-Level Demo Scripts - Blank - Use for reference -->
   <script type="text/javascript">
+    $('.media').hover(
+    function(){
+      $(this).find('.btn-group').fadeIn();
+    },
+    function(){
+      $('.btn-group').fadeOut();
+    });
     Dropzone.options.myAwesomeDropzone = {
       paramName: "attachment", // The name that will be used to transfer the file
       maxFilesize: 2, // MB
@@ -295,6 +329,15 @@
         document.location = '/search/?q=' + $(this).val();
       }
     });
+    $('.autocomplete').each(function(i, e){
+      $(e).autocomplete({source: $(e).data('source')});
+    });
+    $('.draggable').draggable({opacity: 0.75, zIndex: 100, cursor: 'pointer'});
+    $('.dragarea').droppable({
+      out: function(e, ui) {
+        $.ajax($(ui.draggable).data('destroy'));
+        $(ui.draggable).remove();
+    }});
   </script>
   </body>
 
diff --git a/apps/it/templates/edit_issue.html b/apps/it/templates/edit_issue.html
index aaedee2..27bdab0 100644
--- a/apps/it/templates/edit_issue.html
+++ b/apps/it/templates/edit_issue.html
@@ -6,6 +6,6 @@
 <form action="" method="post" class="form">
   {% csrf_token %}
   {% bootstrap_form form %}
-  <button type="submit" class="btn btn-primary">{% trans "Save" %}</button>
+  <button type="submit" class="btn btn-primary pull-right">{% trans "Save" %}</button>
 </form>
 {% endblock main %}
diff --git a/apps/it/templates/list_issues.html b/apps/it/templates/list_issues.html
index 56d05b0..23b9701 100644
--- a/apps/it/templates/list_issues.html
+++ b/apps/it/templates/list_issues.html
@@ -1,5 +1,6 @@
 {% extends "default.html" %}
 {% load bootstrap3 %}
+{% load it_tags %}
 {% load i18n %}
 
 {% block main %}
@@ -8,19 +9,17 @@
   <li{%if k == state %} class="active"{% endif %}><a href="?state={{ k }}">{{ v }}</a></li>
 {% endfor %}
 </ul>
-<table class="table">
-  {% for i in issues %}
-  <tr>
-    <td><a href="{% url 'view_issue' i.pk %}">{{ i.description }}</a></td>
-  </tr>
-  {% endfor %}
-</table>
+
+{% for i in issues %}
+  <h3><a href="{% url 'view_issue' i.pk %}">{{ i.title }}</a></h3>
+  <p>{{ i.description|markdown|truncatewords:20 }}</p>
+{% endfor %}
 {% endblock main %}
 
 {% block inspector %}
 <form action="" method="post" class="form">
   {% csrf_token %}
   {% bootstrap_form form %}
-  <button type="submit" class="btn btn-primary">{% trans "Add Issue" %}</button>
+  <button type="submit" class="btn btn-primary pull-right">{% trans "Add Issue" %}</button>
 </form>
 {% endblock inspector %}
diff --git a/apps/it/templates/view_issue.html b/apps/it/templates/view_issue.html
index cf33b22..b528aa8 100644
--- a/apps/it/templates/view_issue.html
+++ b/apps/it/templates/view_issue.html
@@ -1,66 +1,81 @@
 {% extends "default.html" %}
 {% load bootstrap3 %}
 {% load humanize %}
-{% load i18n %}
 {% load it_tags %}
+{% load i18n %}
 
 {% block main %}
+<div class="page-header">
+  <h3>{{ issue.title }}</h3>
+  <span>{{ issue.created_by}} @ {{ issue.created_at }}</span>
+</div>
+
 {{ issue.description|markdown }}
-<span>{{ issue.created_by}} @ {{ issue.created_at }}</span>
-<hr/>
-<a class="btn btn-default" href="{% url 'edit_issue' issue.pk %}">{% bootstrap_icon "pencil" %} Edit</a>
-<a class="btn btn-default metoo" href="{% url 'metoo' issue.pk 1 %}">{% bootstrap_icon "star" %} Me too!</a>
+
+<form method="post" action="{% url 'tags' %}">
+  {% csrf_token %}
+  <input type="text" name="tag" class="tags autocomplete form-control input-sm" placeholder="{% trans "Add tag" %}" data-source="/tags/?oid={{ issue.pk|safe }}&amp;ctype={{ issue.get_content_type.pk|safe }}" autocomplete="off"/>
+  <input type="hidden" name="object_id" value="{{ issue.pk|safe }}"/>
+  <input type="hidden" name="content_type_id" value="{{ issue.get_content_type.pk|safe }}"/>
+  <input type="submit" class="hidden"/>
+</form>
+<div class="dragarea">
+{% for t in issue.tags.all %}
+  <span class="label label-info draggable" data-id="{{ t.pk|safe }}" data-destroy="{% url 'delete_tag' t.pk %}"><i class="fa fa-tag"></i> {{ t.tag }}</span>
+{% endfor %}
+</div>
 {% for i in issue.task_set.all %}
-<div class="panel panel-default">
-  <div class="panel-heading">
-    <i class="fa fa-user fa-fw"></i> <span class="muted">{{ i.created_by }}</span> <i class="fa fa-clock-o fa-fw"></i> {{ i.created_at|naturaltime }}
-  </div>
-  <div class="panel-body">
-    {{ i.description|markdown }}
-    <hr/>
-    <div class="btn-group">
-      <button type="button" class="btn btn-primary btn-sm dropdown-toggle" data-toggle="dropdown">
+<div class="media">
+  <a class="pull-left" href="#">
+    <img class="media-object img-thumbnail" src="{{ STATIC_URL }}images/bubble-128.png" alt="...">
+  </a>
+  <div class="media-body">
+    <h4 class="media-heading pull-left">
+      <span>{{ i.created_by }}</span> <i class="fa fa-clock-o fa-fw"></i> {{ i.created_at|naturaltime }}
+    </h4>
+    <div class="btn-group pull-right" style="display:none">
+      <button type="button" class="btn btn-xs btn-default dropdown-toggle" data-toggle="dropdown">
         <i class="fa fa-cog"></i> 
         <span class="caret"></span>
       </button>
       <ul class="dropdown-menu" role="menu">
-        <li><a href="{% url 'edit_task' issue.pk i.pk %}">Edit</a>
-        </li>
-        <li><a href="{% url 'delete_task' i.pk %}" class="confirm">Delete</a>
-        </li>
-        <li><a href="#">Something else here</a>
-        </li>
-        <li class="divider"></li>
-        <li><a href="#">Separated link</a>
-        </li>
+        <li><a href="{% url 'edit_task' issue.pk i.pk %}">{% trans "Edit" %}</a></li>
+        <li><a href="{% url 'delete_issue' issue.pk %}" class="confirm">{% trans "Delete" %}</a></li>
       </ul>
     </div>
+    <div class="clearfix"></div>
+    {{ i.description|markdown }}
   </div>
 </div>
 {% endfor %}
-</div>
 {% endblock main %}
 
 {% block inspector %}
-<h4>Users</h4>
+{% if 1 %}
+  <a class="btn btn-sm btn-default btn-primary active" href="{% url 'metoo' issue.pk 1 %}">{% bootstrap_icon "star" %} {% trans "Me too!" %}</a>
+{% else %}
+  <a class="btn btn-sm btn-default btn-primary" href="{% url 'metoo' issue.pk 1 %}">{% bootstrap_icon "star" %} {% trans "Me too!" %}</a>
+{% endif %}
+
+<a class="btn btn-sm btn-default btn-warning" href="{% url 'edit_issue' issue.pk %}">{% bootstrap_icon "pencil" %} {% trans "Edit" %}</a>
+<a class="btn btn-sm btn-default btn-danger confirm" href="{% url 'delete_issue' issue.pk %}">{% bootstrap_icon "trash" %} {% trans "Delete" %}</a>
+  <hr/>
+  <h4>{% trans "Users" %}</h4>
 {% for f in issue.users.all %}
-  <a href=""><span class="label label-info label"><i class="fa fa-user fa-fw"></i> {{ f }}</span></a>
-  <a class="btn btn-default btn-sm" href="{% url 'remove_user' issue.pk f.pk %}">{% bootstrap_icon "trash" %}</a>
+  <span class="label label-info label"><i class="fa fa-user fa-fw"></i> {{ f }} <a class="close" href="{% url 'remove_user' issue.pk f.pk %}">&times;</a></span>
 {% endfor %}
-<hr/>
-<h4>Files</h4>
+  <hr/>
+  <h4>{% trans "Files" %}</h4>
 {% for f in issue.files.all %}
-  <a href=""><span class="label label-info"><i class="fa fa-file"></i> {{ f }}</span></a>
-  <a class="btn btn-default btn-sm" href="{% url 'delete_file' f.pk %}">{% bootstrap_icon "trash" %}</a>
+  <span class="label label-success"><i class="fa fa-file"></i> {{ f }} <a class="close" href="{% url 'delete_file' f.pk %}">&times;</a></span>
 {% endfor %}
 <hr/>
-<form action="{% url 'add_files' issue.pk %}" class="dropzone" id="my-awesome-dropzone">
+<form action="{% url 'add_files' issue.pk %}" class="dropzone well" id="my-awesome-dropzone">
   {% csrf_token %}
 </form>
-<hr/>
 <form action="{% url 'add_task' issue.pk %}" method="post">
   {% csrf_token %}
   {% bootstrap_form form %}
-  <button class="btn btn-primary" type="submit">Add Task</button>
+  <button class="btn btn-primary pull-right" type="submit">Add Task</button>
 </form>
 {% endblock inspector %}
author	Filipp Lepalaan <f@230.to>	2014-02-19 18:02:09 +0200
committer	Filipp Lepalaan <f@230.to>	2014-02-19 18:02:09 +0200
commit	75ad7e4bd7d69243e7e5281c2642f00478fb072d (patch)
tree	eaaaf360902d369f42d94778aac8803db7973ce0 /apps/it/templates
parent	cfc7c3f52544af8a71d3fa3988a06fee200d2c24 (diff)
download	pudding-75ad7e4bd7d69243e7e5281c2642f00478fb072d.tar.gz pudding-75ad7e4bd7d69243e7e5281c2642f00478fb072d.tar.bz2 pudding-75ad7e4bd7d69243e7e5281c2642f00478fb072d.zip