aboutsummaryrefslogtreecommitdiff
path: root/exampleData/ruleSets/image/imageRules.json
blob: 86ab3fd5509a5cc7a7b6e0910c98a34b02572549 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
/*
 * imageRules.json
 *
 * Simple rules for checking that specific images appear on a page, that specific images
 * link back to specific URLs, and that image sizes fall into a proscribed set.
 *
 * Test using exampleData/basic/testImageRules.html
 */

{ 'name': 'Image Rules'
, 'description': 'General guidelines regarding site images'
, 'rules': [
  //----------------------------------------------------------------
  { 'id': 8120001
  , 'name': 'Banner check'
  , 'description': 'Banner image banner.gif must appear and link to somewhere'
  , 'severity': 1
  , 'rule':
  function() {
      var elt = $5('div[id=header]');          // get the div with id=header
      var b = $5(elt).css('background');       // get its background CSS property
      var l = $5('a[href]', elt).prop('href'); // get the <a href=...> string inside the div
      if (/banner\.gif/.test(b)) {
        report('banner.gif missing', elt);
      }
      if (l === null || l.length == 0) {
        report('banner.gif link is missing', elt);
      }
  }
  },
  //----------------------------------------------------------------
  { 'id': 8120002
  , 'name': 'Image Size check'
  , 'description': 'All site images should have height and width in a given set of choices'
  , 'severity': 2
  , 'rule':
  function() {
    var allowedDimensions = { 446: { 300: {}}               // allow any image with these height:width pairs
                            , 342: { 228: {}}
                            , 150: { 100: {}} };
    var specialWidths = { 640: {}                       // allow any image with these special widths
                            , 100: {} };
    $5('img').not('div.filmstrip *')                        // skip filmstrip images
             .each(function(i, elt) {
      var borderStr = /^[0-9]+/.exec($(elt).css('border')); // compensate for image border
      var border = borderStr ? parseInt(borderStr[0]) : 0;
      var w = $(elt).width() + 2 * border;
      var h = $(elt).height() + 2 * border;
      if (!((w in specialWidths) ||
            (h in allowedDimensions && w in allowedDimensions[h]))) {
        report('non-standard dimensions ' + h + 'x' + w, elt);
      }
    });
  }
  },
  //----------------------------------------------------------------
  { 'id': 8120003
  , 'name': 'Image Border check'
  , 'description': 'All site images should have 1px solid #3D border'
  , 'severity': 1
  , 'rule':
  function() {
    // select out first two words of the input
    var norm = function(s) {
      if (/^\w+\s+\w+/.exec(s))
        return /^\w+\s+\w+/.exec(s)[0];
      else
        return 'null null';
    };
    var imgs = $5('img').not('div.filmstrip *');         // select images not in the filmstrip
    imgs.cssIsNot('border', '1px solid', norm)
        .each(function(i, elt) {
          report('non-standard border style', elt);
        });
    imgs.cssIsNot('border-color', '#3D3D3D', fiveui.color.colorToHex)
        .each(function(i, elt) {
          report('non-standard border color', elt);
        });
  }
  }//,
  //----------------------------------------------------------------
]
}