Skip to content

pfelipm/autoslides

Repository files navigation

74842491-cb22aa80-532a-11ea-8116-150ef294bd59

Creado con - Google Apps Script

¿Qué hay aquí?

¿Qué es AutoSlides?

AutoSlides es una plantilla de presentaciones de Google potenciada con código Apps Script diseñada para ser utilizada en puntos de información desatendidos, aunque también puede usarse como elemento informativo, enlazado o incrustado, en cualquier sitio web.

D9Az53UW4AEAjst

¿Por qué AutoSlides?

Las presentaciones de Google disponen de una función de publicación que facilita su difusión. De este modo pueden enlazarse o incrustarse en medios web con facilidad. No obstante, si se modifican las diapositivas de la presentación es necesario recargar la página que contiene sus versiones publicadas en el navegador para que estos cambios se manifiesten. AutoSlides es capaz de generar un pase de diapositivas auto hospedado, visible utilizando un navegador, que se refresca automáticamente a intervalos prefijados sin necesidad de recargar la página web de manera manual en el navegador.

¿Qué puede hacer AutoSlides?

AutoSlide dispone de las siguientes características y funciones:

  • Publicación de la presentación (de modo análogo a ArchivoPublicar) e incrustación por medio de una webapp integrada. El despliegue inicial como webapp debe ser realizado manualmente por el propietario de la presentación, pero a partir de ese momento ya es posible controlar su estado de publicación utilizando los propios menús de AutoSlides.
  • Actualización automática de la presentación incrustada a intervalos establecidos por el usuario, utilizando una transición suave al recargarla. De este modo se pueden introducir modificaciones en las diapositivas, que acabarán reflejándose en cualquier soporte web donde se esté mostrando la webapp.
  • Incrustación totalmente responsive, teniendo en cuenta la relación de aspecto de las diapositivas de la presentación (16:9, 16:10, 4:3, etc).
  • Personalización del modo en que se realiza la incrustación por medio de un panel de control:
    • Tiempo de avance entre diapositivas (s).
    • Periodicidad de recarga de la presentación (s). Si se establece en 0 la presentación nunca se recarga.
    • Retardo tras fundido en recarga (ms). Se recomienda un valor de al menos 1500 ms para lograr una transición suave sin artefactos visuales.
    • Inicio automático (sí / no).
    • Repetición cíclica (sí / no).
    • Eliminación del panel de botones habitual en las presentaciones incrustadas (sí / no).
    • Eliminación de las bandas laterales negras habituales en las presentaciones incrustadas (sí / no).
    • Eliminación del borde del marco de incrustación (sí / no).
    • Selección del color de fondo de la página web que incrusta la presentación.
  • Detección de gráficos de hoja de cálculo vinculados en la presentación. De haberlos, AutoSlides mostrará una advertencia y facilitará instrucciones para que el usuario cree, si así lo desea, un activador por tiempo que deberá vincularse a una función específica del script (refrescarGraficosHdc) para actualizar también estos gráficos a intervalos específicos a partir de sus datos numéricos de origen.

esquema

No he entendido gran cosa ¿me pones un ejemplo?

Claro que sí.

Partimos de la hoja de cálculo AutoSlides # origen (demo). Como verás, contiene 5 gráficos distintos cuyos datos de origen podrían proceder de fuentes diversas: formularios, información importada de otras hojas de cálculo, valores numéricos introducidos directamente por el usuario...

Estos gráficos han sido insertados en la presentación AutoSlides (demo) y quizas podrían experimentar cambios en el futuro como consecuencia de variaciones en los datos en los que se basan. Eso es habitual cuando se usan gráficos que reflejan la evolución de procesos dinámicos (por ejemplo, las respuestas a un formulario abierto). Sin AutoSlides, deberíamos actualizarlos en la presentación de manera manual por medio de las funciones del menú contextual de gráfico vinculado. Con AutoSlides... veremos más abajo qué se puede hacer.

74864106-48601680-534f-11ea-8aa5-17bfecbb84cf

AutoSlides es capaz de publicar la presentación y generar una página web con ella incrustada.

AutoSlides v1 1-1

La presentación publicada, visible en la ventana del navegador (derecha), reflejará los cambios que eventualmente se vayan produciendo en la vista de edición (izquierda) sin que el usuario que la visualice deba recargar la página.

74866819-c6beb780-5353-11ea-9591-918299d3ccb0

