Project

General

Profile

0002-misc-extend-cell-size-options-use-a-dedicated-widget.patch

Frédéric Péters, 15 March 2022 09:43 AM

Download (5.83 KB)

View differences:

Subject: [PATCH 2/2] misc: extend cell size options, use a dedicated widget
 (#62072)

 combo/data/models.py                          | 17 +++++--
 combo/data/widgets.py                         | 21 ++++++++
 combo/manager/static/css/combo.manager.scss   | 49 +++++++++++++++++++
 .../templates/combo/widgets/flexsize.html     | 10 ++++
 tests/test_manager.py                         |  2 +-
 5 files changed, 95 insertions(+), 4 deletions(-)
 create mode 100644 combo/data/widgets.py
 create mode 100644 combo/manager/templates/combo/widgets/flexsize.html
combo/data/models.py
60 60

  
61 61
from .fields import RichTextField, TemplatableURLField
62 62
from .library import get_cell_class, get_cell_classes, register_cell_class
63
from .widgets import FlexSize
63 64

  
64 65

  
65 66
class PostException(Exception):
......
1124 1125
                        label=_('Size'),
1125 1126
                        choices=[
1126 1127
                            ('', ''),
1127
                            ('size--1-1', '1/1'),
1128
                            ('size--t1-2', '1/2'),
1129
                            ('size--t1-3', '1/3'),
1128
                            ('size--1-1', '1'),
1129
                            ('size--t1-2', '½'),
1130
                            ('size--t1-3', '⅓'),
1131
                            ('size--t1-4', '¼'),
1132
                            ('size--t1-5', '⅕'),
1133
                            ('size--t1-6', '⅙'),
1134
                            ('size--t2-3', '⅔'),
1135
                            ('size--t2-5', '⅖'),
1136
                            ('size--t3-4', '¾'),
1137
                            ('size--t3-5', '⅗'),
1138
                            ('size--t4-5', '⅘'),
1139
                            ('size--t5-6', '⅚'),
1130 1140
                        ],
1131 1141
                        required=False,
1142
                        widget=FlexSize,
1132 1143
                    )
1133 1144
                    self.fields.move_to_end('extra_css_class')
1134 1145
                    extra_css_class = self.initial['extra_css_class'].split()
combo/data/widgets.py
1
# combo - content management system
2
# Copyright (C) 2014-2022  Entr'ouvert
3
#
4
# This program is free software: you can redistribute it and/or modify it
5
# under the terms of the GNU Affero General Public License as published
6
# by the Free Software Foundation, either version 3 of the License, or
7
# (at your option) any later version.
8
#
9
# This program is distributed in the hope that it will be useful,
10
# but WITHOUT ANY WARRANTY; without even the implied warranty of
11
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
12
# GNU Affero General Public License for more details.
13
#
14
# You should have received a copy of the GNU Affero General Public License
15
# along with this program.  If not, see <http://www.gnu.org/licenses/>.
16

  
17
from django.forms.widgets import Select
18

  
19

  
20
class FlexSize(Select):
21
    template_name = 'combo/widgets/flexsize.html'
combo/manager/static/css/combo.manager.scss
689 689
.search-engine-add {
690 690
	margin: 2em 0;
691 691
}
692

  
693
.flex-size-select {
694
	position: relative;
695
	margin: 0;
696
	padding: 0;
697
	list-style: none;
698
	&::before {
699
		display: block;
700
		position: absolute;
701
		content: "";
702
		width: calc(100% - 0.5em);
703
		height: 2px;
704
		top: -0.6em;
705
		background: #386ede;
706
	}
707
	li {
708
		display: inline-block;
709
		margin: 0;
710
		padding: 0;
711
		text-align: center;
712
		input {
713
			display: block;
714
			margin: 0;
715
		}
716
		label::before {
717
			display: block;
718
			position: absolute;
719
			content: "";
720
			background: #386ede;
721
			height: 0.9em;
722
			width: 2px;
723
			top: -1em;
724
			right: 0.4em;
725
		}
726
	}
727
	.size--1-1 {
728
		right: 0;
729
	}
730
	@for $i from 1 through 6 {
731
		@for $j from 1 through $i {
732
			.size--t#{$j}-#{$i} {
733
				right: calc(100% - #{100%*$j/$i});
734
			}
735
		}
736
	}
737
	[class*="size--"] {
738
		position: absolute;
739
	}
740
}
combo/manager/templates/combo/widgets/flexsize.html
1
{% load i18n %}
2
{% with id=widget.attrs.id %}
3
<ul{% if id %} id="{{ id }}"{% endif %} class="flex-size-select {{ widget.attrs.class|default:"" }}">{% for group, options, index in widget.optgroups %}
4
  {% for option in options %}
5
  <li class="{{ option.value|default:"size-auto" }}"><label class="{{ option.value }}"
6
          ><input type="radio" name="{{ widget.name }}" value="{{ option.value }}"
7
                {% if option.selected %}checked{% endif %}>{{ option.label|default:_("Auto") }}</label></li>
8
  {% endfor %}
9
{% endfor %}
10
</ul>{% endwith %}
tests/test_manager.py
2843 2843

  
2844 2844
    resp = app.get('/manage/pages/%s/' % page.id)
2845 2845
    resp = resp.click('Options', href=r'cell.*options')
2846
    resp.form['cdata_textcell-%s-fx_size' % cell.id].select(text='1/2')
2846
    resp.form['cdata_textcell-%s-fx_size' % cell.id].select('size--t1-2')
2847 2847
    resp = resp.form.submit().follow()
2848 2848
    cell.refresh_from_db()
2849 2849
    assert cell.extra_css_class == 'size--t1-2'
2850
-