From 7decb0f1f2cb4a662771550c37ba7fb7923868a3 Mon Sep 17 00:00:00 2001
From: jeri <jeri.elizabeth@gmail.com>
Date: Thu, 26 Feb 2015 10:20:24 -0500
Subject: [PATCH] added aria landmarks and skipnav

---
 common/footer.php      |  3 ++-
 common/header.php      |  9 +++++----
 css/sass/_screen.scss  | 21 ++++++++++++++++++++-
 css/style.css          | 21 +++++++++++++++++++++
 javascripts/globals.js |  6 ++++++
 5 files changed, 54 insertions(+), 6 deletions(-)

diff --git a/common/footer.php b/common/footer.php
index 264990c..b1f9694 100644
--- a/common/footer.php
+++ b/common/footer.php
@@ -3,7 +3,7 @@
     </div><!-- end wrap -->
 
 
-    <footer>
+    <footer role="contentinfo">
 
         <div id="footer-text">
             <?php echo get_theme_option('Footer Text'); ?>
@@ -22,6 +22,7 @@
         Omeka.showAdvancedForm();
         Omeka.moveNavOnResize();
         Omeka.mobileMenu();
+        Omeka.skipnav();
     });
     </script>
 
diff --git a/common/header.php b/common/header.php
index a96f7ee..56d92c7 100644
--- a/common/header.php
+++ b/common/header.php
@@ -96,9 +96,10 @@
     ?>
 </head>
 <?php echo body_tag(array('id' => @$bodyid, 'class' => @$bodyclass)); ?>
+    <a href="#content" id="skipnav"><?php echo __('Skip to main content'); ?></a>
     <?php fire_plugin_hook('public_body', array('view'=>$this)); ?>
 
-        <header>
+        <header role="banner">
             <?php fire_plugin_hook('public_header', array('view'=>$this)); ?>
             <div id="site-title"><?php echo link_to_home_page(theme_logo()); ?></div>
         </header>
@@ -106,9 +107,9 @@
         <div class="menu-button button">Menu</div>
             
         <div id="wrap">
-            <nav id="primary-nav">
+            <nav id="primary-nav" role="navigation">
                 <?php echo public_nav_main(array('role' => 'navigation')); ?>
-                <div id="search-wrap">
+                <div id="search-wrap" role="search">
                     <?php if (get_theme_option('use_advanced_search') === null || get_theme_option('use_advanced_search')): ?>
                     <?php echo search_form(array('show_advanced' => true)); ?>
                     <?php else: ?>
@@ -116,5 +117,5 @@
                     <?php endif; ?>
                 </div>
             </nav>
-            <div id="content">
+            <div id="content" role="main" tabindex="-1">
                 <?php fire_plugin_hook('public_content_top', array('view'=>$this)); ?>
diff --git a/css/sass/_screen.scss b/css/sass/_screen.scss
index ccd5aea..916e543 100644
--- a/css/sass/_screen.scss
+++ b/css/sass/_screen.scss
@@ -99,7 +99,26 @@ blockquote {
         right: 2.6667em;
     }
 }
+#skipnav {
+    border: 0;
+    clip: rect(0, 0, 0, 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+}
 
+#skipnav:focus {
+    top:0;
+    z-index:9999;
+    clip:initial;
+    height:auto;
+    width:auto;
+    padding:.5em;
+    border:1px blue dashed;
+}
 /* @end */
 
 /* @group ----- Reusable classes ----- */
@@ -1515,4 +1534,4 @@ input[type="button"],
     height: auto;
 }
 
-/* @end */
\ No newline at end of file
+/* @end */
diff --git a/css/style.css b/css/style.css
index 756892f..3f9312a 100644
--- a/css/style.css
+++ b/css/style.css
@@ -469,6 +469,27 @@ table {
     margin-right: 2.6667em;
   }
 
+  #skipnav {
+    border: 0;
+    clip: rect(0, 0, 0, 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+  }
+
+  #skipnav:focus {
+    top: 0;
+    z-index: 9999;
+    clip: initial;
+    height: auto;
+    width: auto;
+    padding: .5em;
+    border: 1px blue dashed;
+  }
+
   /* @end */
   /* @group ----- Reusable classes ----- */
   .active {
diff --git a/javascripts/globals.js b/javascripts/globals.js
index 86924bf..ff03004 100644
--- a/javascripts/globals.js
+++ b/javascripts/globals.js
@@ -91,4 +91,10 @@ if (!Omeka) {
         });
     };
     
+    Omeka.skipnav = function() {
+        $("#skipnav").click(function() {
+            $("#content").focus()
+        });
+    };
+    
 })(jQuery);