uix_validations 0.5.0 → 0.5.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9f42e5cab37cb240ef7553b7854285893179f6077cd6c79176eca95884f61176
-  data.tar.gz: 3508693ed965fa9a2807cc8c9fd769f510c345802fbab894b6b63f79efa86f05
+  metadata.gz: 38bd0d741cc6a00414d96b740f3a7f6240a1804fa14386dcb52e788552af17e4
+  data.tar.gz: da6fc6e640daaa73cee647916eece8fd25e59de232c0847bd68b82f5f2126a07
 SHA512:
-  metadata.gz: 11bd1069604223f419cea9bbae0a77cbc9223d493392e2dc06c97741815970820d6099251b5ec47fce5809d8589bedbf090e29bf2db68f94759ae72120cac5e9
-  data.tar.gz: 2c651e8b7fc01c5061c738ce91a67206947ea12fbd8ccd291caf983141f6624c323821af06fc0baab764d70fd365b0caec3abd7c32c2044ec5e25906a5f190a5
+  metadata.gz: 0aa08fd1a4f873e3e70bdd0e2e5b59aeb1578fe723b4664315e42129bc942ad07662616d7be3db2b1528212d8e9ed11deec54d579ecdd117e9ae5b4103ab0a56
+  data.tar.gz: e4ebad797a8e6f1d4fee52dd220592fd547fbe10427c0cc116bceed74b48be95f8dd0216c7c99066689ec8f4e3ce06f9ee0e05004b2cb752e76079746dfcb414

data/.gitignore

@@ -0,0 +1,13 @@
+/.bundle/
+/.yardoc
+/_yardoc/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/
+.DS_Store
+*.gem
+*.rbc
+*.sassc
+.bundle

data/Gemfile

