usastandards-rails 0.8.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: b8c7e84429d41a37f6a7badc57553453adc3f6df
+  data.tar.gz: a8d49ab5ee4394d9b7b799a7dfc835ad4c884756
+SHA512:
+  metadata.gz: aeb87da4bb723d125e06d5863202b16c7d4fdc9872b56d849d2b75585b3b4d8ea73e7cbb8f3989a026066924d6124c05e4c3f155eafebb5e0a57d8801b8a0110
+  data.tar.gz: 6a83699d26e3228f3dfc19a858e4401927e61eab2bf7ee60d46347ce1d3cc32f48ab3867fcc9552cf125eaeb87c96ea947bc13de93ae29cdba3bff7ed7bd90c5

data/.gitignore

@@ -0,0 +1,9 @@
+/.bundle/
+/.yardoc
+/Gemfile.lock
+/_yardoc/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/

data/.rspec

@@ -0,0 +1,2 @@
+--format documentation
+--color

data/.travis.yml

@@ -0,0 +1,4 @@
+language: ruby
+rvm:
+  - 2.2
+before_install: gem install bundler -v 1.10.6

data/CODE_OF_CONDUCT.md

@@ -0,0 +1,13 @@
+# Contributor Code of Conduct
+
+As contributors and maintainers of this project, we pledge to respect all people who contribute through reporting issues, posting feature requests, updating documentation, submitting pull requests or patches, and other activities.
+
+We are committed to making participation in this project a harassment-free experience for everyone, regardless of level of experience, gender, gender identity and expression, sexual orientation, disability, personal appearance, body size, race, ethnicity, age, or religion.
+
+Examples of unacceptable behavior by participants include the use of sexual language or imagery, derogatory comments or personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct.
+
+Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct. Project maintainers who do not follow the Code of Conduct may be removed from the project team.
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by opening an issue or contacting one or more of the project maintainers.
+
+This Code of Conduct is adapted from the [Contributor Covenant](http://contributor-covenant.org), version 1.0.0, available at [http://contributor-covenant.org/version/1/0/0/](http://contributor-covenant.org/version/1/0/0/)

data/Gemfile

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in usastandards-rails.gemspec
+gemspec

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 TODO: Write your name
+
+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,41 @@
+# USA Web Standards, for Rails.
+
+[![Build Status](https://travis-ci.org/moss-rb/usastandards-rails.svg)](https://travis-ci.org/moss-rb/usastandards-rails)
+
+Please see the appropriate guide for your environment of choice:
+
+* [Ruby on Rails](#a-ruby-on-rails).
+
+### a. Ruby on Rails
+
+`usastandards-rails` is easy to drop into Rails with the asset pipeline.
+
+In your Gemfile you need to add the `usastandards-rails` gem.
+
+```ruby
+gem 'usastandards-rails', '~> 3.3.5'
+```
+
+`bundle install` and restart your server to make the files available through the pipeline.
+
+Import Standards styles in `app/assets/stylesheets/application.css`:
+
+```scss
+// "usastandards-fonts" must be imported before "usastandards"
+@import "usa-standards-fonts";
+@import "usa-standards";
+
+Require Standards Javascripts in `app/assets/javascripts/application.js`:
+
+```js
+//= require jquery
+//= require usa-standards
+```
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/moss-rb/usastandards-rails. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](contributor-covenant.org) code of conduct.
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,6 @@
+require "bundler/gem_tasks"
+require "rspec/core/rake_task"
+
+RSpec::Core::RakeTask.new(:spec)
+
+task :default => :spec

data/bin/console

@@ -0,0 +1,14 @@
+#!/usr/bin/env ruby
+
+require "bundler/setup"
+require "usastandards/rails"
+
+# 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

data/bin/setup

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

data/lib/usastandards/rails.rb

@@ -0,0 +1,9 @@
+require "usastandards/rails/version"
+require "rails"
+
+module Usastandards
+  module Rails
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/lib/usastandards/rails/version.rb

@@ -0,0 +1,5 @@
+module Usastandards
+  module Rails
+    VERSION = "0.8.0"
+  end
+end

data/usastandards-rails.gemspec

@@ -0,0 +1,27 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'usastandards/rails/version'
+
+Gem::Specification.new do |spec|
+  spec.name          = "usastandards-rails"
+  spec.version       = Usastandards::Rails::VERSION
+  spec.authors       = "Jon Moss"
+  spec.email         = "me@jonathanmoss.me"
+
+  spec.summary       = "Rails useable version of the 18F Web Design Standards"
+  spec.description   = "Rails useable version of the 18F Web Design Standards"
+  spec.homepage      = "https://github.com/moss-rb/usastandards-rails"
+  spec.license       = "MIT"
+
+  spec.files         = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
+  spec.bindir        = "exe"
+  spec.executables   = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
+  spec.require_paths = ["lib"]
+
+  spec.add_runtime_dependency "rails"
+
+  spec.add_development_dependency "bundler", "~> 1.10"
+  spec.add_development_dependency "rake", "~> 10.0"
+  spec.add_development_dependency "rspec"
+end

data/vendor/assets/javascripts/usa-standards.js

@@ -0,0 +1,378 @@
+'use strict';
+
+/* globals $: false */
+
+
+
+/*! politespace - v0.1.5 - 2015-07-09
+Politely add spaces to input values to increase readability (credit card numbers, phone numbers, etc).
+ * https://github.com/filamentgroup/politespace
+ * Copyright (c) 2015 Filament Group (@filamentgroup)
+ * MIT License */
+// TODO when moving to import system, install this with npm install politespace
+(function( w ){
+	"use strict";
+
+	var Politespace = function( element ) {
+		if( !element ) {
+			throw new Error( "Politespace requires an element argument." );
+		}
+
+		if( !element.getAttribute ) {
+			// Cut the mustard
+			return;
+		}
+
+		this.element = element;
+		this.type = this.element.getAttribute( "type" );
+		this.delimiter = this.element.getAttribute( "data-delimiter" ) || " ";
+		// https://en.wikipedia.org/wiki/Decimal_mark
+		this.decimalMark = this.element.getAttribute( "data-decimal-mark" ) || "";
+		this.reverse = this.element.getAttribute( "data-reverse" ) !== null;
+		this.groupLength = this.element.getAttribute( "data-grouplength" ) || 3;
+	};
+
+	Politespace.prototype._divideIntoArray = function( value ) {
+		var split = ( '' + this.groupLength ).split( ',' ),
+			isUniformSplit = split.length === 1,
+			dividedValue = [],
+			loopIndex = 0,
+			groupLength,
+			substrStart,
+			useCharCount;
+
+		while( split.length && loopIndex < value.length ) {
+			if( isUniformSplit ) {
+				groupLength = split[ 0 ];
+			} else {
+				// use the next split or the rest of the string if open ended, ala "3,3,"
+				groupLength = split.shift() || value.length - loopIndex;
+			}
+
+			// Use min if we’re at the end of a reversed string
+			// (substrStart below grows larger than the string length)
+			useCharCount = Math.min( parseInt( groupLength, 10 ), value.length - loopIndex );
+
+			if( this.reverse ) {
+				substrStart = -1 * (useCharCount + loopIndex);
+			} else {
+				substrStart = loopIndex;
+			}
+			dividedValue.push( value.substr( substrStart, useCharCount ) );
+			loopIndex += useCharCount;
+		}
+
+		if( this.reverse ) {
+			dividedValue.reverse();
+		}
+
+		return dividedValue;
+	};
+
+	Politespace.prototype.format = function( value ) {
+		var split;
+		var val = this.unformat( value );
+		var suffix = '';
+
+		if( this.decimalMark ) {
+			split = val.split( this.decimalMark );
+			suffix = split.length > 1 ? this.decimalMark + split[ 1 ] : '';
+			val = split[ 0 ];
+		}
+
+		return this._divideIntoArray( val ).join( this.delimiter ) + suffix;
+	};
+
+	Politespace.prototype.trimMaxlength = function( value ) {
+		var maxlength = this.element.getAttribute( "maxlength" );
+		// Note input type="number" maxlength does nothing
+		if( maxlength ) {
+			value = value.substr( 0, maxlength );
+		}
+		return value;
+	};
+
+	Politespace.prototype.getValue = function() {
+		return this.trimMaxlength( this.element.value );
+	};
+
+	Politespace.prototype.update = function() {
+		this.element.value = this.useProxy() ? this.getValue() : this.format( this.getValue() );
+	};
+
+	Politespace.prototype.unformat = function( value ) {
+		return value.replace( new RegExp(  this.delimiter, 'g' ), '' );
+	};
+
+	Politespace.prototype.reset = function() {
+		this.element.value = this.unformat( this.element.value );
+	};
+
+	Politespace.prototype.useProxy = function() {
+		return this.type === "number";
+	};
+
+	Politespace.prototype.updateProxy = function() {
+		var proxy;
+		if( this.useProxy() ) {
+			proxy = this.element.parentNode.firstChild;
+			proxy.innerHTML = this.format( this.getValue() );
+			proxy.style.width = this.element.offsetWidth + "px";
+		}
+	};
+
+	Politespace.prototype.createProxy = function() {
+		if( !this.useProxy() ) {
+			return;
+		}
+
+		function getStyle( el, prop ) {
+			return window.getComputedStyle( el, null ).getPropertyValue( prop );
+		}
+		function sumStyles( el, props ) {
+			var total = 0;
+			for( var j=0, k=props.length; j<k; j++ ) {
+				total += parseFloat( getStyle( el, props[ j ] ) );
+			}
+			return total;
+		}
+
+		var parent = this.element.parentNode;
+		var el = document.createElement( "div" );
+		var proxy = document.createElement( "div" );
+		proxy.style.font = getStyle( this.element, "font" );
+		proxy.style.paddingLeft = sumStyles( this.element, [ "padding-left", "border-left-width" ] ) + "px";
+		proxy.style.paddingRight = sumStyles( this.element, [ "padding-right", "border-right-width" ] ) + "px";
+		proxy.style.top = sumStyles( this.element, [ "padding-top", "border-top-width", "margin-top" ] ) + "px";
+
+		el.appendChild( proxy );
+		el.className = "politespace-proxy active";
+		var formEl = parent.replaceChild( el, this.element );
+		el.appendChild( formEl );
+
+		this.updateProxy();
+	};
+
+	w.Politespace = Politespace;
+
+}( this ));
+
+(function( $ ) {
+	"use strict";
+
+	// jQuery Plugin
+
+	var componentName = "politespace",
+		enhancedAttr = "data-enhanced",
+		initSelector = "[data-" + componentName + "]:not([" + enhancedAttr + "])";
+
+	$.fn[ componentName ] = function(){
+		return this.each( function(){
+			var polite = new Politespace( this );
+			if( polite.type === "number" ) {
+				polite.createProxy();
+			}
+
+			$( this )
+				.bind( "input keydown", function() {
+					polite.updateProxy();
+				})
+				.bind( "blur", function() {
+					$( this ).closest( ".politespace-proxy" ).addClass( "active" );
+					polite.update();
+					polite.updateProxy();
+				})
+				.bind( "focus", function() {
+					$( this ).closest( ".politespace-proxy" ).removeClass( "active" );
+					polite.reset();
+				})
+				.data( componentName, polite );
+
+			polite.update();
+		});
+	};
+
+	// auto-init on enhance (which is called on domready)
+  $(document).ready(function() {
+    $('[data-' + componentName + ']').politespace();
+  });
+
+}( jQuery ));
+
+/**
+ * Accordion
+ *
+ * An accordion component.
+ *
+ * @param {jQuery} $el A jQuery html element to turn into an accordion.
+ */
+function Accordion($el) {
+  var self = this;
+  this.$root = $el;
+  this.$root.on('click', 'button', function(ev) {
+    var expanded = JSON.parse($(this).attr('aria-expanded'));
+    ev.preventDefault();
+    self.hideAll();
+    if (!expanded) {
+      self.show($(this));
+    }
+  });
+}
+
+Accordion.prototype.$ = function(selector) {
+  return this.$root.find(selector);
+}
+
+Accordion.prototype.hide = function($button) {
+  var selector = $button.attr('aria-controls'),
+      $content = this.$('#' + selector);
+
+  $button.attr('aria-expanded', false);
+  $content.attr('aria-hidden', true);
+};
+
+Accordion.prototype.show = function($button) {
+  var selector = $button.attr('aria-controls'),
+      $content = this.$('#' + selector);
+
+  $button.attr('aria-expanded', true);
+  $content.attr('aria-hidden', false);
+};
+
+Accordion.prototype.hideAll = function() {
+  var self = this;
+  this.$('button').each(function() {
+    self.hide($(this));
+  });
+};
+
+/**
+ * accordion
+ *
+ * Initialize a new Accordion component.
+ *
+ * @param {jQuery} $el A jQuery html element to turn into an accordion.
+ */
+function accordion($el) {
+  return new Accordion($el);
+}
+
+function togglePassword($el) {
+  var fieldSelector =  '#' + $el.attr('aria-controls'),
+      $field = $el.parents('form').find(fieldSelector),
+      showing = false;
+
+  $el.on('click', function(ev) {
+    ev.preventDefault();
+    toggleFieldMask($field, showing);
+    $el.text(showing ? 'Show password' : 'Hide password');
+    showing = !showing;
+  });
+}
+
+function toggleSSN($el) {
+  var fieldSelector =  '#' + $el.attr('aria-controls'),
+      $field = $el.parents('form').find(fieldSelector),
+      showing = false;
+
+  $el.on('click', function(ev) {
+    ev.preventDefault();
+    toggleFieldMask($field, showing);
+    $el.text(showing ? 'Show SSN' : 'Hide SSN');
+    showing = !showing;
+  });
+}
+
+function toggleMultiPassword($el) {
+  var fieldSelector = '#password, #confirmPassword',
+      $fields = $el.parents('form').find(fieldSelector),
+      showing = false;
+
+  $el.on('click', function(ev) {
+    ev.preventDefault();
+    toggleFieldMask($fields, showing);
+    $el.text(showing ? 'Show my typing' : 'Hide my typing');
+    showing = !showing;
+  });
+}
+
+function toggleFieldMask($field, showing) {
+  $field.attr('autocapitalize', 'off');
+  $field.attr('autocorrect', 'off');
+  $field.attr('type', showing ? 'password' : 'text');
+}
+
+function validator($el) {
+  var data = $('#password[data-validation-element]').data(),
+      key,
+      validatorName,
+      validatorPattern,
+      $validatorCheckbox,
+      $checkList = $($el.data('validationElement'));
+
+  function validate() {
+    for (key in data) {
+      if (key.startsWith('validate')) {
+        validatorName = key.split('validate')[1];
+        validatorPattern = new RegExp(data[key]);
+        $validatorCheckbox = $checkList.find('[data-validator=' +
+            validatorName.toLowerCase() + ']');
+
+        if (!validatorPattern.test($el.val())) {
+          $validatorCheckbox.toggleClass('usa-checklist-checked', false);
+        }
+        else {
+          $validatorCheckbox.toggleClass('usa-checklist-checked', true);
+        }
+      }
+    }
+  }
+
+  $el.on('keyup', validate);
+}
+
+$(function() {
+  $('[class^=usa-accordion]').each(function() {
+    accordion($(this));
+  });
+
+  var footerAccordion = function() {
+    if (window.innerWidth < 600) {
+
+      $('.usa-footer-big nav ul').addClass('hidden');
+
+      $('.usa-footer-big nav .usa-footer-primary-link').unbind('click');
+
+      $('.usa-footer-big nav .usa-footer-primary-link').bind('click', function() {
+        $(this).parent().removeClass('hidden')
+        .siblings().addClass('hidden');
+      });
+    } else {
+
+      $('.usa-footer-big nav ul').removeClass('hidden');
+
+      $('.usa-footer-big nav .usa-footer-primary-link').unbind('click');
+    }
+  };
+
+  footerAccordion();
+
+  $(window).resize(function() {
+    footerAccordion();
+  });
+
+  // Fixing skip nav focus behavior in chrome
+  $('.skipnav').click(function(){
+    $('#main-content').attr('tabindex','0');
+  });
+
+  $('#main-content').blur(function(){
+    $(this).attr('tabindex','-1');
+  });
+
+  togglePassword($('.usa-show_password'));
+  toggleMultiPassword($('.usa-show_multipassword'));
+  toggleSSN($('.usa-show_ssn'));
+  validator($('.js-validate_password'));
+
+});