Skip to content

Commit ac06c93

Browse files
gpotter2gpotter2
committed
Final prototype
1 parent 2af66c4 commit ac06c93

4 files changed

Lines changed: 208 additions & 19 deletions

File tree

‎src/components/SponsorCard.vue‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<template>
2+
<v-card variant="flat" color="transparent">
3+
<v-card-text>
4+
<v-list-item class="px-0" :prepend-avatar="'https://avatars.githubusercontent.com/u/' + props.userid + '?s=80'">
5+
<v-list-item-title class="text-body-2 text-white">
6+
<a :href="'https://github.com/' + props.user" class="text-decoration-none">{{ props.user }}</a>
7+
</v-list-item-title>
8+
</v-list-item>
9+
<iframe :src="'https://github.com/sponsors/' + props.user + '/button'" :title="'Sponsor ' + props.user"
10+
height="32" width="100%" style="border: 0; border-radius: 6px; filter: invert(80%);">
11+
</iframe>
12+
</v-card-text>
13+
</v-card>
14+
</template>
15+
16+
<script setup lang="ts">
17+
const props = defineProps(['user', 'userid'])
18+
</script>
19+
20+
<style>
21+
/* Don't display different color for visited links */
22+
a,
23+
a:visited {
24+
color: inherit;
25+
}
26+
</style>

‎src/layouts/default/Default.vue‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,19 @@
33
<default-bar />
44

55
<default-view />
6+
7+
<v-footer class="text-center d-flex flex-column">
8+
<v-breadcrumbs divider="●">
9+
<v-breadcrumbs-item>© The Scapy community</v-breadcrumbs-item>
10+
<v-breadcrumbs-divider />
11+
<v-breadcrumbs-item>2023</v-breadcrumbs-item>
12+
<v-breadcrumbs-divider />
13+
<v-breadcrumbs-item><a href="https://scapy.net">scapy.net</a></v-breadcrumbs-item>
14+
</v-breadcrumbs>
15+
<p>
16+
This website is published under <a href="https://creativecommons.org/licenses/by-sa/4.0/">CC-BY-SA-2.5</a>
17+
</p>
18+
</v-footer>
619
</v-app>
720
</template>
821

@@ -15,3 +28,11 @@ import { provide, ref } from 'vue'
1528
const downloads_section = ref<HTMLDivElement | null>(null);
1629
provide('downloads_section', downloads_section);
1730
</script>
31+
32+
<style scoped>
33+
/* Don't display different color for visited links */
34+
a,
35+
a:visited {
36+
color: inherit;
37+
}
38+
</style>

