harpomaxx commited on
Commit
3711b12
1 Parent(s): 445e135

add minimal ui

Browse files
app/dga-classifier-service.R CHANGED
@@ -40,3 +40,7 @@ function(domain){
40
  prediction<-predict(model,domain_encoded)
41
  return(list(modelid=modelid,domain=domain,class=ifelse(prediction[1]>0.9,1,0),probability=prediction[1]))
42
  }
 
 
 
 
 
40
  prediction<-predict(model,domain_encoded)
41
  return(list(modelid=modelid,domain=domain,class=ifelse(prediction[1]>0.9,1,0),probability=prediction[1]))
42
  }
43
+
44
+ #* @assets ./static /
45
+ list()
46
+
app/static/index.html ADDED
@@ -0,0 +1,36 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Fast API 🤗 Space served with Uvicorn</title>
7
+ <link rel="stylesheet" href="style.css" />
8
+ <script type="module" src="script.js"></script>
9
+ </head>
10
+ <body>
11
+ <main>
12
+ <section id="text-gen">
13
+ <h1>Simple DGA detector using 1DCNN </h1>
14
+ <p>
15
+ Model:
16
+ <a
17
+ href="https://huggingface.co/harpomaxx/dga-detector"
18
+ rel="noreferrer"
19
+ target="_blank"
20
+ >harpomaxx/dga-detector
21
+ </a>
22
+ </p>
23
+ <form class="text-gen-form">
24
+ <label for="text-gen-input">Check for a domain</label>
25
+ <input
26
+ id="text-gen-input"
27
+ type="text"
28
+ value="www.google.com"
29
+ />
30
+ <button id="text-gen-submit">Submit</button>
31
+ <p class="text-gen-output"></p>
32
+ </form>
33
+ </section>
34
+ </main>
35
+ </body>
36
+ </html>
app/static/script.js ADDED
@@ -0,0 +1,20 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ const textGenForm = document.querySelector(".text-gen-form");
2
+
3
+ const translateText = async (text) => {
4
+ const inferResponse = await fetch(`predict?domain=${text}`);
5
+ const inferJson = await inferResponse.json();
6
+ console.log(inferResponse);
7
+ console.log(inferJson);
8
+ const res = 'The probability of being DGA is : ' + inferJson.probability
9
+ return res
10
+
11
+ };
12
+
13
+ textGenForm.addEventListener("submit", async (event) => {
14
+ event.preventDefault();
15
+
16
+ const textGenInput = document.getElementById("text-gen-input");
17
+ const textGenParagraph = document.querySelector(".text-gen-output");
18
+
19
+ textGenParagraph.textContent = await translateText(textGenInput.value);
20
+ });
app/static/style.css ADDED
@@ -0,0 +1,45 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ body {
2
+ --text: hsl(0 0% 15%);
3
+ padding: 2.5rem;
4
+ font-family: sans-serif;
5
+ color: var(--text);
6
+ }
7
+
8
+ body.dark-theme {
9
+ --text: hsl(0 0% 90%);
10
+ background-color: hsl(223 39% 7%);
11
+ }
12
+
13
+ main {
14
+ max-width: 80rem;
15
+ text-align: center;
16
+ }
17
+
18
+ section {
19
+ display: flex;
20
+ flex-direction: column;
21
+ align-items: center;
22
+ }
23
+
24
+ a {
25
+ color: var(--text);
26
+ }
27
+
28
+ form {
29
+ width: 30rem;
30
+ margin: 0 auto;
31
+ }
32
+
33
+ input {
34
+ width: 100%;
35
+ }
36
+
37
+ button {
38
+ cursor: pointer;
39
+ }
40
+
41
+ .text-gen-output {
42
+ min-height: 1.2rem;
43
+ margin: 1rem;
44
+ border: 0.5px solid grey;
45
+ }