Podríamos mostrar la versión publicada en un monitor visible en un espacio público. Pulsando la tecla F11 lograremos una visualización en pantalla completa del navegador. Adicionalmente, si antes de hacerlo sitúas el foco (tecla TAB) justo sobre la presentación, conseguirás que desaparezcan el resto de elementos (esto puede variar en función del navegador utilizado). También puedes simplemente incrustar la página web servida por AutoSlides en cualquier sitio web informativo, por ejemplo creado con Google Sites.

74867638-50bb5000-5355-11ea-96c4-7e2a8ea60426

Además, AutoSlides utiliza unas gotitas de CSS para conseguir que la presentación se ajuste dinámicamente al tamaño de la ventana del navegador sin dejar bandas negras. También es posible, si lo deseamos, eliminar la botonera inferior o los bordes del marco de la presentación.

Aprecia la diferencia que existe entre la inserción convencional 👎 y la de AutoSlides 👍.

74869376-261ec680-5358-11ea-8f68-f9b842629044

Por último, si el usuario crea un activador Apps Script disparado por tiempo que ejecute a intervalos regulares la función refrescarGraficosHdc, que forma parte del código de AutoSlides, conseguiremos que los gráficos de hoja de cálculo vinculados se actualicen también automágicamente. En la imagen del ejemplo se establece una cadencia de actualización de 5 minutos.

¿La cosa queda ya más clara? Pues veamos cómo puedes usar AutoSlides para mejorar la publicación de tus presentaciones, paso a paso.

Instrucciones de uso

Obtén una copia de la plantilla de AutoSlides abriendo este enlace 👉 AutoSlides # plantilla 👈 y a continuación haz clic en Utilizar plantilla.

Edita tu presentación del modo habitual.

Cuando estés listo para publicar tu presentación, haz clic en 🔄 AutoSlides⚙️ Configurar para establecer los distintos ajustes que afectarán al modo en que se mostrarán tus diapositivas. Se recomienda establecer un intervalo de recarga holgadamente superior al necesario para realizar al menos un pase completo de todas las diapositivas.

1️⃣  Si AutoSlides detecta que la presentación contiene gráficos de hoja de cálculo vinculados mostrará un mensaje y te facilitará instrucciones para indicarte cómo puedes configurar un activador por tiempo que también los actualice. Este paso es totalmente opcional, no tienes por qué utilizar gráficos de hojas de cálculo en tus presentaciones o, incluso si lo haces, configurar un activador para actualizarlos.

2️⃣  A continuación, haz clic en 🔄 AutoSlides🌐 Obtener URL público y sigue al pie de la letra las instruciones que aparecerán en el panel lateral. Este procedimiento solo tendrás que completarlo una vez (por cada presentación en la que uses AutoSlides).

3️⃣  Finalmente, ejecuta nuevamente 🔄 AutoSlides🌐 Obtener URL público para activar totalmente la webapp y consigue el URL de la versión publicada de tu presentación. Puedes abrirlo directamente en tu navegador, enviarlo por correo eléctronico, difundirlo en plataformas sociales o utilizarlo como origen de incrustación, por ejemplo en un sitio web creado con Google Sites. El URL puede ser acortado (mediante el servicio gratuito de TinyURL) y copiado fácilmente al portapapeles.

 🚨 ¡Atención, las instrucciones de los pasos 2 y 3 ya no son válidas, échale un vistazo a esto! 🚨

Al visualizar la webapp en tu navegador, bien directamente, bien incrustada dentro de un sitio web, recuerda que con TAB puedes situar el foco sobre la presentación (o hacer clic sobre ella) y con F11 activar o desactivar la visualización en pantalla completa. La advertencia que inserta Google automáticamente sobre fondo gris en la parte superior de la página desaparecerá.

Si en algún momento deseas que tu presentación deje de ser visible públicamente, solo tienes que hacer 🔄 AutoSlides🔻 Detener publicación.

Detalles técnicos

Echemos un mirada bajo el capó de AutoSlides. Si no te interesan este tipo de detalles esto te lo puedes saltar sin remordimientos.

Diagrama de bloques AutoSlides

AutoSlides es un script GAS que vive dentro de una presentación de Google, facilitada como plantilla. El modo más fácil de usarlo es hacerse una copia de esta plantilla y trabajar sobre ella para construir una nueva presentación. Dado que el código de AutoSlides está compuesto por varios archivos, no resulta práctico incluir manualmente todos ellos en una presentación ya existente.

Selección_999(228)

