mochikit_v14/tests/test_MochiKit-Visual.html

   1 <html>
   2 <head>
   3     <script type="text/javascript" src="../MochiKit/Base.js"></script>
   4     <script type="text/javascript" src="../MochiKit/Iter.js"></script>
   5     <script type="text/javascript" src="../MochiKit/DOM.js"></script>
   6     <script type="text/javascript" src="../MochiKit/Async.js"></script>
   7     <script type="text/javascript" src="../MochiKit/Style.js"></script>
   8     <script type="text/javascript" src="../MochiKit/Color.js"></script>
   9     <script type="text/javascript" src="../MochiKit/Signal.js"></script>
  10     <script type="text/javascript" src="../MochiKit/Position.js"></script>
  11     <script type="text/javascript" src="../MochiKit/Visual.js"></script>
  12     <script type="text/javascript" src="SimpleTest/SimpleTest.js"></script>
  13
  14     <link rel="stylesheet" type="text/css" href="SimpleTest/test.css">
  15     <style type="text/css">
  16     #elt1, #elt2, #ctn1 {
  17         visibility: hidden;
  18         font-size: 1em;
  19         margin: 2px;
  20     }
  21     #ctn1 {
  22         height: 2px;
  23     }
  24     </style>
  25 </head>
  26 <body>
  27
  28 <div id='elt1'>elt1</div>
  29 <div id='ctn1'><div id='elt2'></div></div>
  30 <pre id="test">
  31 <script type="text/javascript">
  32 try {
  33     var TestQueue = function () {
  34     };
  35
  36     TestQueue.prototype = new MochiKit.Visual.ScopedQueue();
  37
  38     MochiKit.Base.update(TestQueue.prototype, {
  39         startLoop: function (func, interval) {
  40             this.started = true;
  41             var timePos = new Date().getTime();
  42             while (this.started) {
  43                 timePos += interval;
  44                 MochiKit.Base.map(function (effect) {
  45                     effect.loop(timePos);
  46                 }, this.effects);
  47             }
  48         },
  49         stopLoop: function () {
  50             this.started = false;
  51         }
  52     });
  53
  54     var gl = new TestQueue();
  55     MochiKit.Visual.Queues.instances['global'] = gl;
  56     MochiKit.Visual.Queues.instances['elt1'] = gl;
  57     MochiKit.Visual.Queues.instances['ctn1'] = gl;
  58     MochiKit.Visual.Queue = gl;
  59
  60     pulsate("elt1", {afterFinish: function () {
  61         is(getElement('elt1').style.display != 'none', true, "pulsate ok");
  62     }});
  63
  64     pulsate("elt1", {pulses: 2, afterFinish: function () {
  65         is(getElement('elt1').style.display != 'none', true, "pulsate with numbered pulses ok");
  66     }});
  67
  68     shake("elt1", {afterFinish: function () {
  69         is(getElement('elt1').style.display != 'none', true, "shake ok");
  70     }});
  71
  72     fade("elt1", {afterFinish: function () {
  73         is(getElement('elt1').style.display, 'none', "fade ok");
  74     }});
  75
  76     appear("elt1", {afterFinish: function () {
  77         is(getElement('elt1').style.display != 'none', true, "appear ok");
  78     }});
  79
  80     toggle("elt1", "size", {afterFinish: function () {
  81         is(getElement('elt1').style.display, 'none', "toggle size ok");
  82     }});
  83
  84     toggle("elt1", "size", {afterFinish: function () {
  85         is(getElement('elt1').style.display != 'none', true, "toggle size reverse ok");
  86     }});
  87
  88     Morph("elt1", {"style": {"font-size": "2em"}, afterFinish: function () {
  89         is(getStyle("elt1", "font-size"), "2em", "Morph OK");
  90     }});
  91
  92     Morph("elt1", {"style": {"font-size": "1em", "margin-left": "4px"}, afterFinish: function () {
  93         is(getStyle("elt1", "font-size"), "1em", "Morph multiple (font) OK");
  94         is(getStyle("elt1", "margin-left"), "4px", "Morph multiple (margin) OK");
  95     }});
  96
  97     switchOff("elt1", {afterFinish: function () {
  98         is(getElement('elt1').style.display, 'none', "switchOff ok");
  99     }});
 100
 101     grow("elt1", {afterFinish: function () {
 102         is(getElement('elt1').style.display != 'none', true, "grow ok");
 103     }});
 104
 105     shrink("elt1", {afterFinish: function () {
 106         is(getElement('elt1').style.display, 'none', "shrink ok");
 107     }});
 108
 109     showElement('elt1');
 110     dropOut("elt1", {afterFinish: function () {
 111         is(getElement('elt1').style.display, 'none', "dropOut ok");
 112     }});
 113
 114     showElement('elt1');
 115     puff("elt1", {afterFinish: function () {
 116         is(getElement('elt1').style.display, 'none', "puff ok");
 117     }});
 118
 119     showElement('elt1');
 120     fold("elt1", {afterFinish: function () {
 121         is(getElement('elt1').style.display, 'none', "fold ok");
 122     }});
 123
 124     showElement('elt1');
 125     squish("elt1", {afterFinish: function () {
 126         is(getElement('elt1').style.display, 'none', "squish ok");
 127     }});
 128
 129     slideUp("ctn1", {afterFinish: function () {
 130         is(getElement('ctn1').style.display, 'none', "slideUp ok");
 131     }});
 132
 133     slideDown("ctn1", {afterFinish: function () {
 134         is(getElement('ctn1').style.display != 'none', true, "slideDown ok");
 135     }});
 136
 137     blindDown("ctn1", {afterFinish: function () {
 138         is(getElement('ctn1').style.display != 'none', true, "blindDown ok");
 139     }});
 140
 141     blindUp("ctn1", {afterFinish: function () {
 142         is(getElement('ctn1').style.display, 'none', "blindUp ok");
 143     }});
 144
 145     multiple(["elt1", "ctn1"], appear, {afterFinish: function (effect) {
 146         is(effect.element.style.display != 'none', true, "multiple ok");
 147     }});
 148
 149     var toTests = [roundElement, roundClass, tagifyText, Opacity, Move, Scale, Highlight, ScrollTo, Morph];
 150     for (var m in toTests) {
 151         toTests[m]("elt1");
 152         ok(true, toTests[m].NAME + " doesn't need 'new' keyword");
 153     }
 154     ok(true, "visual suite finished");
 155
 156 } catch (err) {
 157
 158     var s = "test suite failure!\n";
 159     var o = {};
 160     var k = null;
 161     for (k in err) {
 162         // ensure unique keys?!
 163         if (!o[k]) {
 164             s +=  k + ": " + err[k] + "\n";
 165             o[k] = err[k];
 166         }
 167     }
 168     ok ( false, s );
 169     SimpleTest.finish();
 170
 171 }
 172 </script>
 173 </pre>
 174 </body>
 175 </html>
 176