workshops/hextivisti-slides
11
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity
hextivisti-slides/internet.html

407 lines
128 KiB
HTML
Raw Normal View History

added slides for 'how does the internet work'
2024-10-15 17:53:33 +00:00
<!DOCTYPE html><html lang="en-US"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0"><meta name="apple-mobile-web-app-capable" content="yes"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:type" content="website"><meta name="twitter:card" content="summary"><style>@media screen{body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container button{appearance:none;background-color:initial;border:0;color:inherit;cursor:pointer;font-size:inherit;opacity:.8;outline:none;padding:0;transition:opacity .2s linear;-webkit-tap-highlight-color:transparent}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:disabled,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:disabled,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:disabled,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container button:disabled{cursor:not-allowed;opacity:.15!important}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container button:hover{opacity:1}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:active,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:active,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover:active,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container button:hover:active{opacity:.6}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:not(:disabled),body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:not(:disabled),body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover:not(:disabled),body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container button:hover:not(:disabled){transition:none}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev],body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button.bespoke-marp-presenter-info-page-prev{background:#0000 url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJNNjggOTAgMjggNTBsNDAtNDAiLz48L3N2Zz4=") no-repeat 50%;background-size:contain;overflow:hidden;text-indent:100%;white-space:nowrap}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button.bespoke-marp-presenter-info-page-next{background:#0000 url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJtMz
* Marp default theme.
*
* @theme default
* @author Yuki Hattori
*
* @auto-scaling true
* @size 16:9 1280px 720px
* @size 4:3 960px 720px
*/div#\:\$p > svg > foreignObject > section{--base-size-4:calc(var(--marpit-root-font-size, 1rem) * 0.25);--base-size-8:calc(var(--marpit-root-font-size, 1rem) * 0.5);--base-size-16:calc(var(--marpit-root-font-size, 1rem) * 1);--base-text-weight-normal:400;--base-text-weight-medium:500;--base-text-weight-semibold:600;--fontStack-monospace:ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;}div#\:\$p > svg > foreignObject > section [data-theme=light],div#\:\$p > svg > foreignObject > section{color-scheme:light;--focus-outlineColor:#0969da;--fgColor-default:#1f2328;--fgColor-muted:#636c76;--fgColor-accent:#0969da;--fgColor-success:#1a7f37;--fgColor-attention:#9a6700;--fgColor-danger:#d1242f;--fgColor-done:#8250df;--bgColor-default:#fff;--bgColor-muted:#f6f8fa;--bgColor-neutral-muted:#afb8c133;--bgColor-attention-muted:#fff8c5;--borderColor-default:#d0d7de;--borderColor-muted:#d0d7deb3;--borderColor-neutral-muted:#afb8c133;--borderColor-accent-emphasis:#0969da;--borderColor-success-emphasis:#1a7f37;--borderColor-attention-emphasis:#bf8700;--borderColor-danger-emphasis:#cf222e;--borderColor-done-emphasis:#8250df;--color-prettylights-syntax-comment:#57606a;--color-prettylights-syntax-constant:#0550ae;--color-prettylights-syntax-constant-other-reference-link:#0a3069;--color-prettylights-syntax-entity:#6639ba;--color-prettylights-syntax-storage-modifier-import:#24292f;--color-prettylights-syntax-entity-tag:#0550ae;--color-prettylights-syntax-keyword:#cf222e;--color-prettylights-syntax-string:#0a3069;--color-prettylights-syntax-variable:#953800;--color-prettylights-syntax-brackethighlighter-unmatched:#82071e;--color-prettylights-syntax-brackethighlighter-angle:#57606a;--color-prettylights-syntax-invalid-illegal-text:#f6f8fa;--color-prettylights-syntax-invalid-illegal-bg:#82071e;--color-prettylights-syntax-carriage-return-text:#f6f8fa;--color-prettylights-syntax-carriage-return-bg:#cf222e;--color-prettylights-syntax-string-regexp:#116329;--color-prettylights-syntax-markup-list:#3b2300;--color-prettylights-syntax-markup-heading:#0550ae;--color-prettylights-syntax-markup-italic:#24292f;--color-prettylights-syntax-markup-bold:#24292f;--color-prettylights-syntax-markup-deleted-text:#82071e;--color-prettylights-syntax-markup-deleted-bg:#ffebe9;--color-prettylights-syntax-markup-inserted-text:#116329;--color-prettylights-syntax-markup-inserted-bg:#dafbe1;--color-prettylights-syntax-markup-changed-text:#953800;--color-prettylights-syntax-markup-changed-bg:#ffd8b5;--color-prettylights-syntax-markup-ignored-text:#eaeef2;--color-prettylights-syntax-markup-ignored-bg:#0550ae;--color-prettylights-syntax-meta-diff-range:#8250df;--color-prettylights-syntax-sublimelinter-gutter-mark:#8c959f;}div#\:\$p > svg > foreignObject > section [data-theme=dark],div#\:\$p > svg > foreignObject > section:where(.invert){color-scheme:dark;--focus-outlineColor:#1f6feb;--fgColor-default:#e6edf3;--fgColor-muted:#8d96a0;--fgColor-accent:#4493f8;--fgColor-success:#3fb950;--fgColor-attention:#d29922;--fgColor-danger:#f85149;--fgColor-done:#ab7df8;--bgColor-default:#0d1117;--bgColor-muted:#161b22;--bgColor-neutral-muted:#6e768166;--bgColor-attention-muted:#bb800926;--borderColor-default:#30363d;--borderColor-muted:#30363db3;--borderColor-neutral-muted:#6e768166;--borderColor-accent-emphasis:#1f6feb;--borderColor-success-emphasis:#238636;--borderColor-attention-emphasis:#9e6a03;--borderColor-danger-emphasis:#da3633;--borderColor-done-emphasis:#8957e5;--color-prettylights-syntax-comment:#8b949e;--color-prettylights-syntax-constant:#79c0ff;--color-prettylights-syntax-constant-other-reference-link:#a5d6ff;--color-prettylights-syntax-entity:#d2a8ff;--color-prettylights-syntax-storage-modifier-import:#c9d1d9;--color-prettylights-syntax-entity-tag:#7ee787;--color-prettylights-syntax-keyword:#ff7b72;--color-prettylights-syntax-string:#a5d6ff;--color-prettylights-syntax-variable:#ffa657;--color-prettylights-syntax-brackethighlighter-unmatched:#f85149;--color-prettylights-syntax-brackethighlighter-angle:#8b949e;--color-prettylights-syntax-inv
</style></head><body><div class="bespoke-marp-osc"><button data-bespoke-marp-osc="prev" tabindex="-1" title="Previous slide">Previous slide</button><span data-bespoke-marp-osc="page"></span><button data-bespoke-marp-osc="next" tabindex="-1" title="Next slide">Next slide</button><button data-bespoke-marp-osc="fullscreen" tabindex="-1" title="Toggle fullscreen (f)">Toggle fullscreen</button><button data-bespoke-marp-osc="presenter" tabindex="-1" title="Open presenter view (p)">Open presenter view</button></div><div id=":$p"><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="1" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="1" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h1 id="wie-funktioniert-das-internet">Wie funktioniert das Internet?</h1>
<p>ein Rollen-Spiel</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="2" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="2" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h2 id="szenario-1-sich-mit-dem-lokalen-netzwerk-verbinden">Szenario 1: sich mit dem lokalen Netzwerk verbinden</h2>
<p>Starring:</p>
<ul>
<li>Alice</li>
<li>WG-Lan: 192.0.0.1</li>
<li>1&amp;1-Gateway: 72.0.0.1</li>
</ul>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="3" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="3" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="11-gateway-72001">1&amp;1-Gateway: 72.0.0.1</h3>
<p>Schickt Alice einen Brief mit Zugangsdaten</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="4" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="4" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-192001">WG-Lan: 192.0.0.1</h3>
<p>Start-Code: 6876-2131-1312<br />
Zugangs-Code: 1und1/osfhm8fe8joq@online.de<br />
Passwort: 7982369878</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="5" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="5" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="11-gateway-72001-1">1&amp;1-Gateway: 72.0.0.1</h3>
<p>Deine IP ist: 72.132.28.123<br />
Ich kann routen: x.x.x.x<br />
Ich empfehle diesen DNS-Server: 72.1.0.1</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="6" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="6" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice">Alice</h3>
<p>87:67:12:F3:1A:89<br />
WiFi?</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="7" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="7" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-192001-1">WG-Lan: 192.0.0.1</h3>
<p>SSID: WG-Lan<br />
WPA2-gesichert</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="8" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="8" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-1">Alice</h3>
<p>SSID: WG-Lan<br />
Passwort: supersich3r</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="9" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="9" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-192001-2">WG-Lan: 192.0.0.1</h3>
<p>Deine IP ist: 192.0.0.5<br />
Ich kann routen: x.x.x.x<br />
Ich kann auch DNS-Anfragen machen.</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="10" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="10" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h2 id="szenario-2-nach-mr-robot-googlen">Szenario 2: nach Mr. Robot googlen</h2>
<p><em>natürlich nicht mit google, sondern duckduckgo.</em></p>
<p>Starring:</p>
<ul>
<li>Alice: 192.0.0.5</li>
<li>WG-Lan: 72.132.28.123, 192.0.0.1</li>
<li>1&amp;1-Gateway 72.0.0.1</li>
<li>1&amp;1-DNS 72.1.0.1</li>
</ul>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="11" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="11" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
DNS-Anfrage an 192.0.0.1<br />
IP-Adresse (A) von duckduckgo.com</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="12" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="12" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
DNS-Anfrage an 72.1.0.1<br />
IP-Adresse (A) von duckduckgo.com</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="13" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="13" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="11-gateway-72001-2">1&amp;1-Gateway: 72.0.0.1</h3>
<p>gibt die Anfrage an 72.1.0.1 weiter</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="14" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="14" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="11-dns-72101">1&amp;1-DNS: 72.1.0.1</h3>
<p>Antwort an 72.132.28.123<br />
A von duckduckgo: 40.114.177.156</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="15" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="15" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<p><em>A new player joins the game</em></p>
<p>Neue Rollen:</p>
<ul>
<li>duckduckgo.com: 40.114.177.156</li>
<li>MSN-Gateway: 40.0.0.1</li>
</ul>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="16" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="16" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-1">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
Anfrage an 40.114.177.156<br />
<a href="http://duckduckgo.com/?q=mr.+robot+kostenloser+stream">http://duckduckgo.com/?q=mr.+robot+kostenloser+stream</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="17" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="17" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-1">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
Anfrage an 40.114.177.156<br />
<a href="http://duckduckgo.com/?q=mr.+robot+kostenloser+stream">http://duckduckgo.com/?q=mr.+robot+kostenloser+stream</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="18" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="18" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="11-gateway-72001-3">1&amp;1-Gateway: 72.0.0.1</h3>
<p>hm, <code>40.</code>irgendwas, dafür ist MSN verantwortlich.</p>
<h3 id="msn-gateway-40001">MSN-Gateway: 40.0.0.1</h3>
<p>40.114.177.156 ist doch Kunde bei mir! Ich hab denen die IP-Adresse gegeben, ich weiß welches Kabel dieses Paket lang muss.</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="19" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="19" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="duckduckgocom-40114177156">duckduckgo.com: 40.114.177.156</h3>
<p>Antwort an 72.132.28.123</p>
&lt;html&gt;
Liste an Ergebnissen, u.a.:
http://bs.to/serie/Mr-Robot
&lt;/html&gt;
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="20" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="20" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="szenario-3-mr-robot-kostenlos-gucken">Szenario 3: Mr. Robot kostenlos gucken</h3>
<p><em>duckduckgo kann sich setzen ;)</em></p>
<p>Neue Rollen:</p>
<ul>
<li>
<p>notice.cuii.info: 64.190.63.222</p>
</li>
<li>
<p>quad9: 9.9.9.9</p>
</li>
<li>
<p>DNS-Root-Server: 40.36.148.17</p>
</li>
<li>
<p>tonic.to: 40.28.204.240</p>
</li>
<li>
<p>Cloudflare-DNS: 1.1.1.1</p>
</li>
<li>
<p>bs.to: 40.115.31.20</p>
</li>
<li>
<p>voe.sx: 72.2.163.208</p>
</li>
<li>
<p>Alice: 192.0.0.5</p>
</li>
<li>
<p>WG-Lan: 72.132.28.123, 192.0.0.1</p>
</li>
<li>
<p>1&amp;1-Gateway 72.0.0.1</p>
</li>
<li>
<p>1&amp;1-DNS 72.1.0.1</p>
</li>
</ul>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="21" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="21" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-2">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
DNS-Anfrage an 192.0.0.1<br />
IP-Adresse (A) von bs.to</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="22" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="22" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-2">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
DNS-Anfrage an 72.1.0.1<br />
IP-Adresse (A) von bs.to</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="23" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="23" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="11-dns-72101-1">1&amp;1-DNS: 72.1.0.1</h3>
<p>Antwort an 72.132.28.123<br />
A von bs.to: 64.190.63.222</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="24" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="24" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-3">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
Anfrage an 64.190.63.222<br />
<a href="http://bs.to/serie/Mr-Robot">http://bs.to/serie/Mr-Robot</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="25" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="25" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-3">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
Anfrage an 64.190.63.222<br />
<a href="http://bs.to/serie/Mr-Robot">http://bs.to/serie/Mr-Robot</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="26" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="26" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="noticecuiiinfo-6419063222">notice.cuii.info: 64.190.63.222</h3>
<p>Antwort an 72.132.28.123</p>
&lt;html&gt;
Diese Webseite ist aus urheberrechtlichen Gründen nicht verfügbar.
&lt;/html&gt;
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="27" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="27" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-192001-3">WG-Lan: 192.0.0.1</h3>
<p>Antwort an 192.0.0.5</p>
&lt;html&gt;
Diese Webseite ist aus urheberrechtlichen Gründen nicht verfügbar.
&lt;/html&gt;
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="28" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="28" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-4">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
DNS-Anfrage an 9.9.9.9<br />
IP-Adresse (A) von bs.to</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="29" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="29" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-4">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
DNS-Anfrage an 9.9.9.9<br />
IP-Adresse (A) von bs.to</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="30" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="30" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="quad9-9999">quad9: 9.9.9.9</h3>
<p>Anfrage von 9.9.9.9<br />
DNS-Anfrage an 40.36.148.17<br />
NS-Server (NS) von .to</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="31" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="31" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="dns-root-server-403614817">DNS-Root-Server: 40.36.148.17</h3>
<p>Antwort an 9.9.9.9<br />
NS von .to: 40.28.204.240</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="32" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="32" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="quad9-9999-1">quad9: 9.9.9.9</h3>
<p>Anfrage von 9.9.9.9<br />
DNS-Anfrage an 40.36.148.17<br />
IP-Adresse (A) von bs.to</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="33" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="33" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="tonicto-4028204240">tonic.to: 40.28.204.240</h3>
<p>Antwort an 9.9.9.9<br />
A von bs.to: 40.115.31.20</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="34" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="34" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="quad9-9999-2">quad9: 9.9.9.9</h3>
<p>Antwort an 72.132.28.123<br />
A von bs.to: 40.115.31.20</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="35" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="35" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-192001-4">WG-Lan: 192.0.0.1</h3>
<p>Antwort an 192.0.0.5<br />
A von bs.to: 40.115.31.20</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="36" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="36" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-5">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
Anfrage an 40.115.31.20<br />
<a href="http://bs.to/serie/Mr-Robot">http://bs.to/serie/Mr-Robot</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="37" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="37" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-5">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
Anfrage an 40.115.31.20<br />
<a href="http://bs.to/serie/Mr-Robot">http://bs.to/serie/Mr-Robot</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="38" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="38" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="bsto-401153120">bs.to: 40.115.31.20</h3>
<p>Antwort an 72.132.28.123</p>
&lt;html&gt;
Link zum Stream: https://voe.sx/rvaw00e9ibxl
&lt;/html&gt;
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="39" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="39" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-192001-5">WG-Lan: 192.0.0.1</h3>
<p>Antwort an 192.0.0.5</p>
&lt;html&gt;
Link zum Stream: https://voe.sx/rvaw00e9ibxl
&lt;/html&gt;
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="40" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="40" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-6">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
DNS-Anfrage an 9.9.9.9<br />
IP-Adresse (A) von voe.sx</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="41" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="41" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-6">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
DNS-Anfrage an 9.9.9.9<br />
IP-Adresse (A) von voe.sx</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="42" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="42" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="quad9-9999-3">quad9: 9.9.9.9</h3>
<p>Antwort an 72.132.28.123<br />
A von voe.sx: 72.2.163.208</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="43" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="43" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-192001-6">WG-Lan: 192.0.0.1</h3>
<p>Antwort an 192.0.0.5<br />
A von voe.sx: 72.2.163.208</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="44" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="44" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-7">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
Anfrage an 72.2.163.208<br />
HTTPS-Zertifikat von voe.sx</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="45" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="45" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-7">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
Anfrage an 72.2.163.208<br />
HTTPS-Zertifikat von voe.sx</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="46" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="46" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="voesx-722163208">voe.sx: 72.2.163.208</h3>
<p>Antwort an 72.132.28.123<br />
HTTPS-Zertifikat</p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="47" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="47" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="alice-192005-8">Alice: 192.0.0.5</h3>
<p>Anfrage von 192.0.0.5<br />
Anfrage an 72.2.163.208</p>
<p><em>Link überklebt mit DIN-A4-Papier: <a href="https://voe.sx">https://voe.sx</a></em></p>
<p><a href="https://voe.sx/rvaw00e9ibxl">https://voe.sx/rvaw00e9ibxl</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="48" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="48" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-8">WG-Lan: 72.132.28.123</h3>
<p>Anfrage von 72.132.28.123<br />
Anfrage an 72.2.163.208</p>
<p><em>Link überklebt mit DIN-A4-Papier: <a href="https://voe.sx">https://voe.sx</a></em></p>
<p><a href="https://voe.sx/rvaw00e9ibxl">https://voe.sx/rvaw00e9ibxl</a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="49" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="49" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="voesx-722163208-1">voe.sx: 72.2.163.208</h3>
<p>Antwort an 72.132.28.123</p>
<p><em>Inhalt überklebt mit leerem DIN-A4-Papier:</em></p>
<pre is="marp-pre" data-auto-scaling="downscale-only"><code>&lt;video&gt;
Mr. Robot Staffel 1, Folge 1.mp4
&lt;/video&gt;
</code></pre>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="50" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="50" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<h3 id="wg-lan-7213228123-9">WG-Lan: 72.132.28.123</h3>
<p>Antwort an 192.0.0.5</p>
<p><em>Inhalt überklebt mit leerem DIN-A4-Papier:</em></p>
<pre is="marp-pre" data-auto-scaling="downscale-only"><code>&lt;video&gt;
Mr. Robot Staffel 1, Folge 1.mp4
&lt;/video&gt;
</code></pre>
<footer>Wie funktioniert das Internet?</footer>
</section>
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="51" data-paginate="true" data-footer="Wie funktioniert das Internet?" data-theme="default" lang="en-US" data-marpit-pagination="51" style="--paginate:true;--footer:Wie funktioniert das Internet?;--theme:default;" data-marpit-pagination-total="51">
<p><a href="https://voe.sx/rvaw00e9ibxl"><img src="images/mr.robot.png" alt="Screenshot of Mr. Robot" /></a></p>
<footer>Wie funktioniert das Internet?</footer>
</section>
<script>!function(){"use strict";const t={h1:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"1"},style:"display: block; font-size: 2em; margin-block-start: 0.67em; margin-block-end: 0.67em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h2:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"2"},style:"display: block; font-size: 1.5em; margin-block-start: 0.83em; margin-block-end: 0.83em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h3:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"3"},style:"display: block; font-size: 1.17em; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h4:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"4"},style:"display: block; margin-block-start: 1.33em; margin-block-end: 1.33em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h5:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"5"},style:"display: block; font-size: 0.83em; margin-block-start: 1.67em; margin-block-end: 1.67em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h6:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"6"},style:"display: block; font-size: 0.67em; margin-block-start: 2.33em; margin-block-end: 2.33em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},span:{proto:()=>HTMLSpanElement},pre:{proto:()=>HTMLElement,style:"display: block; font-family: monospace; white-space: pre; margin: 1em 0; --marp-auto-scaling-white-space: pre;"}},e="data-marp-auto-scaling-wrapper",i="data-marp-auto-scaling-svg",n="data-marp-auto-scaling-container";class s extends HTMLElement{container;containerSize;containerObserver;svg;svgComputedStyle;svgPreserveAspectRatio="xMinYMid meet";wrapper;wrapperSize;wrapperObserver;constructor(){super();const t=t=>([e])=>{const{width:i,height:n}=e.contentRect;this[t]={width:i,height:n},this.updateSVGRect()};this.attachShadow({mode:"open"}),this.containerObserver=new ResizeObserver(t("containerSize")),this.wrapperObserver=new ResizeObserver(((...e)=>{t("wrapperSize")(...e),this.flushSvgDisplay()}))}static get observedAttributes(){return["data-downscale-only"]}connectedCallback(){this.shadowRoot.innerHTML=`\n<style>\n svg[${i}] { display: block; width: 100%; height: auto; vertical-align: top; }\n span[${n}] { display: table; white-space: var(--marp-auto-scaling-white-space, nowrap); width: max-content; }\n</style>\n<div ${e}>\n <svg part="svg" ${i}>\n <foreignObject><span ${n}><slot></slot></span></foreignObject>\n </svg>\n</div>\n `.split(/\n\s*/).join(""),this.wrapper=this.shadowRoot.querySelector(`div[${e}]`)??void 0;const t=this.svg;this.svg=this.wrapper?.querySelector(`svg[${i}]`)??void 0,this.svg!==t&&(this.svgComputedStyle=this.svg?window.getComputedStyle(this.svg):void 0),this.container=this.svg?.querySelector(`span[${n}]`)??void 0,this.observe()}disconnectedCallback(){this.svg=void 0,this.svgComputedStyle=void 0,this.wrapper=void 0,this.container=void 0,this.observe()}attributeChangedCallback(){this.observe()}flushSvgDisplay(){const{svg:t}=this;t&&(t.style.display="inline",requestAnimationFrame((()=>{t.style.display=""})))}observe(){this.containerObserver.disconnect(),this.wrapperObserver.disconnect(),this.wrapper&&this.wrapperObserver.observe(this.wrapper),this.container&&this.containerObserver.observe(this.container),this.svgComputedStyle&&this.observeSVGStyle(this.svgComputedStyle)}observeSVGStyle(t){const e=()=>{const i=(()=>{const e=t.getPropertyValue("--preserve-aspect-ratio");if(e)return e.trim();return`x${(({textAlign:t,direction:e})=>{if(t.endsWith("left"))return"Min";if(t.endsWith("right"))return"Max";if("start"===t||"end"===t){let i="rtl"===e;return"end"===t&&(i=!i),i?"Max":"Min"}return"Mid"})(t)}YMid meet`})();i!==this.svgPreserveAspectRatio&&(this.svgPreserveAspectRatio=i,this.updateSVGRect()),t===this.svgComputedStyle&&requestAnimationFrame(e)};e()}updateSVGRect(){let t=Math.ceil(this.containerSize?.w
</script></foreignObject></svg></div><script>/*!! License: https://unpkg.com/@marp-team/marp-cli@4.0.0/lib/bespoke.js.LICENSE.txt */
!function(){"use strict";function e(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var t,n,r=(n||(n=1,t={from:function(e,t){var n,r=1===(e.parent||e).nodeType?e.parent||e:document.querySelector(e.parent||e),o=[].filter.call("string"==typeof e.slides?r.querySelectorAll(e.slides):e.slides||r.children,(function(e){return"SCRIPT"!==e.nodeName})),a={},i=function(e,t){return(t=t||{}).index=o.indexOf(e),t.slide=e,t},s=function(e,t){a[e]=(a[e]||[]).filter((function(e){return e!==t}))},c=function(e,t){return(a[e]||[]).reduce((function(e,n){return e&&!1!==n(t)}),!0)},l=function(e,t){o[e]&&(n&&c("deactivate",i(n,t)),n=o[e],c("activate",i(n,t)))},d=function(e,t){var r=o.indexOf(n)+e;c(e>0?"next":"prev",i(n,t))&&l(r,t)},u={off:s,on:function(e,t){return(a[e]||(a[e]=[])).push(t),s.bind(null,e,t)},fire:c,slide:function(e,t){if(!arguments.length)return o.indexOf(n);c("slide",i(o[e],t))&&l(e,t)},next:d.bind(null,1),prev:d.bind(null,-1),parent:r,slides:o,destroy:function(e){c("destroy",i(n,e)),a={}}};return(t||[]).forEach((function(e){e(u)})),n||l(0),u}}),t),o=e(r);const a=document.body,i=(...e)=>history.replaceState(...e),s="",c="presenter",l="next",d=["",c,l],u="bespoke-marp-",f=`data-${u}`,m=(e,{protocol:t,host:n,pathname:r,hash:o}=location)=>{const a=e.toString();return`${t}//${n}${r}${a?"?":""}${a}${o}`},g=()=>a.dataset.bespokeView,p=e=>new URLSearchParams(location.search).get(e),v=(e,t={})=>{const n={location,setter:i,...t},r=new URLSearchParams(n.location.search);for(const t of Object.keys(e)){const n=e[t];"string"==typeof n?r.set(t,n):r.delete(t)}try{n.setter({...window.history.state??{}},"",m(r,n.location))}catch(e){console.error(e)}},h=(()=>{const e="bespoke-marp";try{return localStorage.setItem(e,e),localStorage.removeItem(e),!0}catch{return!1}})(),y=e=>{try{return localStorage.getItem(e)}catch{return null}},b=(e,t)=>{try{return localStorage.setItem(e,t),!0}catch{return!1}},w=e=>{try{return localStorage.removeItem(e),!0}catch{return!1}},x=(e,t)=>{const n="aria-hidden";t?e.setAttribute(n,"true"):e.removeAttribute(n)},k=e=>{e.parent.classList.add(`${u}parent`),e.slides.forEach((e=>e.classList.add(`${u}slide`))),e.on("activate",(t=>{const n=`${u}active`,r=t.slide,o=r.classList,a=!o.contains(n);if(e.slides.forEach((e=>{e.classList.remove(n),x(e,!0)})),o.add(n),x(r,!1),a){const e=`${n}-ready`;o.add(e),document.body.clientHeight,o.remove(e)}}))},$=e=>{let t=0,n=0;Object.defineProperty(e,"fragments",{enumerable:!0,value:e.slides.map((e=>[null,...e.querySelectorAll("[data-marpit-fragment]")]))});const r=r=>void 0!==e.fragments[t][n+r],o=(r,o)=>{t=r,n=o,e.fragments.forEach(((e,t)=>{e.forEach(((e,n)=>{if(null==e)return;const a=t<r||t===r&&n<=o;e.setAttribute(`${f}fragment`,(a?"":"in")+"active");const i=`${f}current-fragment`;t===r&&n===o?e.setAttribute(i,"current"):e.removeAttribute(i)}))})),e.fragmentIndex=o;const a={slide:e.slides[r],index:r,fragments:e.fragments[r],fragmentIndex:o};e.fire("fragment",a)};e.on("next",(({fragment:a=!0})=>{if(a){if(r(1))return o(t,n+1),!1;const a=t+1;e.fragments[a]&&o(a,0)}else{const r=e.fragments[t].length;if(n+1<r)return o(t,r-1),!1;const a=e.fragments[t+1];a&&o(t+1,a.length-1)}})),e.on("prev",(({fragment:a=!0})=>{if(r(-1)&&a)return o(t,n-1),!1;const i=t-1;e.fragments[i]&&o(i,e.fragments[i].length-1)})),e.on("slide",(({index:t,fragment:n})=>{let r=0;if(void 0!==n){const o=e.fragments[t];if(o){const{length:e}=o;r=-1===n?e-1:Math.min(Math.max(n,0),e-1)}}o(t,r)})),o(0,0)},E=document,L=()=>!(!E.fullscreenEnabled&&!E.webkitFullscreenEnabled),S=()=>!(!E.fullscreenElement&&!E.webkitFullscreenElement),P=e=>{e.fullscreen=()=>{L()&&(async()=>{S()?(E.exitFullscreen||E.webkitExitFullscreen)?.call(E):((e=E.body)=>{(e.requestFullscreen||e.webkitRequestFullscreen)?.call(e)})()})()},document.addEventListener("keydown",(t=>{"f"!==t.key&&"F11"!==t.key||t.altKey||t.ctrlKey||t.metaKey||!L()||(e.fullscreen(),t.preventDefault())}))},_=`${u}inactive`,T=(e=2e3)=>({parent:t,fire:n})=>{const r=t.classList,o=e=>n(`marp-${e?"":"in"}active`);let a;const i=()=>{a&&clearTimeout(a),a=setTimeou
Reference in a new issue Copy permalink