From 6fd5e23080ba47bbf3d959e879d5ea3de80fe1bc Mon Sep 17 00:00:00 2001 From: Yvain Liechti Date: Sun, 15 Oct 2017 14:21:17 +0200 Subject: [PATCH 1/8] improve editor config --- .editorconfig | 3 +++ 1 file changed, 3 insertions(+) diff --git a/.editorconfig b/.editorconfig index d152092..af57bbd 100644 --- a/.editorconfig +++ b/.editorconfig @@ -7,3 +7,6 @@ charset = utf-8 trim_trailing_whitespace = true insert_final_newline = true indent_size = 4 + +[{package.json,.travis.yml}] +indent_size = 2 From a58476fc38ccdd9bba828d026102785d25a794b2 Mon Sep 17 00:00:00 2001 From: Yvain Liechti Date: Sun, 15 Oct 2017 14:26:47 +0200 Subject: [PATCH 2/8] replace jscs and jshint by eslint + rename main file as index.js --- .eslintrc.js | 280 ++++++++++++++++++ .gitignore | 1 + .jscsrc | 66 ----- .jshintrc | 29 -- ...y-accessible-accordion-aria.js => index.js | 4 +- package.json | 42 +-- 6 files changed, 307 insertions(+), 115 deletions(-) create mode 100644 .eslintrc.js create mode 100644 .gitignore delete mode 100644 .jscsrc delete mode 100644 .jshintrc rename jquery-accessible-accordion-aria.js => index.js (99%) diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..50c653b --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,280 @@ +module.exports = { + "env": { + "browser": true, + "commonjs": true, + "amd": true + }, + "extends": "eslint:recommended", + "rules": { + "accessor-pairs": "error", + "array-bracket-newline": "error", + "array-bracket-spacing": [ + "error", + "never" + ], + "array-callback-return": "error", + "array-element-newline": "off", + "arrow-body-style": "error", + "arrow-parens": "error", + "arrow-spacing": "error", + "block-scoped-var": "error", + "block-spacing": "error", + "brace-style": "off", + "callback-return": "error", + "camelcase": "off", + "capitalized-comments": [ + "error", + "never" + ], + "class-methods-use-this": "error", + "comma-dangle": "error", + "comma-spacing": [ + "error", + { + "after": true, + "before": false + } + ], + "comma-style": [ + "error", + "last" + ], + "complexity": "error", + "computed-property-spacing": [ + "error", + "never" + ], + "consistent-return": "error", + "consistent-this": "error", + "curly": "error", + "default-case": "error", + "dot-location": "error", + "dot-notation": "error", + "eol-last": "error", + "eqeqeq": "error", + "for-direction": "error", + "func-call-spacing": "error", + "func-name-matching": "error", + "func-names": [ + "error", + "never" + ], + "func-style": [ + "error", + "expression" + ], + "function-paren-newline": "error", + "generator-star-spacing": "error", + "getter-return": "error", + "global-require": "off", + "guard-for-in": "error", + "handle-callback-err": "error", + "id-blacklist": "error", + "id-length": "off", + "id-match": "error", + "indent": "error", + "indent-legacy": "error", + "init-declarations": "error", + "jsx-quotes": "error", + "key-spacing": "error", + "keyword-spacing": [ + "error", + { + "after": true, + "before": true + } + ], + "line-comment-position": "off", + "linebreak-style": [ + "error", + "unix" + ], + "lines-around-comment": "error", + "lines-around-directive": "off", + "max-depth": "error", + "max-len": "off", + "max-lines": "error", + "max-nested-callbacks": "error", + "max-params": "error", + "max-statements": "off", + "max-statements-per-line": "error", + "multiline-ternary": [ + "error", + "never" + ], + "new-cap": "error", + "new-parens": "error", + "newline-after-var": "off", + "newline-before-return": "error", + "newline-per-chained-call": "off", + "no-alert": "error", + "no-array-constructor": "error", + "no-await-in-loop": "error", + "no-bitwise": "error", + "no-buffer-constructor": "error", + "no-caller": "error", + "no-catch-shadow": "error", + "no-confusing-arrow": "error", + "no-continue": "error", + "no-div-regex": "error", + "no-duplicate-imports": "error", + "no-else-return": "error", + "no-empty-function": "error", + "no-eq-null": "error", + "no-eval": "error", + "no-extend-native": "error", + "no-extra-bind": "error", + "no-extra-label": "error", + "no-extra-parens": "off", + "no-floating-decimal": "error", + "no-implicit-coercion": "error", + "no-implicit-globals": "error", + "no-implied-eval": "error", + "no-inline-comments": "off", + "no-invalid-this": "off", + "no-iterator": "error", + "no-label-var": "error", + "no-labels": "error", + "no-lone-blocks": "error", + "no-lonely-if": "error", + "no-loop-func": "error", + "no-magic-numbers": "off", + "no-mixed-operators": "error", + "no-mixed-requires": "error", + "no-multi-assign": "error", + "no-multi-spaces": "error", + "no-multi-str": "error", + "no-multiple-empty-lines": "error", + "no-native-reassign": "error", + "no-negated-condition": "off", + "no-negated-in-lhs": "error", + "no-nested-ternary": "error", + "no-new": "error", + "no-new-func": "error", + "no-new-object": "error", + "no-new-require": "error", + "no-new-wrappers": "error", + "no-octal-escape": "error", + "no-param-reassign": "error", + "no-path-concat": "error", + "no-plusplus": "error", + "no-process-env": "error", + "no-process-exit": "error", + "no-proto": "error", + "no-prototype-builtins": "error", + "no-restricted-globals": "error", + "no-restricted-imports": "error", + "no-restricted-modules": "error", + "no-restricted-properties": "error", + "no-restricted-syntax": "error", + "no-return-assign": "error", + "no-return-await": "error", + "no-script-url": "error", + "no-self-compare": "error", + "no-sequences": "error", + "no-shadow": "error", + "no-shadow-restricted-names": "error", + "no-spaced-func": "error", + "no-sync": "error", + "no-tabs": "error", + "no-template-curly-in-string": "error", + "no-ternary": "off", + "no-throw-literal": "error", + "no-trailing-spaces": "error", + "no-undef-init": "error", + "no-undefined": "error", + "no-underscore-dangle": "error", + "no-unmodified-loop-condition": "error", + "no-unneeded-ternary": "error", + "no-unused-expressions": "error", + "no-use-before-define": "error", + "no-useless-call": "error", + "no-useless-computed-key": "error", + "no-useless-concat": "error", + "no-useless-constructor": "error", + "no-useless-rename": "error", + "no-useless-return": "error", + "no-var": "off", + "no-void": "error", + "no-warning-comments": "error", + "no-whitespace-before-property": "error", + "no-with": "error", + "nonblock-statement-body-position": "error", + "object-curly-newline": "off", + "object-curly-spacing": "error", + "object-property-newline": "error", + "object-shorthand": "error", + "one-var": "off", + "one-var-declaration-per-line": "error", + "operator-assignment": "error", + "operator-linebreak": "error", + "padded-blocks": "off", + "padding-line-between-statements": "error", + "prefer-arrow-callback": "off", + "prefer-const": "error", + "prefer-destructuring": "error", + "prefer-numeric-literals": "error", + "prefer-promise-reject-errors": "error", + "prefer-reflect": "error", + "prefer-rest-params": "error", + "prefer-spread": "error", + "prefer-template": "off", + "quote-props": "off", + "quotes": [ + "error", + "single" + ], + "radix": "error", + "require-await": "error", + "require-jsdoc": "error", + "rest-spread-spacing": "error", + "semi": "error", + "semi-spacing": "error", + "semi-style": [ + "error", + "last" + ], + "sort-imports": "error", + "sort-keys": "off", + "sort-vars": "error", + "space-before-blocks": "error", + "space-before-function-paren": "off", + "space-in-parens": [ + "error", + "never" + ], + "space-infix-ops": "error", + "space-unary-ops": [ + "error", + { + "nonwords": false, + "words": false + } + ], + "spaced-comment": [ + "error", + "always" + ], + "strict": [ + "error", + "function" + ], + "switch-colon-spacing": "error", + "symbol-description": "error", + "template-curly-spacing": "error", + "template-tag-spacing": "error", + "unicode-bom": [ + "error", + "never" + ], + "valid-jsdoc": "error", + "vars-on-top": "off", + "wrap-iife": "error", + "wrap-regex": "error", + "yield-star-spacing": "error", + "yoda": [ + "error", + "never" + ] + } +}; diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3c3629e --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +node_modules diff --git a/.jscsrc b/.jscsrc deleted file mode 100644 index ea5be1d..0000000 --- a/.jscsrc +++ /dev/null @@ -1,66 +0,0 @@ -{ - "disallowEmptyBlocks": true, - "disallowImplicitTypeConversion": ["binary", "string"], - "disallowKeywords": ["eval"], - "disallowMixedSpacesAndTabs": true, - "disallowMultipleLineStrings": true, - "disallowNewlineBeforeBlockStatements": true, - "disallowOperatorBeforeLineBreak": ["."], - "disallowPaddingNewlinesBeforeKeywords": ["catch"], - "disallowPaddingNewlinesInBlocks": true, - "disallowSpaceAfterPrefixUnaryOperators": true, - "disallowSpaceBeforeComma": true, - "disallowSpaceBeforePostfixUnaryOperators": true, - "disallowSpacesInCallExpression": true, - "disallowSpacesInFunctionDeclaration": { - "beforeOpeningRoundBrace": true - }, - "disallowSpacesInNamedFunctionExpression": { - "beforeOpeningRoundBrace": true - }, - "disallowSpacesInsideParentheses": true, - "disallowSpacesInsideParenthesizedExpression": true, - "disallowTrailingComma": true, - "disallowTrailingWhitespace": true, - "disallowYodaConditions": true, - - "requireBlocksOnNewline": 1, - "requireCapitalizedConstructors": true, - "requireCamelCaseOrUpperCaseIdentifiers": true, - "requireCommaBeforeLineBreak": true, - "requireCurlyBraces": true, - "requireKeywordsOnNewLine": ["for", "while"], - "requireLineFeedAtFileEnd": true, - "requireOperatorBeforeLineBreak": [ - "?", ":", "=", "+", "-", "/", "*", "==", "===", - "!=","!==", ">", ">=", "<", "<=", "&&", "||" - ], - "requirePaddingNewLinesAfterUseStrict": true, - "requireParenthesesAroundIIFE": true, - "requireSemicolons": true, - "requireSpaceAfterBinaryOperators": true, - "requireSpaceAfterKeywords": true, - "requireSpaceBeforeBinaryOperators": true, - "requireSpaceBeforeBlockStatements": true, - "requireSpaceBeforeObjectValues": true, - "requireSpaceBetweenArguments": true, - "requireSpacesInConditionalExpression": true, - "requireSpacesInFunction": { - "beforeOpeningCurlyBrace": true - }, - "requireSpacesInAnonymousFunctionExpression" : { - "beforeOpeningRoundBrace": true, - "beforeOpeningCurlyBrace": true - }, - "requireSpacesInForStatement": true, - - "validateIndentation": 2, - "validateLineBreaks": "LF", - "validateQuoteMarks": "'", - - "disallowNodeTypes": [ - "EmptyStatement", - "SwitchStatement", - "WithStatement" - ] -} diff --git a/.jshintrc b/.jshintrc deleted file mode 100644 index 7d8f49b..0000000 --- a/.jshintrc +++ /dev/null @@ -1,29 +0,0 @@ -{ - "globals": {}, - - "browser" : true, - "browserify" : true, - "module" : true, - - "esversion" : 6, - "strict" : "global", - "latedef" : true, - "undef" : true, - "bitwise" : true, - "curly" : true, - "eqeqeq" : true, - "eqnull" : true, - "unused" : true, - "noarg" : true, - "trailing" : true, - "nonbsp" : true, - "forin" : true, - "iterator" : true, - "nocomma" : true, - "nonew" : true, - "notypeof" : true, - "shadow" : false, - "singleGroups": true, - "lastsemic" : true, - "plusplus" : true -} diff --git a/jquery-accessible-accordion-aria.js b/index.js similarity index 99% rename from jquery-accessible-accordion-aria.js rename to index.js index eb065b0..3aaf7e8 100644 --- a/jquery-accessible-accordion-aria.js +++ b/index.js @@ -1,6 +1,6 @@ /* * jQuery Accessible Accordion system, using ARIA - * @version v2.4.4 + * @version v2.4.4 * Website: https://a11y.nicolas-hoffmann.net/accordion/ * License MIT: https://github.com/nico3333fr/jquery-accessible-accordion-aria/blob/master/LICENSE */ @@ -11,7 +11,7 @@ } else if (typeof exports !== 'undefined') { module.exports = factory(require('jquery')); } else { - factory(jQuery); + factory(window.jQuery); } }(function($) { 'use strict'; diff --git a/package.json b/package.json index 2c56abf..dd9a0f7 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,17 @@ "name": "jquery-accessible-accordion-aria", "description": "This jQuery plugin will provide you an accessible Accordion System, using ARIA", "version": "2.4.4", - "main": "jquery-accessible-accordion-aria.js", + "main": "index.js", + "homepage": "https://a11y.nicolas-hoffmann.net/accordion/", + "bugs": { + "web": "https://github.com/nico3333fr/jquery-accessible-accordion-aria/issues" + }, + "repositories": [ + { + "type": "git", + "url": "https://github.com/nico3333fr/jquery-accessible-accordion-aria.git" + } + ], "keywords": [ "Accessibility", "ARIA", @@ -11,6 +21,12 @@ "a11y", "jQuery Plugin" ], + "licenses": [ + { + "name": "MIT", + "url": "https://github.com/nico3333fr/jquery-accessible-accordion-aria/blob/master/LICENSE" + } + ], "author": [ { "name": "Nicolas Hoffmann", @@ -18,23 +34,13 @@ "web": "https://www.nicolas-hoffmann.net/" } ], - "dependencies": { - "jquery": ">=1.0.0" + "scripts" : { + "test" : "eslint index.js" }, - "bugs": { - "web": "https://github.com/nico3333fr/jquery-accessible-accordion-aria/issues" + "devDependencies": { + "eslint": "^4.8.0" }, - "repositories": [ - { - "type": "git", - "url": "https://github.com/nico3333fr/jquery-accessible-accordion-aria.git" - } - ], - "licenses": [ - { - "name": "MIT", - "url": "https://github.com/nico3333fr/jquery-accessible-accordion-aria/blob/master/LICENSE" - } - ], - "homepage": "https://a11y.nicolas-hoffmann.net/accordion/" + "dependencies": { + "jquery": ">=1.0.0" + } } From 6ea785a4b3e8e5948287d3fa11238ea234110899 Mon Sep 17 00:00:00 2001 From: Yvain Liechti Date: Sun, 15 Oct 2017 14:27:46 +0200 Subject: [PATCH 3/8] remove useless trailing space from legacy js add add a warning at top of the file --- ...-accessible-accordion-aria-legacy-1.2.0.js | 57 ++++++++++--------- 1 file changed, 29 insertions(+), 28 deletions(-) diff --git a/jquery-accessible-accordion-aria-legacy-1.2.0.js b/jquery-accessible-accordion-aria-legacy-1.2.0.js index 5d88dfc..c07a3a6 100644 --- a/jquery-accessible-accordion-aria-legacy-1.2.0.js +++ b/jquery-accessible-accordion-aria-legacy-1.2.0.js @@ -1,3 +1,4 @@ +// This file is kept only for historical prupose, don’t use it. $(document).ready(function(){ /* @@ -7,8 +8,8 @@ $(document).ready(function(){ */ var $accordions = $( ".js-accordion" ); if ( $accordions.length ) { // if there are at least one :) - - // init + + // init $accordions.each( function( index ) { var $this = $( this ); $options = $this.data(), @@ -16,29 +17,29 @@ $(document).ready(function(){ $accordions_prefix_classes = $options.accordionPrefixClasses || '', $accordions_multiselectable = $options.accordionMultiselectable || '', $index_accordion = index+1 ; - + $this.attr({ "role": "tablist", "aria-multiselectable": "true", "class": $accordions_prefix_classes }); - + // multiselectable or not if ($accordions_multiselectable === "none") { $this.attr( "aria-multiselectable", "false" ); } - + $accordions_headers.each( function( index_h ) { var $that = $( this ), $text = $that.text(), $accordion_panel = $that.next( ".js-accordion__panel" ), $index_header = index_h+1 ; - + $accordion_panel.prepend( $that.removeClass( "js-accordion__header" ).addClass( $accordions_prefix_classes + "__title" ).attr( "tabindex", "0") ); - + $accordion_header = $( '' ); - $accordion_panel.before( $accordion_header ); - + $accordion_panel.before( $accordion_header ); + $accordion_header.attr({ "aria-controls": "accordion" + $index_accordion + "_panel" + $index_header, "aria-expanded": "false", @@ -53,35 +54,35 @@ $(document).ready(function(){ "id": "accordion" + $index_accordion + "_panel" + $index_header, "aria-hidden": "true" }).addClass( $accordions_prefix_classes + "__panel" ); - + // if opened by default if ( $that.attr( "data-accordion-opened" ) == "true" ) { $accordion_header.attr( "aria-expanded", "true" ).removeAttr( "data-accordion-opened" ); $accordion_panel.attr( "aria-hidden", "false" ); } - + // init first one focusable if ( $index_header === 1 ) { $accordion_header.removeAttr( "tabindex" ); } - - }); + + }); }); - + /* Events ---------------------------------------------------------------------------------------------------------- */ /* click on a tab link */ $( "body" ).on( "focus", ".js-accordion__header", function( event ) { var $this = $( this ), $accordion = $this.parent(), $all_accordion_headers = $accordion.find( ".js-accordion__header" ); - + // selected $all_accordion_headers.attr({ "tabindex": "-1", "aria-selected": "false" }); $this.attr( "aria-selected", "true" ).removeAttr( "tabindex" ); - + }) .on( "click", ".js-accordion__header", function( event ) { var $this = $( this ), @@ -90,10 +91,10 @@ $(document).ready(function(){ $accordion_multiselectable = $accordion.attr( "aria-multiselectable" ), $all_accordion_headers = $accordion.find( ".js-accordion__header" ), $all_accordion_panels = $accordion.find( ".js-accordion__panel" ); - + $all_accordion_headers.attr( "aria-selected", "false" ); $this.attr( "aria-selected", "true" ); - + // opened or closed? if ( $this.attr( "aria-expanded" ) == "false" ) { // closed $this.attr( "aria-expanded", "true" ); @@ -103,15 +104,15 @@ $(document).ready(function(){ $this.attr( "aria-expanded", "false" ); $this_panel.attr( "aria-hidden", "true" ); } - + if ( $accordion_multiselectable == "false" ){ $all_accordion_panels.not( $this_panel ).attr( "aria-hidden", "true" ); $all_accordion_headers.not( $this ).attr( "aria-expanded", "false" ); } - + setTimeout(function(){ $this.focus(); }, 0); event.preventDefault(); - + }) .on( "keydown", ".js-accordion__header", function( event ) { var $this = $( this ), @@ -121,7 +122,7 @@ $(document).ready(function(){ $last_header = $accordion.find( ".js-accordion__header" ).last(), $prev_header = $this.prevAll( ".js-accordion__header" ).first(), $next_header = $this.nextAll( ".js-accordion__header" ).first(); - + // strike up or left in the tab => previous tab if ( ( event.keyCode == 37 || event.keyCode == 38 ) && !event.ctrlKey ) { $all_accordion_headers.attr({ @@ -187,7 +188,7 @@ $(document).ready(function(){ $prev_header = $this_header.prevAll( ".js-accordion__header" ).first(), $next_header = $this_header.nextAll( ".js-accordion__header" ).first(), $last_header = $accordion.find( ".js-accordion__header" ).last(); - + // strike up + ctrl => go to header if ( event.keyCode == 38 && event.ctrlKey ) { setTimeout(function(){ $this_header.focus(); }, 0); @@ -215,11 +216,11 @@ $(document).ready(function(){ event.preventDefault(); } } - + }); - - + + } - - + + }); From 0950934a66b0e2e20f9dcecdeb7256bc38ca8e4f Mon Sep 17 00:00:00 2001 From: Yvain Liechti Date: Sun, 15 Oct 2017 14:29:22 +0200 Subject: [PATCH 4/8] add npmignore to not download usless files when this package is instaled as dependency --- .npmignore | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .npmignore diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..0d0d247 --- /dev/null +++ b/.npmignore @@ -0,0 +1,6 @@ +.editorconfig +.travis.yml +.eslint.js +bower.json +*-legacy.js +docs From 16766f988308f36f85a7a56e79dbd0ffcf50e015 Mon Sep 17 00:00:00 2001 From: Yvain Liechti Date: Sun, 15 Oct 2017 14:30:16 +0200 Subject: [PATCH 5/8] add a simple travis file to run lint test on pull request --- .travis.yml | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 .travis.yml diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 0000000..58b2563 --- /dev/null +++ b/.travis.yml @@ -0,0 +1,4 @@ +language: node_js +node_js: + - "6.10" + - "stable" From 33d1d52c9aa1f927aac34bc6a25f9b6c05e24b15 Mon Sep 17 00:00:00 2001 From: Yvain Liechti Date: Wed, 18 Oct 2017 23:32:41 +0200 Subject: [PATCH 6/8] fix keyboard navigation in nested accordian --- .editorconfig | 2 +- bower.json | 4 +- docs/sample-nested.html | 101 ++++++++++++++++++++++++++++++++++++++++ docs/sample.html | 5 +- index.js | 28 +++++------ package.json | 6 +-- 6 files changed, 119 insertions(+), 27 deletions(-) create mode 100644 docs/sample-nested.html diff --git a/.editorconfig b/.editorconfig index af57bbd..a298b2a 100644 --- a/.editorconfig +++ b/.editorconfig @@ -8,5 +8,5 @@ trim_trailing_whitespace = true insert_final_newline = true indent_size = 4 -[{package.json,.travis.yml}] +[{*.html,package.json,.travis.yml}] indent_size = 2 diff --git a/bower.json b/bower.json index 9b5d33c..364cb8e 100644 --- a/bower.json +++ b/bower.json @@ -1,7 +1,7 @@ { "title": "jQuery Accessible Accordion system, using ARIA", "name": "jquery-accessible-accordion-aria", - "version": "2.4.4", + "version": "2.4.5", "main": "jquery-accessible-accordion-aria.js", "description": "This jQuery plugin will provide you an accessible Accordion System, using ARIA", "author": [ @@ -26,7 +26,5 @@ ], "dependencies": { "jquery": ">=1.0.0" - }, - "devDependencies": { } } diff --git a/docs/sample-nested.html b/docs/sample-nested.html new file mode 100644 index 0000000..cbc93da --- /dev/null +++ b/docs/sample-nested.html @@ -0,0 +1,101 @@ + + + +Accordion example + + + + + + + + + + + + + + +
+

Example of nested accordions

+ +
+
+

First tab

+

Content of 1st tab

+
+
+

Second tab

+

Content of 2nd tab

+ +
+
+

First tab

+

Content of 1st tab

+
+
+

Second tab

+

Content of 2nd tab

+
+
+

Third tab

+

Content of 3rd tab

+
+
+
+
+

Third tab

+

Content of 3rd tab

+
+
+ +


+ Design pattern +

+ jQuery Accessible tab panel system, using ARIA + +
+ + diff --git a/docs/sample.html b/docs/sample.html index 6643a67..e9ea35e 100644 --- a/docs/sample.html +++ b/docs/sample.html @@ -8,9 +8,8 @@ - - +