/* 20123101-1035 */ /* * Friendly Iframe Library version 0.3 * @date 30/11/2011 * @author Jaydson Gomes * @email jaydson.gomes@corp.terra.com.br */ (function(doc){ /* FiF Global Object - Represents a Friendly Iframe API */ var FiF = { /* Default settings */ core : { settings : { 'placeholder' : '', 'fifsrc' : 'iframe.html', 'adsrc' : null, 'adcode' : null, 'width' : '', 'height' : '', 'exp_width' : '', 'exp_height' : '', 'expandable' : false, 'rectangle' : false, 'expandFunction' : false, 'contractFunction' : false, 'extra' : false, 'callback' : function(){} }, /* Build the Friendly Iframe */ buildFiF : function(config){ // Merge default settings with new settings var settings = FiF.core.settings = FiF.core.mergeObj(FiF.core.settings,config), fif = null, // Reference to document d = doc; /* If the ad code is provided */ if(settings.adcode){ // fifBody is a Friendly Iframe template var fifBody = '', fifId = 'fif_'+settings.placeholder, idoc, idocContent, // iframeModel is the HTML template to append to document iframeModel = ''; try{ // Get the Friendly Iframe placeholder, that is where will be placed var fifElement = d.getElementById(settings.placeholder); // We need to use innerHTML instead appendChild for some Internet Explorer issues fifElement.innerHTML = iframeModel; // Execute a callback function after insert HTML Iframe code to the document if(typeof(settings.callback) === 'function'){ settings.callback(); } }catch(error){ FiF.core.debug.errors.push({'HumanReadable':'Error appendind Iframe in placeholder','error':error}); } // Get Friendly Iframe object reference fif = document.getElementById(fifId); /* / Here is where the magic of Friendly Iframe happens / We open the Friendly Iframe document, then write dinamicaly inside / The content is defined in fifBody variable, that is a Iframe model */ // Get a content window of a Friendly Iframe idocContent = fif.contentWindow.document; // Open the Friendly Iframe document idocContent.open(); // Write inside the Friendly Iframe document idocContent.write(fifBody); /* If the ad src is provided */ }else if(settings.adsrc){ /* Trick: * We need to create the iframe in this way(with a string and innerHTML stuff),because firefox reload the flash content inside an iframe * if we change the position dinamicaly to absolute - Fu**ing odd! */ var fifHTML = '', // Get the Friendly Iframe placeholder ph = d.getElementById(settings.placeholder); // Parse fifHTML string into placeholder if(ph){ ph.innerHTML = fifHTML; // Now, get a friendly iframe object fif = d.getElementById('fif_'+settings.placeholder); // And some styles (waiting for HTML5 seamless feature) try{ fif.style.width = settings.width + "px"; fif.style.height = settings.height + "px"; fif.style.borderWidth = "0px"; fif.style.padding = "0px"; }catch(e){} /* * This is a trick! create a fif_src attribute, that is the javascript file ad(that one that return the evil document.write) * This attribute will be used to dinamicaly change the iframe src */ fif.fif_src = settings.adsrc; fif.area_name = settings.adname; FiF.core._addEvent(fif,'load',function(){ if(typeof fif.contentWindow[settings.contractFunction] == 'function'){ var oldContractFunction = fif.contentWindow[settings.contractFunction]; } fif.contentWindow[settings.contractFunction] = function(){ if(fif.contentWindow.isOpenedAd){ setTimeout(function(){ if(settings.rectangle){ fif.style.marginLeft = '0px'; } fif.style.height = settings.height + 'px'; fif.style.width = settings.width + 'px'; fif.contentWindow.isOpenedAd = false; },1000); } }; if(oldContractFunction){ oldContractFunction(); } if(settings.extra){ fif.contentWindow.document.body.style.styleFloat = 'left'; fif.contentWindow.document.body.style.cssFloat = 'left'; } // Execute the callback function when the iframe is loaded if(settings.callback){ settings.callback(); } }); // Then apply the source (this is a html page in the same domain)... fif.src = settings.fifsrc; } /* Well.. neither src and code were provided... */ }else{ FiF.core.debug.errors.push('Neither src or code for ad were provided. Fix that! I do not do magic!'); } /* Expandable */ if(fif){ if(settings.expandable){ fif.contentWindow.isOpenedAd = false; fif.style.position = 'absolute'; fif.style.zIndex = '99999'; /* Just for rectangles ads */ if(settings.rectangle){ if(settings.exp_width !== '' || settings.exp_height !== ''){ FiF.core._addEvent(fif,'load',function(){ var placeholder = d.getElementById(settings.placeholder), container = fif.contentWindow.document.getElementById('FiF_container'); placeholder.style.overflow = 'visible'; container.style.styleFloat = 'right'; container.style.cssFloat = 'right'; fif.style.zIndex = '996'; if(typeof fif.contentWindow[settings.expandFunction] == 'function'){ var oldBoxExpand = fif.contentWindow[settings.expandFunction]; } fif.contentWindow[settings.expandFunction] = function(){ fif.style.position = 'absolute'; fif.style.marginLeft = '-' + (settings.exp_width - settings.width) + 'px'; fif.style.width = settings.exp_width + 'px'; fif.style.height = settings.exp_height + 'px'; fif.contentWindow.isOpenedAd = true; } if(oldBoxExpand){ oldBoxExpand(); } }); } }else{ if(settings.exp_width !== '' || settings.exp_height !== ''){ FiF.core._addEvent(fif,'mouseover',function(){ if(typeof fif.contentWindow[settings.expandFunction] == 'function'){ fif.style.width = settings.exp_width + 'px'; fif.style.height = settings.exp_height + 'px'; fif.contentWindow.isOpenedAd = true; } }); FiF.core._addEvent(fif,'mouseout',function(){ fif.style.width = settings.width + 'px'; fif.style.height = settings.height + 'px'; }); } } } } }, /* Add & Remove event by John Resig http://ejohn.org/projects/flexible-javascript-events/ */ _addEvent : function(obj,type,fn){ if(obj.attachEvent){ obj['e'+type+fn] = fn; obj[type+fn] = function(){ try{ if(obj && type && fn){ obj['e'+type+fn](window.event); } }catch(err){} }; obj.attachEvent( 'on'+type, obj[type+fn] ); }else{ obj.addEventListener(type,fn,false); } }, _removeEvent : function(obj,type,fn){ if(obj.detachEvent){ obj.detachEvent( 'on'+type, obj[type+fn] ); obj[type+fn] = null; }else{ obj.removeEventListener(type,fn,false); } }, /* Simple merge method to overload settings */ mergeObj : function(o,ob){ var obj = {}; for(var z in ob){ if(ob.hasOwnProperty(z)){ obj[z] = ob[z]; } } return obj; }, /* Dev stuff - Useful informations about the FiFs */ debug : { // All errors are pushed to this Array errors : [] } }, /* Public namespace */ pub : { /* Public method to log errors*/ logError : function(e){ FiF.core.debug.errors.push(e); }, /* Create one Friendly Iframe */ create : function(new_settings){ FiF.core.buildFiF(new_settings); }, /* Obviusly show the errors that was found */ showErrors : function(){ if(window.console){ console.log(FiF.core.debug.errors); } }, /* Reload all friendly iframes */ reloadAll : function(){ var iframes = d.getElementsByTagName('iframe'), if_length = iframes.length, i = 0; for(i;i