/
Implementación de Ajax V4 Múltiple Genérico

Implementación de Ajax V4 Múltiple Genérico

Owned by Sebastian Perez (Unlicensed)
Last updated: Mar 07, 2018

 

El Ajax V4 Múltiple puede implementarse como un genérico. Permite llamar desde todas las páginas a un mismo tag (puede incluso guardarse como un archivo .js) y definir las variables para cada sección de forma individual. Esta versión suele ser considerada frente a sitios con una estructura muy compleja de Secciones y Subsecciones.

 

Detallamos cómo es la Implementación a continuación:

 

La implementación consta de 3 partes:

- Tag Genérico >> Se llamará siempre al mismo código.

- Definición de Variables >> Se estará indicando el Sitio, Sección/ Subsección y Espacios implementados a través de variables.

- Llamadas a Espacios >> Esto aplica igual a la Implementación del Ajax V4 Múltiple tradicional.

 

- Tag Genérico >>

Para poder transformar el Ajax en Genérico se debe primero tomar de base un tag extraído de la plataforma:

<script language='JavaScript' type='text/javascript'><!--
var eplDoc = document; var eplLL = false;
var eS1 = 'us.img.e-planning.net';var eplArgs = { iIF:1,sV:'http://ads.eu.e-planning.net/',vV:'4',sI:'7b0',sec:'Home',eIs:['Top_728x90','Lat_160x600','Bottom_728x90'] };
function eplCheckStart() {
    if (document.epl) {
        var e = document.epl;
        if (e.eplReady()) {
            return true;
        } else {
            e.eplInit(eplArgs);
            if (eplArgs.custom) {
                for (var s in eplArgs.custom) {
                    document.epl.setCustomAdShow(s, eplArgs.custom[s]);
                }
            }
            return e.eplReady();       
        }
    } else {
        if (eplLL) return false;
        if (!document.body) return false; var eS2; var dc = document.cookie; var ci = dc.indexOf('EPLSERVER=');
        if (ci != -1) {
            ci += 10; var ce = dc.indexOf(';', ci);
            if (ce == -1) ce = dc.length;
            eS2 = dc.substring(ci, ce);
        }
        var eIF = document.createElement('IFRAME');
        eIF.src = 'about:blank'; eIF.id = 'epl4iframe'; eIF.name = 'epl4iframe';
        eIF.width=0; eIF.height=0; eIF.style.width='0px'; eIF.style.height='0px';
        eIF.style.display='none'; document.body.appendChild(eIF);
       
        var eIFD = eIF.contentDocument ? eIF.contentDocument : eIF.document;
        eIFD.open();eIFD.write('<html><head><title>e-planning</title></head><bo'+'dy></bo'+'dy></html>');eIFD.close();
        var s = eIFD.createElement('SCRIPT'); s.src = 'http://' + (eS2?eS2:eS1) +'/layers/epl-41.js';
        eIFD.body.appendChild(s);
        if (!eS2) {
            var ss = eIFD.createElement('SCRIPT');
            ss.src = 'http://ads.eu.e-planning.net/egc/4/684';
            eIFD.body.appendChild(ss);
        }
        eplLL = true;
        return false;
    }
}
eplCheckStart();
function eplSetAdM(eID,custF) {
    if (eplCheckStart()) {
        if (custF) { document.epl.setCustomAdShow(eID,eplArgs.custom[eID]); }
        document.epl.showSpace(eID);
    } else {
        var efu = 'eplSetAdM(''+eID+'', '+ (custF?'true':'false') +');';
        setTimeout(efu, 250);   
    }
}

function eplAD4M(eID,custF) {
    document.write('<div id='eplAdDiv'+eID+''></div>');
    if (custF) {
        if (!eplArgs.custom) { eplArgs.custom = {}; }
        eplArgs.custom[eID] = custF;
    }
    eplSetAdM(eID, custF?true:false);
}
function eplSetAd(eID) {
    if (eplCheckStart()) {
        var opts = (eplArgs.sOpts && eplArgs.sOpts[eID]) ? eplArgs.sOpts[eID] : {};
        if (opts.custF) { document.epl.setCustomAdShow(eID,opts.custF); }
        document.epl.setSpace(eID, opts);
    } else {
        setTimeout('eplSetAd(''+eID+'');', 250);   
    }
}
function eplAD4(eID, opts) {
    document.write('<div id='eplAdDiv'+eID+''></div>');
    if (!opts) opts = {t:1};
    if (!eplArgs.sOpts) { eplArgs.sOpts = {}; }
    eplArgs.sOpts[eID] = opts;
    eplSetAd(eID);
}
//--></script>

Los parámetros señalados en rojo serán los que pasarán a ser variables a ser definidas. Como nombre de cada variable mientras que sea descriptivo, se puede indicar el que se desee.

