accessible-bootstrap3-rails 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 5e0c125bff2c38c53288abb742f5f9f55bf931a0
+  data.tar.gz: 8a6b6dcedb2e9ed0378737284a5a041aceb893d5
+SHA512:
+  metadata.gz: c5fda2b1a52fb9755a2ed6c0969740f05620f692ff4e1e511c3e3f47d8a375f263213e0cafd58aa5d71fcf9c6de3462998e4837625a23884f68853a50ca7ac2b
+  data.tar.gz: cd878a5b15402af9469fe6085e3dd3f5b96e209342def9f2656dffa5bd3b726dfe9c83aaa20458faa24afd1d458a6f75b59c5be1fba95bb387783c84bda45675

data/.gitignore

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

data/Gemfile

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

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 Reax.io
+
+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,68 @@
+# Accessible::Bootstrap3::Rails
+
+#### A gem to bring npm package bootstrap3-accessibility-patches into your rails project.
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'accessible-bootstrap3-rails'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install accessible-bootstrap3-rails
+
+## Usage
+
+Add it and the jQuery dependency to your `application.js`:
+```
+  //= require accessible-bootstrap3/index
+```
+## If your already using 'jquery >=1.9.1 < 2.0.0' you can leave out the next line
+
+`//= require jquery/dist/jquery.min.js`
+
+## Usage specs are specified in bootstrap3-accessibility-patches npm package.
+
+> https://www.npmjs.com/package/bootstrap3-accessibility-patches
+
+# bootstrap3-accessibility-patches
+
+A package for making your bootstrap3 web app more accessible.
+This Package tries to address accessibility related issues mostly related to keyboard navigation of your web-views.
+
+  > 1. We start off making sure drop-downs and sub-menus get closed when they lose focus.
+  > 2. We update area-expanded attributes accordingly when drop-downs are opened and closed.
+  >      * Make sure you start off by adding are-expanded="false" to all .dropdown-toggle .trigger class elements.
+  > 3. We add the ability to open and close menus with the space-bar.
+  > 4. We also prevent the enter key from submitting forms except when on the form submit button. When enter is pressed on
+  >    a text input it will place focus on the next input. When it is pressed on a checkbox or radio button it will toggle
+  >    the state of that input.
+  > 5. Lastly, we make it easy to add a skip navigation link at the top of your page.
+
+This Package depends on jQuery so you need to link to a version of jQuery that is greater than 1.9.1, but less than 2.0.0.
+This package may work with older and or newer jquery versions than specified, but this is untested.
+
+You will also need to link to index.js in this package.
+
+```html
+  <script src="node_modules/bootstrap3-accessibility-patches/index.js"></script>
+  <script src="node_modules/jquery/dist/jquery.min.js">
+```
+
+## Creating a skip navigation link.
+
+At the very top of the page you will need to create a link, That preferably, navigates to the first page heading after your navigation. This link needs to have an **ID** set to **skip-nav** like so.
+```html
+  <a link="#heading" id="skip-nav"><a>
+```
+And that's it, everything else happens behind the scenes.
+
+## Disclaimer
+This is not a solution to all your accessiblity woes, it's just a step in the right direction.

data/Rakefile

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

data/accessible-bootstrap3-package.json