La mayor parte del código vive dentro del archivo Código.gs. En él se encuentran las funciones necesarias para:

  • Construir el menú de la aplicación (onOpen).
  • Mostrar información sobre AutoScript a través de la función acercaDe, que visualiza el archivo HTML acercaDe.html, inyectando como parámetro mediante un scriptlet explícito (printing scriptlet) la cadena que identifica la versión del script (VERSION). Esto se consigue gracias al servicio de plantillas HTML.
<p><?= version ?>.</p>
<p>Más información en su <a target="_blank" href="https://github.com/pfelipm/autoslides">Repositorio GitHub</a>.</p>
  • Contabilizar y actualizar los gráficos vinculados de hoja de cálculo (funciones contarGraficosHdc y refrescarGraficosHdc). No parece haber en la clase GAS SlidesApp facilidades para hacer lo mismo directamente con tablas (rangos de datos) de hoja de cálculo vinculados del mismo modo. Una posible solución, que quizás no siempre será adecuada, consiste en generar a partir de estos datos gráficos de tipo tabla. Hubiera preferido resolver esto de un modo más compacto usando funciones flecha, ya admitidas en Apps Script, pero desgraciadamente me he visto obligado a configurar AutoSlides con el antiguo motor de ejecución Rhino para poder obtener desde el código la URL pública de la webapp.
function refrescarGraficosHdc() { 

  // Versión V8: No se utiliza por bug V8 y ScriptApp.GetService().getUrl()
  // https://groups.google.com/d/topic/google-apps-script-community/0snPFcUqt40/discussion
  // SlidesApp.getActivePresentation().getSlides().map(diapo => {diapo.getSheetsCharts().map(grafico => {grafico.refresh();});});
 
  SlidesApp.getActivePresentation().getSlides().map(function(diapo) {
    diapo.getSheetsCharts().map(function(grafico) {
      grafico.refresh();});});
}

Desplegar el panel lateral de configuración de AutoSlides (función configurar). Se utiliza PropertiesService para inicializar y guardar la configuración de incrustación y el estado de publicación de la presentación. La selección de ajustes se realiza mediante un formulario HTML (panelLateral.html) creado con la ayuda de Materialize.

Los valores vigentes de cada ajuste son inyectados nuevamente en los elementos HTML del formulario por medio de scriptlets explícitos. Las secciones CSS (panelLateral_css.html) y JavaScript (panelLateral_js.html) se insertan en el código HTML también mediante scriptlets explícitos, pero esta vez de tipo forzado (force-printing scriptlets). También se usan scriptlets no explícitos (standard scriptlets) para mostrar las instrucciones de creación de un activador por tiempo si se detectan gráficos vinculados:

<!-- Incluir valores por defecto de controles del formulario usando printing scriptlets -->
<div class="row">
  <div class="input-field col s12">
  <label for="numFil">Avance automático cada (s)</label>
  <input class="validate" type="number" name="sAvanzar" value="<?= sAvanzar ?>" min="1" step="1" id="sAvanzar">
  </div>
</div>
<!-- Incluir css usando force-printing scriptlets -->
<?!= HtmlService.createHtmlOutputFromFile('panelLateral_css').getContent(); ?>
<!-- Incluir js usando force-printing scriptlets -->
<?!= HtmlService.createHtmlOutputFromFile('panelLateral_js').getContent(); ?>
<!-- Mostrar nº de hdc vinculadas en la presentación + instrucciones  -->
<? if (contarGraficosHdc() > 0 ) { ?>
  <p>Se han detectado <b><?= numGraficos ?></b> gráficos de HdC vinculados.
  Configura un activador temporal si quieres que cuando cambien se actualice 
  la presentación.</p>
  <ul class="collapsible">
  ...
  </ul>
<?}?>
  • Restablecer los ajustes por defecto cuando se utiliza el botón correspondiente del panel lateral de configuración (función ajustesPorDefecto). No se modifica en este caso el valor de las propiedades publicar ni urlCorto, que son independientes de los ajustes de publicación.
function ajustesPorDefecto() {

  // Invocado desde panelLateral_js
  // Restablecer ajustes por defecto (,false para preservar otras propiedades)
  PropertiesService.getDocumentProperties().setProperties(AJUSTES_P, false);
  
  // Devolver a panelLateral_js para que actualice formulario
  return AJUSTES_P; 
}

Recibir los ajustes establecidos por el usuario desde el panel lateral de configuración vía la llamada de la API de cliente JavaScript google.script.run.actualizarAjustes($('#formConfigurar').get(0)); y actualizar las propiedades del documento (función actualizarAjustes).

