OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <meta charset="UTF-8"> |
| 3 <style> |
| 4 .target { |
| 5 color: white; |
| 6 width: 100px; |
| 7 height: 100px; |
| 8 background-color: black; |
| 9 display: inline-block; |
| 10 overflow: hidden; |
| 11 } |
| 12 .replica { |
| 13 background-color: green; |
| 14 } |
| 15 .target div { |
| 16 width: 10px; |
| 17 height: 10px; |
| 18 display: inline-block; |
| 19 background: orange; |
| 20 margin: 1px; |
| 21 } |
| 22 .test { |
| 23 overflow: hidden; |
| 24 } |
| 25 </style> |
| 26 <body> |
| 27 <template id="target-template"> |
| 28 <div></div> |
| 29 </template> |
| 30 <script src="../testharness/testharness.js"></script> |
| 31 <script src="../testharness/testharnessreport.js"></script> |
| 32 <script src="resources/interpolation-test.js"></script> |
| 33 <script> |
| 34 |
| 35 assertInterpolation({ |
| 36 property: 'transform', |
| 37 from: 'matrix(5, 6, 10, 7, 21, 23)', |
| 38 to: 'matrix(8, 4, 9, 11, 24, 22)' |
| 39 }, [ |
| 40 {at: -1, is: 'matrix(-21.971399357258385, -10.985699678629187, -50.57889827616
046, -38.946928317003575, 18, 24)'}, |
| 41 {at: 0, is: 'matrix(5, 6, 10, 7, 21, 23)'}, |
| 42 {at: 0.25, is: 'matrix(1.5045862850823934, 2.1375701058706307, 1.9887759643453
702, 1.2132035030840276, 21.75, 22.75)'}, |
| 43 {at: 0.75, is: 'matrix(3.1847985591364396, 1.2803008685850275, 4.4228208119507
615, 5.537010031441669, 23.25, 22.25)'}, |
| 44 {at: 1, is: 'matrix(8, 4, 9, 11, 24, 22)'}, |
| 45 {at: 2, is: 'matrix(-16.45196668627737, -19.74236002353284, -18.81066272622538
, 0.5900238929654478, 27, 21)'}, |
| 46 ]); |
| 47 assertInterpolation({ |
| 48 property: 'transform', |
| 49 from: 'matrix(43.30127018922194, 30, -17.5, 36.373066958946424, 31, 33)', |
| 50 to: 'matrix(36, 31.17691453623979, -76.2102355330306, 22, 34, 32)' |
| 51 }, [ |
| 52 {at: -1, is: 'matrix(50.66971090528417, 27.756474621427802, 4.860028812048279,
17.73232844681859, 28, 34)'}, |
| 53 {at: 0, is: 'matrix(43.30127018922194, 30, -17.5, 36.373066958946424, 31, 33)'
}, |
| 54 {at: 0.25, is: 'matrix(41.46349186018549, 30.39211289511227, -29.1289154613291
93, 36.33246246588023, 31.75, 32.75)'}, |
| 55 {at: 0.75, is: 'matrix(37.81039134763866, 30.97972596106563, -58.6460998010611
8, 29.322678715217965, 33.25, 32.25)'}, |
| 56 {at: 1, is: 'matrix(36, 31.17691453623979, -76.2102355330306, 22, 34, 32)'}, |
| 57 {at: 2, is: 'matrix(28.9236870855142, 31.34124716880554, -160.89841710117557,
-36.69885507392111, 37, 31)'}, |
| 58 ]); |
| 59 assertInterpolation({ |
| 60 property: 'transform', |
| 61 from: 'none', |
| 62 to: 'matrix3d(1.0806046117362795, 0, -1.682941969615793, 0, 0, 3, 0, 0, 3.3658
83939231586, 0, 2.161209223472559, 0, 0, 0, 0, 1)' |
| 63 }, [ |
| 64 {at: -1, is: 'matrix3d(0, 0, 0, 0, 0, -1, 0, 0, 1.682941969615793, 0, -1.08060
46117362795, 0, 0, 0, 0, 1)'}, |
| 65 {at: 0, is: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)'}, |
| 66 {at: 0.25, is: 'matrix3d(1.211140527138306, 0, -0.30925494906815365, 0, 0, 1.5
, 0, 0, 0.43295692869541513, 0, 1.6955967379936283, 0, 0, 0, 0, 1)'}, |
| 67 {at: 0.75, is: 'matrix3d(1.2804555205291865, 0, -1.1928678300408346, 0, 0, 2.5
, 0, 0, 2.215325970075836, 0, 2.377988823839918, 0, 0, 0, 0, 1)'}, |
| 68 {at: 1, is: 'matrix3d(1.0806046117362795, 0, -1.682941969615793, 0, 0, 3, 0, 0
, 3.365883939231586, 0, 2.161209223472559, 0, 0, 0, 0, 1)'}, |
| 69 {at: 2, is: 'matrix3d(-1.2484405096414273, 0, -2.727892280477045, 0, 0, 5, 0,
0, 6.365081987779772, 0, -2.9130278558299967, 0, 0, 0, 0, 1)'}, |
| 70 ]); |
| 71 assertInterpolation({ |
| 72 property: 'transform', |
| 73 from: 'matrix3d(1.0806046117362795, 0, -1.682941969615793, 0, 0, 3, 0, 0, 3.36
5883939231586, 0, 2.161209223472559, 0, 0, 0, 0, 1)', |
| 74 to: 'none' |
| 75 }, [ |
| 76 {at: -1, is: 'matrix3d(-1.2484405096414273, 0, -2.727892280477045, 0, 0, 5, 0,
0, 6.365081987779772, 0, -2.9130278558299967, 0, 0, 0, 0, 1)'}, |
| 77 {at: 0, is: 'matrix3d(1.0806046117362795, 0, -1.682941969615793, 0, 0, 3, 0, 0
, 3.365883939231586, 0, 2.161209223472559, 0, 0, 0, 0, 1)'}, |
| 78 {at: 0.25, is: 'matrix3d(1.2804555205291865, 0, -1.1928678300408346, 0, 0, 2.5
, 0, 0, 2.215325970075836, 0, 2.377988823839918, 0, 0, 0, 0, 1)'}, |
| 79 {at: 0.75, is: 'matrix3d(1.211140527138306, 0, -0.30925494906815365, 0, 0, 1.5
, 0, 0, 0.43295692869541513, 0, 1.6955967379936283, 0, 0, 0, 0, 1)'}, |
| 80 {at: 1, is: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)'}, |
| 81 {at: 2, is: 'matrix3d(0, 0, 0, 0, 0, -1, 0, 0, 1.682941969615793, 0, -1.080604
6117362795, 0, 0, 0, 0, 1)'}, |
| 82 ]); |
| 83 assertInterpolation({ |
| 84 property: 'transform', |
| 85 from: 'matrix3d(2.3505561943, 0.0, 0.0, 0.0, 0.0, 2.6068943664, 0.0, 0.0, 0.0,
0.0, 2.6591082592, 0.0, 20.3339914256, 20.6709033765, 20.9147808456, 1.0)', |
| 86 to: 'matrix3d(2.7133590938, 0.0, 0.0, 0.0, 0.0, 2.4645137761, 0.0, 0.0, 0.0, 0
.0, 2.801687476, 0.0, 20.4335882254, 20.2330661998, 20.4583968206, 1.0)' |
| 87 }, [ |
| 88 {at: -1, is: 'matrix3d(1.9877532948000005, 0.0, 0.0, 0.0, 0.0, 2.7492749567000
003, 0.0, 0.0, 0.0, 0.0, 2.5165290423999997, 0.0, 20.2343946258, 21.1087405532,
21.371164870599998, 1.0)'}, |
| 89 {at: 0, is: 'matrix3d(2.3505561943, 0.0, 0.0, 0.0, 0.0, 2.6068943664, 0.0, 0.0
, 0.0, 0.0, 2.6591082592, 0.0, 20.3339914256, 20.6709033765, 20.9147808456, 1.0)
'}, |
| 90 {at: 0.25, is: 'matrix3d(2.441256919175, 0.0, 0.0, 0.0, 0.0, 2.571299218825, 0
.0, 0.0, 0.0, 0.0, 2.6947530634, 0.0, 20.35889062555, 20.561444082325, 20.800684
839349998, 1.0)'}, |
| 91 {at: 0.75, is: 'matrix3d(2.622658368925, 0.0, 0.0, 0.0, 0.0, 2.500108923675, 0
.0, 0.0, 0.0, 0.0, 2.7660426718, 0.0, 20.408689025450002, 20.342525493975, 20.57
2492826850002, 1.0)'}, |
| 92 {at: 1, is: 'matrix3d(2.7133590938, 0.0, 0.0, 0.0, 0.0, 2.4645137761, 0.0, 0.0
, 0.0, 0.0, 2.801687476, 0.0, 20.4335882254, 20.2330661998, 20.4583968206, 1.0)'
}, |
| 93 {at: 2, is: 'matrix3d(3.0761619932999995, 0.0, 0.0, 0.0, 0.0, 2.3221331858, 0.
0, 0.0, 0.0, 0.0, 2.9442666928000003, 0.0, 20.5331850252, 19.7952290231, 20.0020
12795600002, 1.0)'}, |
| 94 ]); |
| 95 assertInterpolation({ |
| 96 property: 'transform', |
| 97 from: 'none', |
| 98 to: 'matrix3d(0, 0.6875, -0.625, 0.3125, -0.6666666666666665, -1, 0.8333333333
333334, 0.125, -0.6666666666666665, 0, 0.5, 1.0625, -1.1875, -0.0625, 1.3125, 1)
' |
| 99 }, [ |
| 100 {at: -1, is: 'matrix3d(-0.0000000000000002377810622383943, -1.0671050586638147
, -0.08972656766237302, 1.3740432449326199, 0.98484601036295, -2.653201092395309
, 0.6753819540610847, 3.6127240080250744, -2.7988839807429846, -1.20900041941533
36, -0.5183744226115445, -0.7936088631686278, 1.1875, 0.0625, -1.3125, 5.3407689
14473683)'}, |
| 101 {at: 0, is: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)'}, |
| 102 {at: 0.25, is: 'matrix3d(0.9041890962319094, 0.3522701519297133, -0.1524020429
8176957, -0.1428256720529315, -0.7579798772527586, 0.6803606288839232, -0.051333
36076757235, 0.37904689530895724, -0.1957679784745485, 0.38554138029509327, 0.82
26186974340638, 0.3370288143441876, -0.296875, -0.015625, 0.328125, 0.5930529142
680923)'}, |
| 103 {at: 0.75, is: 'matrix3d(0.35007413226026135, 0.7254385504141292, -0.497700915
0941454, 0.09582061929004702, -1.1027525038949482, -0.5884810398827429, 0.451682
9688651701, 0.5447944343861767, -0.68717798815684, 0.2657772247405681, 0.5465690
479810023, 1.0836207863885503, -0.890625, -0.046875, 0.984375, 0.593052914268092
7)'}, |
| 104 {at: 1, is: 'matrix3d(0, 0.6875, -0.625, 0.3125, -0.6666666666666665, -1, 0.83
33333333333334, 0.125, -0.6666666666666665, 0, 0.5, 1.0625, -1.1875, -0.0625, 1.
3125, 1)'}, |
| 105 {at: 2, is: 'matrix3d(-0.5844534449366048, -0.42278005999296053, -0.4650580659
922564, -0.6817595809063256, 0.9156938760088464, 0.3851647027225889, 0.924444350
7516923, 0.7218225020358241, -0.0803568793574344, 0.1719974850210706, -0.4967660
9633513097, -0.25968177786904373, -2.375, -0.125, 2.625, 5.340768914473685)'}, |
| 106 ]); |
| 107 assertInterpolation({ |
| 108 property: 'transform', |
| 109 from: 'matrix3d(0, 0.6875, -0.625, 0.3125, -0.6666666666666665, -1, 0.83333333
33333334, 0.125, -0.6666666666666665, 0, 0.5, 1.0625, -1.1875, -0.0625, 1.3125,
1)', |
| 110 to: 'matrix3d(0.571428571428571, -0.625, -0.8333333333333346, -0.6666666666666
9, 0.5, -0.1875, -0.8125, 0.3125, 0.34375, -1, 0.8333333333333327, 1.34375, -1.3
4375, 1, -0.9375, 1)' |
| 111 }, [ |
| 112 {at: -1, is: 'matrix3d(-0.6299594065765657, -0.10825090106268696, -0.201333116
71001855, 5.485724217214554, 6.358051978686152, 0.16496896269344588, 1.576005114
3537075, -54.21568355620423, 0.7106057459805782, -1.1596356050622005, -0.1149534
2545397585, -4.913752963990824, -1.03125, -1.125, 3.5625, -5.901513951904114)'}, |
| 113 {at: 0, is: 'matrix3d(0, 0.6875, -0.625, 0.3125, -0.6666666666666665, -1, 0.83
33333333333334, 0.125, -0.6666666666666665, 0, 0.5, 1.0625, -1.1875, -0.0625, 1.
3125, 1)'}, |
| 114 {at: 0.25, is: 'matrix3d(0.33652832679595723, 0.55254445148386, -0.75447244478
33296, 0.22700224951774267, -0.69720168363685, -0.036373245768780864, 0.28149188
169180933, -0.2845156818045006, -0.24737156018941048, 0.31207160370190334, 0.456
4821058052897, 0.9220853089096839, -1.2265625, 0.203125, 0.75, 1.647016932991011
)'}, |
| 115 {at: 0.75, is: 'matrix3d(0.6861191524977764, -0.18025672746204927, -0.87102972
37546482, 0.6072134247444672, 0.2819931018922366, 0.27778974607679663, -0.654012
8246146626, 0.5063632314069845, 0.5509562084361049, -0.3215202993119732, 0.54590
62603735321, 2.8697154005492105, -1.3046875, 0.734375, -0.375, 1.647016932991009
6)'}, |
| 116 {at: 1, is: 'matrix3d(0.571428571428571, -0.625, -0.8333333333333346, -0.66666
666666669, 0.5, -0.1875, -0.8125, 0.3125, 0.34375, -1, 0.8333333333333327, 1.343
75, -1.34375, 1, -0.9375, 1)'}, |
| 117 {at: 2, is: 'matrix3d(-1.1789992641434441, -0.7109729379601547, -0.44557465379
54199, -21.703089533128907, -0.11137581475421703, -0.08822983871000473, -0.05695
380894007451, -2.22667264132605, -3.1443917136741506, 1.8952588096345078, 2.4266
15889772007, -21.697523130750138, -1.5, 2.0625, -3.1875, -5.901513951904121)'}, |
| 118 ]); |
| 119 assertInterpolation({ |
| 120 property: 'transform', |
| 121 from: 'matrix3d(0.571428571428571, -0.625, -0.8333333333333346, -0.66666666666
669, 0.5, -0.1875, -0.8125, 0.3125, 0.34375, -1, 0.8333333333333327, 1.34375, -1
.34375, 1, -0.9375, 1)', |
| 122 to: 'none' |
| 123 }, [ |
| 124 {at: -1, is: 'matrix3d(-0.6413028394192518, -1.0702420910513302, -0.5807595966
791961, -18.02447171345163, 0.8211815704840004, 1.0980679097347057, 0.9399408862
655454, 22.460730852026064, 0.28421009261178104, -0.5408346238741739, 0.51947913
63698213, 3.075163035391172, -2.6875, 2, -1.875, -14.881239394516232)'}, |
| 125 {at: 0, is: 'matrix3d(0.571428571428571, -0.625, -0.8333333333333346, -0.66666
666666669, 0.5, -0.1875, -0.8125, 0.3125, 0.34375, -1, 0.8333333333333327, 1.343
75, -1.34375, 1, -0.9375, 1)'}, |
| 126 {at: 0.25, is: 'matrix3d(0.7912976716694541, -0.4517927901159618, -0.686874597
4719376, 1.2522201536338506, 0.7952183069582651, 0.06340410955800829, -0.7956629
784232128, 2.2561737435012983, 0.345639443327071, -0.8934490945546473, 0.8301314
43385676, 1.2606901484983566, -1.0078125, 0.75, -0.703125, 2.4888661932358946)'}
, |
| 127 {at: 0.75, is: 'matrix3d(1.0093457700315165, -0.12746048375025829, -0.24746788
943106088, 1.3202120308857304, 0.6128364656690982, 0.7600694601651116, -0.222333
59857303325, 1.4081483224940277, 0.21669805381113447, -0.3786082265932788, 0.908
354523914928, 0.6747509193960347, -0.3359375, 0.25, -0.234375, 2.488866193235896
4)'}, |
| 128 {at: 1, is: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)'}, |
| 129 {at: 2, is: 'matrix3d(0.39048513570444376, 0.14780794797065988, 0.696306810021
7401, -4.857907861239344, -2.967682789284791, 0.6004978769584385, -3.54723760168
72444, 26.675324787979896, -2.5953724498995308, 1.6280843851961373, 0.8163834310
586356, 9.001735256585825, 1.34375, -1, 0.9375, -14.881239394516227)'}, |
| 130 ]); |
| 131 |
| 132 </script> |
| 133 </body> |
OLD | NEW |