@@ -0,0 +1,89 @@
+{
+  "_args": [
+    [
+      {
+        "name": "accessible-bootstrap3",
+        "raw": "accessible-bootstrap3",
+        "rawSpec": "",
+        "scope": null,
+        "spec": "latest",
+        "type": "tag"
+      },
+      "/Users/brandonhoward/Desktop/code/reax_code/accessible-bootstrap3-rails"
+    ]
+  ],
+  "_from": "accessible-bootstrap3@latest",
+  "_id": "accessible-bootstrap3@0.1.0",
+  "_inCache": true,
+  "_installable": true,
+  "_location": "/accessible-bootstrap3",
+  "_nodeVersion": "5.10.0",
+  "_npmOperationalInternal": {
+    "host": "packages-12-west.internal.npmjs.com",
+    "tmp": "tmp/accessible-bootstrap3-0.1.0.tgz_1465563692135_0.5165368870366365"
+  },
+  "_npmUser": {
+    "email": "the-team@reax.io",
+    "name": "reax"
+  },
+  "_npmVersion": "3.9.5",
+  "_phantomChildren": {},
+  "_requested": {
+    "name": "accessible-bootstrap3",
+    "raw": "accessible-bootstrap3",
+    "rawSpec": "",
+    "scope": null,
+    "spec": "latest",
+    "type": "tag"
+  },
+  "_requiredBy": [
+    "/"
+  ],
+  "_resolved": "https://registry.npmjs.org/accessible-bootstrap3/-/accessible-bootstrap3-0.1.0.tgz",
+  "_shasum": "83fd897fd33350c9d64eb44ec1fed4094b48d7ae",
+  "_shrinkwrap": null,
+  "_spec": "accessible-bootstrap3",
+  "_where": "/Users/brandonhoward/Desktop/code/reax_code/accessible-bootstrap3-rails",
+  "author": {
+    "email": "brandon@reax.io",
+    "name": "Brandon Howard",
+    "url": "brandonrhoward.com"
+  },
+  "bugs": {
+    "url": "https://github.com/ReaxDev/accessible-bootstrap3/issues"
+  },
+  "dependencies": {
+    "jquery": ">=1.9.1 < 2.0.0"
+  },
+  "description": "A js script for making your bootstrap3 web app more accessible.",
+  "devDependencies": {},
+  "directories": {},
+  "dist": {
+    "shasum": "83fd897fd33350c9d64eb44ec1fed4094b48d7ae",
+    "tarball": "https://registry.npmjs.org/accessible-bootstrap3/-/accessible-bootstrap3-0.1.0.tgz"
+  },
+  "engines": {
+    "node": ">=4.2.4"
+  },
+  "gitHead": "fb461a2f25dab0c7b5748196f7e480d95be4d809",
+  "homepage": "https://github.com/ReaxDev/accessible-bootstrap3#readme",
+  "license": "MIT",
+  "main": "index.js",
+  "maintainers": [
+    {
+      "email": "the-team@reax.io",
+      "name": "reax"
+    }
+  ],
+  "name": "accessible-bootstrap3",
+  "optionalDependencies": {},
+  "readme": "ERROR: No README data found!",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ReaxDev/accessible-bootstrap3.git"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "version": "0.1.0"
+}

data/accessible-bootstrap3-rails.gemspec

@@ -0,0 +1,25 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'accessible/bootstrap3/rails/version'
+
+Gem::Specification.new do |spec|
+  spec.name          = "accessible-bootstrap3-rails"
+  spec.version       = Accessible::Bootstrap3::Rails::VERSION
+  spec.authors       = ["brayhoward"]
+  spec.email         = ["brandon@reax.io"]
+
+  spec.summary       = %q{A gem to bring bootstrap3-accessibility-patches into your rails project.}
+  spec.homepage      = "https://github.com/ReaxDev/accessible-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_development_dependency "bundler", "~> 1.11"
+  spec.add_development_dependency "rake", "~> 10.0"
+
+  spec.add_dependency "railties", "> 3.1"
+end

data/bin/console

@@ -0,0 +1,14 @@
+#!/usr/bin/env ruby
+
+require "bundler/setup"
+require "accessible/bootstrap3/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,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/copy.sh

@@ -0,0 +1,24 @@
+#!/bin/bash
+
+npm install accessible-bootstrap3
+
+rm -rf vendor
+
+mkdir -p vendor/assets/javascripts/accessible-bootstrap3 vendor/assets/javascripts/jquery
+
+cp node_modules/accessible-bootstrap3/index.js vendor/assets/javascripts/accessible-bootstrap3
+cp -r node_modules/jquery/dist/ vendor/assets/javascripts/jquery
+
+# copy data from bootstrap3-accessibility-patches package.json and README.md
+rm README.md accessible-bootstrap3-package.json && touch README.md accessible-bootstrap3-package.json
+
+cp node_modules/accessible-bootstrap3/package.json accessible-bootstrap3-package.json
+
+
+cp gem-instructions.md  README.md
+cat node_modules/accessible-bootstrap3/README.md >> README.md
+
+rm -rf node_modules
+
+echo 'Done.'
+echo 'DO NOT FORGET TO UPDATE VERSION IN GEMSPEC!'

