Mercurial > repos > saskia-hiltemann > ireport

comparison iframe-resizer/test/v1.html @ 0:ac5f9272033b draft

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