Reworked new template, especially agenda and dashboard.

openslides/agenda/static/javascript/agenda.js

@@ -37,19 +37,23 @@ function hideClosedSlides(hide) {
 $(function() {
     $('.close_link a').click(function(event) {
         event.preventDefault();
-        slide = $(this);
+        var link = $(this);
         $.ajax({
             type: 'GET',
-            url: slide.attr('href'),
+            url: $(this).attr('href'),
             dataType: 'json',
             success: function(data) {
                 if (data.closed) {
                     newclass = 'closed';
+                    link.parent().parent().parent().addClass('itemdoneline');
                 } else {
                     newclass = 'open';
+                    link.parent().parent().parent().removeClass('itemdoneline');
                 }
-                slide.parent().removeClass('closed open').addClass(newclass);
+                link.parent().removeClass('closed open').addClass(newclass);
-                slide.attr('href', data.link);
+
+
+                link.attr('href', data.link);
             }
         });
     });

openslides/agenda/static/styles/agenda.css

@@ -18,3 +18,8 @@
 .close_link.closed span {
     background-image: url(../images/icons/close.png);
 }
+
+tr.topline td {
+    border-bottom: 1px solid #333333;
+    background-color: #CDCDCD;
+}

openslides/agenda/templates/agenda/edit.html

@@ -42,10 +42,8 @@
             <button class="btn" type="submit" name="apply">
                 {% trans 'Apply' %}
             </button>
-            <a href='{% url 'item_overview' %}'>
+            <a href="{% url 'item_overview' %}" class="btn">
-            <button class="btn" type="button" onclick="window.location='{% url 'item_overview' %}'">
+                {% trans 'Cancel' %}
-                {% trans 'Cancel' %}</span>
-            </button>
             </a>
         </div>
         <small>* {% trans "required" %}</small>

openslides/agenda/templates/agenda/item_row.html

@@ -3,13 +3,14 @@
 {% load tags %}
 
     <td>
-        <span class="close_link{% if item.closed %} closed{% endif %}">
+        <span class="close_link {% if item.closed %}closed{% else %}open{% endif %}">
         {% if perms.agenda.can_manage_agenda %}
-               <a href="{% if item.closed %}{% url 'item_open' item.id %}{% else %}{% url 'item_close' item.id %}{% endif %}" title="{% trans 'Mark item as done' %}">
+            <a href="{% if item.closed %}{% url 'item_open' item.id %}{% else %}{% url 'item_close' item.id %}{% endif %}" 
-                    <span></span>
+                class="btn btn-mini" title="{% trans 'Reopen item' %}">
+                <i class="icon- custom-icons"></i>
             </a>
-            {% elif item.closed %}
+        {% else %}
-                <img src="{% static 'images/icons/close.png' %}" title="{% trans 'Item closed' %}">
+            <i class="icon- custom-icons"></i>
         {% endif %}
         </span>
     </td>
@@ -24,7 +25,7 @@
         {{ item.get_title_supplement|safe }}
     </td>
     {% if perms.agenda.can_manage_agenda %}
-    <td>
+    <td class="optional">
         {{ item.comment|first_line }}
     </td>
     {% endif %}
@@ -32,16 +33,20 @@
     <td>
         <span style="width: 1px; white-space: nowrap;">
         {% if perms.projector.can_manage_projector %}
-            <a class="activate_link {% if item.active %}active{% endif %}" href="{% url 'projector_activate_slide' item.sid %}" title="{% trans 'Activate item' %}">
+            <a href="{% url 'projector_activate_slide' item.sid  %}" class="activate_link btn {% if item.active %}btn-primary{% endif %} btn-mini" title="{% trans 'Activate item' %}">
-                <span></span>
+                <i class="icon icon-facetime-video {% if item.active %}icon-white{% endif %}"></i>
             </a>
         {% endif %}
         {% if perms.agenda.can_manage_agenda %}
-            <a href="{% model_url item 'edit' %}"><img src="{% static 'images/icons/edit.png' %}" title="{% trans 'Edit item' %}"></a>
+            <a href="{% model_url item 'edit' %}" title="{% trans 'Edit' %}" class="btn btn-mini">
-            <a href="{% model_url item 'delete' %}"><img src="{% static 'images/icons/delete.png' %}" title="{% trans 'Delete item' %}"></a>
+                <i class="icon-pencil"></i>
+            </a>
+            <a href="{% model_url item 'delete' %}" title="{% trans 'Delete' %}" class="btn btn-mini">
+                <i class="icon-remove"></i>
+            </a>
             {% if not item.is_leaf_node %}
-                <a class="activate_link" href="{% url 'projector_activate_slide' item.sid 'summary' %}">
+                <a href="{% url 'projector_activate_slide' item.sid 'summary' %}" class="activate_link btn btn-mini" title="{% trans 'Activate summary for this item' %}">
-                    <img src="{% static 'images/icons/summary.png' %}" title="{% trans 'Activate summary for this item' %}">
+                    <img src="{% static 'images/icons/summary.png' %}">
                 </a>
             {% endif %}
         {% endif %}

openslides/agenda/templates/agenda/overview.html

@@ -74,7 +74,7 @@
                 <th width="10px"></th>
                 <th>{% trans "Item" %}</th>
                 {% if perms.agenda.can_manage_agenda %}
-                    <th width="200">{% trans "Comment" %}</th>
+                    <th width="200" class="optional">{% trans "Comment" %}</th>
                 {% endif %}
                 {% if perms.agenda.can_manage_agenda or perms.projector.can_manage_projector %}
                     <th width="50">{% trans "Actions" %}</th>
@@ -86,26 +86,26 @@
             <tr class="topline{% if active_sid == 'agenda' %} activeline{% endif %}">
                 <td></td>
                 <td>
-                    <strong>{% trans "Agenda" %}</strong>
+                    {% trans "Agenda" %}
                 </td>
                 {% if perms.agenda.can_manage_agenda %}
-                <td></td>
+                <td class="optional"></td>
                 {% endif %}
                 {% if perms.agenda.can_manage_agenda or perms.projector.can_manage_projector %}
                 <td>
                 {% if perms.projector.can_manage_projector %}
                     <span>
-                        <a class="activate_link{% if active_sid == 'agenda' %} active{% endif %}" href="{% url 'projector_activate_slide' 'agenda' %}" title="{% trans 'Activate item' %}">
+                    <a href="{% url 'projector_activate_slide' 'agenda' %}" class="activate_link btn {% if active_sid == 'agenda' %}btn-primary{% endif %} btn-mini" title="{% trans 'Activate agenda' %}">
-                            <span></span>
+                        <i class="icon icon-facetime-video {% if active_sid == 'agenda' %}icon-white{% endif %}"></i>
                     </a>
-                    </span>
+                    <span>
                 {% endif %}
                 </td>
                 {% endif %}
             </tr>
         {% if items %}
             {% for item in items %}
-            <tr class="itemline draggable{% cycle ' odd' '' %}{% if item.active %} activeline{% endif %}">
+            <tr class="draggable{% if item.active %} activeline{% endif %}{% if item.closed %} itemdoneline{% endif %}">
                 {% include "agenda/item_row.html" %}
             </tr>
             {% endfor %}

openslides/agenda/templates/agenda/view.html

@@ -5,7 +5,31 @@
 {% block title %}{{ block.super }} – {{ item.title }}{% endblock %}
 
 {% block content %}
-    <h1>{{ item }}</h1>
+<h1>
+    {{ item }}
+    <small class="pull-right">
+    <div class="btn-toolbar">
+        <a href="{% url 'item_overview' %}" class="btn btn-mini"><i class="icon-chevron-left"></i> {% trans "Back to overview" %}</a>
+        <div class="btn-group">
+            <a data-toggle="dropdown" href="#" class="btn btn-mini dropdown-toggle">
+                {% trans 'More actions' %}
+                <span class="caret"></span>
+            </a>
+            {% if perms.agenda.can_manage_agenda %}
+            <ul class="dropdown-menu pull-right">
+                <li><a href="{% url 'item_edit' item.id %}"><i class="icon-edit"></i> {% trans 'Edit item' %}</a></li>
+                <li><a href="{% url 'item_delete' item.id %}"><i class="icon-remove"></i> {% trans 'Delete item' %}</a></li>
+            </ul>
+            {% endif %}
+        </div>
+            {% if perms.projector.can_manage_projector %}
+                <a href="{% url 'projector_activate_slide' item.sid  %}" class="activate_link btn btn-mini {% if item.active %}btn-primary{% endif %}"  rel="tooltip" data-original-title="{% trans 'Show item' %}">
+                    <i class="icon icon-facetime-video {% if item.active %}icon-white{% endif %}"></i>
+                </a>
+            {% endif %}
+    </div>
+    </small>
+</h1>
     <p>{{ item.text|safe|linebreaks }}</p>
 
     {% if perms.agenda.can_manage_agenda %}

openslides/agenda/templates/agenda/widget.html

@@ -4,9 +4,9 @@
 
 <ul style="line-height: 180%">
     <li class="{% if agenda.active %}activeline{% endif %}">
-        <a href="{% url 'projector_activate_slide' agenda.key %}" class="activate_link {% if agenda.active %}active{% endif %}">
+        <a href="{% url 'projector_activate_slide' agenda.key  %}" class="activate_link btn {% if agenda.active %}btn-primary{% endif %} btn-mini" title="{% trans 'Show agenda' %}">
-            <div></div>
+            <i class="icon icon-facetime-video {% if item.active %}icon-white{% endif %}"></i>
-        </a>
+        </a>&nbsp;
         <a href="{% url 'projctor_preview_slide' agenda.key %}" title="{% trans 'Preview' %}" class="icon preview right">
             <span></span>
         </a>
@@ -17,9 +17,9 @@
 <ul style="line-height: 180%">
 {% for item in items %}
     <li class="{% if item.active %}activeline{% endif %}">
-        <a href="{% url 'projector_activate_slide' item.sid %}" class="activate_link {% if item.active %}active{% endif %}">
+        <a href="{% url 'projector_activate_slide' item.sid  %}" class="activate_link btn {% if item.active %}btn-primary{% endif %} btn-mini" title="{% trans 'Show item' %}">
-            <div></div>
+            <i class="icon icon-facetime-video {% if item.active %}icon-white{% endif %}"></i>
-        </a>
+        </a>&nbsp;
         <a href="{% model_url item 'delete' %}" title="{% trans 'Delete' %}" class="icon delete right">
             <span></span>
         </a>

openslides/motion/templates/motion/overview.html

@@ -52,10 +52,10 @@
             <th><a href="?sort=number{% if 'number' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "#" %}</a></th>
             <th><a href="?sort=title{% if 'title' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "Motion title" %}</a></th>
             {% if min_supporters > 0 %}
-            <th><a href="?sort=supporter{% if 'supporter' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "Number of supporters" %}</a></th>
+            <th class="optional"><a href="?sort=supporter{% if 'supporter' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "Number of supporters" %}</a></th>
             {% endif %}
             <th><a href="?sort=status{% if 'status' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "Status" %}</a></th>
-            <th><a href="?sort=submitter{% if 'submitter' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "Submitter" %}</a></th>
+            <th class="optional"><a href="?sort=submitter{% if 'submitter' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "Submitter" %}</a></th>
             <th class="optional"><a href="?sort=time{% if 'time' in request.GET.sort and 'reverse' not in request.GET %}&reverse{%endif%}">{% trans "Creation Time" %}<a></th>
             <th style="width: 1px;">{% trans "Actions" %}</th>
         </tr>
@@ -66,7 +66,7 @@
             <td>{% if motion.number %}{{ motion.number }}{% else %}-{% endif %}</td>
             <td><a href="{% url 'motion_view' motion.id %}">{{ motion.public_version.title }}</a></td>
         {% if min_supporters > 0 %}
-            <td>{{ motion.count_supporters }}</td>
+            <td class="optional">{{ motion.count_supporters }}</td>
         {% endif %}
             <td>{% if motion.status != "pub" %}
                 {{ motion.get_status_display }}<br>
@@ -76,7 +76,7 @@
                 {% if not forloop.last %}<br>{%endif%}
                 {% endfor %}
             </td>
-            <td>{{ motion.submitter }}</td>
+            <td class="optional">{{ motion.submitter }}</td>
             <td class="optional">{{ motion.creation_time }}</td>
             <td>
                 <span style="width: 1px; white-space: nowrap;">

openslides/participant/templates/participant/login.html

@@ -51,6 +51,8 @@
         <input type="hidden" name="next" value="{{ next }}" />
         </p>
     </form>
+{% endblock %}
+{% block javascript %}
     {% if os_enable_anonymous_login %}
         <script>
             $("#anonymous_login").live('click', function () {

openslides/participant/views.py

@@ -507,7 +507,7 @@ def user_settings(request):
         form_user = UsersettingsForm(instance=request.user, initial={'language': language})
 
     return {
-        'form': form,
+        'form': form_user,
         'edituser': request.user,
     }
 

openslides/static/javascript/utils.js

@@ -23,14 +23,16 @@ $(function () {
         var link = $(this);
         $.ajax({
             type: 'GET',
-            url: $(this).attr('href'),
+            url: link.attr('href'),
             dataType: 'json',
             data: '',
             success: function(data) {
-                $('.activate_link').removeClass('active');
+                $('.activate_link').removeClass('btn-primary');
+                $('.icon').removeClass('icon-white');
                 $('tr').removeClass('activeline');
                 link.parent().parent().parent().addClass('activeline');
-                link.addClass('active');
+                link.addClass('btn-primary');
+                link.find('.icon').addClass('icon-white');
             }
         });
     });

openslides/static/styles/base.css

@@ -79,6 +79,12 @@ a:hover {
 
 
 /** Utils **/
+tr.activeline td, li.activeline {
+    background-color: #bed4de !important;
+}
+tr.itemdoneline td, li.itemdoneline {
+    background-color: #EAEAEA !important;
+}
 .nopadding {
     padding: 0;
 }
@@ -222,6 +228,16 @@ form .required label:after {
     background-position: -360px -144px;
 }
 
+/** More glyphicons free icons **/
+.custom-icons {
+    background-position: 0;
+}
+.icon-check_new, .close_link.closed i {
+    background-image: url("../img/glyphicons_152_check.png");
+}
+.icon-uncheck_new, .close_link.open i {
+    background-image: url("../img/glyphicons_153_unchecked.png");
+}
 
 /** Responsive **/
 @media (max-width: 767px) {

openslides/utils/utils.py

@@ -38,8 +38,8 @@ def gen_confirm_form(request, message, url):
         %s
         <form action="%s" method="post">
             <input type="hidden" value="%s" name="csrfmiddlewaretoken">
-            <button type="submit" class="btn">%s</button>
+            <button type="submit" class="btn btn-mini">%s</button>
-            <button class="btn">%s</button>
+            <button class="btn btn-mini">%s</button>
         </form>
         """
         % (message, url, csrf(request)['csrf_token'], _("Yes"), _("No")))

openslides/utils/views.py

@@ -121,7 +121,7 @@ class QuestionMixin(object):
 
     def confirm_form(self):
         option_fields = "\n".join([
-            '<button type="submit" class="btn" name="%s">%s</button>' % (option[0], unicode(option[1]))
+            '<button type="submit" class="btn btn-mini" name="%s">%s</button>' % (option[0], unicode(option[1]))
             for option in self.get_answer_options()])
         messages.warning(
             self.request,