accessible-bootstrap3-rails 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: 5e0c125bff2c38c53288abb742f5f9f55bf931a0
4
+ data.tar.gz: 8a6b6dcedb2e9ed0378737284a5a041aceb893d5
5
+ SHA512:
6
+ metadata.gz: c5fda2b1a52fb9755a2ed6c0969740f05620f692ff4e1e511c3e3f47d8a375f263213e0cafd58aa5d71fcf9c6de3462998e4837625a23884f68853a50ca7ac2b
7
+ data.tar.gz: cd878a5b15402af9469fe6085e3dd3f5b96e209342def9f2656dffa5bd3b726dfe9c83aaa20458faa24afd1d458a6f75b59c5be1fba95bb387783c84bda45675
data/.gitignore ADDED
@@ -0,0 +1,9 @@
1
+ /.bundle/
2
+ /.yardoc
3
+ /Gemfile.lock
4
+ /_yardoc/
5
+ /coverage/
6
+ /doc/
7
+ /pkg/
8
+ /spec/reports/
9
+ /tmp/
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in accessible-bootstrap3-rails.gemspec
4
+ gemspec
data/LICENSE.txt ADDED
@@ -0,0 +1,21 @@
1
+ The MIT License (MIT)
2
+
3
+ Copyright (c) 2016 Reax.io
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in
13
+ all copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
+ THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,68 @@
1
+ # Accessible::Bootstrap3::Rails
2
+
3
+ #### A gem to bring npm package bootstrap3-accessibility-patches into your rails project.
4
+
5
+ ## Installation
6
+
7
+ Add this line to your application's Gemfile:
8
+
9
+ ```ruby
10
+ gem 'accessible-bootstrap3-rails'
11
+ ```
12
+
13
+ And then execute:
14
+
15
+ $ bundle
16
+
17
+ Or install it yourself as:
18
+
19
+ $ gem install accessible-bootstrap3-rails
20
+
21
+ ## Usage
22
+
23
+ Add it and the jQuery dependency to your `application.js`:
24
+ ```
25
+ //= require accessible-bootstrap3/index
26
+ ```
27
+ ## If your already using 'jquery >=1.9.1 < 2.0.0' you can leave out the next line
28
+
29
+ `//= require jquery/dist/jquery.min.js`
30
+
31
+ ## Usage specs are specified in bootstrap3-accessibility-patches npm package.
32
+
33
+ > https://www.npmjs.com/package/bootstrap3-accessibility-patches
34
+
35
+ # bootstrap3-accessibility-patches
36
+
37
+ A package for making your bootstrap3 web app more accessible.
38
+ This Package tries to address accessibility related issues mostly related to keyboard navigation of your web-views.
39
+
40
+ > 1. We start off making sure drop-downs and sub-menus get closed when they lose focus.
41
+ > 2. We update area-expanded attributes accordingly when drop-downs are opened and closed.
42
+ > * Make sure you start off by adding are-expanded="false" to all .dropdown-toggle .trigger class elements.
43
+ > 3. We add the ability to open and close menus with the space-bar.
44
+ > 4. We also prevent the enter key from submitting forms except when on the form submit button. When enter is pressed on
45
+ > a text input it will place focus on the next input. When it is pressed on a checkbox or radio button it will toggle
46
+ > the state of that input.
47
+ > 5. Lastly, we make it easy to add a skip navigation link at the top of your page.
48
+
49
+ 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.
50
+ This package may work with older and or newer jquery versions than specified, but this is untested.
51
+
52
+ You will also need to link to index.js in this package.
53
+
54
+ ```html
55
+ <script src="node_modules/bootstrap3-accessibility-patches/index.js"></script>
56
+ <script src="node_modules/jquery/dist/jquery.min.js">
57
+ ```
58
+
59
+ ## Creating a skip navigation link.
60
+
61
+ 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.
62
+ ```html
63
+ <a link="#heading" id="skip-nav"><a>
64
+ ```
65
+ And that's it, everything else happens behind the scenes.
66
+
67
+ ## Disclaimer
68
+ This is not a solution to all your accessiblity woes, it's just a step in the right direction.
data/Rakefile ADDED
@@ -0,0 +1,2 @@
1
+ require "bundler/gem_tasks"
2
+ task :default => :spec
@@ -0,0 +1,89 @@
1
+ {
2
+ "_args": [
3
+ [
4
+ {
5
+ "name": "accessible-bootstrap3",
6
+ "raw": "accessible-bootstrap3",
7
+ "rawSpec": "",
8
+ "scope": null,
9
+ "spec": "latest",
10
+ "type": "tag"
11
+ },
12
+ "/Users/brandonhoward/Desktop/code/reax_code/accessible-bootstrap3-rails"
13
+ ]
14
+ ],
15
+ "_from": "accessible-bootstrap3@latest",
16
+ "_id": "accessible-bootstrap3@0.1.0",
17
+ "_inCache": true,
18
+ "_installable": true,
19
+ "_location": "/accessible-bootstrap3",
20
+ "_nodeVersion": "5.10.0",
21
+ "_npmOperationalInternal": {
22
+ "host": "packages-12-west.internal.npmjs.com",
23
+ "tmp": "tmp/accessible-bootstrap3-0.1.0.tgz_1465563692135_0.5165368870366365"
24
+ },
25
+ "_npmUser": {
26
+ "email": "the-team@reax.io",
27
+ "name": "reax"
28
+ },
29
+ "_npmVersion": "3.9.5",
30
+ "_phantomChildren": {},
31
+ "_requested": {
32
+ "name": "accessible-bootstrap3",
33
+ "raw": "accessible-bootstrap3",
34
+ "rawSpec": "",
35
+ "scope": null,
36
+ "spec": "latest",
37
+ "type": "tag"
38
+ },
39
+ "_requiredBy": [
40
+ "/"
41
+ ],
42
+ "_resolved": "https://registry.npmjs.org/accessible-bootstrap3/-/accessible-bootstrap3-0.1.0.tgz",
43
+ "_shasum": "83fd897fd33350c9d64eb44ec1fed4094b48d7ae",
44
+ "_shrinkwrap": null,
45
+ "_spec": "accessible-bootstrap3",
46
+ "_where": "/Users/brandonhoward/Desktop/code/reax_code/accessible-bootstrap3-rails",
47
+ "author": {
48
+ "email": "brandon@reax.io",
49
+ "name": "Brandon Howard",
50
+ "url": "brandonrhoward.com"
51
+ },
52
+ "bugs": {
53
+ "url": "https://github.com/ReaxDev/accessible-bootstrap3/issues"
54
+ },
55
+ "dependencies": {
56
+ "jquery": ">=1.9.1 < 2.0.0"
57
+ },
58
+ "description": "A js script for making your bootstrap3 web app more accessible.",
59
+ "devDependencies": {},
60
+ "directories": {},
61
+ "dist": {
62
+ "shasum": "83fd897fd33350c9d64eb44ec1fed4094b48d7ae",
63
+ "tarball": "https://registry.npmjs.org/accessible-bootstrap3/-/accessible-bootstrap3-0.1.0.tgz"
64
+ },
65
+ "engines": {
66
+ "node": ">=4.2.4"
67
+ },
68
+ "gitHead": "fb461a2f25dab0c7b5748196f7e480d95be4d809",
69
+ "homepage": "https://github.com/ReaxDev/accessible-bootstrap3#readme",
70
+ "license": "MIT",
71
+ "main": "index.js",
72
+ "maintainers": [
73
+ {
74
+ "email": "the-team@reax.io",
75
+ "name": "reax"
76
+ }
77
+ ],
78
+ "name": "accessible-bootstrap3",
79
+ "optionalDependencies": {},
80
+ "readme": "ERROR: No README data found!",
81
+ "repository": {
82
+ "type": "git",
83
+ "url": "git+https://github.com/ReaxDev/accessible-bootstrap3.git"
84
+ },
85
+ "scripts": {
86
+ "test": "echo \"Error: no test specified\" && exit 1"
87
+ },
88
+ "version": "0.1.0"
89
+ }
@@ -0,0 +1,25 @@
1
+ # coding: utf-8
2
+ lib = File.expand_path('../lib', __FILE__)
3
+ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
4
+ require 'accessible/bootstrap3/rails/version'
5
+
6
+ Gem::Specification.new do |spec|
7
+ spec.name = "accessible-bootstrap3-rails"
8
+ spec.version = Accessible::Bootstrap3::Rails::VERSION
9
+ spec.authors = ["brayhoward"]
10
+ spec.email = ["brandon@reax.io"]
11
+
12
+ spec.summary = %q{A gem to bring bootstrap3-accessibility-patches into your rails project.}
13
+ spec.homepage = "https://github.com/ReaxDev/accessible-rails"
14
+ spec.license = "MIT"
15
+
16
+ spec.files = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
17
+ spec.bindir = "exe"
18
+ spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
19
+ spec.require_paths = ["lib"]
20
+
21
+ spec.add_development_dependency "bundler", "~> 1.11"
22
+ spec.add_development_dependency "rake", "~> 10.0"
23
+
24
+ spec.add_dependency "railties", "> 3.1"
25
+ end
data/bin/console ADDED
@@ -0,0 +1,14 @@
1
+ #!/usr/bin/env ruby
2
+
3
+ require "bundler/setup"
4
+ require "accessible/bootstrap3/rails"
5
+
6
+ # You can add fixtures and/or initialization code here to make experimenting
7
+ # with your gem easier. You can also use a different console, if you like.
8
+
9
+ # (If you use this, don't forget to add pry to your Gemfile!)
10
+ # require "pry"
11
+ # Pry.start
12
+
13
+ require "irb"
14
+ IRB.start
data/bin/setup ADDED
@@ -0,0 +1,8 @@
1
+ #!/usr/bin/env bash
2
+ set -euo pipefail
3
+ IFS=$'\n\t'
4
+ set -vx
5
+
6
+ bundle install
7
+
8
+ # Do any other automated setup that you need to do here
data/copy.sh ADDED
@@ -0,0 +1,24 @@
1
+ #!/bin/bash
2
+
3
+ npm install accessible-bootstrap3
4
+
5
+ rm -rf vendor
6
+
7
+ mkdir -p vendor/assets/javascripts/accessible-bootstrap3 vendor/assets/javascripts/jquery
8
+
9
+ cp node_modules/accessible-bootstrap3/index.js vendor/assets/javascripts/accessible-bootstrap3
10
+ cp -r node_modules/jquery/dist/ vendor/assets/javascripts/jquery
11
+
12
+ # copy data from bootstrap3-accessibility-patches package.json and README.md
13
+ rm README.md accessible-bootstrap3-package.json && touch README.md accessible-bootstrap3-package.json
14
+
15
+ cp node_modules/accessible-bootstrap3/package.json accessible-bootstrap3-package.json
16
+
17
+
18
+ cp gem-instructions.md README.md
19
+ cat node_modules/accessible-bootstrap3/README.md >> README.md
20
+
21
+ rm -rf node_modules
22
+
23
+ echo 'Done.'
24
+ echo 'DO NOT FORGET TO UPDATE VERSION IN GEMSPEC!'
@@ -0,0 +1,34 @@
1
+ # Accessible::Bootstrap3::Rails
2
+
3
+ #### A gem to bring npm package bootstrap3-accessibility-patches into your rails project.
4
+
5
+ ## Installation
6
+
7
+ Add this line to your application's Gemfile:
8
+
9
+ ```ruby
10
+ gem 'accessible-bootstrap3-rails'
11
+ ```
12
+
13
+ And then execute:
14
+
15
+ $ bundle
16
+
17
+ Or install it yourself as:
18
+
19
+ $ gem install accessible-bootstrap3-rails
20
+
21
+ ## Usage
22
+
23
+ Add it and the jQuery dependency to your `application.js`:
24
+ ```
25
+ //= require accessible-bootstrap3/index
26
+ ```
27
+ ## If your already using 'jquery >=1.9.1 < 2.0.0' you can leave out the next line
28
+
29
+ `//= require jquery/dist/jquery.min.js`
30
+
31
+ ## Usage specs are specified in bootstrap3-accessibility-patches npm package.
32
+
33
+ > https://www.npmjs.com/package/bootstrap3-accessibility-patches
34
+
@@ -0,0 +1,10 @@
1
+ require "accessible/bootstrap3/rails/version"
2
+
3
+ module Accessible
4
+ module Bootstrap3
5
+ module Rails
6
+ class Engine < ::Rails::Engine
7
+ end
8
+ end
9
+ end
10
+ end
@@ -0,0 +1,10 @@
1
+ require 'json'
2
+
3
+ module Accessible
4
+ module Bootstrap3
5
+ module Rails
6
+ package_info = JSON.parse(File.read(File.expand_path('../../../../../accessible-bootstrap3-package.json', __FILE__)))
7
+ VERSION = package_info["version"]
8
+ end
9
+ end
10
+ end
data/package.json ADDED
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "accessible-bootstrap3-rails",
3
+ "version": "0.1.0",
4
+ "description": "A gem to bring the accessible-bootstrap3 npm package into your rails project ",
5
+ "main": "index.js",
6
+ "scripts": {
7
+ "test": "echo \"Error: no test specified\" && exit 1"
8
+ },
9
+ "author": "Brandon Howard <brandon@reax.io> (brandonrhoward.com)",
10
+ "license": "MIT",
11
+ "dependencies": {
12
+ "accessible-bootstrap3": "0.1.0",
13
+ "bootstrap3-accessibility-patches": "0.0.5"
14
+ }
15
+ }
@@ -0,0 +1,145 @@
1
+ $(document).ready(function() {
2
+ console.log("bootstrap3-accessibility-patches loaded.");
3
+
4
+ var getKeyCode = function(event) {
5
+ // Some browsers use keyCode and some use which.
6
+ // Return whichever one doesn't blow up.
7
+ return event.keyCode || event.which;
8
+ }
9
+ //////////////////////////////////////////////////////////////////
10
+ // This code removes the open class from a .dropdown menu,
11
+ // or adds {"display": "none"} css to .sub-menu menu
12
+ // after it && its children elements loose focus. Which in turn
13
+ // causes the dropdown menu to close or hide.
14
+ $('body').focusin(function(){
15
+ // remove open class from all .dropdown elements
16
+ $('.dropdown').removeClass('open');
17
+ // Set aria-expanded="false" after we close the dropdown.
18
+ $('.dropdown a.dropdown-toggle').attr("aria-expanded", false);
19
+ });
20
+
21
+ $('.dropdown').focusin(function(){
22
+ var children = $(this).children();
23
+
24
+ children.focusin(function(event) {
25
+ // stop the bubble up event from triggering
26
+ // the $('body').focusin function (line 16)
27
+ // This prevents the dropdown from collapsing while focus is
28
+ // on any of the children elements.
29
+ event.stopPropagation();
30
+ // Close sub-menu dropdown by adding display: none css.
31
+ $('.dropdown-submenu > ul.sub-menu').css({"display": "none"})
32
+ });
33
+ });
34
+
35
+ $('.dropdown-submenu').focusin(function(){
36
+ var children = $(this).children();
37
+
38
+ children.focusin(function(event) {
39
+ // stop the bubble up event from triggering
40
+ // the $('.dropdown').focusin function (line 21)
41
+ // This prevents the dropdown from collapsing while focus is
42
+ // on any of the children elements.
43
+ event.stopPropagation();
44
+ });
45
+ });
46
+ //////////////////////////////////////////////////////////////////
47
+
48
+ /// Toggle aria-expanded attribute for dropdown and submenus //////////
49
+ $(".dropdown-toggle").bind("click", function() {
50
+ var self = $(this);
51
+ var parent = self.parent('.dropdown');
52
+ expanded = !parent.hasClass("open");
53
+ self.attr("aria-expanded", expanded);
54
+ });
55
+
56
+ $("a.trigger").bind("click", function() {
57
+ var self = $(this);
58
+ var submenu = self.next(".sub-menu");
59
+ expanded = !(submenu.css("display") === "none");
60
+ self.attr("aria-expanded", expanded);
61
+ });
62
+ /////////////////////////////////////////////////////////////////////////
63
+
64
+ //// Modify keyboard defaults for dropdown menu and submenus.//////
65
+ $('.dropdown-toggle').keydown(function(event) {
66
+ var code = getKeyCode(event);
67
+ var thisDropdown = $(this).parent('.dropdown');
68
+ if ( !thisDropdown.hasClass('open') && (code == 27) ) {
69
+ // stop escape key from opening dropdown
70
+ event.stopPropagation();
71
+ // If space bar hit open or close dropdown
72
+ } else if (code === 32 ) {
73
+ event.preventDefault();
74
+ $(this).click()
75
+ }
76
+ });
77
+
78
+ $('.dropdown-submenu a.trigger').keydown(function(event) {
79
+ var code = getKeyCode(event);
80
+ var subMenu = $(this).next("ul.sub-menu");
81
+
82
+ if (code === 32 ) {
83
+ // Stop page scroll
84
+ event.preventDefault();
85
+ // Open and close submenu when space bar is hit.
86
+ subMenu.css('display') == "none" ? subMenu.css('display', 'block' ) : subMenu.css('display', 'none' )
87
+ }
88
+ });
89
+ ///////////////////////////////////////////////////////
90
+
91
+ //// Skip Navigation ////////////////////////////////////////////////////
92
+ // bind a click event to the 'skip' link
93
+ $("#skip-nav").click(function(event){
94
+
95
+ // strip the leading hash and declare
96
+ // the content we're skipping to
97
+ var skipTo="#"+this.href.split('#')[1];
98
+
99
+ // Setting 'tabindex' to -1 takes an element out of normal
100
+ // tab flow but allows it to be focused via javascript
101
+ $(skipTo).attr('tabindex', -1).on('blur focusout', function () {
102
+
103
+ // when focus leaves this element,
104
+ // remove the tabindex attribute
105
+ $(this).removeAttr('tabindex');
106
+
107
+ }).focus(); // focus on the content container
108
+ });
109
+ /////////////////////////////////////////////////////////////////////////
110
+
111
+ /// Prevent enter from submitting form //////////////////////////////////
112
+ $(document).on("keypress", "form", function (event) {
113
+ var code = getKeyCode(event);
114
+ // If target is <textarea> or submit return true and do NOT modify normal behavior.
115
+ if ($(event.target).is("textarea") || $(event.target).is("input:submit")) {return true}
116
+
117
+ if (code == 13 ) {
118
+ if ($(event.target).is("input:checkbox") || $(event.target).is("input:radio") ) {
119
+ event.preventDefault();
120
+ event.target.click();
121
+ return false
122
+ }
123
+ if ($(event.target).is("select")) {event.preventDefault(); mouseDown(event.target); return false}
124
+
125
+ tabIndexForward(event);
126
+ event.preventDefault();
127
+ }
128
+ });
129
+
130
+ //click element with virtual mouse.
131
+ var mouseDown = function (element) {
132
+ var event = document.createEvent('MouseEvents');
133
+ event.initMouseEvent('mousedown', true, true, window);
134
+ element.dispatchEvent(event);
135
+ };
136
+
137
+ // Move tab index forward one input inside the form an event originates.
138
+ var tabIndexForward = function(event) {
139
+ var inputs = $(event.target).parents("form").eq(0).find(":input:visible");
140
+ var idx = inputs.index(event.target);
141
+ // If at end of focusable elements move back to beginning, if not move forward one.
142
+ (idx == inputs.length - 1) ? inputs[0].focusin() : inputs[idx + 1].focus();
143
+ }
144
+ /////////////////////////////////////////////////////////////////////////
145
+ });