From f335afaeecc412a57d8bf3da65b392bccf111c85 Mon Sep 17 00:00:00 2001 From: cschallenberger Date: Mon, 10 Oct 2016 11:26:41 -0300 Subject: [PATCH 1/4] #3 <@cschallenberger, @mathiasVoelcker> - Criar JavaScript que nao permite solicitar numero menor que 0 doadores --- .../javascripts/hospital_necessities.js | 17 ++++++++-- app/assets/javascripts/hospital_register.js | 7 +++- .../services/validate_form_service.js | 11 ++++++- app/views/hospital_necessities/_form.html.erb | 32 +++++++++---------- 4 files changed, 46 insertions(+), 21 deletions(-) diff --git a/app/assets/javascripts/hospital_necessities.js b/app/assets/javascripts/hospital_necessities.js index 24f83d1..c8de768 100644 --- a/app/assets/javascripts/hospital_necessities.js +++ b/app/assets/javascripts/hospital_necessities.js @@ -1,3 +1,14 @@ -# Place all the behaviors and hooks related to the matching controller here. -# All this logic will automatically be available in application.js. -# You can use CoffeeScript in this file: http://coffeescript.org/ + +function myFunction(){ + + var aPositiveInput = document.getElementById("a_positive_input"); + if(aPositiveInput.value == - || aPositiveInput.value == +){ + alert("Por favor, utilize apenas números maiores que 0!"); + aPositiveInput.value = null; + } + + // document.onkeypress = function(evt) { + // if () + // } + +} diff --git a/app/assets/javascripts/hospital_register.js b/app/assets/javascripts/hospital_register.js index 831241f..586ba99 100644 --- a/app/assets/javascripts/hospital_register.js +++ b/app/assets/javascripts/hospital_register.js @@ -2,15 +2,20 @@ ready(function(){ var hospitalRegisterPage = (function(){ - + var initialize = function(){ validateForm(); + validateNecessity(); }; var validateForm = function(){ validateFormService.validateName('js-validateName'); }; + var validateNecessity = function(){ + validateFormService.validateNecessity('js-validateNecessity'); + }; + var animateModal = function(){ } diff --git a/app/assets/javascripts/services/validate_form_service.js b/app/assets/javascripts/services/validate_form_service.js index 05ad1da..e562b94 100644 --- a/app/assets/javascripts/services/validate_form_service.js +++ b/app/assets/javascripts/services/validate_form_service.js @@ -1,5 +1,5 @@ var validateFormService = (function(){ - + alert("puts"); return { validateName: function(selector){ @@ -16,6 +16,15 @@ var validateFormService = (function(){ return false; } } + + validateNecessity: function(selector){ + var aPositiveInput = document.getElementsByClassName(selector); + document.getElementById("a_positive_input").onkeyup = function(){ + if(aPositiveInput.value < 0){ + alert("Por favor, utilize apenas números maiores que 0!"); + aPositiveInput.value = 0; + } + } } })() diff --git a/app/views/hospital_necessities/_form.html.erb b/app/views/hospital_necessities/_form.html.erb index 0452c50..adba598 100644 --- a/app/views/hospital_necessities/_form.html.erb +++ b/app/views/hospital_necessities/_form.html.erb @@ -35,26 +35,26 @@
- <%= f.number_field :a_positive, class: "Input-value u-size3of12" %> - doadores + <%= f.number_field :a_positive, min: "0", max: "100", class: "Input-value u-size4of12", id: "a_positive_input", onkeyup: "myFunction()" %> + doadores
- <%= f.number_field :b_positive, class: "Input-value u-size3of12" %> - doadores + <%= f.number_field :b_positive, class: "Input-value u-size4of12" %> + doadores
- <%= f.number_field :ab_positive, class: "Input-value u-size3of12" %> - doadores + <%= f.number_field :ab_positive, class: "Input-value u-size4of12" %> + doadores
- <%= f.number_field :o_negative, class: "Input-value u-size3of12" %> - doadores + <%= f.number_field :o_negative, class: "Input-value u-size4of12" %> + doadores
@@ -65,26 +65,26 @@
- <%= f.number_field :a_negative , class: "Input-value u-size3of12" %> - doadores + <%= f.number_field :a_negative , class: "Input-value u-size4of12"%> + doadores
- <%= f.number_field :b_negative, class: "Input-value u-size3of12"%> - + <%= f.number_field :b_negative, class: "Input-value u-size4of12"%> +
- <%= f.number_field :ab_negative, class: "Input-value u-size3of12" %> - + <%= f.number_field :ab_negative, class: "Input-value u-size4of12" %> +
- <%= f.number_field :o_negative, class: "Input-value u-size3of12" %> - + <%= f.number_field :o_negative, class: "Input-value u-size4of12" %> +
From c9fcf8e70c2afe4cda4c3f2fed1e4253fe86fd44 Mon Sep 17 00:00:00 2001 From: mvoliveira Date: Mon, 10 Oct 2016 11:32:10 -0300 Subject: [PATCH 2/4] <@cristianferreira, @lucasgaspari> - Corrigir erro de javascript --- .../javascripts/hospital_necessities.js | 3 +- app/assets/javascripts/hospital_register.js | 12 +++---- .../services/validate_form_service.js | 35 +++---------------- app/views/hospitals/_form.html.erb | 3 +- 4 files changed, 15 insertions(+), 38 deletions(-) diff --git a/app/assets/javascripts/hospital_necessities.js b/app/assets/javascripts/hospital_necessities.js index c8de768..586e54a 100644 --- a/app/assets/javascripts/hospital_necessities.js +++ b/app/assets/javascripts/hospital_necessities.js @@ -1,8 +1,9 @@ + function myFunction(){ var aPositiveInput = document.getElementById("a_positive_input"); - if(aPositiveInput.value == - || aPositiveInput.value == +){ + if(aPositiveInput.value == "-" || aPositiveInput.value == "+"){ alert("Por favor, utilize apenas números maiores que 0!"); aPositiveInput.value = null; } diff --git a/app/assets/javascripts/hospital_register.js b/app/assets/javascripts/hospital_register.js index 586ba99..262fbce 100644 --- a/app/assets/javascripts/hospital_register.js +++ b/app/assets/javascripts/hospital_register.js @@ -2,18 +2,18 @@ ready(function(){ var hospitalRegisterPage = (function(){ - + var initialize = function(){ validateForm(); - validateNecessity(); }; var validateForm = function(){ - validateFormService.validateName('js-validateName'); - }; + var inputName = document.getElementsByClassName('js-validateName')[0]; + + inputName.addEventListener('onchange', function(){ + validateFormService.validateName('js-validateName'); + }) - var validateNecessity = function(){ - validateFormService.validateNecessity('js-validateNecessity'); }; var animateModal = function(){ diff --git a/app/assets/javascripts/services/validate_form_service.js b/app/assets/javascripts/services/validate_form_service.js index e562b94..5486fc5 100644 --- a/app/assets/javascripts/services/validate_form_service.js +++ b/app/assets/javascripts/services/validate_form_service.js @@ -1,49 +1,24 @@ var validateFormService = (function(){ - alert("puts"); + return { validateName: function(selector){ - var valueName = document.getElementsByClassName(selector); - - console.log(valueName) + var valueName = document.getElementsByClassName(selector)[0].value; + console.log(valueName); - var errorName = document.getElementById('errorName'); - // console.log("chegou aqui"); if (valueName == "") { - errorName.style.display = "block"; + console.log("chegou aqui") alert('Preencha o campo com seu nome'); - valueName.focus(); return false; } } - validateNecessity: function(selector){ - var aPositiveInput = document.getElementsByClassName(selector); - document.getElementById("a_positive_input").onkeyup = function(){ - if(aPositiveInput.value < 0){ - alert("Por favor, utilize apenas números maiores que 0!"); - aPositiveInput.value = 0; - } - } + } })() - - - - - - - - - - - - - - function validate(){ //$('#ButtonFormHospital').click(function(){ //}); diff --git a/app/views/hospitals/_form.html.erb b/app/views/hospitals/_form.html.erb index eb98098..caf5545 100644 --- a/app/views/hospitals/_form.html.erb +++ b/app/views/hospitals/_form.html.erb @@ -130,7 +130,6 @@ -
<%= hidden_field :password, :value => @password %>
@@ -139,9 +138,11 @@
+
<%= f.submit "Limpar", class: "Button Button--medium" %> +
From 9fda5e7f914eeebd8090119a82cd5189bccf179e Mon Sep 17 00:00:00 2001 From: shemoreira Date: Mon, 10 Oct 2016 13:10:39 -0300 Subject: [PATCH 3/4] #3 <@souzabruna, @lucimarNeves> - Alterado css --- app/assets/javascripts/components/modal.js | 4 +- app/assets/stylesheets/components/Modal.scss | 73 ++++++++++------- app/views/components/index.html.erb | 84 ++++++++++---------- 3 files changed, 89 insertions(+), 72 deletions(-) diff --git a/app/assets/javascripts/components/modal.js b/app/assets/javascripts/components/modal.js index 9e9395d..192ba99 100644 --- a/app/assets/javascripts/components/modal.js +++ b/app/assets/javascripts/components/modal.js @@ -2,12 +2,12 @@ var Modal = function(){ return { open: function(){ - const modal = document.getElementById('modal'); + const modal = document.getElementsByClassName('js-modal')[0]; modal.style.display = "block"; }, close: function(){ - const modal = document.getElementById('modal'); + const modal = document.getElementsByClassName('js-modal')[0]; modal.style.display = "none"; } } diff --git a/app/assets/stylesheets/components/Modal.scss b/app/assets/stylesheets/components/Modal.scss index feb0d0b..4ec61e1 100644 --- a/app/assets/stylesheets/components/Modal.scss +++ b/app/assets/stylesheets/components/Modal.scss @@ -2,63 +2,76 @@ .Modal { $border-color: #c1c1c1; + $overlay-background-color: rgba(0, 0, 0, 0.66); - border: 1px solid $border-color; - border-radius: 5px; display: none; - margin: 30vh auto 0; - max-width: 550px; - overflow: hidden; &::after { - background: rgba(0, 0, 0, 0.66); + background: $overlay-background-color; content: ' '; height: 100%; left: 0; - position: absolute; + position: fixed; top: 0; width: 100%; - z-index: -1; + z-index: 1; + } + + &-content { + border: 1px solid $border-color; + border-radius: 5px; + max-width: 550px; + z-index: 2; + position: fixed; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); } &-header { background-color: #6495ED; - padding: 15px; overflow: auto; + padding: 15px; } - &-step { + &-stepBox { background: #ffffff; - margin: 12px 0 0 15px; border-radius: 100%; float: left; text-align: center; - width: 30px; - height: 30px; + width: 40px; + height: 40px; vertical-align: middle; + display: table; } - &-stepText { + &-step { font-size: 18px; font-weight: 800; - padding: 6px 0 0 0; text-align: center; - width: 30px; - height: 30px; + display: table-cell; + vertical-align: middle; } - &-title { - font-size: 24px; + &-titleBox { + margin: 10px; + float: left; + text-align: center; + display: table; + + } + + &-title{ color: $brand-color; - padding-right: 50px; - margin-top: 19px; - height: 0px; + font-size: 24px; + vertical-align: middle; + display: table-cell; } &-body { background-color: $body-color; - padding: 15px; overflow: auto; + padding: 15px; } &-subTitle { @@ -67,26 +80,26 @@ } &-typesRequest { - margin: 1%; float: left; + margin: 1%; & li { font-size: 14px; font-weight: bolder; - padding-top: 2px; margin: 5px; + padding-top: 2px; } } - &-confirmation{ - padding: 0 15px; - margin-top: 15px; + &-confirmation { border-left: 1px solid $border-color; float: right; + margin-top: 15px; + padding: 0 15px; @include mobile { border-top: 1px solid $border-color; - border-left: none; + border-left: 0; } } @@ -94,7 +107,7 @@ margin: 12px 0 0 10px; - & .Button{ + & .Button { margin: 0 10px; } diff --git a/app/views/components/index.html.erb b/app/views/components/index.html.erb index 66e1a54..cc7e884 100644 --- a/app/views/components/index.html.erb +++ b/app/views/components/index.html.erb @@ -12,64 +12,68 @@ Abrir modal - @@ -90,7 +90,7 @@ Rua:
- <%= f.text_field :street, class: "Input Input-value" %> + <%= f.text_field :street, class: "Input Input-value js-validateStreet " %>
@@ -101,7 +101,7 @@ Nº:
- <%= f.text_field :number, class: "Input Input-value" %> + <%= f.text_field :number, class: "Input Input-value js-validateNumber" %>
@@ -113,7 +113,7 @@ Cidade:
- <%= f.text_field :city, class: "Input Input-value" %> + <%= f.text_field :city, class: "Input Input-value js-validateCity" %>
@@ -124,7 +124,7 @@ Estado:
- <%= f.text_field :state, class: "Input Input-value" %> + <%= f.text_field :state, class: "Input Input-value js-validateState" %>