Hugging Face's logo

Spaces:
Bhargavitippareddy
/
tagging
Sleeping

App Files Community
Bhargavitippareddy commited on
Commit
fe37323
·
verified ·
1 Parent(s): 59baa55

Upload 2 files

Browse files
Files changed (2) hide show
  1. templates/index (1).html +151 -0
  2. templates/index__working.html +146 -0
templates/index (1).html ADDED
@@ -0,0 +1,151 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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, shrink-to-fit=no" />
6
+ <meta name="description" content="" />
7
+ <meta name="author" content="" />
8
+ <title>Predicting TagsEnhancing Developer Support: Automated Tagging on Stack Overflow</title>
9
+ <link rel="icon" type="image/x-icon" href="static/assets/favicon.ico" />
10
+ <!-- Font Awesome icons (free version)-->
11
+ <script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
12
+ <!-- Google fonts-->
13
+ <link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet" />
14
+ <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet" />
15
+ <!-- Core theme CSS (includes Bootstrap)-->
16
+ <link href="static/css/styles.css" rel="stylesheet" />
17
+ </head>
18
+ <body id="page-top">
19
+ <!-- Navigation-->
20
+ <nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav">
21
+ <div class="container px-4 px-lg-5">
22
+ <a class="navbar-brand" href="#page-top">Home</a>
23
+ <button class="navbar-toggler navbar-toggler-right" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
24
+ Menu
25
+ <i class="fas fa-bars"></i>
26
+ </button>
27
+ <div class="collapse navbar-collapse" id="navbarResponsive">
28
+ <ul class="navbar-nav ms-auto">
29
+ <li class="nav-item"><a class="nav-link" href="#about">Background</a></li>
30
+ <li class="nav-item"><a class="nav-link" href="#projects">Summary</a></li>
31
+ <li class="nav-item"><a class="nav-link" href="#signup">tag_predictor</a></li>
32
+ </ul>
33
+ </div>
34
+ </div>
35
+ </nav>
36
+ <!-- Masthead-->
37
+ <header class="masthead">
38
+ <div class="container px-4 px-lg-5 d-flex h-100 align-items-center justify-content-center">
39
+ <div class="d-flex justify-content-center">
40
+ <div class="text-center">
41
+ <h1 class="mx-auto my-0 text-uppercase">Automated Tagging</h1>
42
+ <h2 class="text-white-50 mx-auto mt-2 mb-5">Predicting Tags: Enhancing Developer Support by automated tagging of stackoverflow questions.</h2>
43
+ <a class="btn btn-primary" href="#about">Get Started</a>
44
+ </div>
45
+ </div>
46
+ </div>
47
+ </header>
48
+ <!-- About-->
49
+ <section class="about-section text-center" id="about">
50
+ <div class="container px-4 px-lg-5">
51
+ <div class="row gx-4 gx-lg-5 justify-content-center">
52
+ <div class="col-lg-8">
53
+ <h2 class="text-white mb-4">Manual tagging??</h2>
54
+ <p class="text-white-50">
55
+ Manually tagging questions on Stack Overflow is time-consuming and often inaccurate. This leads to poor discoverability, inconsistent categorization, and slower response times. An automated tagging system helps developers classify their questions efficiently, ensuring they reach the right audience for faster and more relevant answers.
56
+ </p>
57
+ </div>
58
+ </div>
59
+ <img class="img-fluid" src="static/assets/img/stack1.png" alt="..." />
60
+ </div>
61
+ </section>
62
+ <!-- Projects-->
63
+ <section class="projects-section bg-light" id="projects">
64
+ <div class="container px-4 px-lg-5">
65
+ <!-- Featured Project Row-->
66
+ <div class="row gx-0 mb-4 mb-lg-5 align-items-center">
67
+ <div class="col-xl-8 col-lg-7"><img class="img-fluid mb-3 mb-lg-0" src="static/assets/img/tags.png" alt="..." /></div>
68
+ <div class="col-xl-4 col-lg-5">
69
+ <div class="featured-text text-center text-lg-left">
70
+ <h4>Classes</h4>
71
+ <p class="text-black-50 mb-0">Model has been trained on more than 8 thousand tags. Most of the tags are covered in training.</p>
72
+ </div>
73
+ </div>
74
+ </div>
75
+ <!-- Project One Row-->
76
+ <div class="row gx-0 mb-5 mb-lg-0 justify-content-center">
77
+ <div class="col-lg-6"><img class="img-fluid" src="static/assets/img/logistic.png" alt="..." /></div>
78
+ <div class="col-lg-6">
79
+ <div class="bg-black text-center h-100 project">
80
+ <div class="d-flex h-100">
81
+ <div class="project-text w-100 my-auto text-center text-lg-left">
82
+ <h4 class="text-white">Model</h4>
83
+ <p class="mb-0 text-white-50">This predictor is using logistic regression model</p>
84
+ </div>
85
+ </div>
86
+ </div>
87
+ </div>
88
+ </div>
89
+ <!-- Project Two Row-->
90
+ <div class="row gx-0 justify-content-center">
91
+ <div class="col-lg-6"><img class="img-fluid" src="static/assets/img/Flask_logo.png" alt="..." /></div>
92
+ <div class="col-lg-6 order-lg-first">
93
+ <div class="bg-black text-center h-100 project">
94
+ <div class="d-flex h-100">
95
+ <div class="project-text w-100 my-auto text-center text-lg-right">
96
+ <h4 class="text-white">Web Framework</h4>
97
+ <p class="mb-0 text-white-50">This is created with Flask web framework</p>
98
+ </div>
99
+ </div>
100
+ </div>
101
+ </div>
102
+ </div>
103
+ </div>
104
+ </section>
105
+ <section class="projects-section tag_predictor" id="projects">
106
+
107
+ <!-- Signup-->
108
+ <section class="signup-section" id="signup">
109
+ <div class="container px-4 px-lg-5">
110
+ <div class="row gx-4 gx-lg-5">
111
+ <div class="col-md-10 col-lg-8 mx-auto text-center">
112
+ <h2 class="text-white mb-5">Tag Predictor</h2>
113
+ <form id="predict-form">
114
+ <textarea name="query" class="form-control" placeholder="Enter your query here..." rows="4"></textarea>
115
+ <button class="btn btn-primary mt-3">Predict</button>
116
+ </form>
117
+
118
+ <div id="tags-container">
119
+ <h2 class="text-white mb-5">Predicted Tags</h2>
120
+ <div id="tags-output" class="tag-box"></div>
121
+ </div>
122
+ </div>
123
+ <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
124
+ <script>
125
+ $("#predict-form").submit(function(event) {
126
+ event.preventDefault();
127
+
128
+ $.ajax({
129
+ type: "POST",
130
+ url: "/predict",
131
+ data: $(this).serialize(),
132
+ dataType: "json",
133
+ success: function(response) {
134
+ $("#tags-output").html(""); // Clear old tags
135
+
136
+ response.tags.forEach(tag => {
137
+ $("#tags-output").append(`<span class="tag-box">${tag}</span>`);
138
+ });
139
+ },
140
+ error: function(xhr, status, error) {
141
+ $("#tags-output").html("<strong>Error processing request. Please try again.</strong>");
142
+ }
143
+ });
144
+ });
145
+ </script>
146
+ </div>
147
+ </div>
148
+ </div>
149
+ </section>
150
+ </body>
151
+ </html>
templates/index__working.html ADDED
@@ -0,0 +1,146 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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, shrink-to-fit=no" />
6
+ <meta name="description" content="" />
7
+ <meta name="author" content="" />
8
+ <title>Predicting TagsEnhancing Developer Support: Automated Tagging on Stack Overflow</title>
9
+ <link rel="icon" type="image/x-icon" href="static/assets/favicon.ico" />
10
+ <!-- Font Awesome icons (free version)-->
11
+ <script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
12
+ <!-- Google fonts-->
13
+ <link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet" />
14
+ <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet" />
15
+ <!-- Core theme CSS (includes Bootstrap)-->
16
+ <link href="static/css/styles.css" rel="stylesheet" />
17
+ </head>
18
+ <body id="page-top">
19
+ <!-- Navigation-->
20
+ <nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav">
21
+ <div class="container px-4 px-lg-5">
22
+ <a class="navbar-brand" href="#page-top">Start Bootstrap</a>
23
+ <button class="navbar-toggler navbar-toggler-right" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
24
+ Menu
25
+ <i class="fas fa-bars"></i>
26
+ </button>
27
+ <div class="collapse navbar-collapse" id="navbarResponsive">
28
+ <ul class="navbar-nav ms-auto">
29
+ <li class="nav-item"><a class="nav-link" href="#about">Background</a></li>
30
+ <li class="nav-item"><a class="nav-link" href="#projects">Summary</a></li>
31
+ <li class="nav-item"><a class="nav-link" href="#signup">tag_predictor</a></li>
32
+ </ul>
33
+ </div>
34
+ </div>
35
+ </nav>
36
+ <!-- Masthead-->
37
+ <header class="masthead">
38
+ <div class="container px-4 px-lg-5 d-flex h-100 align-items-center justify-content-center">
39
+ <div class="d-flex justify-content-center">
40
+ <div class="text-center">
41
+ <h1 class="mx-auto my-0 text-uppercase">Automated Tagging</h1>
42
+ <h2 class="text-white-50 mx-auto mt-2 mb-5">Predicting Tags: Enhancing Developer Support by automated tagging of stackoverflow questions.</h2>
43
+ <a class="btn btn-primary" href="#about">Get Started</a>
44
+ </div>
45
+ </div>
46
+ </div>
47
+ </header>
48
+ <!-- About-->
49
+ <section class="about-section text-center" id="about">
50
+ <div class="container px-4 px-lg-5">
51
+ <div class="row gx-4 gx-lg-5 justify-content-center">
52
+ <div class="col-lg-8">
53
+ <h2 class="text-white mb-4">Manual tagging??</h2>
54
+ <p class="text-white-50">
55
+ Manually tagging questions on Stack Overflow is time-consuming and often inaccurate. This leads to poor discoverability, inconsistent categorization, and slower response times. An automated tagging system helps developers classify their questions efficiently, ensuring they reach the right audience for faster and more relevant answers.
56
+ </p>
57
+ </div>
58
+ </div>
59
+ <img class="img-fluid" src="static/assets/img/stack1.png" alt="..." />
60
+ </div>
61
+ </section>
62
+ <!-- Projects-->
63
+ <section class="projects-section bg-light" id="projects">
64
+ <div class="container px-4 px-lg-5">
65
+ <!-- Featured Project Row-->
66
+ <div class="row gx-0 mb-4 mb-lg-5 align-items-center">
67
+ <div class="col-xl-8 col-lg-7"><img class="img-fluid mb-3 mb-lg-0" src="static/assets/img/tags.png" alt="..." /></div>
68
+ <div class="col-xl-4 col-lg-5">
69
+ <div class="featured-text text-center text-lg-left">
70
+ <h4>Classes</h4>
71
+ <p class="text-black-50 mb-0">Model has been trained on more than 8 thousand tags. Most of the tags are covered in training.</p>
72
+ </div>
73
+ </div>
74
+ </div>
75
+ <!-- Project One Row-->
76
+ <div class="row gx-0 mb-5 mb-lg-0 justify-content-center">
77
+ <div class="col-lg-6"><img class="img-fluid" src="static/assets/img/logistic.png" alt="..." /></div>
78
+ <div class="col-lg-6">
79
+ <div class="bg-black text-center h-100 project">
80
+ <div class="d-flex h-100">
81
+ <div class="project-text w-100 my-auto text-center text-lg-left">
82
+ <h4 class="text-white">Model</h4>
83
+ <p class="mb-0 text-white-50">This predictor is using logistic regression model</p>
84
+ </div>
85
+ </div>
86
+ </div>
87
+ </div>
88
+ </div>
89
+ <!-- Project Two Row-->
90
+ <div class="row gx-0 justify-content-center">
91
+ <div class="col-lg-6"><img class="img-fluid" src="static/assets/img/Flask_logo.png" alt="..." /></div>
92
+ <div class="col-lg-6 order-lg-first">
93
+ <div class="bg-black text-center h-100 project">
94
+ <div class="d-flex h-100">
95
+ <div class="project-text w-100 my-auto text-center text-lg-right">
96
+ <h4 class="text-white">Web Framework</h4>
97
+ <p class="mb-0 text-white-50">This is created with Flask web framework</p>
98
+ </div>
99
+ </div>
100
+ </div>
101
+ </div>
102
+ </div>
103
+ </div>
104
+ </section>
105
+ <section class="projects-section tag_predictor" id="projects">
106
+
107
+ <!-- Signup-->
108
+ <section class="signup-section" id="signup">
109
+ <div class="container text-center">
110
+ <h2 class="text-white mb-5">Tag Predictor</h2>
111
+ <form id="predict-form">
112
+ <textarea name="query" class="form-control" placeholder="Enter your query here..." rows="4"></textarea>
113
+ <button class="btn btn-primary mt-3">Predict</button>
114
+ </form>
115
+
116
+ <div id="tags-container">
117
+ <h2 class="text-white mb-5">Predicted Tags</h2>
118
+ <div id="tags-output" class="tag-box"></div>
119
+ </div>
120
+ </div>
121
+ <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
122
+ <script>
123
+ $("#predict-form").submit(function(event) {
124
+ event.preventDefault();
125
+
126
+ $.ajax({
127
+ type: "POST",
128
+ url: "/predict",
129
+ data: $(this).serialize(),
130
+ dataType: "json",
131
+ success: function(response) {
132
+ $("#tags-output").html(""); // Clear old tags
133
+
134
+ response.tags.forEach(tag => {
135
+ $("#tags-output").append(`<span class="tag-box">${tag}</span>`);
136
+ });
137
+ },
138
+ error: function(xhr, status, error) {
139
+ $("#tags-output").html("<strong>Error processing request. Please try again.</strong>");
140
+ }
141
+ });
142
+ });
143
+ </script>
144
+
145
+ </section>
146
+ </html>