Merge pull request #748 from emanuelschuetze/widget-issues
Fixed #745 and #744: Make widgets fixable and collapsable.
This commit is contained in:
commit
2f10996933
BIN
openslides/projector/static/img/glyphicons_335_pushpin.png
Normal file
BIN
openslides/projector/static/img/glyphicons_335_pushpin.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 979 B |
@ -104,6 +104,16 @@ $(function() {
|
||||
$('#overlay_message_text').val(data['overlay_message']);
|
||||
}
|
||||
});
|
||||
$('.fixbutton button').click(function (event) {
|
||||
event.preventDefault();
|
||||
if($(this).hasClass('active')) {
|
||||
$(this).closest('.widget').removeClass('affix');
|
||||
$(this).closest('.widget').removeAttr('data-spy');
|
||||
} else {
|
||||
$(this).closest('.widget').addClass('affix');
|
||||
$(this).closest('.widget').attr('data-spy', 'affix');
|
||||
}
|
||||
});
|
||||
|
||||
/* comment out this function because '$.browser' has been removed from jquery 1.9, see:
|
||||
http://blog.jquery.com/2013/01/15/jquery-1-9-final-jquery-2-0-beta-migrate-final-released/
|
||||
|
@ -14,8 +14,15 @@
|
||||
.widget {
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
.widget.affix {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
right: 20px;
|
||||
top: 42px;
|
||||
max-width: 40%;
|
||||
}
|
||||
.widget-header {
|
||||
height: 30px;
|
||||
min-height: 30px;
|
||||
background: #E9E9E9;
|
||||
background:-moz-linear-gradient(top, #FAFAFA 0%, #E9E9E9 100%); /* FF3.6+ */
|
||||
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#FAFAFA), color-stop(100%,#E9E9E9)); /* Chrome,Safari4+ */
|
||||
@ -27,27 +34,31 @@
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9')";
|
||||
border: 1px solid #D5D5D5;
|
||||
border-radius: 5px 5px 0 0;
|
||||
-moz-border-radius: 5px 5px 0 0;
|
||||
-webkit-border-radius: 5px 5px 0 0;
|
||||
|
||||
}
|
||||
.widget-header h3 {
|
||||
padding-left: 7px;
|
||||
margin: 7px 0;
|
||||
display: inline-block;
|
||||
margin: 7px 0 7px 14px;
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
.widget-header [class^="icon-"], .widget-header [class*=" icon-"] {
|
||||
display: inline-block;
|
||||
margin: -2px 0 0 13px;
|
||||
margin: -2px 5px 0 0px;
|
||||
color: #555;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.widget-header .collapsebutton, .widget-header .fixbutton{
|
||||
margin: -2px 4px 0 0px;
|
||||
}
|
||||
.widget-header .fixbutton{
|
||||
margin-left: 6px;
|
||||
}
|
||||
.widget-header .icon-pushpin {
|
||||
background-image: url("../img/glyphicons_335_pushpin.png");
|
||||
background-position: 0 center;
|
||||
margin-left:4px !important;
|
||||
}
|
||||
.widget-content {
|
||||
padding: 20px 15px 15px 13px;
|
||||
padding: 0px 15px 0px 13px;
|
||||
background: #FFF;
|
||||
border: 1px solid #D5D5D5;
|
||||
border-radius: 0 0 5px 5px;
|
||||
@ -97,11 +108,12 @@
|
||||
height: 768px;
|
||||
}
|
||||
#iframewrapper {
|
||||
width: 256px;/*100%;*/
|
||||
height: 192px;/*230px;*/
|
||||
width: 256px;
|
||||
height: 192px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border: 1px solid #D5D5D5;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#iframeoverlay {
|
||||
width: 256px;
|
||||
|
@ -27,11 +27,24 @@
|
||||
{% if widget.default_column == 1 %}
|
||||
<div class="widget" id="widget_{{ widget.get_name }}">
|
||||
<div class="widget-header">
|
||||
<i class="{% if widget %}icon-{{widget.name}}{% else %}icon-star{% endif %}"></i>
|
||||
<h3>{% trans widget.get_title %}</h3>
|
||||
<h3>
|
||||
<i class="{% if widget %}icon-{{widget.name}}{% else %}icon-star{% endif %}"></i>
|
||||
<div class="collapsebutton btn-group right" data-toggle="buttons-checkbox">
|
||||
<button type="button" class="btn btn-mini"
|
||||
data-toggle="collapse" data-target="#widgetcontent_{{ widget.get_name }}"
|
||||
title="{% trans 'Collapse widget content' %}">
|
||||
_</button>
|
||||
</div>
|
||||
<div class="fixbutton btn-group right" data-toggle="buttons-checkbox">
|
||||
<button type="button" class="btn btn-mini" style="width: 20px;"
|
||||
title="{% trans 'Fix widget position' %}">
|
||||
<i class="icon-pushpin"></i></button>
|
||||
</div>
|
||||
{% trans widget.get_title %}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="widget-content">
|
||||
{{ widget.html }}
|
||||
<div class="widget-content collapse in" id="widgetcontent_{{ widget.get_name }}">
|
||||
<br>{{ widget.html }}<br>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -42,11 +55,25 @@
|
||||
{% for name, widget in widgets.items %}
|
||||
{% if widget.default_column == 2 %}
|
||||
<div class="widget" id="widget_{{ widget.get_name }}">
|
||||
<div class="widget-header"><i class="{% if widget %}icon-{{widget.name}}{% else %}icon-star{% endif %}"></i>
|
||||
<h3>{% trans widget.get_title %}<h3>
|
||||
<div class="widget-header">
|
||||
<h3>
|
||||
<i class="{% if widget %}icon-{{widget.name}}{% else %}icon-star{% endif %}"></i>
|
||||
<div class="collapsebutton btn-group right" data-toggle="buttons-checkbox">
|
||||
<button type="button" class="btn btn-mini"
|
||||
data-toggle="collapse" data-target="#widgetcontent_{{ widget.get_name }}"
|
||||
title="{% trans 'Collapse widget content' %}">
|
||||
_</button>
|
||||
</div>
|
||||
<div class="fixbutton btn-group right" data-toggle="buttons-checkbox">
|
||||
<button type="button" class="btn btn-mini" style="width: 20px;"
|
||||
title="{% trans 'Fix widget position' %}">
|
||||
<i class="icon-pushpin"></i></button>
|
||||
</div>
|
||||
{% trans widget.get_title %}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="widget-content">
|
||||
{{ widget.html }}
|
||||
<div class="widget-content collapse in" id="widgetcontent_{{ widget.get_name }}">
|
||||
<br>{{ widget.html }}<br>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
@ -1,32 +1,5 @@
|
||||
{% load i18n %}
|
||||
|
||||
<!-- projector control buttons -->
|
||||
{% if perms.projector.can_manage_projector %}
|
||||
<div style="float: right;">
|
||||
<p>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_bigger' %}" title="{% trans 'Zoom in' %}">
|
||||
<i class="icon-zoom-in"></i>
|
||||
</a><br>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_smaller' %}" title="{% trans 'Zoom out' %}">
|
||||
<i class="icon-zoom-out"></i>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_up' %}" title="{% trans 'Scroll visible view up' %}">
|
||||
<i class="icon-arrow-up"></i>
|
||||
</a><br>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_down' %}" title="{% trans 'Scroll visible view down' %}">
|
||||
<i class="icon-arrow-down"></i>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_clean' %}" title="{% trans 'Reset projector view' %}">
|
||||
<i class="icon-resize-small"></i>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- projector live view -->
|
||||
<a href="{% url 'projector_show' %}" target="_blank">
|
||||
<div id="iframewrapper">
|
||||
@ -34,3 +7,26 @@
|
||||
<div id="iframeoverlay"></div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- projector control buttons -->
|
||||
{% if perms.projector.can_manage_projector %}
|
||||
<p>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_bigger' %}" title="{% trans 'Zoom in' %}">
|
||||
<i class="icon-zoom-in"></i>
|
||||
</a>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_smaller' %}" title="{% trans 'Zoom out' %}">
|
||||
<i class="icon-zoom-out"></i>
|
||||
</a>
|
||||
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_up' %}" title="{% trans 'Scroll visible view up' %}">
|
||||
<i class="icon-arrow-up"></i>
|
||||
</a>
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_down' %}" title="{% trans 'Scroll visible view down' %}">
|
||||
<i class="icon-arrow-down"></i>
|
||||
</a>
|
||||
|
||||
<a class="projector_edit btn btn-mini" href="{% url 'projector_clean' %}" title="{% trans 'Reset projector view' %}">
|
||||
<i class="icon-resize-small"></i>
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
|
@ -60,7 +60,7 @@ class PersonalInfoWidget(TestCase):
|
||||
|
||||
def test_widget_appearance(self):
|
||||
response = self.client.get('/projector/dashboard/')
|
||||
self.assertContains(response, '<h3>My items, motions and elections</h3>', status_code=200)
|
||||
self.assertContains(response, 'My items, motions and elections', status_code=200)
|
||||
|
||||
def test_item_list(self):
|
||||
agenda = self.import_agenda()
|
||||
|
Loading…
Reference in New Issue
Block a user