annotate iframe-resizer/test/v1.html @ 0:c73753f1606f draft

Uploaded
author saskia-hiltemann
date Mon, 06 Oct 2014 08:13:54 -0400
parents
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
0
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
1 <!DOCTYPE html>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
2 <html>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
3 <head>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
4 <meta charset="utf-8">
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
5 <title>QUnit LoadHide</title>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
6 <link rel="stylesheet" href="resources/qunit.css">
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
7 </head>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
8 <body>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
9 <div id="qunit"></div>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
10 <div id="qunit-fixture">
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
11
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
12 <div style="width:600px;">
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
13 <iframe src="resources/frame.content.html" width="100%" scrolling="no"></iframe>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
14 </div>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
15
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
16 </div>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
17 <script src="resources/qunit.js"></script>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
18 <script src="resources/jquery.js"></script>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
19 <script>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
20 /*
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
21 * File: jquery.iframeSizer.js
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
22 * Desc: Force cross domain iframes to size to content.
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
23 * Requires: iframeSizer.contentWindow.js to be loaded into the target frame.
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
24 * Author: David J. Bradshaw - dave@bradshaw.net
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
25 * Date: 2013-06-14
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
26 */
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
27
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
28
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
29 (function($) {
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
30
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
31 var
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
32 msgId = '[iFrameSizer]', //Must match iframe msg ID
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
33 msgIdLen = msgId.length,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
34 count = 0,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
35 settings,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
36 defaults = {
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
37 log: true,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
38 contentWindowBodyMargin:8,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
39 doHeight:true,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
40 doWidth:false,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
41 interval:0,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
42 enablePublicMethods:false,
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
43 callback:function(){}
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
44 };
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
45
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
46
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
47 function setupRAF(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
48 var
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
49 vendors = ['moz', 'webkit', 'o', 'ms'],
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
50 x;
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
51
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
52 // Remove vendor prefixing if prefixed and break early if not
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
53 for (x = 0; x < vendors.length && !window.requestAnimationFrame; x += 1) {
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
54 window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
55 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
56
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
57 // If not supported then just call callback
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
58 if (!window.requestAnimationFrame){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
59 log(' RequestAnimationFrame not supported');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
60 window.requestAnimationFrame = function(callback){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
61 callback();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
62 };
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
63 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
64
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
65 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
66
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
67 function log(msg){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
68 if (window.console){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
69 console.log(msgId + '[Host page]' + msg);
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
70 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
71 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
72
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
73 setupRAF();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
74
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
75 $(window).on('message',function(event){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
76 function receiver(msg) {
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
77 function resize(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
78 function setDimension(dimension){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
79 window.requestAnimationFrame(function(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
80 messageData.iframe.style[dimension] = messageData[dimension] + 'px';
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
81 log( ' ' + messageData.iframe.id + ' ' + dimension + ' set to ' + messageData[dimension] + 'px');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
82 });
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
83 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
84
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
85 if(settings.doHeight){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
86 setDimension('height');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
87 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
88
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
89 if(settings.doWidth){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
90 setDimension('width');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
91 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
92 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
93
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
94 function processMsg(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
95 var data = msg.substr(msgIdLen).split(':');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
96
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
97 messageData = {
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
98 iframe: document.getElementById(data[0]),
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
99 height: data[1],
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
100 width: data[2]
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
101 };
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
102 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
103
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
104 var messageData = {};
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
105
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
106 //check message is for us.
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
107 if (msgId === msg.substr(0,msgIdLen)){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
108 processMsg();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
109 resize();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
110 settings.callback(messageData,settings);
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
111 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
112 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
113
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
114 receiver(event.originalEvent.data);
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
115 });
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
116
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
117
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
118 $.fn.iFrameSizer = function(options){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
119
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
120 settings = $.extend( {}, defaults, options );
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
121
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
122 return this.each(function(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
123 function isIframe(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
124 return iframe.contentWindow ? true : false;
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
125 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
126
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
127 //We have to call trigger twice, as we can not be sure if all
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
128 //iframes have completed loading when this code runs.
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
129 function init(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
130 iframe.style.overflow = 'hidden';
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
131 iframe.scrolling = 'no';
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
132
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
133 $(iframe).on('load',function(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
134 trigger('iFrame.onload');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
135 });
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
136 trigger('init');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
137 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
138
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
139 function trigger(calleeMsg){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
140
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
141 function ensureHasId(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
142 if (''===iframe.id){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
143 iframe.id = 'iFrameSizer' + count++;
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
144 log(' Added missing iframe ID: '+iframe.id);
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
145 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
146 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
147
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
148 function postMessageToIframe(){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
149 var msg = iframe.id + ':' + settings.contentWindowBodyMargin + ':' + settings.doWidth + ':' +
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
150 settings.log + ':' + settings.interval + ':' + settings.enablePublicMethods;
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
151 log('[' + calleeMsg + '] Sending init msg to iframe ('+msg+')');
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
152 iframe.contentWindow.postMessage( msgId + msg, '*' );
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
153 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
154
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
155 ensureHasId();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
156 postMessageToIframe();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
157 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
158
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
159 var iframe = this;
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
160
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
161 if (isIframe()){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
162 init();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
163 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
164 });
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
165 };
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
166
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
167 })( window.jQuery );
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
168
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
169
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
170 </script>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
171 <script>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
172
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
173 'use strict';
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
174 var msgId = '[iFrameSizerTest]:';
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
175
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
176 asyncTest( "postMessage Response", function() {
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
177
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
178 $('iframe').iFrameSizer({
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
179 callback:function(messageData){
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
180 //console.log('Receive message back from iFrame.')
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
181 ok( true, 'Receive message back from iFrame.' );
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
182 ok( '600' === messageData.width, 'iFrame width = 600.' );
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
183 start();
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
184 }
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
185 });
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
186 });
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
187
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
188 </script>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
189 </body>
c73753f1606f Uploaded
saskia-hiltemann
parents:
diff changeset
190 </html>