‎src/plugins/vuetify.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ export default createVuetify({
1818
themes: {
1919
dark: {
2020
colors: {
21-
primary: '#1867C0',
22-
secondary: '#5CBBF6',
21+
primary: '#68d665',
22+
secondary: '#BBDEFB',
2323
},
2424
},
2525
},

‎src/views/Home.vue‎

Lines changed: 159 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
| Welcome to Scapy<br />
1717
| Version {{ version }}<br />
1818
| <br />
19-
| <span class='text-blue-lighten-4'><a href="https://github.com/secdev/scapy"><span
19+
| <span class='text-secondary'><a href="https://github.com/secdev/scapy"><span
2020
class="hidden-xs">https://github.com/</span>secdev/scapy</a>
2121
</span><br />
2222
| <br />
@@ -36,16 +36,15 @@
3636
<v-row>
3737
<!-- What is Scapy -->
3838
<v-col cols="12" lg="7" class="d-flex">
39-
<v-card variant="tonal">
40-
<v-card-title>What is Scapy?</v-card-title>
39+
<v-card variant="tonal" title="What is Scapy?">
4140
<v-card-text>
4241
<v-row>
4342
<v-col cols="12" sm="4">
4443
<p class="pb-2 text-body-1">
4544
<span class="font-weight-bold">Manipulate packets</span>
4645
</p>
4746
<p>
48-
Scapy is powerful <span class="text-lime-lighten-2">interactive packet manipulation libary</span>
47+
Scapy is a powerful <span class="text-primary">interactive packet manipulation libary</span>
4948
written in <span>Python</span>.
5049
Scapy is able to forge or decode packets of a wide number of protocols, send them on the wire, capture
5150
them, match requests and replies, and much more.
@@ -56,8 +55,7 @@
5655
<span class="font-weight-bold">A REPL and a Library</span>
5756
</p>
5857
<p>
59-
Scapy can be used <span class="text-lime-lighten-2">as a REPL</span>, to quickly craft-and-send,
60-
sniff.. custom packets over the network, or <span class="text-lime-lighten-2">as
58+
Scapy can be used <span class="text-primary">as a REPL</span> or <span class="text-primary">as
6159
a library</span>. It provides all the tools and documentation to quickly add custom network layers.
6260
</p>
6361
</v-col>
@@ -67,7 +65,7 @@
6765
</p>
6866
<p>
6967
Scapy runs natively on Linux, Windows, OSX and on most Unixes with libpcap.<br />
70-
Starting from version 2.5.0+, it has has support for <span class="text-lime-lighten-2">Python
68+
Starting from version 2.5.0+, it has has support for <span class="text-primary">Python
7169
3.7+</span> (and PyPy).
7270
</p>
7371
</v-col>
@@ -77,29 +75,162 @@
7775
</v-col>
7876
<!-- Shell demo -->
7977
<v-col cols="12" lg="5" class="d-flex flex-column">
80-
<v-card variant="tonal" class="full-height flex-grow-1 flex-shrink-1">
81-
<v-card-title>Shell demo</v-card-title>
78+
<v-card variant="tonal" title="Shell demo" class="flex-grow-1 flex-shrink-1">
8279
<v-card-text class="text-body-2">
8380
<pre style="white-space: pre-wrap;" v-html="DEMO_CODE"></pre>
8481
</v-card-text>
8582
</v-card>
8683
</v-col>
8784
<!-- Documentation -->
88-
<v-col cols="12">
89-
<v-card variant="tonal">
90-
<v-card-title>Documentation</v-card-title>
85+
<v-col cols="12" lg="8">
86+
<v-card variant="tonal" title="Documentation">
87+
<v-card-text class="text-body-2 align-content-center">
88+
<p>
89+
The official Scapy documentation can be found online on readthedocs:
90+
</p>
91+
<v-row justify="center" class="py-3">
92+
<v-col cols="auto">
93+
<v-btn href="https://scapy.readthedocs.io/" color="secondary">
94+
Documentation
95+
<v-icon class="ml-1">mdi-open-in-new</v-icon>
96+
</v-btn>
97+
</v-col>
98+
</v-row>
99+
<p>
100+
But there are other good introductions out there, most notably:
101+
<ul class="ml-5">
102+
<li><a class="text-secondary"
103+
href="https://guedou.github.io/talks/2022_GreHack/Scapy in 0x30 minutes.slides.html">Scapy
104+
in 0x30 minutes</a> (<a class="text-secondary"
105+
href="https://github.com/guedou/guedou.github.io/blob/master/talks/2022_GreHack/Scapy%20in%200x30%20minutes.ipynb">notebook</a>)
106+
by guedou</li>
107+
<li><a class="text-secondary"
108+
href="https://github.com/secdev/scapy/blob/master/doc/notebooks/Scapy%20in%2015%20minutes.ipynb">Scapy
109+
in 15 minutes (or longer)</a>, made guedou and p-l-</li>
110+
<li><a class="text-secondary" href="https://guedou.github.io/talks/2021_sharkfest/slides.pdf">Scapy
111+
Turned 18. Boy They Grow Up Fast, Don’t They - SharkFest’21 Keynote</a> (<a class="text-secondary"
112+
href="https://www.youtube.com/watch?v=krZ3fOCTlfs">video</a>), by guedou</li>
113+
<li>ThePacketGeek's <a class="text-secondary"
114+
href="https://thepacketgeek.com/scapy/building-network-tools/">"Building Network Tools with Scapy
115+
tutorial"</a></li>
116+
<li><a class="text-secondary" href="http://www.oreilly.com/catalog/9780596009632/">Security Power
117+
Tools</a> where Philippe Biondi wrote a complete chapter about Scapy.</li>
118+
<li>A bunch (<a class="text-secondary"
119+
href="https://boutique.ed-diamond.com/home/863-misc-hs-11.html">MISC HS 11</a>, <a
120+
class="text-secondary" href="https://boutique.ed-diamond.com/numeros-deja-parus/354-misc52.html">MISC
121+
52</a>, <a class="text-secondary"
122+
href="https://boutique.ed-diamond.com/les-hors-series/1245-gnulinux-magazine-hs-90.html">GNU HS90</a>)
123+
of articles in French Security Magazines</li>
124+
</ul>
125+
</p>
126+
<p class="mt-2">
127+
This website also hosts several conferences related to Scapy, some of which can provide details regarding
128+
certain parts of Scapy:
129+
<ul class="ml-5">
130+
<li><a class="text-secondary" :href="BASE_URL + 'talk/troopers2022/main.slides.html'">Automotive Network
131+
Scans with Scapy - Troopers 2022
132+
slides</a></li>
133+
<li><a class="text-secondary" :href="BASE_URL + 'talk/troopers2019/index.html'">Automotive Penetration
134+
Testing with Scapy - Troopers 2019
135+
slides</a></li>
136+
<li><a class="text-secondary" :href="BASE_URL + 'talk/scapy_pacsec05.pdf'">Scapy’s PacSec/core05
137+
slides</a> (<a class="text-secondary" :href="BASE_URL + 'talk/scapy_pacsec05.handout.pdf'">printable
138+
version</a>)</li>
139+
<li><a class="text-secondary" :href="BASE_URL + 'talk/scapy_hack.lu.pdf'">Scapy’s Hack.lu 2005 slides</a>
140+
</li>
141+
<li><a class="text-secondary" :href="BASE_URL + 'talk/scapy_Aachen.pdf'">Scapy’s Summerschool Applied IT
142+
Security 2005 slides</a></li>
143+
<li><a class="text-secondary" :href="BASE_URL + 'talk/scapy_T2.pdf'">Scapy’s T2’2005 slides</a></li>
144+
<li><a class="text-secondary" :href="BASE_URL + 'talk/scapy_csw05.pdf'">Scapy’s CanSecWest/core05
145+
slides</a></li>
146+
<li><a class="text-secondary" :href="BASE_URL + 'talk/scapy_lsm2003.pdf'">Scapy’s LSM 2003 slides</a></li>
147+
</ul>
148+
</p>
149+
</v-card-text>
150+
</v-card>
151+
</v-col>
152+
<!-- Maintainers -->
153+
<v-col cols="12" lg="4" class="d-flex flex-column">
154+
<v-card variant="tonal" title="Maintainers" class="flex-grow-1 flex-shrink-1">
91155
<v-card-text class="text-body-2">
92-
The followings are good heads
156+
<v-row>
157+
<v-col cols="6" sm="4" lg="6">
158+
<SponsorCard user="gpotter2" userid="10530980" />
159+
</v-col>
160+
<v-col cols="6" sm="4" lg="6">
161+
<SponsorCard user="p-l-" userid="5064814" />
162+
</v-col>
163+
<v-col cols="6" sm="4" lg="6">
164+
<SponsorCard user="guedou" userid="11683796" />
165+
</v-col>
166+
</v-row>
93167
</v-card-text>
94168
</v-card>
95169
</v-col>
96170
<!-- Downloads -->
97171
<v-col cols="12">
98172
<div ref="downloads_section">
99-
<v-card variant="tonal">
100-
<v-card-title>Downloads</v-card-title>
173+
<v-card variant="tonal" title="Downloads & Installation">
101174
<v-card-text class="text-body-2">
102-
yolo
175+
<p>
176+
There are several ways of installing Scapy, depending on your plateform.
177+
</p>
178+
<p class="pb-3">
179+
Please also have a look at the
180+
full documentation, which contains
181+
<a href="https://scapy.readthedocs.io/en/latest/installation.html" class="text-primary">more
182+
installation
183+
instructions.
184+
</a>
185+
</p>
186+
<v-card color="transparent">
187+
<v-tabs v-model="dllTab" bg-color="primary" density="compact">
188+
<v-tab value="pypi">PyPI</v-tab>
189+
<v-tab value="github">Github</v-tab>
190+
<v-tab value="conda">Conda (forge)</v-tab>
191+
<v-tab value="debian">Debian / Ubuntu</v-tab>
192+
<v-tab value="windows">Windows</v-tab>
193+
<v-tab value="other">More</v-tab>
194+
</v-tabs>
195+
<v-card-text>
196+
<v-window v-model="dllTab">
197+
<v-window-item value="pypi">
198+
<code class="bash"><span class="text-secondary">pip install scapy</span></code>
199+
</v-window-item>
200+
<v-window-item value="github">
201+
<code
202+
class="bash"><span class="text-secondary">pip install https://github.com/secdev/scapy/archive/refs/heads/master.zip</span></code>
203+
</v-window-item>
204+
<v-window-item value="conda">
205+
<code class="bash"><span class="text-secondary">conda install -c conda-forge scapy</span></code>
206+
</v-window-item>
207+
<v-window-item value="debian">
208+
<code class="bash"><span class="text-secondary">sudo apt install python3-scapy</span></code>
209+
</v-window-item>
210+
<v-window-item value="windows">
211+
<p class="pb-2">
212+
You will need to install <a class="text-secondary" href="https://npcap.com/#download">Npcap</a>
213+
(included if you have Wireshark), then use another installation method (PyPI, Github, etc.)
214+
</p>
215+
<v-btn href="https://npcap.com/#download" color="secondary">
216+
Download Npcap
217+
<v-icon class="ml-1">mdi-open-in-new</v-icon>
218+
</v-btn>
219+
</v-window-item>
220+
<v-window-item value="other">
221+
<p class="pb-2">
222+
More platform-specific instructions (MacOS, BSD...) are available in the full documentation:
223+
</p>
224+
<v-btn
225+
href="https://scapy.readthedocs.io/en/latest/installation.html#platform-specific-instructions"
226+
color="secondary">
227+
Other instructions
228+
<v-icon class="ml-1">mdi-open-in-new</v-icon>
229+
</v-btn>
230+
</v-window-item>
231+
</v-window>
232+
</v-card-text>
233+
</v-card>
103234
</v-card-text>
104235
</v-card>
105236
</div>
@@ -111,6 +242,7 @@
111242

112243
<script lang="ts" setup>
113244
import ScapyS from '@/components/ScapyS.vue'
245+
import SponsorCard from '@/components/SponsorCard.vue'
114246
115247
import { useDisplay } from 'vuetify';
116248
import { inject, computed, onMounted, ref } from 'vue';
@@ -121,7 +253,6 @@ const version = '2.5.0';
121253
const animationOk = ref(false);
122254
const downloads_section = inject<Ref<HTMLDivElement | null>>('downloads_section');
123255
124-
125256
/* Wait 1s (animation time), if big screen, then display Home */
126257
const { smAndDown } = useDisplay();
127258
onMounted(() => {
@@ -166,6 +297,12 @@ Received 2 packets, got 1 answers, remaining 0 packets
166297
<span class="text-blue">&gt;&gt;&gt;</span> resp[ICMP]
167298
&lt;<span class="text-red">ICMP</span> <span class="text-blue">type</span>=<span class="text-purple">echo-reply</span> <span class="text-blue">code</span>=<span class="text-purple">0</span> <span class="text-blue">chksum</span>=<span class="text-purple">0xffff</span> <span class="text-blue">id</span>=<span class="text-purple">0x0</span> <span class="text-blue">seq</span>=<span class="text-purple">0x0</span> |&gt;
168299
`;
300+
301+
/* Download tabs */
302+
const dllTab = ref("pypi");
303+
304+
/* Export base URL */
305+
const BASE_URL = import.meta.env.BASE_URL;
169306
</script>
170307

171308
<style scoped>
@@ -180,4 +317,9 @@ a,
180317
a:visited {
181318
color: inherit;
182319
}
320+
321+
/* Bash line */
322+
code.bash:before {
323+
content: '$ ';
324+
}
183325
</style>

0 commit comments

Comments
 (0)