More AJAX for projector control template. Moved projector stuff from agenda overview to new control page.

openslides/agenda/models.py

@@ -139,4 +139,4 @@ register_slidemodel(Item, category=_('Agenda'), model_name=_('Agenda Item'))
 from projector.api import register_slidefunc
 from agenda.slides import agenda_show
 
-register_slidefunc('agenda_show', agenda_show, category=_('Agenda'))
+register_slidefunc(_('Agenda'), agenda_show, category=_('Agenda'))

openslides/agenda/templates/agenda/item_row.html

@@ -1,45 +1,30 @@
 {% load i18n %}
 
-<tr id="item_row_{{ item.id }}" class="draggable{% cycle ' odd' '' %}
+<tr class="draggable{% cycle ' odd' '' %}
-    {% if item.active %} activeline{% else %}
+    {% if item.active %}activeline{% endif %}">
-    {% if perms.agenda.can_manage_agenda %} inactiveline{% endif %}
+    <td>
-    {% endif %}">
+        {% if item.closed %}
-    {% if perms.agenda.can_manage_agenda %}
+            <img src="/static/images/icons/task-complete.png" title="{% trans 'Item closed' %}">
-        <td class="select">
+        {% endif %}
-            <a id="activate_link_{{ item.id }}" class="activate_link" href="{% url item_activate item.id %}">
+    </td>
-                <div></div>
-            </a>
-        </td>
-    {% else %}
-        <td>
-            {% if item.closed %}
-                <img src="/static/images/icons/task-complete.png" title="{% trans 'Item closed' %}">
-            {% endif %}
-        </td>
-    {% endif %}
     <td>
         {% for p in item.get_ancestors %}
             <div class="indentation">&nbsp;</div>
         {% endfor %}
-
         {% if perms.agenda.can_manage_agenda %}
             <div class="dragcell"></div>
         {% endif %}
-
         {{ item }}
-
     </td>
     <td>
-        <span style="width: 1px;white-space: nowrap;">
+        <span style="width: 1px; white-space: nowrap;">
             <a href="{{ item.get_absolute_url }}"><img src="/static/images/icons/document-preview.png" title="{% trans 'Show projector preview' %}"></a>
-
             {% if perms.agenda.can_manage_agenda %}
                 <a href="{% url item_edit item.id %}"><img src="/static/images/icons/document-edit.png" title="{% trans 'Edit item' %}"></a>
                 <a href="{% url item_delete item.id %}"><img src="/static/images/icons/edit-delete.png" title="{% trans 'Delete item' %}"></a>
                 <a class="close_link {% if item.closed %}closed{% else %}open{% endif %}" href="{% if item.closed %}{% url item_open item.id %}{% else %}{% url item_close item.id %}{% endif %}">
                     <span></span>
                 </a>
-
                 {% if item.children.exists %}
                     <a href="{% url item_activate_summary item.id %}"><img src="/static/images/icons/view-list-tree.png" title="{% trans 'Select item overview' %}"></a>
                 {% endif %}

openslides/agenda/templates/agenda/overview.html

@@ -52,32 +52,20 @@
 
             <table id="menu-overview" class="agendatable">
                 <tr>
-                    {% if perms.agenda.can_manage_agenda %}
+                    <th style="width: 1px;">{% trans "Done" %}</th>
-                        <th style="width: 1px;">{% trans "Projector" %}</th>
-                    {% else %}
-                        <th style="width: 1px;">{% trans "Done" %}</th>
-                    {% endif %}
                     <th>{% trans "Item" %}</th>
                     <th style="width: 1px;">{% if perms.agenda.can_manage_agenda %}{% trans "Actions" %}{% endif %}</th>
                     {% if perms.agenda.can_manage_agenda %}
                         <th class="tabledrag-hide">{% trans "Weight" %}</th>
                     {% endif %}
                 </tr>
-                <tr id="item_row_0" class="topline{% if overview %} activeline{% else %}{% if perms.agenda.can_manage_agenda %} inactiveline {% endif %}{% endif %}">
+                <tr class="topline {% if overview %}activeline{% endif %}">
-                    {% if perms.agenda.can_manage_agenda %}
+                    <td>{{overview}}</td>
-                        <td class="select">
-                            <a href="{% url item_activate 0 %}" class="activate_link">
-                                <div></div>
-                            </a>
-                        </td>
-                    {% else %}
-                        <td></td>
-                    {% endif %}
                     <td>
                         <b>{% trans "Agenda" %} ({{ items|length }} {% trans "items" %}<span id="hiddencount"></span>)</b>
                     </td>
                     <td>
