adding alt text capability for reference

Author: Lauren McCarthy

docs/yuidoc-p5-theme-src/scripts/tpl/item.html

@@ -4,7 +4,7 @@ <h3><%=item.name%><% if (item.isMethod) { %>()<% } %></h3>
 <div class="example">
   <h4>Example</h4>
 
-	<div class="example-content">
+	<div class="example-content" data-alt="<%= item.alt %>">
     <%= item.example %>
   </div>
 </div> 
@@ -13,6 +13,7 @@ <h4>Example</h4>
 
 <div class="description">
   <h4>Description</h4>
+
   <p><%= item.description %></p>
 
   <% if (item.module === 'p5.dom') { %>

docs/yuidoc-p5-theme-src/scripts/views/itemView.js

@@ -99,6 +99,21 @@ define([
         this.$el.html(itemHtml);
 
         renderCode();
+
+        // Hook up alt-text for examples
+        setTimeout(function() {
+          var alts = $('.example-content')[0];
+          if (alts) {
+            alts = $(alts).data('alt').split('\n');
+
+            var examples = $('.example_container canvas');
+            for (var i=0; i<alts.length; i++) {
+              if (i < examples.length) {
+                $(examples[i]).attr('alt', alts[i]);
+              }
+            }
+          }
+        }, 1000);
         Prism.highlightAll();
       }
 

src/color/creating_reading.js

@@ -115,6 +115,10 @@ p5.prototype.brightness = function(c) {
  *                                 (default is 0-100)
  * @return {Array}                 resulting color
  *
+ * @alt 
+ * This is alt text for example 1.
+ * This is alt text for example 2.
+ * This is alt text for example 3.
  * @example
  * <div>
  * <code>