Greasy Fork is available in English.

Google Slides - Offline Presentation

It allows you to save a Google Slides presentation as a working html file using the browser's "complete webpage save" feature

スクリプトをインストールするには、Tampermonkey, GreasemonkeyViolentmonkey のような拡張機能のインストールが必要です。

You will need to install an extension such as Tampermonkey to install this script.

スクリプトをインストールするには、TampermonkeyViolentmonkey のような拡張機能のインストールが必要です。

スクリプトをインストールするには、TampermonkeyUserscripts のような拡張機能のインストールが必要です。

このスクリプトをインストールするには、Tampermonkeyなどの拡張機能をインストールする必要があります。

このスクリプトをインストールするには、ユーザースクリプト管理ツールの拡張機能をインストールする必要があります。

(ユーザースクリプト管理ツールは設定済みなのでインストール!)

このスタイルをインストールするには、Stylusなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus などの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus tなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

(ユーザースタイル管理ツールは設定済みなのでインストール!)

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください
// ==UserScript==
// @name     Google Slides - Offline Presentation
// @description It allows you to save a Google Slides presentation as a working html file using the browser's "complete webpage save" feature
// @version  1
// @grant    none
// @include  https://docs.google.com/presentation/d/e/*/pub*
// @include  https://docs.google.com/presentation/d/*/present*
// @namespace https://greasyfork.org/users/396351
// ==/UserScript==

// Utils
const loadImage = src => {
  const img = document.createElement('img');
	img.src = src;
	img.style.display = 'none';
  document.body.appendChild(img);
}
const getFilename = path => path.split('/').slice(-1)[0];

