Anwarkh1 commited on
Commit
e5dd1b4
1 Parent(s): d8dbaae

Delete index.html

Browse files
Files changed (1) hide show
  1. index.html +0 -230
index.html DELETED
@@ -1,230 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en" >
3
-
4
- <head>
5
-
6
- <meta charset="UTF-8">
7
-
8
- <link rel="apple-touch-icon" type="image/png" href="https://cpwebassets.codepen.io/assets/favicon/apple-touch-icon-5ae1a0698dcc2402e9712f7d01ed509a57814f994c660df9f7a952f3060705ee.png" />
9
- <meta name="apple-mobile-web-app-title" content="CodePen">
10
-
11
- <link rel="shortcut icon" type="image/x-icon" href="https://cpwebassets.codepen.io/assets/favicon/favicon-aec34940fbc1a6e787974dcd360f2c6b63348d4b1f4e06c77743096d55480f33.ico" />
12
-
13
- <link rel="mask-icon" type="image/x-icon" href="https://cpwebassets.codepen.io/assets/favicon/logo-pin-8f3771b1072e3c38bd662872f6b673a722f4b3ca2421637d5596661b4e2132cc.svg" color="#111" />
14
-
15
-
16
- <title>{{ appName }}</title>
17
- <script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js" type="text/javascript"></script>
18
-
19
-
20
-
21
- <link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css'>
22
-
23
- <style>
24
- /*just bg and body style*/
25
- body{
26
- background-color:#1e2832;
27
- }
28
- .container{
29
- background-color:#1E2832;
30
- padding-bottom:20px;
31
- margin-top:10px;
32
- border-radius:5px;
33
- }
34
- .center{
35
- text-align:center;
36
- }
37
- #top{
38
- margin-top:20px;
39
- }
40
- .btn-container{
41
- background:#fff;
42
- border-radius:5px;
43
- padding-bottom:20px;
44
- margin-bottom:20px;
45
- }
46
- .white{
47
- color:white;
48
- }
49
- .imgupload{
50
- color:#1E2832;
51
- padding-top:40px;
52
- font-size:7em;
53
- }
54
- #namefile{
55
- color:black;
56
- }
57
- h4>strong{
58
- color:#ff3f3f
59
- }
60
- .btn-primary{
61
- border-color: #ff3f3f !important;
62
- color: #ffffff;
63
- text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
64
- background-color: #ff3f3f !important;
65
- border-color: #ff3f3f !important;
66
- }
67
-
68
- /*these two are set to not display at start*/
69
- .imgupload.ok{
70
- display:none;
71
- color:green;
72
- }
73
- .imgupload.stop{
74
- display:none;
75
- color:red;
76
- }
77
-
78
-
79
- /*this sets the actual file input to overlay our button*/
80
- #fileup{
81
- opacity: 0;
82
- -moz-opacity: 0;
83
- filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
84
- width:200px;
85
- cursor: pointer;
86
- position:absolute;
87
- left: 50%;
88
- transform: translateX(-50%);
89
- bottom: 40px;
90
- height: 50px;
91
- }
92
-
93
- /*switch between input and not active input*/
94
- #submitbtn{
95
- padding:5px 50px;
96
- display:none;
97
- }
98
- #fakebtn{
99
- padding:5px 40px;
100
- }
101
-
102
-
103
- /*www.emilianocostanzo.com*/
104
- #sign{
105
- color:#1E2832;
106
- position:fixed;
107
- right:10px;
108
- bottom:10px;
109
- text-shadow:0px 0px 0px #1E2832;
110
- transition:all.3s;
111
- }
112
- #sign:hover{
113
- color:#1E2832;
114
- text-shadow:0px 0px 5px #1E2832;
115
- }
116
- </style>
117
-
118
- <script>
119
- window.console = window.console || function(t) {};
120
- </script>
121
-
122
-
123
-
124
- <script>
125
- if (document.location.search.match(/type=embed/gi)) {
126
- window.parent.postMessage("resize", "*");
127
- }
128
- </script>
129
-
130
-
131
- </head>
132
-
133
- <body translate="no" >
134
- <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet">
135
-
136
- <div class="container center">
137
- <div class="row">
138
- <div class="col-md-12">
139
- <h1 class="white">{{ appName }}</h1>
140
- <p class="white">In this APP , submit is allowed only in case the user uploads a valid image file.</p>
141
- </div>
142
- </div>
143
-
144
- <form name="upload" method="post" action="predict" enctype="multipart/form-data" accept-charset="utf-8">
145
- <div class="row">
146
- <div class="col-md-6 col-md-offset-3 center">
147
- <div class="btn-container">
148
- <!--the three icons: default, ok file (img), error file (not an img)-->
149
- <h1 class="imgupload"><i class="fa fa-file-image-o"></i></h1>
150
- <h1 class="imgupload ok"><i class="fa fa-check"></i></h1>
151
- <h1 class="imgupload stop"><i class="fa fa-times"></i></h1>
152
- <!--this field changes dinamically displaying the filename we are trying to upload-->
153
- <p id="namefile">Only pics allowed! (jpg,jpeg,bmp,png)</p>
154
- <!--our custom btn which which stays under the actual one-->
155
- <button type="button" id="btnup" class="btn btn-primary btn-lg">Browse for your pic!</button>
156
- <!--this is the actual file input, is set with opacity=0 beacause we wanna see our custom one-->
157
- <input type="file" value="" name="fileup" id="fileup">
158
- </div>
159
- </div>
160
- </div>
161
- <!--additional fields-->
162
- <div class="row">
163
- <div class="col-md-12">
164
- <!--the defauld disabled btn and the actual one shown only if the three fields are valid-->
165
- <input type="submit" value="Submit!" class="btn btn-primary" id="submitbtn">
166
- <button type="button" class="btn btn-default" disabled="disabled" id="fakebtn">Submit! <i class="fa fa-minus-circle"></i></button>
167
- </div>
168
- </div>
169
- </form>
170
- <br>
171
- <br>
172
- <br>
173
- <div class="col-md-6 col-md-offset-3 center">
174
- <div class="btn-container">
175
- <div class="row">
176
- <div class="col-md-12">
177
- <h1 class="white" style="color:darkred;">{{prediction}}</h1>
178
- <img src="{{ image }}">
179
- </div>
180
- </div>
181
- </div>
182
-
183
-
184
- </div>
185
- <script src="https://cpwebassets.codepen.io/assets/common/stopExecutionOnTimeout-2c7831bb44f98c1391d6a4ffda0e1fd302503391ca806e7fcc7b9b87197aec26.js"></script>
186
-
187
- <script src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
188
- <script src='//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js'></script>
189
- <script id="rendered-js" >
190
- $('#fileup').change(function () {
191
- //here we take the file extension and set an array of valid extensions
192
- var res = $('#fileup').val();
193
- var arr = res.split("\\");
194
- var filename = arr.slice(-1)[0];
195
- filextension = filename.split(".");
196
- filext = "." + filextension.slice(-1)[0];
197
- valid = [".jpg", ".png", ".jpeg", ".bmp"];
198
- //if file is not valid we show the error icon, the red alert, and hide the submit button
199
- if (valid.indexOf(filext.toLowerCase()) == -1) {
200
- $(".imgupload").hide("slow");
201
- $(".imgupload.ok").hide("slow");
202
- $(".imgupload.stop").show("slow");
203
-
204
- $('#namefile').css({ "color": "red", "font-weight": 700 });
205
- $('#namefile').html("File " + filename + " is not pic!");
206
-
207
- $("#submitbtn").hide();
208
- $("#fakebtn").show();
209
- } else {
210
- //if file is valid we show the green alert and show the valid submit
211
- $(".imgupload").hide("slow");
212
- $(".imgupload.stop").hide("slow");
213
- $(".imgupload.ok").show("slow");
214
-
215
- $('#namefile').css({ "color": "green", "font-weight": 700 });
216
- $('#namefile').html(filename);
217
-
218
- $("#submitbtn").show();
219
- $("#fakebtn").hide();
220
- }
221
- });
222
- //# sourceURL=pen.js
223
- </script>
224
-
225
-
226
-
227
- </body>
228
-
229
- </html>
230
-