Template improvements.

- motion detail template: Fixes motion manage state template block.
- mediafile list template: Fixed missing activeline class.
- item detail template: Fixed is_active_slide conditions.
- assignment view template: Use bottongroup instead of single radio buttons.
- Projector template: Updated header and countdown style. Removed footer.
- Added config options to show logo and/or title/description.
- Projector template: New config options to set background color and font color for projector header.
- Make WLAN form labels not translateable.

openslides/agenda/templates/agenda/view.html

@@ -23,9 +23,9 @@
     <a href="{% url 'item_overview' %}" class="btn btn-mini"><i class="icon-chevron-left"></i> {% trans "Back to overview" %}</a>
     {% if perms.projector.can_manage_projector %}
         <a href="{{ item|absolute_url:'projector' }}"
-            class="activate_link btn btn-mini {% if item.is_active and active_type != 'list_of_speakers' %}btn-primary{% endif %}"
+            class="activate_link btn btn-mini {% if item.is_active_slide and active_type != 'list_of_speakers' %}btn-primary{% endif %}"
             rel="tooltip" data-original-title="{% trans 'Show item' %}">
-            <i class="icon icon-facetime-video {% if item.is_active and active_type != 'list_of_speakers' %}icon-white{% endif %}"></i>
+            <i class="icon icon-facetime-video {% if item.is_active_slide and active_type != 'list_of_speakers' %}icon-white{% endif %}"></i>
         </a>
     {% endif %}
     {% if perms.agenda.can_manage_agenda %}
@@ -69,9 +69,9 @@
 {% endif %}
 {% if perms.projector.can_manage_projector %}
     <a href="{{ item|absolute_url:'projector_list_of_speakers' }}"
-        class="activate_link btn btn-mini {% if item.is_active and active_type == 'list_of_speakers' %}btn-primary{% endif %}"
+        class="activate_link btn btn-mini {% if item.is_active_slide and active_type == 'list_of_speakers' %}btn-primary{% endif %}"
         rel="tooltip" data-original-title="{% trans 'Show list of speakers' %}">
-        <i class="icon icon-bell {% if item.is_active and active_type == 'list_of_speakers' %}icon-white{% endif %}"></i>
+        <i class="icon icon-bell {% if item.is_active_slide and active_type == 'list_of_speakers' %}icon-white{% endif %}"></i>
         {% trans 'Show list' %}
     </a>
 {% endif %}

openslides/assignment/templates/assignment/assignment_detail.html

@@ -283,18 +283,17 @@
     {% if perms.assignment.can_manage_assignment %}
     <div class="well">
         <h4>{% trans "Change status" %}:</h4>
-        <label class="radio">
+        <div class="btn-group btn-group-vertical" data-toggle="buttons-radio">
-            <input type="radio" name="status" onclick="window.location.href='{% url 'assignment_set_status' assignment.id 'sea' %}';"
+            <a href="{% url 'assignment_set_status' assignment.id 'sea' %}"
-                {% if 'sea' in assignment.status %}checked{% endif %}>{% trans 'Searching for candidates' %}
+                class="btn btn-small {% if 'sea' in assignment.status %}active{% endif %}">
-        </label>
+                {% trans 'Searching for candidates' %}</a>
-        <label class="radio">
+            <a href="{% url 'assignment_set_status' assignment.id 'vot' %}"
-            <input type="radio" name="status" onclick="window.location.href='{% url 'assignment_set_status' assignment.id 'vot' %}';"
+                class="btn btn-small {% if 'vot' in assignment.status %}active{% endif %}">
-                {% if 'vot' in assignment.status %}checked{% endif %}>{% trans 'Voting' %}<br>
+                {% trans 'Voting' %}</a>
-        </label>
+            <a href="{% url 'assignment_set_status' assignment.id 'fin' %}"
-        <label class="radio">
+                class="btn btn-small {% if 'fin' in assignment.status %}active{% endif %}">
-            <input type="radio" name="status" onclick="window.location.href='{% url 'assignment_set_status' assignment.id 'fin' %}';"
+                {% trans 'Finished' %}</a>
-                {% if 'fin' in assignment.status %}checked{% endif %}>{% trans 'Finished' %}
+        </div>
-        </label>
     </div> <!--/well-->
     {% endif %}
 </div> <!--/span-->