// Load slide images as img tags so that they're saved
const viewerData = window.eval('viewerData');
[].concat.apply(this, viewerData.docData[1]).filter(a => Array.isArray(a) && a.length > 0).flatMap(a => a).filter(h => h.startsWith && h.startsWith('https')).forEach(async h => {
  loadImage(h);

  const scripts = Array.from(document.querySelectorAll('script'));
  const svgs = scripts.filter(s => s.innerHTML.startsWith('SK_svgData'));
  const type = await fetch(h, {method: 'HEAD'}).then(r => r.headers.get('Content-Type').split('/')[1]);
  const local = `' + localStorage.getItem('loc') + '/${getFilename(h).substring(0, 60)}.${type.replace('jpeg', 'jpg')}`;
  const escapedLink = h.replace(/\//g, '\\/');
  svgs.forEach(s => s.innerHTML = s.innerHTML.replace(escapedLink, local));

  const vdScript = scripts.filter(s => s.innerHTML.includes('var viewerData'))[0];
  vdScript.innerHTML = vdScript.innerHTML.replace(new RegExp(h, 'g'), local.replace(/'/g, '"'));
});

// Load button images as img tags
const [viewerStyle, style, media] = Array.from(document.styleSheets[0].cssRules).filter(r => {
  return r.cssText.match(/punch_viewer_sprite|\/viewer-/) && r.cssText.includes('nav');
});
const mediaStyle = Array.from(media.cssRules).filter(r => r.cssText.includes('sprite'))[0];
const [viewer, sprite, mediaSprite] = [viewerStyle, style, mediaStyle].map(s => getFilename(s.style['background-image'].slice(4, -2)));

const staticImageURL = 'https://ssl.gstatic.com/docs/presentations/images/';
loadImage(staticImageURL + mediaSprite);
loadImage(staticImageURL + sprite);
loadImage(staticImageURL + viewer)

// Function whose source to load as a script tag
const source = () => {
  // Remove overlay
  document.addEventListener('DOMContentLoaded', (e) => {
    document.querySelectorAll('.punch-viewer-container')[1].parentNode.remove();
  });
  
  window.addEventListener('load', e => {
    if (!location.href.startsWith('file')) return;
    
    // Hack to find the location of the local file
    const loc = Array.from(document.querySelectorAll('link')).filter(l => l.rel == 'stylesheet')[0].getAttribute('href').split('/')[0];
    const prevLoc = localStorage.getItem('loc');
    if (!prevLoc || prevLoc != loc) {
      localStorage.setItem('loc', loc);
      location.reload();
    }
      
    //Fix main window styling
    const style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML =` 
		.punch-viewer-nav-v2 .punch-viewer-nav-logo-image,
    .punch-viewer-nav-v2 .punch-viewer-icon,
    .punch-viewer-nav-v2 .punch-viewer-icon-large,
    .punch-viewer-nav-v2 .punch-viewer-laser-icon,
    .punch-viewer-nav-v2 .goog-flat-menu-button-dropdown,
    .punch-viewer-body-v2 .goog-option-selected .goog-menuitem-checkbox,
    .punch-viewer-body-v2 .punch-viewer-menuitem-skippedslide .goog-menuitem-checkbox,
    .lmwd-dialog .punch-viewer-icon,
    .lmwd-dialog .punch-viewer-icon-large {
     background-image:url(${loc}/${sprite})
    }
                         
		@media screen and (min-resolution:2dppx),(-webkit-min-device-pixel-ratio:2) {
      .punch-viewer-nav-v2 .punch-viewer-nav-logo-image,
       .punch-viewer-nav-v2 .punch-viewer-icon,
       .punch-viewer-nav-v2 .punch-viewer-icon-large,
       .punch-viewer-nav-v2 .punch-viewer-laser-icon,
       .punch-viewer-nav-v2 .goog-flat-menu-button-dropdown,
       .punch-viewer-body-v2 .goog-option-selected .goog-menuitem-checkbox,
       .punch-viewer-body-v2 .punch-viewer-menuitem-skippedslide .goog-menuitem-checkbox,
       .lmwd-dialog .punch-viewer-icon,
       .lmwd-dialog .punch-viewer-icon-large {
          background-image:url(${loc}/${mediaSprite});
      }
		}

    `;
    document.head.appendChild(style);
    
		// Fix speaker notes window styling
    window._open = window.open;
    window.open = function(){
      const win = window._open.apply(this, arguments);
      const $ = (selector) => win.document.querySelector(selector);
  		
      const link = document.querySelector('link[href*=viewer_css_ltr]').cloneNode();
      win.document._write = win.document.write;
      win.document.write = function() {
        const val = win.document._write.apply(this, arguments);
				win.document.head.appendChild(link);
      
        setTimeout(() => {
          const sidePanelLength = 331;
          const dragger = '.punch-viewer-speakernotes-dragger';
          const drag = () => {
            const rect = $(dragger).getBoundingClientRect();
            const evArgs = { buttons:1, clientX: rect.x + rect.width/2, clientY: 100, bubbles: true };
            const mouse = (selector, type, args) => $(selector).dispatchEvent(new MouseEvent('mouse' + type, args));
            mouse(dragger, 'down', evArgs);
            mouse('.punch-viewer-speakernotes-text-body-scrollable', 'move', {...evArgs, clientX: sidePanelLength, movementX: 1});
            mouse('.punch-viewer-speakernotes-dragger', 'up', {...evArgs, clientX: sidePanelLength});
          }
          drag(); drag();

          Array.from(win.document.querySelectorAll('.punch-viewer-speakernotes-page-iframe')).forEach(i => {
            i.contentDocument.head.appendChild(link.cloneNode());
          });

          $('#punch-viewer-speakernotes').addEventListener('mousemove', e => {
            const currentSidePanelLength = parseInt($('.punch-viewer-speakernotes-side-panel').style.width.slice(0, -2));
            if(e.buttons == 1 && (e.movementX <= 0 &&  currentSidePanelLength <= sidePanelLength || e.clientX <= sidePanelLength)) {
              e.stopPropagation();
            }
          }, true);


          const style = win.document.createElement('style');
          style.type = 'text/css';
          style.innerHTML = `
          .punch-viewer-nav-logo-image,
          .punch-viewer-icon,
          .punch-viewer-icon-large,
          .punch-viewer-laser-icon,
          .punch-viewer-nav .goog-flat-menu-button-dropdown {
            background-image:url(${win.localStorage.getItem('loc')}/${viewer})
          }
          `;
          win.document.head.appendChild(style);
        }, 500);
        return val;
      }
      return win;
    }
  });
}

const extractVariables = vars => Object.keys(vars).map(name => {
  return `${name} = ${vars[name].toSource()}`;
}).join(';') + ';';

const script = document.createElement('script');
script.type = 'text/javascript';
const scriptSource = source.toSource().split('\n').slice(1, -1).join('\n')
script.innerHTML = extractVariables({viewer, sprite, mediaSprite}) + scriptSource;
document.body.appendChild(script);