A destacar que si el objeto form devuelto contiene casillas de verificación que no están activadas no existen propiedades que las representen en el objeto recibido del lado del servidor. Una asignación directa tipo: PropertiesService.getDocumentProperties().setProperties(form) daría lugar a estupendas confusiones dado que la desactivación de una casilla en el formulario no se trasladaría a su representación en la propiedad del documento.

function actualizarAjustes(form) {

  // Invocado desde panelLateral_js
  // Al devolver form desde cliente, si una casilla de verificación no está marcada,
  // su propiedad (name) en el objeto pasado a servidor no se devuelve (cuidado).
  
  PropertiesService.getDocumentProperties().setProperties({
    'sAvanzar' : form.sAvanzar,
    'sRecargar' : form.sRecargar,
    'msFundido' : form.msFundido,
    'colorFondo' : form.colorFondo,
    'iniciar' : form.iniciar, // 'on' o NULL
    'repetir' : form.repetir, // 'on' o NULL
    'eliminarMenu' : form.eliminarMenu, // 'on' o NULL
    'eliminarBandas' : form.eliminarBandas, // 'on' o NULL
    'eliminarBordes' : form.eliminarBordes // 'on' o NULL
  }, false);
}

Localizar la versión más reciente de la presentación (función obtenerRevisiones) para publicarla (publicar) o dejar de publicarla (función despublicar). El script depende para ello de la API avanzada de Drive. Si no se ha producido la publicación inicial del script como webapp se desplegará otro panel lateral con las correspondientes instrucciones para el usuario (archivo instruccionesWebApp.html).

En caso de que se detecte que la webapp ya ha sido publicada, simplemente se mostrará su URL público (archivo infoPublicada.html), que además contiene algo de JavaScript para acortarlo, copiarlo al portapapeles o sencillamente probarlo (ya sé, debería haber movido el código js a un archivo independiente, pero era poca cosa).

Y todo ello bien encerrado entre bloques try{} .. catch{} para cazar posibles errores en tiempo de ejecución, de los que preparando el código estos días me he encontrado alguno que otro, quizás como consecuencia de los recientes cambios en la plataforma que sostiene Apps Script.

A continuación se identificará la última edición (versión) de la presentación y se publicará, de modo análogo a como se haría manualmente con ArchivoPublicar. Mucho cuidado con el token que señaliza que hay más versiones no devueltas al interrogar a la API de Drive. Del mismo modo que el caso de otras APIs avanzadas (me viene ahora a la memoria la de Classroom), hay que contemplar esta posibilidad paraa tener la certeza de que alcanzamos realmente la que representa el último estado de edición.

...
var slideId = SlidesApp.getActivePresentation().getId();
var respuesta;
var token;
var revisiones = [];
var hayMas = true;