openslides/core/signals.py

@@ -59,6 +59,48 @@ def setup_general_config_page(sender, **kwargs):
             label=ugettext_lazy('Event organizer'),
             required=False))
 
+    projector_enable_logo = ConfigVariable(
+        name='projector_enable_logo',
+        default_value=True,
+        form_field=forms.BooleanField(
+            label=ugettext_lazy('Show logo on projector'),
+            help_text=ugettext_lazy('You can find and replace the logo under "openslides/static/img/projector/static/img/logo-projector.png".'),
+            required=False))
+
+    projector_enable_title = ConfigVariable(
+        name='projector_enable_title',
+        default_value=True,
+        form_field=forms.BooleanField(
+            label=ugettext_lazy('Show titel and description of event on projector'),
+            required=False))
+
+    projector_backgroundcolor1 = ConfigVariable(
+        name='projector_backgroundcolor1',
+        default_value='#444444',
+        form_field=forms.CharField(
+            widget=forms.TextInput(),
+            label=ugettext_lazy('Background color of projector header'),
+            help_text=ugettext_lazy('Use web color names like "red" or hex numbers like "#ff0000".'),
+            required=True))
+
+    projector_backgroundcolor2 = ConfigVariable(
+        name='projector_backgroundcolor2',
+        default_value='#222222',
+        form_field=forms.CharField(
+            widget=forms.TextInput(),
+            label=ugettext_lazy('Second (optional) background color for linear color gradient'),
+            help_text=ugettext_lazy('Use web color names like "red" or hex numbers like "#ff0000".'),
+            required=False))
+
+    projector_fontcolor = ConfigVariable(
+        name='projector_fontcolor',
+        default_value='#F5F5F5',
+        form_field=forms.CharField(
+            widget=forms.TextInput(),
+            label=ugettext_lazy('Font color of projector header'),
+            help_text=ugettext_lazy('Use web color names like "red" or hex numbers like "#ff0000".'),
+            required=True))
+
     welcome_title = ConfigVariable(
         name='welcome_title',
         default_value=_('Welcome to OpenSlides'),
@@ -119,15 +161,19 @@ def setup_general_config_page(sender, **kwargs):
             label=ugettext_lazy('WLAN encryption'),
             help_text=ugettext_lazy('Used for WLAN QRCode in PDF of access data.'),
             choices=(
-                ('', ugettext_lazy('---------')),
+                ('', '---------'),
-                ('WEP', ugettext_lazy('WEP')),
+                ('WEP', 'WEP'),
-                ('WPA', ugettext_lazy('WPA/WPA2')),
+                ('WPA', 'WPA/WPA2'),
                 ('nopass', ugettext_lazy('No encryption')))))
 
     group_event = ConfigGroup(
         title=ugettext_lazy('Event'),
         variables=(event_name, event_description, event_date, event_location, event_organizer))
 
+    group_projector = ConfigGroup(
+        title=ugettext_lazy('Projector'),
+        variables=(projector_enable_logo, projector_enable_title, projector_backgroundcolor1, projector_backgroundcolor2, projector_fontcolor))
+
     group_welcome_widget = ConfigGroup(
         title=ugettext_lazy('Welcome Widget'),
         variables=(welcome_title, welcome_text))
@@ -141,4 +187,4 @@ def setup_general_config_page(sender, **kwargs):
         url='general',
         required_permission='config.can_manage',
         weight=10,
