-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
181 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,128 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> | ||
| <title>host for iframe-resizer issue 243</title> | ||
|
|
||
| <!-- Bootstrap --> | ||
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> | ||
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> | ||
|
|
||
| <!-- Custom styles for this template --> | ||
| <link rel="stylesheet" href="http://getbootstrap.com/examples/jumbotron/jumbotron.css"> | ||
|
|
||
| <!-- iFrame Resizer CSS --> | ||
| <style> | ||
| body { | ||
| height: 300vh; | ||
| } | ||
| iframe { | ||
| width: 100%; | ||
| border: none; | ||
| } | ||
| </style> | ||
|
|
||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | ||
| <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> | ||
| <!--[if lt IE 9]> | ||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | ||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | ||
| <![endif]--> | ||
|
|
||
| <!-- iFrame Resizer JavaScript --> | ||
| <script type="text/javascript"> | ||
| // https://raw.githubusercontent.com/davidjbradshaw/iframe-resizer/master/js/iframeResizer.min.js | ||
| !function(a){"use strict";function b(b,c,d){"addEventListener"in a?b.addEventListener(c,d,!1):"attachEvent"in a&&b.attachEvent("on"+c,d)}function c(){var b,c=["moz","webkit","o","ms"];for(b=0;b<c.length&&!E;b+=1)E=a[c[b]+"RequestAnimationFrame"];E||f(" RequestAnimationFrame not supported")}function d(){var b="Host page";return a.top!==a.self&&(b=a.parentIFrame?a.parentIFrame.getId():"Nested host page"),b}function e(a){return B+"["+d()+"]"+a}function f(b){x&&"object"==typeof a.console&&console.log(e(b))}function g(b){"object"==typeof a.console&&console.warn(e(b))}function h(b){function c(){function a(){l(K),j()}h("Height"),h("Width"),m(a,K,"resetPage")}function d(a){var b=a.id;f(" Removing iFrame: "+b),a.parentNode.removeChild(a),G[b].closedCallback(b),delete G[b],f(" --")}function e(){var a=J.substr(C).split(":");return{iframe:G[a[0]].iframe,id:a[0],height:a[1],width:a[2],type:a[3]}}function h(a){var b=Number(G[L]["max"+a]),c=Number(G[L]["min"+a]),d=a.toLowerCase(),e=Number(K[d]);if(c>b)throw new Error("Value for min"+a+" can not be greater than max"+a);f(" Checking "+d+" is in range "+c+"-"+b),c>e&&(e=c,f(" Set "+d+" to min value")),e>b&&(e=b,f(" Set "+d+" to max value")),K[d]=""+e}function p(){function a(){function a(){f(" Checking connection is from allowed list of origins: "+d);var a;for(a=0;a<d.length;a++)if(d[a]===c)return!0;return!1}function b(){var a=G[L].remoteHost;return f(" Checking connection is from: "+a),c===a}return d.constructor===Array?a():b()}var c=b.origin,d=G[L].checkOrigin;if(d&&""+c!="null"&&!a())throw new Error("Unexpected message received from: "+c+" for "+K.iframe.id+". Message was: "+b.data+". This error can be disabled by setting the checkOrigin: false option or by providing of array of trusted domains.");return!0}function q(){return B===(""+J).substr(0,C)&&J.substr(C).split(":")[0]in G}function r(){var a=K.type in{"true":1,"false":1,undefined:1};return a&&f(" Ignoring init message from meta parent page"),a}function s(a){return J.substr(J.indexOf(":")+A+a)}function t(a){f(" MessageCallback passed: {iframe: "+K.iframe.id+", message: "+a+"}"),G[L].messageCallback({iframe:K.iframe,message:JSON.parse(a)}),f(" --")}function u(){return null===K.iframe?(g(" IFrame ("+K.id+") not found"),!1):!0}function v(a){var b=a.getBoundingClientRect();return i(),{x:parseInt(b.left,10)+parseInt(D.x,10),y:parseInt(b.top,10)+parseInt(D.y,10)}}function w(b){function c(){D=h,y(),f(" --")}function d(){return{x:Number(K.width)+e.x,y:Number(K.height)+e.y}}var e=b?v(K.iframe):{x:0,y:0},h=d();f(" Reposition requested from iFrame (offset x:"+e.x+" y:"+e.y+")"),a.top!==a.self?a.parentIFrame?a.parentIFrame["scrollTo"+(b?"Offset":"")](h.x,h.y):g(" Unable to scroll to requested position, window.parentIFrame not found"):c()}function y(){!1!==G[L].scrollCallback(D)&&j()}function z(b){function c(a){var b=v(a);f(" Moving to in page link (#"+d+") at x: "+b.x+" y: "+b.y),D={x:b.x,y:b.y},y(),f(" --")}var d=b.split("#")[1]||"",e=decodeURIComponent(d),g=document.getElementById(e)||document.getElementsByName(e)[0];a.top!==a.self?a.parentIFrame?a.parentIFrame.moveToAnchor(d):f(" In page link #"+d+" not found and window.parentIFrame not found"):g?c(g):f(" In page link #"+d+" not found")}function E(){switch(G[L].firstRun&&I(),K.type){case"close":d(K.iframe);break;case"message":t(s(6));break;case"scrollTo":w(!1);break;case"scrollToOffset":w(!0);break;case"inPageLink":z(s(9));break;case"reset":k(K);break;case"init":c(),G[L].initCallback(K.iframe),G[L].resizedCallback(K);break;default:c(),G[L].resizedCallback(K)}}function F(a){var b=!0;return G[a]||(b=!1,g(K.type+" No settings for "+a+". Message was: "+J)),b}function H(){for(var a in G)n("iFrame requested init",o(a),document.getElementById(a),a)}function I(){G[L].firstRun=!1,Function.prototype.bind&&(G[L].iframe.iFrameResizer={close:d.bind(null,G[L].iframe),resize:n.bind(null,"Window resize","resize",G[L].iframe),moveToAnchor:function(a){n("Move to anchor","inPageLink:"+a,G[L].iframe,L)},sendMessage:function(a){a=JSON.stringify(a),n("Send Message","message:"+a,G[L].iframe,L)}})}var J=b.data,K={},L=null;"[iFrameResizerChild]Ready"===J?H():q()?(K=e(),L=K.id,!r()&&F(L)&&(x=G[L].log,f(" Received: "+J),u()&&p()&&E())):f(" Ignored: "+J)}function i(){null===D&&(D={x:void 0!==a.pageXOffset?a.pageXOffset:document.documentElement.scrollLeft,y:void 0!==a.pageYOffset?a.pageYOffset:document.documentElement.scrollTop},f(" Get page position: "+D.x+","+D.y))}function j(){null!==D&&(a.scrollTo(D.x,D.y),f(" Set page position: "+D.x+","+D.y),D=null)}function k(a){function b(){l(a),n("reset","reset",a.iframe,a.id)}f(" Size reset requested by "+("init"===a.type?"host page":"iFrame")),i(),m(b,a,"init")}function l(a){function b(b){a.iframe.style[b]=a[b]+"px",f(" IFrame ("+e+") "+b+" set to "+a[b]+"px")}function c(b){y||"0"!==a[b]||(y=!0,f(" Hidden iFrame detected, creating visibility listener"),s())}function d(a){b(a),c(a)}var e=a.iframe.id;G[e].sizeHeight&&d("height"),G[e].sizeWidth&&d("width")}function m(a,b,c){c!==b.type&&E?(f(" Requesting animation frame"),E(a)):a()}function n(a,b,c,d){d=d||c.id,c&&c.contentWindow?(f("["+a+"] Sending msg to iframe["+d+"] ("+b+")"),c.contentWindow.postMessage(B+b,G[d].targetOrigin)):(g("["+a+"] IFrame("+d+") not found"),G[d]&&delete G[d])}function o(a){return a+":"+G[a].bodyMarginV1+":"+G[a].sizeWidth+":"+G[a].log+":"+G[a].interval+":"+G[a].enablePublicMethods+":"+G[a].autoResize+":"+G[a].bodyMargin+":"+G[a].heightCalculationMethod+":"+G[a].bodyBackground+":"+G[a].bodyPadding+":"+G[a].tolerance+":"+G[a].inPageLinks+":"+G[a].resizeFrom+":"+G[a].widthCalculationMethod}function p(a,c){function d(){function b(b){1/0!==G[t][b]&&0!==G[t][b]&&(a.style[b]=G[t][b]+"px",f(" Set "+b+" = "+G[t][b]+"px"))}b("maxHeight"),b("minHeight"),b("maxWidth"),b("minWidth")}function e(b){return""===b&&(a.id=b="iFrameResizer"+w++,x=(c||{}).log,f(" Added missing iframe ID: "+b+" ("+a.src+")")),b}function h(){f(" IFrame scrolling "+(G[t].scrolling?"enabled":"disabled")+" for "+t),a.style.overflow=!1===G[t].scrolling?"hidden":"auto",a.scrolling=!1===G[t].scrolling?"no":"yes"}function i(){("number"==typeof G[t].bodyMargin||"0"===G[t].bodyMargin)&&(G[t].bodyMarginV1=G[t].bodyMargin,G[t].bodyMargin=""+G[t].bodyMargin+"px")}function j(){var b=G[t].firstRun,c=G[t].heightCalculationMethod in F;!b&&c&&k({iframe:a,height:0,width:0,type:"init"})}function l(c){function d(){n("iFrame.onload",c,a),j()}b(a,"load",d),n("init",c,a)}function m(a){if("object"!=typeof a)throw new TypeError("Options is not an object.")}function p(a){for(var b in I)I.hasOwnProperty(b)&&(G[t][b]=a.hasOwnProperty(b)?a[b]:I[b])}function q(a){return(""===a||"file://"===a)&&(a="*"),a}function r(b){b=b||{},G[t]={firstRun:!0,iframe:a,remoteHost:a.src.split("/").slice(0,3).join("/")},m(b),p(b),G[t].targetOrigin=!0===G[t].checkOrigin?q(G[t].remoteHost):"*",x=G[t].log}function s(){return t in G&&"iFrameResizer"in a}var t=e(a.id);s()?g(" Ignored iFrame, already setup."):(r(c),h(),d(),i(),l(o(t)))}function q(a,b){null===H&&(H=setTimeout(function(){H=null,a()},b))}function r(a){return null!==a.offsetParent}function s(){function b(){function a(a){function b(b){return"0px"===G[a].iframe.style[b]}r(G[a].iframe)&&(b("height")||b("width"))&&n("Visibility change","resize",G[a].iframe,a)}for(var b in G)a(b)}function c(a){f(" Mutation observed: "+a[0].target+" "+a[0].type),q(b,16)}function d(){var a=document.querySelector("body"),b={attributes:!0,attributeOldValue:!1,characterData:!0,characterDataOldValue:!1,childList:!0,subtree:!0},d=new e(c);d.observe(a,b)}var e=a.MutationObserver||a.WebKitMutationObserver;e&&d()}function t(){function c(a){function b(){e("Window "+a,"resize")}f(" Trigger event: "+a),q(b,16)}function d(){function a(){e("Tab Visable","resize")}"hidden"!==document.visibilityState&&(f(" Trigger event: Visiblity change"),q(a,16))}function e(a,b){function c(a){return"parent"===G[a].resizeFrom&&G[a].autoResize&&!G[a].firstRun}for(var d in G)c(d)&&n(a,b,document.getElementById(d),d)}b(a,"message",h),b(a,"resize",function(){c("resize")}),b(document,"visibilitychange",d),b(document,"-webkit-visibilitychange",d),b(a,"focusin",function(){c("focus")}),b(a,"focus",function(){c("focus")})}function u(){function a(a,b){if(!b.tagName)throw new TypeError("Object is not a valid DOM element");if("IFRAME"!==b.tagName.toUpperCase())throw new TypeError("Expected <IFRAME> tag, found <"+b.tagName+">.");p(b,a)}return c(),t(),function(b,c){switch(typeof c){case"undefined":case"string":Array.prototype.forEach.call(document.querySelectorAll(c||"iframe"),a.bind(void 0,b));break;case"object":a(b,c);break;default:throw new TypeError("Unexpected data type ("+typeof c+").")}}}function v(a){a.fn.iFrameResize=function(a){return this.filter("iframe").each(function(b,c){p(c,a)}).end()}}var w=0,x=!1,y=!1,z="message",A=z.length,B="[iFrameSizer]",C=B.length,D=null,E=a.requestAnimationFrame,F={max:1,scroll:1,bodyScroll:1,documentElementScroll:1},G={},H=null,I={autoResize:!0,bodyBackground:null,bodyMargin:null,bodyMarginV1:8,bodyPadding:null,checkOrigin:!0,inPageLinks:!1,enablePublicMethods:!0,heightCalculationMethod:"bodyOffset",interval:32,log:!1,maxHeight:1/0,maxWidth:1/0,minHeight:0,minWidth:0,resizeFrom:"parent",scrolling:!1,sizeHeight:!0,sizeWidth:!1,tolerance:0,widthCalculationMethod:"scroll",closedCallback:function(){},initCallback:function(){},messageCallback:function(){g("MessageCallback function not defined")},resizedCallback:function(){},scrollCallback:function(){return!0}};a.jQuery&&v(jQuery),"function"==typeof define&&define.amd?define([],u):"object"==typeof module&&"object"==typeof module.exports?module.exports=u():a.iFrameResize=a.iFrameResize||u()}(window||{}); | ||
| </script> | ||
| </head> | ||
| <body> | ||
|
|
||
| <nav class="navbar navbar-inverse navbar-fixed-top"> | ||
| <div class="container"> | ||
| <div class="navbar-header"> | ||
| <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> | ||
| <span class="sr-only">Toggle navigation</span> | ||
| <span class="icon-bar"></span> | ||
| <span class="icon-bar"></span> | ||
| <span class="icon-bar"></span> | ||
| </button> | ||
| <a class="navbar-brand" href="/">Project name</a> | ||
| </div> | ||
| <div id="navbar" class="navbar-collapse collapse"> | ||
| <form class="navbar-form navbar-right"> | ||
| <div class="form-group"> | ||
| <input type="text" placeholder="Email" class="form-control"> | ||
| </div> | ||
| <div class="form-group"> | ||
| <input type="password" placeholder="Password" class="form-control"> | ||
| </div> | ||
| <button type="submit" class="btn btn-success">Sign in</button> | ||
| </form> | ||
| </div><!--/.navbar-collapse --> | ||
| </div> | ||
| </nav> | ||
|
|
||
| <!-- Main jumbotron for a primary marketing message or call to action --> | ||
| <div class="jumbotron"> | ||
| <div class="container"> | ||
| <h1>Hello, world!</h1> | ||
| <p>This is a template for a simple marketing or informational website. It includes a large callout called a jumbotron and three supporting pieces of content. Use it as a starting point to create something more unique.</p> | ||
| <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more »</a></p> | ||
| </div> | ||
| </div> | ||
|
|
||
| <iframe src="iframe.html" scrolling="no"></iframe> | ||
|
|
||
| <div class="container"> | ||
| <!-- Example row of columns --> | ||
| <div class="row"> | ||
| <div class="col-md-4"> | ||
| <h2>Heading</h2> | ||
| <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p> | ||
| <p><a class="btn btn-default" href="#" role="button">View details »</a></p> | ||
| </div> | ||
| <div class="col-md-4"> | ||
| <h2>Heading</h2> | ||
| <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p> | ||
| <p><a class="btn btn-default" href="#" role="button">View details »</a></p> | ||
| </div> | ||
| <div class="col-md-4"> | ||
| <h2>Heading</h2> | ||
| <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p> | ||
| <p><a class="btn btn-default" href="#" role="button">View details »</a></p> | ||
| </div> | ||
| </div> | ||
|
|
||
| <hr> | ||
|
|
||
| <footer> | ||
| <p>© Company {% now 'Y' %}</p> | ||
| </footer> | ||
| </div> <!-- /container --> | ||
|
|
||
| <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> | ||
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> | ||
| <!-- Include all compiled plugins (below), or include individual files as needed --> | ||
| <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> | ||
| <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> | ||
| <script src="http://getbootstrap.com/assets/js/ie10-viewport-bug-workaround.js"></script> | ||
| <!-- iFrame Resizer Init --> | ||
| <script type="text/javascript"> | ||
| iFrameResize({ | ||
| log: true, | ||
| checkOrigin: false, | ||
| heightCalculationMethod: 'taggedElement', | ||
| autoResize: false, | ||
| enablePublicMethods: true, | ||
| scrollCallback: function (coords) { | ||
| console.log("[OVERRIDE] overrode scrollCallback x: " + coords.x + " y: " + coords.y); | ||
| window.scrollTo(coords.x, coords.y-50); | ||
| return false; | ||
| } | ||
| }) | ||
| </script> | ||
| </body> | ||
| </html> |
Oops, something went wrong.