// Iterar hasta alcanzar la última revisión de la presentación
try {
  while (hayMas == true) {
    respuesta = Drive.Revisions.list(slideId, {maxResults: 1000, pageToken: token});
    revisiones = revisiones.concat(respuesta.items);
    token = revisiones.nextPageToken;
    hayMas = (token == undefined) ? false : true;
  }
...
  • Acortar el URL público de la webapp (función acortarUrl). Se recurre al servicio anónimo y gratuito de TinyURL, al que se le realiza una petición HTTPS especialmente formada por medio de la clase UrlFetchApp.
    Esta estrategia evita que el usuario tenga que registrarse en un servicio de enlaces cortos para obtener de él un token de uso, que posteriormente debería ser introducido en el código de AutoSlides.
var TINYURL = 'https://tinyurl.com/api-create.php?url=';
...
urlCorto = UrlFetchApp.fetch(TINYURL + ScriptApp.getService().getUrl()).getContentText();

La publicación de webapps Apps Script presenta en estos momentos bastantes sutilezas y, por qué no decirlo, aristas, que la llegada del motor de ejecución V8 no han hecho sino afilar. La cosa da para extenderse de manera específica, así que mejor hablaremos de ello en otra ocasión.

Generar y devolver al navegador del usuario que accede a la presentación publicada el URL de la página web en la que se encuentra incrustada, de acuerdo con las preferencias del usuario (función doGet). Aquí encontramos más scriptlets explícitos que parametrizan los ajustes del URL de incrustación, cuya dirección base no es idéntica, aunque igualmente parametrizable, a la que se obtiene al hacer ArchivoPublicar, sino que se obtiene a partir del URL de edición + sufijo /embed. Este URL está enterrado en el código HTML que devuelve la webapp, pero puede ser obtenido fácilmente. Esto hace que, técnicamente, el acceso a la presentación (con este URL) siempre será posible para los usuarios con permisos de (al menos) lectura sobre ella, con independencia de su estado de publicación, pero será imposible para aquellos a los que no se les haya concedido permisos de acceso explícitos (los que la visualizan de manera pública).

Por otro lado, la página web genererada se devuelve con XFrameOptionsMode.ALLOWALL para que admita ser incrustada en cualquier sitio web.

function doGet(e) {

  // Generar página web con presentación incrustada

  var incrustaWeb = HtmlService.createTemplateFromFile('slidesEmbed');
  
  // Rellenar elementos de plantilla
  var ajustes = PropertiesService.getDocumentProperties().getProperties();
  var aspecto = 100 * SlidesApp.getActivePresentation().getPageHeight() / SlidesApp.getActivePresentation().getPageWidth();
  var offsetPx = ajustes.eliminarBordes == 'on' ? INSET_BORDES : 0; 
  incrustaWeb.url =  'https://docs.google.com/presentation/d/' + SlidesApp.getActivePresentation().getId() + '/embed';
  incrustaWeb.iniciar = ajustes.iniciar == 'on' ? 'true' : 'false';
  incrustaWeb.repetir = ajustes.repetir == 'on' ? 'true' : 'false';
  incrustaWeb.msAvanzar = (+ajustes.sAvanzar * 1000).toString();
  incrustaWeb.msFundido = ajustes.msFundido;
  incrustaWeb.colorFondo = ajustes.colorFondo;
  incrustaWeb.msRecargar = (+ajustes.sRecargar * 1000).toString();
  incrustaWeb.insetInferior = ajustes.eliminarMenu == 'on' ? Math.ceil(INSET_INFERIOR  + offsetPx).toString() : '0';
  incrustaWeb.insetLateral = ajustes.eliminarBandas == 'on' ? Math.ceil(100 * NUMERO_MAGICO / aspecto + offsetPx).toString() : '0';
  incrustaWeb.insetSuperior = offsetPx.toString();

  // Para "truco" CSS que hace el iframe responsive
  incrustaWeb.aspecto = aspecto.toString();
  
  return incrustaWeb.evaluate().setTitle(SlidesApp.getActivePresentation().getName()).setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}

Dejando de lado las distintas funciones que forman parte del código de AutoSlides, veamos ahora qué hay en el interior de slidesEmbed.html, el archivo HTML donde realmente se realiza la incrustación de la presentación. Es corto pero tiene algún que otro detalle interesante. Vamos primero con el código de incrustación:

<div id="marco1"
     style="display: block;
            position: relative;
            padding-bottom: <?= aspecto ?>%;
            height: 0;
            overflow: hidden;
            border: none;">
                         
  <iframe id="marco2"
          style="transition: opacity 1s;
                 position:absolute;
                 width: 100%; height: 100%;
                 clip-path: inset(<?= insetSuperior ?>px <?= insetLateral ?>px <?= insetInferior ?>px <?= insetLateral ?>px)";
          src="<?= url ?>
               ?start=<?= iniciar ?>
               &loop=<?= repetir ?>
               &delayms=<?= msAvanzar ?>"
           frameborder="0" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"> 
  </iframe>
  
</div>

Intervienen aquí numerosos scriptlets de parametrización, que son instanciados, como hemos visto, en la función doGet:

  • <?= aspecto ?>: Aparece en el bloque DIV exterior. Se emplea para ajustar el relleno inferior de esta capa exterior (marco1) para conseguir una visualización adaptada al tamaño de la ventana (responsive) con independencia de la relación de aspecto de la presentación. Para que esto funcione es necesario que el <iframe> interior (marco2) tenga un posicionamiento CSS de tipo absoluto.
  • <?= insetSuperior ?>, <?= insetLateral ?>, <?= insetInferior ?>: Se utilizan para recortar las bandas laterales, la barra inferior y, en su caso, los bordes del marco incrustado empleando la propiedad CSS clip-path.
  • <?= url ?>: El URL de la versión publicada de la presentación.
  • <?= iniciar ?>, <?= repetir ?>: Controlan si la presentación debe comenzar a reproducirse automáticamente al cargar y si se repite tras la proyección de la última diapositiva.
  • <?= msAvanzar ?>: Velocidad de avance de diapositiva, en milisegundos.

Esto resuelve la incrustación parametrizada, solo falta ahora que el marco interior (marco2) se recargue automáticamente de acuerdo con el intervalo establecido por el usuario. Esto se consigue con esta sencilla función JavaScript, que cambia su atributo src periódicamente de acuerdo con el parámetro <?= msRecargar ?> asociado a una función invocada mediante setInterval.

<script>
  
  setInterval(function(){
      
    document.getElementById("marco2").style.opacity = 0;
      
    sleep(1000).then(() => {document.getElementById('marco2').src="<?= url ?>?start=<?= iniciar ?>&loop=<?= repetir ?>&delayms=<?= msAvanzar ?>";});
    sleep(<?= msFundido ?>).then(() => {document.getElementById("marco2").style.opacity = 1;});
           
  }, <?= msRecargar ?>);
    
  function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
  }
    
