var BAR_ID = 'PROGRESS_BAR_ID'; var BAR_HEIGHT = 10; // px var presentation = SlidesApp.getActivePresentation(); function createBars() { var slides = presentation.getSlides(); deleteBars(); for (var i = 0; i < slides.length; ++i) { var ratioComplete = (i / (slides.length - 1)); var x = 0; var y = presentation.getPageHeight() - BAR_HEIGHT; var barWidth = presentation.getPageWidth() * ratioComplete; if (barWidth > 0) { var bar = slides[i].insertShape(SlidesApp.ShapeType.RECTANGLE, x, y, barWidth, BAR_HEIGHT); bar.getBorder().setTransparent(); bar.setLinkUrl(BAR_ID); } } }
function onMessage(e) { var bot = e.message.annotations[0].userMention.user.displayName; var loc = encodeURI(e.message.text.substring(bot.length+2)); var mapClick = { "openLink": { "url": "https://google.com/maps/search/?api=1&query=" + loc } }; return { // see JSON payload in the documentation link above }; }
<!doctype html> <html ⚡4email> <head> <meta charset="utf-8"> <script async src="https://cdn.ampproject.org/v0.js"><'/script> <!-- The AMP4email boilerplate. --> <style amp4email-boilerplate>body{visibility:hidden}</style> <script async custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js"></script> <script async custom-element="amp-selector" src="https://cdn.ampproject.org/v0/amp-selector-0.1.js"></script> <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script> <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script> <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.1.js"></script> <style amp-custom> html{font-family: 'Roboto';} ... </style> </head> <body> <h2>Hello dear user,</h2> <div class="photo-gallery"> <div class="text">Photos from your latest trips: <span [text]="+selectedSlide + 1">1</span>/4</div> <amp-selector layout="container" name="carousel-selector"...> <amp-carousel controls width="430" height="80"> <amp-img ...></amp-img> ... </amp-carousel> </amp-selector> <amp-carousel ...> <amp-img ...></amp-img> ... </amp-carousel> <div class="trip-location">Please rate your trip location:</div> <form id="rating" class="p2" method="post" ...> <fieldset class="rating"> <input name="rating" type="radio" id="rating1" value="1" .../> <label for="rating1" title="1 stars">★</label> ... </fieldset> <div submit-success> <template type="amp-mustache"> <div class="text">Thanks for rating {{rating}} star(s)!</div> </template> </div> </form> </div> </body> </html> [Full example in AmpByExample’s Playground]
