Commit 6ce95321b10656aad7ee76db5f2c05a91027617d

Authored by Adabriand Furtado
1 parent 1cf18a2c
Exists in master

Fixes on submit sign form

view/css/main.css
... ... @@ -62,7 +62,11 @@ body {
62 62 }
63 63  
64 64 .navbar-default .navbar-nav>li>a {
65   - color: #FFFFFF;
  65 + color: #ffffff;
  66 +}
  67 +
  68 +.navbar-default .navbar-nav .open .dropdown-menu>li>a {
  69 + color: #ffffff;
66 70 }
67 71  
68 72 .col-centered {
... ...
view/css/submit-sign.css
... ... @@ -28,3 +28,11 @@
28 28 #upload-success-msg {
29 29 display: none;
30 30 }
  31 +
  32 +.radio-inline .wl-national-sign-radio {
  33 + margin-top: 12px;
  34 +}
  35 +
  36 +#input-state-container, #input-city-container {
  37 + display: none;
  38 +}
... ...
view/js/submit-sign.js
... ... @@ -2,8 +2,7 @@
2 2  
3 3 var submitUrl = '';
4 4 var loggedUser = '';
5   - var MIN_PHRASES_LENGTH = 3;
6   - var MAX_PHRASES_LENGTH = 20;
  5 + var MAX_CHAR_LENGTH = 255;
7 6  
8 7 function _isEmpty(str) {
9 8 return (!str || 0 === str.length);
... ... @@ -28,21 +27,17 @@
28 27 }
29 28 }
30 29  
31   - function _areValidPhrases(phrases) {
32   - var cleanPhrases = phrases.replace(/[.,\/#!$%\^&\*;:{}=\-_`~()]/g, "");
33   - var splitPhrasesLength = cleanPhrases.trim().split(/\s+/g).length;
34   - return splitPhrasesLength >= MIN_PHRASES_LENGTH
35   - && splitPhrasesLength <= MAX_PHRASES_LENGTH;
  30 + function _arePhrasesValid(phrases) {
  31 + return phrases.length <= MAX_CHAR_LENGTH;
36 32 }
37 33  
38 34 function _alertPhrase() {
39 35 $('#upload-warning-msg').hide();
40 36 var phrases = $('#input-phrases').val();
41   - if (!_areValidPhrases(phrases)) {
  37 + if (!_arePhrasesValid(phrases)) {
42 38 $('#upload-warning-msg').html(
43   - 'As frases de exemplo devem possuir no minímo '
44   - + MIN_PHRASES_LENGTH + ' e no máximo '
45   - + MAX_PHRASES_LENGTH + ' palavras.');
  39 + 'As frases de exemplo devem possuir no máximo '
  40 + + MAX_CHAR_LENGTH + ' caracteres.');
46 41 $('#upload-warning-msg').show();
47 42 }
48 43 }
... ... @@ -56,16 +51,6 @@
56 51 }
57 52 }
58 53  
59   - function _alertCity() {
60   - $('#upload-warning-msg').hide();
61   - var city = $('#input-city').val();
62   - if (_isEmpty(city)) {
63   - $('#upload-warning-msg').html(
64   - 'Por favor indique o nome da sua cidade.');
65   - $('#upload-warning-msg').show();
66   - }
67   - }
68   -
69 54 function _alertSignUpload() {
70 55 $('#upload-warning-msg').hide();
71 56 var signUpload = $('#input-sign-upload').val();
... ... @@ -76,16 +61,24 @@
76 61 }
77 62 }
78 63  
  64 + function _getNationalRadioCheckedValue() {
  65 + return $(".wl-national-sign-radio:checked").attr("value");
  66 + }
  67 +
  68 + function _isValidState(state) {
  69 + var value = _getNationalRadioCheckedValue();
  70 + return value === 'no' && state != '' || value === 'yes';
  71 + }
  72 +