</script>

Para que la recarga del contenido del marco interior (con la presentación) sea suave se juega con su propiedad opacity, sobre la que se ha establecido previamente una transición de 1 segundo. Además, gracias a una promesa JavaScript, se introduce un retardo de <?= msFundido ?> milisengudos antes de volver a hacer visible la presentación.

Todo este bloque que resuelve la incrustación y refresco de la presentación está gobernado por un scriptlet no explícito que vigila el valor de la propiedad del documento publicar y obra en consecuencia en el momento en que se genera la página y expanden también el resto de scriptlets. Un segundo scriptlet activa o desactiva, dependiendo de la propiedad sRecargar, el bloque JavaScript encargado de la recarga periódica del marco que incrusta la presentación:

<body> 
  
  <!-- Mostrar presentación incrustada si publicación activada y ajustes inicializados -->  
  
  <? if (PropertiesService.getDocumentProperties().getProperty('publicar') == 'true' && 
         PropertiesService.getDocumentProperties().getProperty('inicializado') == 'true' ) { ?>

    <!-- Aquí va el bloque HTML que incrusta la presentación... -->

    <!-- Si intervalo de recarga = 0 no recargaremos nunca -->
  
    <? if (PropertiesService.getDocumentProperties().getProperty('sRecargar') != '0') { ?>

      <!-- ...y aquí va el bloque JavaScript responsable de su recarga periódica -->
    
    <? } ?>
  
  <? } else {?>

    <h1>La presentación no está disponible</h1>

  <? } ?>
  
</body>

Recordemos que los scriptlets son un poderoso mecanismo para generar código HTML dinámico. Pero este dinamismo se limita al momento en que la plantilla HTML que los contiene es evaluada con el método .evaluate() del servicio Html de Apps Script, justo antes de ser enviada al navegador del usuario. Si se modifican los ajustes de AutoSlides (o se desactiva la publicación de la presentación) será necesario, ahora sí, recargar manualmente la página servida por la webapp para que los cambios tengan efecto.

No quiero acabar sin comentar 2 detalles adicionales:

  • Es la primera vez que incluyo imágenes como elementos informativos o meramente decorativos en un desarrollo GAS. Resulta realmente práctico embeber estas imágenes en el código HTML del proyecto. Para ello hay que asignarle al atributo src del tag <IMG> una cadena con el prefijo data:image/{tipo};base64 seguida del contenido binario de la imagen codificado en Base64. Para ello puedes utilizar cualquier conversor en línea, este por ejemplo. No obstante al editor Apps Script le pesan estas interminables secuencia de caracteres, así que mejor no excederse con esto y, en cualquier caso, utilizarlas en archivos independientes específicos del proyecto GAS.
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAa...">

  • Las webapps GAS admiten en estos momentos únicamente 30 accesos concurrentes (bueno, realmente 29). ¿Quiere esto decir que una presentación publicada con AutoSlides solo puede aparecer en 29 navegadores en un instante dado? En absoluto. Esta limitación de acceso únicamente afecta al momento en que la webapp recibe una petición y construye y devuelve la página web. Una vez el código HTML + JavaScript se está ejecutando en el navegador del usuario, deja de contabilizar como un acceso dado que a partir de ahí es código absolutamente estático que no conecta en ningún momento con las funciones GAS en el servidor. En cualquier caso, el escenario de uso principal de AutoSlides es la creación de paneles informativos desatentidos en espacios reales, por lo que entiendo que esta limitación es aún menos relevante.

Licencia

© 2020 Pablo Felip Monferrer (@pfelipm). Se distribuye bajo licencia GNU GPL v3.

About

Script + webapp que autopublica una presentación de Google con actualización automática temporizada y ajustes de incrustación avanzados.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published