-                        <span id="action_field" style="width: 1px;white-space: nowrap;">
+                        <span id="action_field" style="width: 1px; white-space: nowrap;">
                             <span></span>
                         </span>
                         <a href="{% url print_agenda %}" title="{%trans 'Print agenda' %}" class="pdficon">

openslides/projector/templates/projector/control.html

@@ -5,42 +5,25 @@
 
 {% block header %}
     <link type="text/css" href="/static/styles/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" />
-    <link type="text/css" rel="stylesheet" media="all" href="/static/styles/agenda.css" />
+    <link type="text/css" rel="stylesheet" media="all" href="/static/styles/projector-control.css" />
     <script type="text/javascript" src="/static/javascript/jquery-ui-1.8.18.custom.min.js"></script>
     <script type="text/javascript" src="/static/javascript/projector-control.js"></script>
     <script type="text/javascript" src="/static/javascript/jquery.cookie.js"></script>
     <script type="text/javascript">
-        $(function(){
-            $("#accordion").accordion({ header: "h2" });
-        });
-    </script>
-    <style>
-    .column { width: 50%; float: left; padding-bottom: 0px; }
-    .portlet { margin: 0 1em 1em 0; }
-    .portlet-header { margin: 0.3em; padding-bottom: 4px; padding-left: 0.2em; }
-    .portlet-header .ui-icon { float: right; }
-    .portlet-content { padding: 0.4em; overflow: hidden; }
-    .ui-sortable-placeholder { border: 1px dotted black; visibility: visible !important; height: 50px !important; }
-    .ui-sortable-placeholder * { visibility: hidden; }
-    </style>
-    <script>
     $(function() {
         $( ".column" ).sortable({
             connectWith: ".column"
         });
-
         $( ".portlet" ).addClass( "ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" )
             .find( ".portlet-header" )
                 .addClass( "ui-widget-header ui-corner-all" )
                 .prepend( "<span class='ui-icon ui-icon-minusthick'></span>")
                 .end()
             .find( ".portlet-content" );
-
         $( ".portlet-header .ui-icon" ).click(function() {
             $( this ).toggleClass( "ui-icon-minusthick" ).toggleClass( "ui-icon-plusthick" );
             $( this ).parents( ".portlet:first" ).find( ".portlet-content" ).toggle();
         });
-
         $( ".column" ).disableSelection();
     });
     </script>
@@ -85,9 +68,9 @@
         </a>
     </div>
 
-
-    {% for category, slides in categories.items %}
     <div class="column">
+    {% for category, slides in categories.items %}
+
         <div class="portlet">
             <div class="portlet-header">{{ category }}</div>
             <div class="portlet-content">
@@ -96,24 +79,20 @@
                     <ul style="line-height: 180%">
                     {% for item in slide.get_items %}
                         <li><a href="{% url projector_activate_slide item.sid %}" 
-                        {% if item.active %}
+                        class="activate_link {% if item.active %}active{% endif %}"
-                            class="inactivate_link"
+                        ><div></div></a><a href="{% url projector_edit_slide item.id %}">{{ item }}</a></li>
-                        {% else %}
-                            class="activate_link"
-                        {% endif %}
-                        ><div></div></a>{{ item }}</li>
                     {% endfor %}
                     </ul>
                 {% else %}
                     <a href="{% url projector_activate_slide slide.key %}"
-                            class="activate_link"
+                            class="activate_link {% if slide.active %}active{% endif %}"
                     ><div></div></a>{{ slide.key }}
                 {% endif %}
             {% endfor %}
             </div>
         </div>
-    </div>
     {% endfor %}
+    </div>
 
     <div class="column">
         <div class="portlet">

openslides/projector/urls.py

@@ -15,6 +15,7 @@ from django.conf.urls.defaults import *
 from utils.views import CreateView
 
 from views import ControlView, ActivateView
+from agenda.views import ItemUpdate
 from models import ProjectorSlide
 
 
@@ -32,6 +33,11 @@ urlpatterns = patterns('projector.views',
         name='projector_activate_slide',
     ),
 