El siguiente es un ejemplo con variables sugeridas:

<script language='JavaScript' type='text/javascript'><!--
var eplDoc = document; var eplLL = false;
var eS1 = 'us.img.e-planning.net';var eplArgs = { iIF:1,sV:'http://ads.eu.e-planning.net/',vV:'4',sI:sitioEplanning,sec:seccionEplanning,eIs:arrayPosiciones};
function eplCheckStart() {
    if (document.epl) {
        var e = document.epl;
        if (e.eplReady()) {
            return true;
        } else {
            e.eplInit(eplArgs);
            if (eplArgs.custom) {
                for (var s in eplArgs.custom) {
                    document.epl.setCustomAdShow(s, eplArgs.custom[s]);
                }
            }
            return e.eplReady();       
        }
    } else {
        if (eplLL) return false;
        if (!document.body) return false; var eS2; var dc = document.cookie; var ci = dc.indexOf('EPLSERVER=');
        if (ci != -1) {
            ci += 10; var ce = dc.indexOf(';', ci);
            if (ce == -1) ce = dc.length;
            eS2 = dc.substring(ci, ce);
        }
        var eIF = document.createElement('IFRAME');
        eIF.src = 'about:blank'; eIF.id = 'epl4iframe'; eIF.name = 'epl4iframe';
        eIF.width=0; eIF.height=0; eIF.style.width='0px'; eIF.style.height='0px';
        eIF.style.display='none'; document.body.appendChild(eIF);
       
        var eIFD = eIF.contentDocument ? eIF.contentDocument : eIF.document;
        eIFD.open();eIFD.write('<html><head><title>e-planning</title></head><bo'+'dy></bo'+'dy></html>');eIFD.close();
        var s = eIFD.createElement('SCRIPT'); s.src = 'http://' + (eS2?eS2:eS1) +'/layers/epl-41.js';
        eIFD.body.appendChild(s);
        if (!eS2) {
            var ss = eIFD.createElement('SCRIPT');
            ss.src = 'http://ads.eu.e-planning.net/egc/4/684';
            eIFD.body.appendChild(ss);
        }
        eplLL = true;
        return false;
    }
}
eplCheckStart();
function eplSetAdM(eID,custF) {
    if (eplCheckStart()) {
        if (custF) { document.epl.setCustomAdShow(eID,eplArgs.custom[eID]); }
        document.epl.showSpace(eID);
    } else {
        var efu = 'eplSetAdM(''+eID+'', '+ (custF?'true':'false') +');';
        setTimeout(efu, 250);   
    }
}

function eplAD4M(eID,custF) {
    document.write('<div id='eplAdDiv'+eID+''></div>');
    if (custF) {
        if (!eplArgs.custom) { eplArgs.custom = {}; }
        eplArgs.custom[eID] = custF;
    }
    eplSetAdM(eID, custF?true:false);
}
function eplSetAd(eID) {
    if (eplCheckStart()) {
        var opts = (eplArgs.sOpts && eplArgs.sOpts[eID]) ? eplArgs.sOpts[eID] : {};
        if (opts.custF) { document.epl.setCustomAdShow(eID,opts.custF); }
        document.epl.setSpace(eID, opts);
    } else {
        setTimeout('eplSetAd(''+eID+'');', 250);   
    }
}
function eplAD4(eID, opts) {
    document.write('<div id='eplAdDiv'+eID+''></div>');
    if (!opts) opts = {t:1};
    if (!eplArgs.sOpts) { eplArgs.sOpts = {}; }
    eplArgs.sOpts[eID] = opts;
    eplSetAd(eID);
}
//--></script>

Cuando el tag esté listo se puede guardar como un archivo .js y reservar hasta completar la Implementación.

Ej:

http://demos.e-planning.net/GenericoAjaxV4Multiple.js

 

Si se estuviese implementando una Subsección, se podría agregar una variable extra:

ss:subseccionEplanning

Si se estuviesen implementando Palabras Clave, se podría agregar otra variable extra:

kVs:kwsEplanning


Luego en cada sección se deben incluir las definiciones de las variables (el tag genérico llamará a estas variables y se completará con las definiciones de cada sección)

sI:sitioEplanning >> ID de Sitio

sec:seccionEplanning >> Nombre de Sección implementada 

 eIs:arrayPosiciones >> Enumeración de Espacios a implementar en la Sección


- Definición de Variables >>

Para definir las variables se debe primero conocer los ID de los Sitios a Implementar (Asignado por e-planning en la plataforma. Si no se conoce se puede verificar abriendo un tag de ese sitio en la cuenta) y los nombres tanto de las Secciones/Subsecciones como de los Espacios.