data/gem-instructions.md

@@ -0,0 +1,34 @@
+# Accessible::Bootstrap3::Rails
+
+#### A gem to bring npm package bootstrap3-accessibility-patches into your rails project.
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'accessible-bootstrap3-rails'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install accessible-bootstrap3-rails
+
+## Usage
+
+Add it and the jQuery dependency to your `application.js`:
+```
+  //= require accessible-bootstrap3/index
+```
+## If your already using 'jquery >=1.9.1 < 2.0.0' you can leave out the next line
+
+`//= require jquery/dist/jquery.min.js`
+
+## Usage specs are specified in bootstrap3-accessibility-patches npm package.
+
+> https://www.npmjs.com/package/bootstrap3-accessibility-patches
+

data/lib/accessible/bootstrap3/rails.rb

@@ -0,0 +1,10 @@
+require "accessible/bootstrap3/rails/version"
+
+module Accessible
+  module Bootstrap3
+    module Rails
+      class Engine < ::Rails::Engine
+      end
+    end
+  end
+end

data/lib/accessible/bootstrap3/rails/version.rb

@@ -0,0 +1,10 @@
+require 'json'
+
+module Accessible
+  module Bootstrap3
+    module Rails
+      package_info = JSON.parse(File.read(File.expand_path('../../../../../accessible-bootstrap3-package.json', __FILE__)))
+      VERSION = package_info["version"]
+    end
+  end
+end

data/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "accessible-bootstrap3-rails",
+  "version": "0.1.0",
+  "description": "A gem to bring the accessible-bootstrap3 npm package into your rails project ",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "Brandon Howard <brandon@reax.io> (brandonrhoward.com)",
+  "license": "MIT",
+  "dependencies": {
+    "accessible-bootstrap3": "0.1.0",
+    "bootstrap3-accessibility-patches": "0.0.5"
+  }
+}

data/vendor/assets/javascripts/accessible-bootstrap3/index.js

