diff options
| -rw-r--r-- | README.md | 119 | ||||
| -rw-r--r-- | doc/ci.html | 19 | ||||
| -rw-r--r-- | doc/demo_passt.html | 19 | ||||
| -rw-r--r-- | doc/demo_pasta.html | 19 | ||||
| -rw-r--r-- | doc/demo_podman.html | 19 | ||||
| -rwxr-xr-x | hooks/pre-push | 1 |
6 files changed, 161 insertions, 35 deletions
@@ -6,6 +6,45 @@ Author: Stefano Brivio <sbrivio@redhat.com> <span style="font-weight: bold; color: red;">While functional and tested to some extent, this project is still in early development phase: don't use in production or critical environments yet.</span> +<style scoped> +.mobile_hide { + visibility: hidden; + display: none; +} +img { + visibility: hidden; + display: none; +} +li { + margin: 10px; +} + +@media only screen and (min-width: 768px) { + .mobile_hide { + visibility: visible; + display: inherit; + } + img { + visibility: visible; + display: inherit; + } + li { + margin: 0px; + } +} + +.mobile_show { + visibility: visible; + display: inherit; +} +@media only screen and (min-width: 768px) { + .mobile_show { + visibility: hidden; + display: none; + } +} +</style> + # passt: Plug A Simple Socket Transport _passt_ implements a translation layer between a Layer-2 network interface and @@ -13,12 +52,13 @@ native Layer-4 sockets (TCP, UDP, ICMP/ICMPv6 echo) on a host. It doesn't require any capabilities or privileges, and it can be used as a simple replacement for Slirp. +<div class="mobile_hide"> <picture> <source type="image/webp" srcset="/builds/latest/web/passt_overview.webp"> <source type="image/png" srcset="/builds/latest/web/passt_overview.png"> <img src="/builds/latest/web/passt_overview.png" usemap="#image-map" class="bright" style="z-index: 20; position: relative;" alt="Overview diagram of passt"> </picture> -<map name="image-map" id="map_overview"> +<map name="image-map" id="map_overview" class="mobile_hide"> <area class="map_area" target="_blank" href="https://man7.org/linux/man-pages/man7/tcp.7.html" coords="229,275,246,320,306,294,287,249" shape="poly"> <area class="map_area" target="_blank" href="https://lwn.net/Articles/420799/" coords="230,201,243,246,297,232,289,186" shape="poly"> <area class="map_area" target="_blank" href="https://man7.org/linux/man-pages/man7/udp.7.html" coords="234,129,236,175,297,169,293,126" shape="poly"> @@ -50,6 +90,7 @@ replacement for Slirp. <area class="map_area" target="_blank" href="/passt/tree/conf.c" coords="989,294,1040,264,1089,280,986,344" shape="poly"> </map> <canvas id="map_highlight" style="border: 0px; z-index: 10; position: fixed; pointer-events: none"></canvas> +</div> <script> function canvas_position(el) { var rect = el.getBoundingClientRect(); @@ -116,11 +157,13 @@ destination address are moved directly between Layer-4 sockets, avoiding Layer-2 translations, using the _splice_(2) and _recvmmsg_(2)/_sendmmsg_(2) system calls for TCP and UDP, respectively. +<div class="mobile_hide"> <picture> <source type="image/webp" srcset="/builds/latest/web/pasta_overview.webp"> <source type="image/png" srcset="/builds/latest/web/pasta_overview.png"> <img src="/builds/latest/web/passt_overview.png" class="bright" style="z-index: 20; position: relative;" alt="Overview diagram of pasta"> </picture> +</div> - [Motivation](#motivation) - [Features](#features) @@ -408,56 +451,62 @@ is fully configurable with command line options. <link rel="stylesheet" type="text/css" href="/static/asciinema-player.css" /> <script src="/static/asciinema-player.min.js"></script> -<style scoped> -.small_video { -} -@media (min-width: 1500px) { - .small_video { - display: grid; - grid-template-columns: 1fr 1fr; - } -} -</style> -<div class="small_video"> +<div class="mobile_hide" id="demo_pasta_div" style="display: grid; grid-template-columns: 1fr 1fr;"> <div id="demo_pasta" style="width: 99%;"></div> <div id="demo_podman" style="width: 99%;"></div> </div> <script> -demo_pasta_player = AsciinemaPlayer.create('/builds/latest/web/demo_pasta.cast', - document.getElementById('demo_pasta'), - { cols: 130, rows: 41, - preload: true, poster: 'npt:0:4' - }); - -demo_podman_player = AsciinemaPlayer.create('/builds/latest/web/demo_podman.cast', - document.getElementById('demo_podman'), - { cols: 130, rows: 41, - preload: true, poster: 'npt:0:4' - }); +if (getComputedStyle(document.getElementById('demo_pasta_div'))['visibility'] == "visible") { + demo_pasta_player = AsciinemaPlayer.create('/builds/latest/web/demo_pasta.cast', + document.getElementById('demo_pasta'), + { cols: 130, rows: 41, + preload: true, poster: 'npt:0:4' + }); + + demo_podman_player = AsciinemaPlayer.create('/builds/latest/web/demo_podman.cast', + document.getElementById('demo_podman'), + { cols: 130, rows: 41, + preload: true, poster: 'npt:0:4' + }); +} </script> +<div class="mobile_show"> + <p><a href="/builds/latest/web/demo_pasta.html">Overview of pasta functionality</a></p> + <p><a href="/builds/latest/web/demo_podman.html">Overview of Podman operation with pasta</a></p> +</div> ### passt -<div id="demo_passt" style="width: 70%; height: auto; max-height: 90%"></div> +<div class="mobile_hide" id="demo_passt" style="width: 70%; height: auto; max-height: 90%"></div> <script> -demo_passt_player = AsciinemaPlayer.create('/builds/latest/web/demo_passt.cast', - document.getElementById('demo_passt'), - { cols: 130, rows: 41, - preload: true, poster: 'npt:0:4' - }); +if (getComputedStyle(document.getElementById('demo_passt'))['visibility'] == "visible") { + demo_passt_player = AsciinemaPlayer.create('/builds/latest/web/demo_passt.cast', + document.getElementById('demo_passt'), + { cols: 130, rows: 41, + preload: true, poster: 'npt:0:4' + }); +} </script> +<div class="mobile_show"> + <p><a href="/builds/latest/web/demo_passt.html">Overview of passt functionality</a></p> +</div> ## Continuous Integration -<div id="ci" style="width: 90%; height: auto; max-height: 90%"></div> +<div class="mobile_hide" id="ci" style="width: 90%; height: auto; max-height: 90%"></div> <script> -ci_player = AsciinemaPlayer.create('/builds/latest/web/ci.cast', - document.getElementById('ci'), - { cols: 240, rows: 51, poster: 'npt:999:0' } - ); +if (getComputedStyle(document.getElementById('ci'))['visibility'] == "visible") { + ci_player = AsciinemaPlayer.create('/builds/latest/web/ci.cast', + document.getElementById('ci'), + { cols: 240, rows: 51, poster: 'npt:999:0' } + ); +} </script> -<div><script src="/builds/latest/web/ci.js"></script></div> +<div class="mobile_hide"><script src="/builds/latest/web/ci.js"></script></div> +<div class="mobile_show"> + <p><a href="/builds/latest/web/ci.html">Continuous integration test run</a></p> +</div> Test logs [here](/builds/latest/test/). diff --git a/doc/ci.html b/doc/ci.html new file mode 100644 index 0000000..46a6e48 --- /dev/null +++ b/doc/ci.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"/> +<title>Continuous integration test run</title> +<link rel="stylesheet" type="text/css" href="/static/asciinema-player.css" /> +<script src="/static/asciinema-player.min.js"></script> +</head> +<body style="margin: 0"> +<div id="ci" style="height: 100vh; width: 100vw"></div> +<script> +AsciinemaPlayer.create('/builds/latest/web/ci.cast', + document.getElementById('ci'), + { cols: 240, rows: 51, fit: "both", + preload: true, poster: 'npt:0:4' + }); +</script> +</body> +</html> diff --git a/doc/demo_passt.html b/doc/demo_passt.html new file mode 100644 index 0000000..1cef904 --- /dev/null +++ b/doc/demo_passt.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"/> +<title>demo: Overview of passt functionality</title> +<link rel="stylesheet" type="text/css" href="/static/asciinema-player.css" /> +<script src="/static/asciinema-player.min.js"></script> +</head> +<body style="margin: 0"> +<div id="demo_passt" style="height: 100vh; width: 100vw"></div> +<script> +AsciinemaPlayer.create('/builds/latest/web/demo_passt.cast', + document.getElementById('demo_pasta'), + { cols: 130, rows: 41, fit: "both", + preload: true, poster: 'npt:0:4' + }); +</script> +</body> +</html> diff --git a/doc/demo_pasta.html b/doc/demo_pasta.html new file mode 100644 index 0000000..dc4101b --- /dev/null +++ b/doc/demo_pasta.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"/> +<title>demo: Overview of pasta functionality</title> +<link rel="stylesheet" type="text/css" href="/static/asciinema-player.css" /> +<script src="/static/asciinema-player.min.js"></script> +</head> +<body style="margin: 0"> +<div id="demo_pasta" style="height: 100vh; width: 100vw"></div> +<script> +AsciinemaPlayer.create('/builds/latest/web/demo_pasta.cast', + document.getElementById('demo_pasta'), + { cols: 130, rows: 41, fit: "both", + preload: true, poster: 'npt:0:4' + }); +</script> +</body> +</html> diff --git a/doc/demo_podman.html b/doc/demo_podman.html new file mode 100644 index 0000000..33cd9e8 --- /dev/null +++ b/doc/demo_podman.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"/> +<title>demo: Overview of Podman operation with pasta</title> +<link rel="stylesheet" type="text/css" href="/static/asciinema-player.css" /> +<script src="/static/asciinema-player.min.js"></script> +</head> +<body style="margin: 0"> +<div id="demo_podman" style="height: 100vh; width: 100vw"></div> +<script> +AsciinemaPlayer.create('/builds/latest/web/demo_podman.cast', + document.getElementById('demo_podman'), + { cols: 130, rows: 41, fit: "both", + preload: true, poster: 'npt:0:4' + }); +</script> +</body> +</html> diff --git a/hooks/pre-push b/hooks/pre-push index 73dac94..678ca29 100755 --- a/hooks/pre-push +++ b/hooks/pre-push @@ -62,6 +62,7 @@ for pic in passt_overview pasta_overview; do cwebp -preset drawing -q 10 "doc/${pic}.png" -o "doc/${pic}.webp" scp "doc/${pic}.png" "doc/${pic}.png" "${USER_HOST}:${WEB}/" done +scp doc/*.html "${USER_HOST}:${WEB}/" ssh "${USER_HOST}" "mv ${LATEST} ${AWAY}" ssh "${USER_HOST}" "mv ${TEMP} ${LATEST}" |