-        groups=(group_event, group_welcome_widget, group_system))
+        groups=(group_event, group_projector, group_welcome_widget, group_system))

openslides/mediafile/templates/mediafile/mediafile_list.html

@@ -25,7 +25,7 @@
             {% endif %}
         </tr>
         {% for mediafile in mediafile_list %}
-        <tr>
+        <tr class="{% if mediafile.is_active_slide %}activeline{% endif %}">
             <td><a href="{{ mediafile.mediafile.url }}">{{ mediafile }}</a></td>
             <td>{{ mediafile.filetype }}</td>
             <td>{{ mediafile.get_filesize }}</td>

openslides/motion/templates/motion/motion_detail.html

@@ -292,13 +292,15 @@
     <!-- Manage motion box -->
     <div class="well">
     <h4>{% trans "Manage motion" %}</h4>
-        <div class="btn-group btn-group-vertical">
         {% for state in motion.state.next_states.all %}
+            {% if forloop.first %}
+                <div class="btn-group btn-group-vertical">
+            {% endif %}
             <a href="{% url 'motion_set_state' motion.pk state.pk %}" class="btn btn-small">{% trans state.get_action_word %}</a>
+            {% if forloop.last %}
+                </div>
+            {% endif %}
         {% endfor %}
-        </div>
-    <p></p>
-    <hr>
     <h5>{% trans "For administration only:" %}</h5>
     <a href="{% url 'motion_reset_state' motion.id %}" class="btn btn-mini btn-danger">
         <i class="icon-exclamation-sign icon-white"></i> {% trans 'Reset state' %}

openslides/projector/static/styles/projector.css

@@ -13,25 +13,37 @@ body{
 
 /*** HEADER ***/
 #header {
-    background-color: #333333;
-    background-image: -moz-linear-gradient(top, #444444, #222222);
-    background-image: -ms-linear-gradient(top, #444444, #222222);
-    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444444), to(#222222));
-    background-image: -webkit-linear-gradient(top, #444444, #222222);
-    background-image: -o-linear-gradient(top, #444444, #222222);
-    background-image: linear-gradient(top, #444444, #222222);
     box-shadow: 0 0 7px rgba(0,0,0,0.6);
     height: 70px;
     margin-bottom: 20px;
-    padding: 7px 20px 0;
-    position: relative;
 }
 #logo {
-    position: absolute;
+    position: relative;
-    top: 8px;
     left: 75px;
+    top: 4px;
+    height: 60px;
+    margin-right: 35px;
+    float: left;
+}
+#eventdata {
+    position: relative;
+    left: 75px;
+    top: 12px;
+    height: 50px;
+    overflow: hidden;
+}
+#eventdata .title {
+    font-size: 26px;
+    font-weight: bold;
+ }
+#eventdata .title.titleonly {
+    position: relative;
+    top: 12px;
+}
+#eventdata .description {
+    font-size: 18px;
+    opacity: 0.5;
 }
-
 #currentTime {
     border:0 solid #000000;
     font-size:24px;
@@ -43,42 +55,6 @@ body{
     background: url(../img/glyphicons_054_clock_big.png) no-repeat scroll 0px 0px;
 }
 