79 73 function _validadeAllFields() {
80 74 var signName = $('#input-sign-name').val();
81 75 var wordClass = $('#input-word-class').val();
82 76 var phrases = $('#input-phrases').val();
83 77 var state = $('#input-state').val();
84   - var city = $('#input-city').val();
85 78 var signUpload = $('#input-sign-upload').val();
86 79 return !_isEmpty(signName) && !_isEmpty(wordClass)
87   - && _areValidPhrases(phrases) && !_isEmpty(state)
88   - && !_isEmpty(city) && !_isEmpty(signUpload);
  80 + && _arePhrasesValid(phrases) && !_isEmpty(signUpload)
  81 + && _isValidState(state);
89 82 }
90 83  
91 84 function _updateSubmitButton() {
... ... @@ -169,16 +162,34 @@
169 162 _alertPhrase();
170 163 _updateSubmitButton();
171 164 });
172   - $('#input-state').on('input', function() {
173   - _alertState();
  165 + $('#input-sign-upload').on('change', function() {
  166 + _alertSignUpload();
174 167 _updateSubmitButton();
175 168 });
176   - $('#input-city').on('input', function() {
177   - _alertCity();
  169 +
  170 + $('#input-state').on('input', function() {
  171 + var value = $(this).val();
  172 + if (value === 'Nacional') {
  173 + $('.wl-national-sign-radio[value=yes]').trigger("click");
  174 + } else {
  175 + _alertState();
  176 + }
  177 +
178 178 _updateSubmitButton();
179 179 });
180   - $('#input-sign-upload').on('change', function() {
181   - _alertSignUpload();
  180 + $('.wl-national-sign-radio').on('click', function() {
  181 + var value = $(this).attr("value");
  182 + if (value === 'no') {
  183 + $("#input-state-container").show();
  184 + $("#input-city-container").show();
  185 + $("#input-state").val('');
  186 + } else {
  187 + $("#input-state-container").hide();
  188 + $("#input-city-container").hide();
  189 + $("#input-state").val('Nacional');
  190 + $("#input-city").val('');
  191 + }
  192 +
182 193 _updateSubmitButton();
183 194 });
184 195 }
... ...
view/templates/submit-sign/submit-sign.html
... ... @@ -43,14 +43,26 @@
43 43 </div>
44 44 </div>
45 45 <div class="form-group">
46   - <label class="control-label col-sm-3">Frases de exemplo:</label>
  46 + <label class="control-label col-sm-3">Frases de exemplo (opcional):</label>
47 47 <div class="col-sm-5">
48 48 <textarea id="input-phrases" name="frases" class="form-control"
49   - rows="2">
50   - </textarea>
  49 + rows="2"></textarea>
51 50 </div>
52 51 </div>
53 52 <div class="form-group">
  53 + <label class="control-label col-sm-3">O sinal é nacional?</label>
  54 + <div class="col-sm-5">
  55 + <label class="radio-inline">
  56 + <input type="radio" name="wl-national-sign-radio"
  57 + class="wl-national-sign-radio" value="yes">Sim
  58 + </label>
  59 + <label class="radio-inline">
  60 + <input type="radio" name="wl-national-sign-radio"
  61 + class="wl-national-sign-radio" value="no">Não
  62 + </label>
  63 + </div>
  64 + </div>
  65 + <div id="input-state-container" class="form-group">
54 66 <label class="control-label col-sm-3">Estado:</label>
55 67 <div class="col-sm-5">
56 68 <select id="input-state" name="estado" class="form-control">
... ... @@ -82,11 +94,12 @@
82 94 <option value="São Paulo">São Paulo</option>
83 95 <option value="Sergipe">Sergipe</option>
84 96 <option value="Tocantins">Tocantins</option>
  97 + <option value="Nacional">Nacional</option>
85 98 </select>
86 99 </div>
87 100 </div>
88   - <div class="form-group">
89   - <label class="control-label col-sm-3">Cidade:</label>
  101 + <div id="input-city-container" class="form-group">
  102 + <label class="control-label col-sm-3">Cidade (opcional):</label>
90 103 <div class="col-sm-5">
91 104 <input id="input-city" name="cidade" class="form-control"
92 105 placeholder="Nome da sua cidade" type="text">
... ...