added imageRules and colorRules, and test HTML files

3 files changed, 119 insertions, 0 deletions

diff --git a/exampleData/ruleSets/colorRules.json b/exampleData/ruleSets/colorRules.json
new file mode 100644
index 0000000..5dfb7ca
--- /dev/null
+++ b/exampleData/ruleSets/colorRules.json
@@ -0,0 +1,53 @@
+{ 'name': "Colors are in a specified set"
+, 'description': "All background and foreground colors used on a page should be in a specificed set"
+, 'rules': [
+             { 'image-appears': "Foregrounds"
+             , 'description': "Foreground colors are in a specified set"
+             , 'rule':
+             function() { //----------------------------------------------
+               var allowableColors = { '#0': 1, '#FFFFFF': 1, '#3D3D3D': 1,
+                                       '#B4B4B4': 1, '#4E4E4E': 1, '#C2C2C2': 1,
+                                       '#F7F7F7': 1 };
+               fiveui.query(':visible').each(
+                   function(i, elt) {
+                     var color =  $(elt).css('color');
+                     // console.log('color: ' + color + ' --> ' + fiveui.colorToHex(color));
+                     if (!(fiveui.colorToHex(color) in allowableColors)) {
+                       report('Disallowed FOREground color appears');
+                     }
+                   });
+             } //---------------------------------------------------------
+             },//==============================================================
+             { 'image-appears': "Backgrounds"
+             , 'description': "Backgrounds colors are in a specified set"
+             , 'rule':
+             function() { //----------------------------------------------
+               var allowableColors = { '#0': 1, '#FFFFFF': 1,
+                                       '#3D3D3D': 1, '#B4B4B4': 1, '#4E4E4E': 1,
+                                       '#C2C2C2': 1 };
+               fiveui.query(':visible').each(
+                   function(i, elt) {
+                     var color =  $(elt).css('background-color');
+                     if (!(fiveui.colorToHex(color) in allowableColors)) {
+                       report('Disallowed BACKground color appears');
+                     }
+                   });
+             } //---------------------------------------------------------
+             },//==============================================================
+             { 'image-appears': "Content Area Color"
+             , 'description': "Content Area Color is #F7"
+             , 'rule':
+             //----------
+             function() {
+               var allowableColors = { '#F7F7F7': 1 };
+               fiveui.query("div[id='content'").each(
+                   function(i, elt) {
+                     var color =  $(elt).css('color');
+                     if (!(fiveui.colorToHex(color) in allowableColors)) {
+                       report('Invalid color in content area');
+                     }
+                   });
+             } //---------------------------------------------------------
+             } //==============================================================
+          ]
+}
diff --git a/exampleData/ruleSets/imageRules.json b/exampleData/ruleSets/imageRules.json
new file mode 100644
index 0000000..0ba8f77
--- /dev/null
+++ b/exampleData/ruleSets/imageRules.json
@@ -0,0 +1,34 @@
+{ 'name': "Image exists and links back to URL"
+, 'description': "A specific image file should be included in the page and link back to a specific URL"
+, 'rules': [
+             { 'image-appears': "Image appears on page"
+             , 'description': "A specific image should appear somewhere on the page."
+             , 'rule':
+             function() {
+                 var flag = false;
+                 fiveui.query("img[src$='star.jpeg']").each(function(i, elt) { flag = true; });
+                 if (!flag) {
+                   report('Image star.gif does not appear');
+                 }
+             }
+             },
+             { 'image-links-back': "Image links back"
+             , 'description': "Each instance of a specific image must link back to a specific URL"
+             , 'rule':
+             function() {
+               fiveui.query('a').has('img').each(
+                 function(i, elt) {
+                   fiveui.query('img', elt).each(
+                     function(j, elt2) {
+                       if (/star.jpeg$/.test(elt2['src']) && !/star/.test(elt['href'])) {
+                         report('Image star.jpeg does not link back to google');
+                       }
+                     }
+                   );
+                 }
+               );
+             }
+             }
+           ]
+}
+
diff --git a/exampleData/ruleSets/template.json b/exampleData/ruleSets/template.json
new file mode 100644
index 0000000..6a5a886
--- /dev/null
+++ b/exampleData/ruleSets/template.json
@@ -0,0 +1,32 @@
+{ 'name': "Colors are in a specified set"
+, 'description': "All background and foreground colors used on a page should be in a specificed set"
+, 'rules': [
+             { 'image-appears': "Foregrounds"
+             , 'description': "Foreground colors are in a specified set"
+             , 'rule':
+             function() {
+                 var allowableColors = [ '#000000', '#FFFFFF', '#3D3D3D', '#B4B4B4', '#4E4E4E', '#C2C2C2' ];
+                 fiveui.query('').each(
+                    function(i, elt) {
+                      if ($(elt).css('color') in allowableColors) {
+                        $(elt).addClass('reportColor');
+                      }
+                    });
+               }
+             },
+             { 'image-appears': "Backgrounds"
+             , 'description': "Backgrounds colors are in a specified set"
+             , 'rule':
+             function() {
+                 var allowableColors = [ 'transparent', '#000000', '#FFFFFF', '#3D3D3D', '#B4B4B4', '#4E4E4E', '#C2C2C2' ];
+                 fiveui.query('').each(
+                    function(i, elt) {
+                      if ($(elt).css('color') in allowableColors) {
+                        $(elt).addClass('reportBackColor');
+                      }
+                    });
+               }
+             }
+ 
+          ]
+}