-/*** FOOTER ***/
-#footer {
-    color: #999999;
-    font-size: 16px;
-    clear: both;
-    margin-top: 50px;
-    position: fixed;
-    left: 0px;
-    right: 0;
-    bottom: 0px;
-    height: 30px;
-    padding-top: 10px;
-    background-color: #333333;
-    background-image: -moz-linear-gradient(top, #444444, #222222);
-    background-image: -ms-linear-gradient(top, #444444, #222222);
-    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444444), to(#222222));
-    background-image: -webkit-linear-gradient(top, #444444, #222222);
-    background-image: -o-linear-gradient(top, #444444, #222222);
-    background-image: linear-gradient(top, #444444, #222222);
-    box-shadow: 0 0 7px rgba(0,0,0,0.6);
-    border-top: 1px solid #999999;
-
-}
-.event_name_description {
-    left: 75px;
-    float: left;
-    position: absolute;
-    width: 50%;
-}
-.event_date_location {
-    text-align: right;
-    right: 40px;
-    position: absolute;
-    width: 40%;
-}
-
 /*** CONTENT ***/
 #content {
     position: absolute;

openslides/projector/templates/projector.html

@@ -23,12 +23,38 @@
             {% endfor %}
             });
         </script>
-
+        <style type="text/css">
+            #header {
+                {% if 'projector_backgroundcolor2'|get_config %}
+                    background-image: -moz-linear-gradient(top, {{ 'projector_backgroundcolor1'|get_config }}, {{ 'projector_backgroundcolor2'|get_config }});
+                    background-image: -ms-linear-gradient(top, {{ 'projector_backgroundcolor1'|get_config }}, {{ 'projector_backgroundcolor2'|get_config }});
+                    background-image: -webkit-gradient(linear, 0 0, 0 100%, from({{ 'projector_backgroundcolor1'|get_config }}), to({{ 'projector_backgroundcolor2'|get_config }}));
+                    background-image: -webkit-linear-gradient(top, {{ 'projector_backgroundcolor1'|get_config }}, {{ 'projector_backgroundcolor2'|get_config }});
+                    background-image: -o-linear-gradient(top, {{ 'projector_backgroundcolor1'|get_config }}, {{ 'projector_backgroundcolor2'|get_config }});
+                    background-image: linear-gradient(top, {{ 'projector_backgroundcolor1'|get_config }}, {{ 'projector_backgroundcolor2'|get_config }});
+                {% else %}
+                    background-color: {{ 'projector_backgroundcolor1'|get_config }};
+                {% endif %}
+            }
+            #eventdata {
+                color: {{ 'projector_fontcolor'|get_config }};
+            }
+        </style>
     </head>
     <body>
         <div id="header">
-            <a title="Startseite" id="logo" href="/"><img alt="Logo" src="/static/img/logo.png"></a>
+            {% if 'projector_enable_logo'|get_config %}
-            <div class="pull-right"></div>
+                <img id="logo" alt="Logo" src="/static/img/logo.png">
+            {% endif %}
+            {% if 'projector_enable_title'|get_config %}
+                <div id="eventdata">
+                    <div class="title {% if not 'event_description'|get_config %}titleonly{% endif %}">{{ 'event_name'|get_config }}</div>
+                    {% if 'event_description'|get_config %}
+                        <div class="description">{{ 'event_description'|get_config }}</div>
+                    {% endif %}
+                </div>
+            {% endif %}
+
         </div>
 
         <div id="overlays">
@@ -38,16 +64,5 @@
         <div id="content" {% if reload %}class="reload"{% endif %}>
             {{ content }}
         </div>
-
-        <div id="footer">
-            <div class="event_name_description">
-                {{ 'event_name'|get_config }} | {{ 'event_description'|get_config }}
-            </div>
-            <div class="event_date_location">
-                {% if 'event_date'|get_config %}
-                    {{ 'event_date'|get_config }}{% if 'event_location'|get_config %}, {{ 'event_location'|get_config }}{% endif %}
-                {% endif %}
-            </div>
-        </div>
     </body>
 </html>

openslides/projector/templates/projector/overlay_countdown_projector.html

@@ -2,13 +2,14 @@
 #overlay_countdown_inner {
     position: fixed;
     right: 40px;
-    height: 37px;
+    height: 30px;
+    width: 215px;
+    margin: 0;
     top: 0;
-    padding: 20px 50px;
     font-size: 4em;
     font-weight: bold;
-    border-bottom-left-radius: 0.5em;
+    text-align: center;
-    border-bottom-right-radius: 0.5em;
+    border-radius: 0 0 0.2em 0.2em;
 }
 </style>