@@ -0,0 +1,6 @@
+source "https://rubygems.org"
+
+git_source(:github) {|repo_name| "https://github.com/#{repo_name}" }
+
+# Specify your gem's dependencies in uix_validations.gemspec
+gemspec

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2018 lucasandrad
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,132 @@
+# UixValidations
+
+`uix_validations` is a gem that provides Js functions for real time validations.
+
+Uix is the abbreviation that I "created" for UI and UX, since this gem has some things from both worlds
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'uix_validations'
+```
+
+And then execute:
+
+    bundle install
+
+
+Than in your Rails project add this line at `app/assets/javascripts/application.js`
+
+```
+//= require uix_validations
+```
+
+And this import at `app/assets/stylesheets/application.scss`
+
+```scss
+@import "uix_validations";
+```
+
+If you are using `application.css` insted of `application.scss`, you can import uix_validations into any `.scss` file.
+
+## Usage
+
+### Live demo
+Check out this live demo using Uix Validations: [uix_validations_demo link here](https://uix-validations-demo.herokuapp.com/)
+
+### Examples
+Real time validation for numbers:
+```html
+<!-- html -->
+<div class="input">
+  <%= f.label 'Validation Number' %><br>
+  <%= f.text_field :title, class: 'input-text', id: 'input-num' %>
+  <!-- Add this div under your input -->
+  <div class="uix-validation" id="vali1">
+    Should have only numbers
+  </div>
+</div>
+
+<script>
+  // pass your input Id and your div Id
+  validateNumber("#input-num", "#vali1");
+</script>
+```
+---
+Real time validation for characters
+```html
+<div class="input">
+  <%= f.label 'Validation Character' %><br>
+  <%= f.text_field :title, class: 'input-text', id: 'input-char' %>
+  <div class="uix-validation" id="vali2">
+    Should have only characters
+  </div>
+</div>
+
+<script>
+  validateCharacter("#input-char", "#vali2");
+</script>
+```
+---
+Real time validation for characters with length 5 - 10
+```html
+<script>
+  validateCharacterLength("#input-num", "#vali1", [5,10]);
+</script>
+```
+
+### Table with all functions
+
+| Js Function | What is it for? |
+|---|---|
+| `validateNumber(input_id, div_id)` | Valid if there are only numbers |
+| `validateNumberRange(input_id, div_id, [0, 2])`  | For now validates only the length of the number, example: [0,2] it's 00 to 99 |
+| `validateCharacter(input_id, div_id)` | Valid if there are only Characters |
+| `validateCharacterLength(input_id, div_id, [0, 2])` | Valid if there are only Characters with the correct length |
+| `validateNonDigit(input_id, div_id)` | Valid if there is anything except digits |
+| `validateNonDigitLength(input_id, div_id, [0, 2])` | Valid if there is anything except digits with the correct length |
+| `validateJustLength(input_id, div_id, [0,2])` | Valid if the value has the correct length |
+| `validateEmail(input_id, div_id)` | Checks for a valid email |
+| `validateRegex(input_id, div_id, custom_regex)` | Validate a custom regex |
+| `validateStrongPassword(input_id, div_id)` | Validate if the password has: at least one digit, at least one character and at least 8 characters |
+| `validateVeryStrongPassword(input_id, div_id)` | Validate if the password has: at least one digit, at least one upcase character, at least one downcase character and at least 8 characters |
+
+### Customize
+You can customize the style of the div with the validation message<br>
+Here is the flow of the validation:<br>
+- When the page loads, the class of validation div is: `class="uix-validation"`
+- When the user is typing the class change to: `class="uix-validation uix-default"`
+- If the input.value is valid the div class change to: `class="uix-validation uix-valid"`
+- If the input.value is invalid, when user click out of the input the class change to: `class="uix-validation uix-invalid"`
+
+So if the `.uix-valid` and `.uix-invalid` styles are not exactly what you want, you can change the style as you want.
+
+## Good practices about real time validations
+This gem is inspired in [Luke Wroblewski study, (article here)](https://alistapart.com/article/inline-validation-in-web-forms) about validation in web forms. This article was published in 2009 but it's still a excellent reference about form validations. Many writers use Luke study as reference in other articles [Example here](https://designmodo.com/ux-form-validation/)
+
+**This gem follow this practices:**
+ - Show the validation at the right time (right after the user has submitted the input value)
+ - Show the validation at the right place (under the input)
+ - Correct colors (not too red and not too green)
+ - The colors change at the right moment (while the user types validations don't turn red, only if he click outside the input, but if the input value is valid the validations turn green, because is good to know that the value is correct just in time)
+ - Validations don't have a alarming design (I am not a design but I tried to make then clean and understandable, something like the ideas of minimalist design)
+
+## Write good messages
+
+Good messages can be a differential in your forms. Don't scare your users with alarming messages, like:<br>**Error: this is wrong. Use just numbers**<br>
+
+Instead you need to focus in what is wrong and help the user to fix it. Something like:<br>
+**Should have onlye numbers. Ex: 99887766**
+
+You can read more about it here: [UX Movement, post about good messages](http://uxmovement.com/forms/how-to-make-your-form-error-messages-more-reassuring/)
+
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/lucasandrad/uix_validations.
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,2 @@
+require "bundler/gem_tasks"
+task :default => :spec

data/bin/console

@@ -0,0 +1,14 @@
+#!/usr/bin/env ruby
+
+require "bundler/setup"
+require "uix_validations"
+
+# You can add fixtures and/or initialization code here to make experimenting
+# with your gem easier. You can also use a different console, if you like.
+
+# (If you use this, don't forget to add pry to your Gemfile!)
+# require "pry"
+# Pry.start
+
+require "irb"
+IRB.start(__FILE__)

data/bin/setup

@@ -0,0 +1,8 @@
+#!/usr/bin/env bash
+set -euo pipefail
+IFS=$'\n\t'
+set -vx
+
+bundle install
+
+# Do any other automated setup that you need to do here

data/lib/uix_validations.rb

@@ -0,0 +1,6 @@
+require "uix_validations/version"
+require "uix_validations/engine"
+
+module UixValidations
+
+end

data/lib/uix_validations/engine.rb

@@ -0,0 +1,4 @@
+module UixValidations
+  class Engine < Rails::Engine
+  end
+end

data/lib/uix_validations/version.rb

@@ -0,0 +1,3 @@
+module UixValidations
+  VERSION = "0.5.1"
+end

data/uix_validations.gemspec

@@ -0,0 +1,38 @@
+
+lib = File.expand_path("../lib", __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require "uix_validations/version"
+
+Gem::Specification.new do |spec|
+  spec.name          = "uix_validations"
+  spec.version       = UixValidations::VERSION
+  spec.authors       = ["Lucas Andrade"]
+  spec.email         = ["lucasandrad@yandex.com"]
+
+  spec.summary       = %q{This gem provides real time validations for forms}
+  spec.description   = %q{This gem provides real time validations for forms. All validations follow the best principles of UI and UX}
+  spec.homepage      = "https://github.com/LucasAndrad/uix_validations"
+  spec.license       = "MIT"
+
+  # Prevent pushing this gem to RubyGems.org. To allow pushes either set the 'allowed_push_host'
+  # to allow pushing to a single host or delete this section to allow pushing to any host.
+  # if spec.respond_to?(:metadata)
+  #   spec.metadata["allowed_push_host"] = "TODO: Set to 'http://mygemserver.com'"
+  # else
+  #   raise "RubyGems 2.0 or newer is required to protect against " \
+  #     "public gem pushes."
+  # end
+
+  # Specify which files should be added to the gem when it is released.
+  # The `git ls-files -z` loads the files in the RubyGem that have been added into git.
+  spec.files         = Dir.chdir(File.expand_path('..', __FILE__)) do
+    `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
+  end
+  spec.bindir        = "exe"
+  spec.executables   = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
+  spec.require_paths = ["lib"]
+
+  spec.add_development_dependency "bundler", "~> 1.16"
+  spec.add_development_dependency "rake", "~> 10.0"
+  spec.add_runtime_dependency 'autoprefixer-rails', '~> 9.1', '>= 9.1.0'
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: uix_validations
 version: !ruby/object:Gem::Version
-  version: 0.5.0
+  version: 0.5.1
 platform: ruby
 authors:
 - Lucas Andrade
@@ -66,8 +66,19 @@ executables: []
 extensions: []
 extra_rdoc_files: []
 files:
-- vendor/assets/javascripts/uix_validations.js
-- vendor/assets/stylesheets/uix_validations.scss
+- ".gitignore"
+- Gemfile
+- LICENSE.txt
+- README.md
+- Rakefile
+- app/assets/javascripts/uix_validations.js
+- app/assets/stylesheets/uix_validations.scss
+- bin/console
+- bin/setup
+- lib/uix_validations.rb
+- lib/uix_validations/engine.rb
+- lib/uix_validations/version.rb
+- uix_validations.gemspec
 homepage: https://github.com/LucasAndrad/uix_validations
 licenses:
 - MIT