@@ -0,0 +1,145 @@
+$(document).ready(function() {
+  console.log("bootstrap3-accessibility-patches loaded.");
+
+  var getKeyCode = function(event) {
+    // Some browsers use keyCode and some use which.
+    // Return whichever one doesn't blow up.
+    return event.keyCode || event.which;
+  }
+  //////////////////////////////////////////////////////////////////
+  // This code removes the open class from a .dropdown menu,
+  // or adds {"display": "none"} css to .sub-menu menu
+  // after it && its children elements loose focus. Which in turn
+  // causes the dropdown menu to close or hide.
+  $('body').focusin(function(){
+    // remove open class from all .dropdown elements
+    $('.dropdown').removeClass('open');
+    // Set aria-expanded="false" after we close the dropdown.
+    $('.dropdown a.dropdown-toggle').attr("aria-expanded", false);
+  });
+
+  $('.dropdown').focusin(function(){
+    var children = $(this).children();
+
+    children.focusin(function(event) {
+      // stop the bubble up event from triggering
+      // the $('body').focusin function (line 16)
+      // This prevents the dropdown from collapsing while focus is
+      // on any of the children elements.
+      event.stopPropagation();
+      // Close sub-menu dropdown by adding display: none css.
+      $('.dropdown-submenu > ul.sub-menu').css({"display": "none"})
+    });
+  });
+
+  $('.dropdown-submenu').focusin(function(){
+    var children = $(this).children();
+
+    children.focusin(function(event) {
+      // stop the bubble up event from triggering
+      // the $('.dropdown').focusin function (line 21)
+      // This prevents the dropdown from collapsing while focus is
+      // on any of the children elements.
+      event.stopPropagation();
+    });
+  });
+  //////////////////////////////////////////////////////////////////
+
+/// Toggle aria-expanded attribute for dropdown and submenus //////////
+  $(".dropdown-toggle").bind("click", function() {
+    var self = $(this);
+    var parent = self.parent('.dropdown');
+    expanded = !parent.hasClass("open");
+    self.attr("aria-expanded", expanded);
+  });
+
+  $("a.trigger").bind("click", function() {
+    var self = $(this);
+    var submenu = self.next(".sub-menu");
+    expanded = !(submenu.css("display") === "none");
+    self.attr("aria-expanded", expanded);
+  });
+/////////////////////////////////////////////////////////////////////////
+
+//// Modify keyboard defaults for dropdown menu and submenus.//////
+  $('.dropdown-toggle').keydown(function(event) {
+    var code = getKeyCode(event);
+    var thisDropdown = $(this).parent('.dropdown');
+    if ( !thisDropdown.hasClass('open') && (code == 27) ) {
+      // stop escape key from opening dropdown
+      event.stopPropagation();
+    // If space bar hit open or close dropdown
+    } else if (code === 32 ) {
+      event.preventDefault();
+      $(this).click()
+    }
+  });
+
+  $('.dropdown-submenu a.trigger').keydown(function(event) {
+    var code = getKeyCode(event);
+    var subMenu = $(this).next("ul.sub-menu");
+
+    if (code === 32 ) {
+      // Stop page scroll
+      event.preventDefault();
+      // Open and close submenu when space bar is hit.
+      subMenu.css('display') == "none" ? subMenu.css('display', 'block' ) : subMenu.css('display', 'none' )
+    }
+  });
+///////////////////////////////////////////////////////
+
+//// Skip Navigation ////////////////////////////////////////////////////
+  // bind a click event to the 'skip' link
+  $("#skip-nav").click(function(event){
+
+    // strip the leading hash and declare
+    // the content we're skipping to
+    var skipTo="#"+this.href.split('#')[1];
+
+    // Setting 'tabindex' to -1 takes an element out of normal
+    // tab flow but allows it to be focused via javascript
+    $(skipTo).attr('tabindex', -1).on('blur focusout', function () {
+
+        // when focus leaves this element,
+        // remove the tabindex attribute
+        $(this).removeAttr('tabindex');
+
+    }).focus(); // focus on the content container
+  });
+/////////////////////////////////////////////////////////////////////////
+
+  /// Prevent enter from submitting form //////////////////////////////////
+  $(document).on("keypress", "form", function (event) {
+    var code = getKeyCode(event);
+    // If target is <textarea> or submit return true and do NOT modify normal behavior.
+    if ($(event.target).is("textarea") || $(event.target).is("input:submit")) {return true}
+
+    if (code == 13 ) {
+      if ($(event.target).is("input:checkbox") || $(event.target).is("input:radio") ) {
+        event.preventDefault();
+        event.target.click();
+        return false
+      }
+      if ($(event.target).is("select")) {event.preventDefault(); mouseDown(event.target); return false}
+
+      tabIndexForward(event);
+      event.preventDefault();
+    }
+  });
+
+  //click element with virtual mouse.
+  var mouseDown = function (element) {
+    var event = document.createEvent('MouseEvents');
+    event.initMouseEvent('mousedown', true, true, window);
+    element.dispatchEvent(event);
+  };
+
+  // Move tab index forward one input inside the form an event originates.
+  var tabIndexForward = function(event) {
+    var inputs = $(event.target).parents("form").eq(0).find(":input:visible");
+    var idx = inputs.index(event.target);
+    // If at end of focusable elements move back to beginning, if not move forward one.
+    (idx == inputs.length - 1) ? inputs[0].focusin() : inputs[idx + 1].focus();
+  }
+  /////////////////////////////////////////////////////////////////////////
+});