Así es como se estarán definiendo:

var sitioEplanning = '7b0';
var seccionEplanning = 'Home';
var arrayPosiciones = new Array('Top_728x90','Lat_160x600','Bottom_728x90');


- Llamadas a Espacios >>

Tomar los scripts de los espacios a implementar:

<script type='text/javascript'>eplAD4M('Top_728x90');</script>

<script type='text/javascript'>eplAD4M('Lat_160x600');</script>

<script type='text/javascript'>eplAD4M('Bottom_728x90');</script>

 

Ya teniendo todo definido se podrá armar la Implementación final:

<html>
<head>
</head>
<body>
<script type='text/javascript' language='Javascript'><!--
var sitioEplanning = '7b0';
var seccionEplanning = 'Home';
var arrayPosiciones = new Array('Top_728x90','Lat_160x600','Bottom_728x90');
//--></script>
 
 
<script language='JavaScript' type='text/javascript'><!--
var eplDoc = document; var eplLL = false;
var eS1 = 'us.img.e-planning.net';var eplArgs = { iIF:1,sV:'http://ads.eu.e-planning.net/',vV:'4',sI:sitioEplanning,sec:seccionEplanning,eIs:arrayPosiciones};
function eplCheckStart() {
    if (document.epl) {
        var e = document.epl;
        if (e.eplReady()) {
            return true;
        } else {
            e.eplInit(eplArgs);
            if (eplArgs.custom) {
                for (var s in eplArgs.custom) {
                    document.epl.setCustomAdShow(s, eplArgs.custom[s]);
                }
            }
            return e.eplReady();      
        }
    } else {
        if (eplLL) return false;
        if (!document.body) return false; var eS2; var dc = document.cookie; var ci = dc.indexOf('EPLSERVER=');
        if (ci != -1) {
            ci += 10; var ce = dc.indexOf(';', ci);
            if (ce == -1) ce = dc.length;
            eS2 = dc.substring(ci, ce);
        }
        var eIF = document.createElement('IFRAME');
        eIF.src = 'about:blank'; eIF.id = 'epl4iframe'; eIF.name = 'epl4iframe';
        eIF.width=0; eIF.height=0; eIF.style.width='0px'; eIF.style.height='0px';
        eIF.style.display='none'; document.body.appendChild(eIF);
      
        var eIFD = eIF.contentDocument ? eIF.contentDocument : eIF.document;
        eIFD.open();eIFD.write('<html><head><title>e-planning</title></head><bo'+'dy></bo'+'dy></html>');eIFD.close();
        var s = eIFD.createElement('SCRIPT'); s.src = 'http://' + (eS2?eS2:eS1) +'/layers/epl-41.js';
        eIFD.body.appendChild(s);
        if (!eS2) {
            var ss = eIFD.createElement('SCRIPT');
            ss.src = 'http://ads.eu.e-planning.net/egc/4/684';
            eIFD.body.appendChild(ss);
        }
        eplLL = true;
        return false;
    }
}
eplCheckStart();
function eplSetAdM(eID,custF) {
    if (eplCheckStart()) {
        if (custF) { document.epl.setCustomAdShow(eID,eplArgs.custom[eID]); }
        document.epl.showSpace(eID);
    } else {
        var efu = 'eplSetAdM(''+eID+'', '+ (custF?'true':'false') +');';
        setTimeout(efu, 250);  
    }
}

function eplAD4M(eID,custF) {
    document.write('<div id='eplAdDiv'+eID+''></div>');
    if (custF) {
        if (!eplArgs.custom) { eplArgs.custom = {}; }
        eplArgs.custom[eID] = custF;
    }
    eplSetAdM(eID, custF?true:false);
}
function eplSetAd(eID) {
    if (eplCheckStart()) {
        var opts = (eplArgs.sOpts && eplArgs.sOpts[eID]) ? eplArgs.sOpts[eID] : {};
        if (opts.custF) { document.epl.setCustomAdShow(eID,opts.custF); }
        document.epl.setSpace(eID, opts);
    } else {
        setTimeout('eplSetAd(''+eID+'');', 250);  
    }
}
function eplAD4(eID, opts) {
    document.write('<div id='eplAdDiv'+eID+''></div>');
    if (!opts) opts = {t:1};
    if (!eplArgs.sOpts) { eplArgs.sOpts = {}; }
    eplArgs.sOpts[eID] = opts;
    eplSetAd(eID);
}
//--></script>

 
<script type='text/javascript'>eplAD4M('Top_728x90');</script>

<script type='text/javascript'>eplAD4M('Lat_160x600');</script>

<script type='text/javascript'>eplAD4M('Bottom_728x90');</script>
 
 
</body>
</html>

Related content