Projet

Général

Profil

0001-widgets-add-dedicated-mobile-mode-to-meetings-select.patch

Frédéric Péters, 07 avril 2020 17:04

Télécharger (2,75 ko)

Voir les différences:

Subject: [PATCH] widgets: add dedicated mobile mode to meetings selection
 (#22959)

 static/includes/_misc.scss                    | 17 ++++++++++++++
 .../forms/widgets/select--meetings.html       | 22 ++++++++++++++++---
 2 files changed, 36 insertions(+), 3 deletions(-)
static/includes/_misc.scss
594 594
	div.head {
595 595
		padding-bottom: 0.7em;
596 596
	}
597
	button {
598
		margin: 0;
599
	}
597 600

  
598 601
	div span {
599 602
		display: block;
......
615 618
			color: $button-color;
616 619
		}
617 620
	}
621

  
622
	&.mobile {
623
		> div {
624
			width: 100%;
625
		}
626
		div span {
627
			display: inline-block;
628
			padding: 0.5em;
629
			margin: 0.5em;
630
		}
631
		button {
632
			height: 3em;
633
		}
634
	}
618 635
}
619 636

  
620 637
div.location-icon {
templates/qommon/forms/widgets/select--meetings.html
24 24
                  "{% trans "Saturday" %}"];
25 25
  var $select = $('#form_{{widget.name}}');
26 26
  var $table = $('#form_{{widget.name}}_table');
27
  var column_count = 5;
27 28

  
28 29
  function fill_with_items(items) {
29 30
    $select.empty();
......
81 82
    return false;
82 83
  });
83 84
  go_next.on('click', function() {
84
    current_offset = Math.min(current_offset+1, Math.max(0, nb_days-5));
85
    current_offset = Math.min(current_offset+1, Math.max(0, nb_days-column_count));
85 86
    display(current_offset);
86 87
    return false;
87 88
  });
88 89

  
89 90
  function display(offset) {
90 91
    $('#form_{{widget.name}}_table > div').each(function(idx, elem) {
91
      if (idx >= offset && idx < offset+5) {
92
      if (idx >= offset && idx < offset+column_count) {
92 93
        $(elem).show();
93 94
      } else {
94 95
        $(elem).hide();
......
106 107
    }
107 108
    current_offset = offset;
108 109
  }
109
  display(current_offset);
110

  
111
  function set_layout() {
112
    if ($select.parents('form').width() > 600) {
113
      // desktop layout
114
      column_count = 5;
115
      $table.removeClass('mobile');
116
    } else {
117
      // mobile layout
118
      column_count = 1;
119
      $table.addClass('mobile');
120
    }
121
    display(current_offset);
122
  }
123
  set_layout();
124
  $(window).on('resize', set_layout);
125

  
110 126
  $('#form_{{widget.name}}_table span.selectable').on('click', function() {
111 127
   $('#form_{{widget.name}}_table span').removeClass('on');
112 128
   $(this).addClass('on');
113
-