+    url(r'^edit/(?P<pk>\d+)/$',
+        ItemUpdate.as_view(),
+        name='projector_edit_slide',
+    ),
+
     url(r'^new/$',
         CreateView.as_view(
             success_url='projector_control',

openslides/static/javascript/agenda.js

@@ -28,22 +28,6 @@ function hideClosedSlides(hide) {
 }
 
 $(function() {
-    $('.activate_link').click(function(event) {
-        event.preventDefault();
-        $.ajax({
-            type: 'GET',
-            url: $(this).attr('href'),
-            dataType: 'json',
-            data: '',
-            success: function(data) {
-                $('.activeline').removeClass('activeline').addClass('inactiveline');
-                $('#item_row_' + data.active).removeClass('inactiveline').addClass('activeline');
-            },
-            error: function () {
-                alert("Ajax Error");
-            }
-        });
-    });
     $('.close_link').click(function(event) {
         event.preventDefault();
         slide = $(this);
@@ -77,48 +61,4 @@ $(function() {
     } else if ($.cookie('Slide.HideClosed') == 1) {
         hideClosedSlides(true);
     }
-
-    // control the projector
-    $('.projector_edit').click(function(event) {
-        event.preventDefault();
-        link = $(this);
-        $.ajax({
-            type: 'GET',
-            url: link.attr('href'),
-            dataType: 'json',
-            success: function(data) {
-            }
-        });
-    });
-
-    // control countdown
-    $('.projector_countdown').click(function(event) {
-        event.preventDefault();
-        link = $(this);
-        $.ajax({
-            type: 'GET',
-            url: link.attr('href'),
-            dataType: 'json',
-            success: function(data) {
-            }
-        });
-    });
-    $('.countdown_visible_link').click(function(event) {
-        event.preventDefault();
-        link = $(this);
-        $.ajax({
-            type: 'GET',
-            url: link.attr('href'),
-            dataType: 'json',
-            success: function(data) {
-                if (data.countdown_visible == "True") {
-                    newclass = 'open';
-                } else {
-                    newclass = 'closed';
-                }
-                link.removeClass('closed open').addClass(newclass);
-                link.attr('href', data.link);
-            }
-        });
-    });
 });

openslides/static/javascript/projector-control.js

@@ -1,82 +1,22 @@
-function hideLine(object) {
-    if (object == []) {
-        return;
-    }
-    object.hide();
-    id = object.children('td.tabledrag-hide').children('input.menu-mlid').attr('value');
-    $('.menu-plid[value=\'' + id + '\']').parent().parent().each(function() {
-        hideLine($(this));
-    });
-}
-
-function hideClosedSlides(hide) {
-    if (hide) {
-        $('#hidelink').attr('title','show');
-        $('#hidelink').removeClass('hide').addClass('show');
-        $('.close_link.closed').parent().parent().each(function() {
-            hideLine($(this));
-        });
-        hidden = $('#menu-overview tr:hidden').size();
-        $('#hiddencount').text(', davon ' + hidden + ' verborgen.');
-    } else {
-        $('#menu-overview tr').show();
-        $('#hidelink').attr('title','hide');
-        $('#hidelink').removeClass('show').addClass('hide');
-        $('#hiddencount').text('');
-    }
-    return false;
-}
-
 $(function() {
+    // activate an element to show it on projector
     $('.activate_link').click(function(event) {
         event.preventDefault();
+        link = $(this);
         $.ajax({
             type: 'GET',
             url: $(this).attr('href'),
             dataType: 'json',
             data: '',
             success: function(data) {
-                $('.activeline').removeClass('activeline').addClass('inactiveline');
+                $('.activate_link').removeClass('active');
-                $('#item_row_' + data.active).removeClass('inactiveline').addClass('activeline');
+                link.addClass('active');
             },
             error: function () {
                 alert("Ajax Error");
             }
         });
     });
-    $('.close_link').click(function(event) {
-        event.preventDefault();
-        slide = $(this);
-        $.ajax({
-            type: 'GET',
-            url: slide.attr('href'),
-            dataType: 'json',
-            success: function(data) {
-                if (data.closed) {
-                    newclass = 'closed';
-                } else {
-                    newclass = 'open';
-                }
-                slide.removeClass('closed open').addClass(newclass);
-                slide.attr('href', data.link);
-            }
-        });
-    });
-    // hide closed items
-    $('#action_field span').after($('<a id="hidelink" class="hidelink hide" title="hide" href="#"><span></span></a>').click(function () {
-        if ($.cookie('Slide.HideClosed') == 1) {
-            $.cookie('Slide.HideClosed', 0);
-            hideClosedSlides(false);
-        } else {
-            $.cookie('Slide.HideClosed', 1);
-            hideClosedSlides(true);
-        }
-    }));
-    if ($.cookie('Slide.HideClosed') === null) {
-        $.cookie('Slide.HideClosed', 0);
-    } else if ($.cookie('Slide.HideClosed') == 1) {
-        hideClosedSlides(true);
-    }
 
     // control the projector
     $('.projector_edit').click(function(event) {

openslides/static/styles/agenda.css

@@ -1,34 +1,3 @@
-a.activate_link div {
-    background-image: url(/static/images/icons/task-accepted-grey.png);
-    background-repeat: no-repeat;
-    float: left;
-    width: 16px;
-    height: 16px;
-    padding-right: 10px;
-}
-a.inactivate_link div {
-    background-image: url(/static/images/icons/task-accepted.png);
-    background-repeat: no-repeat;
-    float: left;
-    width: 16px;
-    height: 16px;
-    padding-right: 10px;
-}
-tr.activeline a.activate_link div {
-    background-image: url(/static/images/icons/task-accepted.png);
-    background-repeat: no-repeat;
-    background-position: center;
-    width: 16px;
-    height: 16px;
-}
-tr.inactiveline a.activate_link div {
-    background-image: url(/static/images/icons/task-accepted-grey.png);
-    background-repeat: no-repeat;
-    background-position: center;
-    width: 16px;
-    height: 16px;
-}
-
 a.close_link.closed span {
     background-image: url(/static/images/icons/user-offline.png);
     background-repeat: no-repeat;
@@ -63,33 +32,3 @@ a.hidelink.show span {
     display: inline-block;
 }
 
-a.countdown_visible_link.closed div {
-    background-image: url(/static/images/icons/user-offline.png);
-    background-repeat: no-repeat;
-    background-position: center;
-    width: 16px;
-    height: 16px;
-    display: inline-block;
-}
-a.countdown_visible_link.open div {
-    background-image: url(/static/images/icons/user-online.png);
-    background-repeat: no-repeat;
-    background-position: center;
-    width: 16px;
-    height: 16px;
-    display: inline-block;
-}
-
-
-#iframe {
-    -moz-transform: scale(0.25, 0.25) translate(-150%, -150%);
-    -webkit-transform: scale(0.25, 0.25) translate(-150%, -150%);
-    -o-transform: scale(0.25, 0.25) translate(-150%, -150%);
-    transform: scale(0.25, 0.25) translate(-150%, -150%);
-    width: 400%;
-    height: 400%;
-}
-#iframewrapper {
-    width: 256px;/*100%;*/
-    height: 192px;/*230px;*/
-}

openslides/static/styles/projector-control.css

@@ -0,0 +1,76 @@
+/**
+ * OpenSlides projector control template style
+ */
+
+/* Portlet */
+.column {
+    width: 50%;
+    float: left;
+    padding-bottom: 0px;
+}
+.portlet {
+    margin: 0 1em 1em 0;
+}
+.portlet-header {
+    margin: 0.3em;
+    padding-bottom: 4px;
+    padding-left: 0.2em;
+}
+.portlet-header .ui-icon {
+    float: right;
+}
+.portlet-content {
+    padding: 0.4em;
+    overflow: hidden;
+}
+.ui-sortable-placeholder {
+    border: 1px dotted black;
+    visibility: visible !important;
+    height: 50px !important;
+}
+.ui-sortable-placeholder * {
+    visibility: hidden;
+}
+
+/* iframe */
+#iframe {
+    -moz-transform: scale(0.25, 0.25) translate(-150%, -150%);
+    -webkit-transform: scale(0.25, 0.25) translate(-150%, -150%);
+    -o-transform: scale(0.25, 0.25) translate(-150%, -150%);
+    transform: scale(0.25, 0.25) translate(-150%, -150%);
+    width: 400%;
+    height: 400%;
+}
+#iframewrapper {
+    width: 256px;/*100%;*/
+    height: 192px;/*230px;*/
+}
+/* countdown */
+a.countdown_visible_link.closed div {
+    background-image: url(/static/images/icons/user-offline.png);
+    background-repeat: no-repeat;
+    background-position: center;
+    width: 16px;
+    height: 16px;
+    display: inline-block;
+}
+a.countdown_visible_link.open div {
+    background-image: url(/static/images/icons/user-online.png);
+    background-repeat: no-repeat;
+    background-position: center;
+    width: 16px;
+    height: 16px;
+    display: inline-block;
+}
+/* activate link */
+a.activate_link div {
+    background-image: url(/static/images/icons/task-accepted-grey.png);
+    background-repeat: no-repeat;
+    float: left;
+    width: 16px;
+    height: 16px;
+    padding-right: 10px;
+}
+a.activate_link.active div {
+    background-image: url(/static/images/icons/task-accepted.png);
+}

openslides/static/styles/projector.css

@@ -166,4 +166,3 @@ tr.total td {
     border-top: 1px solid #333333;
     background-color: #e3e3e3;
 }
-