2020-1-capstone-design2 / 2016104137

Go to a project
Toggle navigation Toggle navigation pinning
김예미
44f63a3c 2 parents a986f129 f462be36

Merge branch 'master' of ssh://khuhub.khu.ac.kr:12959/2020-1-capstone-design2/2016104137

Expand all
Inline Side-by-side
Showing 51 changed files with 1814 additions and 7 deletions
...@@ -4,10 +4,8 @@ ...@@ -4,10 +4,8 @@
4 <component name="GradleSettings"> 4 <component name="GradleSettings">
5 <option name="linkedExternalProjectsSettings"> 5 <option name="linkedExternalProjectsSettings">
6 <GradleProjectSettings> 6 <GradleProjectSettings>
7 - <compositeConfiguration>
8 - <compositeBuild compositeDefinitionSource="SCRIPT" />
9 - </compositeConfiguration>
10 <option name="delegatedBuild" value="false" /> 7 <option name="delegatedBuild" value="false" />
8 + <option name="testRunner" value="PLATFORM" />
11 <option name="distributionType" value="DEFAULT_WRAPPED" /> 9 <option name="distributionType" value="DEFAULT_WRAPPED" />
12 <option name="externalProjectPath" value="$PROJECT_DIR$" /> 10 <option name="externalProjectPath" value="$PROJECT_DIR$" />
13 <option name="modules"> 11 <option name="modules">
...@@ -17,7 +15,6 @@ ...@@ -17,7 +15,6 @@
17 </set> 15 </set>
18 </option> 16 </option>
19 <option name="resolveModulePerSourceSet" value="false" /> 17 <option name="resolveModulePerSourceSet" value="false" />
20 - <option name="testRunner" value="PLATFORM" />
21 </GradleProjectSettings> 18 </GradleProjectSettings>
22 </option> 19 </option>
23 </component> 20 </component>
......
1 +.content{
2 + width :100%;
3 + height :100%;
4 +}
5 +.win_top{
6 + width :100%;
7 + height :10%;
8 + float:left;
9 +}
10 +#title{
11 + width :68%;
12 + height :10%;
13 + float:left;
14 +}
15 +#title img{
16 + height: 80px;
17 + width : auto;
18 + margin-left : 20px;
19 + float:left;
20 +}
21 +#title img:hover{
22 + opacity:0.6;
23 +}
24 +#selected-date{
25 + font-size: 10px;
26 + float:left;
27 + font-weight: bold;
28 + margin-top : -10px;
29 + margin-left:17px;
30 + border-bottom: 1px solid #4e73df;
31 +
32 +}
33 +#selected-file{
34 + font-size: 10px;
35 + float:left;
36 + font-weight: bold;
37 + margin-top : -10px;
38 + margin-left:70px;
39 + border-bottom: 1px solid #4e73df;
40 +}
41 +#date{
42 + width:28%;
43 + height :15%;
44 + float:left;
45 + vertical-align: middle;
46 +}
47 +p.float_left{
48 + float:left;
49 +}
50 +.results{
51 + width :98%;
52 + height :85%;
53 + position:absolute;
54 + bottom:10px;
55 + left:10px;
56 + text-align: center;
57 + float:left;
58 + border :2px dashed #4e73df;
59 + overflow-y:auto;
60 +}
61 +.photo{
62 + width : 240px;
63 + height : 300px;
64 + border :1px solid #4e73df;
65 + color:black;
66 + float : left;
67 + margin : 5px;
68 +
69 +}
70 +.top{
71 + width:240px;
72 + height:240px;
73 +}
74 +.top img{
75 + width:100%;
76 + height:100%;
77 + object-fit:contain;
78 +}
79 +.bottom{
80 + width:240px;
81 + height:60px;
82 +}
83 +.name{
84 + width : 200px;
85 + height:60px;
86 + float : left;
87 +}
88 +.check{
89 + width : 40px;
90 + height:60px;
91 + float : left;
92 +}
93 +.check input{
94 + width:20px;
95 + height :20px;
96 + margin-top:20px;
97 + margin-right:10px;
98 + border: 2px solid #bcbcbc;
99 +}
100 +.check input:checked{
101 + background-color: #4e73df;
102 +}
103 +#start_date{
104 + border: 1px solid #4e73df;
105 + background-color: white;
106 + line-height: 1;
107 + font-size: 17px;
108 + width: 200px;
109 + height :50px;
110 + padding:10px 15px;
111 + display: block;
112 + box-sizing: border-box;
113 + border-radius: 60px;
114 + color: dimgray;
115 + font-weight: 100;
116 + letter-spacing: 0.01em;
117 + position: relative;
118 + z-index: 1;
119 + margin-left: 10px;
120 +}
121 +#end_date{
122 + border: 1px solid #4e73df;
123 + background-color: white;
124 + line-height: 1;
125 + font-size: 17px;
126 + width: 200px;
127 + height :50px;
128 + padding:10px 15px;
129 + display: block;
130 + box-sizing: border-box;
131 + border-radius: 60px;
132 + color: dimgray;
133 + font-weight: 100;
134 + letter-spacing: 0.01em;
135 + position: relative;
136 + z-index: 1;
137 + margin-left: 10px;
138 +}
139 +#select{
140 + border: 1px solid #4e73df;
141 + background-color: #4e73df;
142 + line-height: 1;
143 + font-size: 17px;
144 + width: 135px;
145 + height :50px;
146 + padding:10px 15px;
147 + display: block;
148 + box-sizing: border-box;
149 + color: white;
150 + font-weight: 100;
151 + letter-spacing: 0.01em;
152 + position: relative;
153 + z-index: 1;
154 + margin-left: 10px;
155 +}
156 +#select:hover{
157 + background-color: white;
158 + color: #4e73df;
159 +}
160 +#submit{
161 + border: 1px solid #4e73df;
162 + background-color: #4e73df;
163 + line-height: 1;
164 + font-size: 17px;
165 + width: 100px;
166 + height :50px;
167 + padding:10px 15px;
168 + display: block;
169 + box-sizing: border-box;
170 + border-radius: 60px;
171 + color: white;
172 + font-weight: 100;
173 + letter-spacing: 0.01em;
174 + position: relative;
175 + z-index: 1;
176 + margin-left: 10px;
177 +}
178 +#submit:hover{
179 + background-color: white;
180 + color: #4e73df;
181 +}
182 +#save_photo{
183 + border: 1px solid #4e73df;
184 + background-color: #4e73df;
185 + line-height: 1;
186 + font-size: 17px;
187 + width: 135px;
188 + height :50px;
189 + padding:10px 15px;
190 + display: block;
191 + box-sizing: border-box;
192 + color: white;
193 + font-weight: 100;
194 + letter-spacing: 0.01em;
195 + position: relative;
196 + z-index: 1;
197 + margin-left: 10px;
198 + visibility: visible;
199 +}
200 +#save_photo:hover{
201 + background-color: white;
202 + color: #4e73df;
203 +}
204 +#closeBtn {
205 + border: 1px solid #4e73df;
206 + background-color: #4e73df;
207 + line-height: 1;
208 + font-size: 25px;
209 + width: 50px;
210 + height :50px;
211 + padding:10px 15px;
212 + display: block;
213 + box-sizing: border-box;
214 + border-radius: 60px;
215 + color: white;
216 + font-weight: 100;
217 + letter-spacing: 0.01em;
218 + position: relative;
219 + z-index: 1;
220 + margin-left: 5px;
221 +}
222 +#closeBtn:hover{
223 + background-color: white;
224 + color: #4e73df;
225 +}
1 +.content{
2 + width :100%;
3 + height :100%;
4 +}
5 +.win_top{
6 + width :100%;
7 + height :10%;
8 + float:left;
9 +}
10 +#title{
11 + width :68%;
12 + height :10%;
13 + float:left;
14 +}
15 +#title img{
16 + height: 80px;
17 + width : auto;
18 + margin-left : 20px;
19 + float:left;
20 +}
21 +#title img:hover{
22 + opacity :0.6;
23 +}
24 +#date{
25 + width:28%;
26 + height :15%;
27 + float:left;
28 + vertical-align: middle;
29 +}
30 +p.float_left{
31 + float:left;
32 +}
33 +.results{
34 + width :98%;
35 + height :85%;
36 + position:absolute;
37 + bottom:10px;
38 + left:10px;
39 + text-align: center;
40 + float:left;
41 + overflow-y:auto;
42 + border : 2px solid #4e73df
43 +}
44 +#image{
45 + float: left;
46 + filter:blur(5px);
47 + margin:5px;
48 +}
49 +#image:hover{
50 +opacity: 0.8;
51 +}
52 +#detect{
53 + border: 1px solid dimgray;
54 + background-color: dimgray;
55 + line-height: 1;
56 + font-size: 17px;
57 + width: 200px;
58 + height :40px;
59 + padding:10px 15px;
60 + display: block;
61 + box-sizing: border-box;
62 + color: white;
63 + font-weight: 100;
64 + letter-spacing: 0.01em;
65 + position: absolute;
66 + top:4%;
67 + right:5%;
68 + z-index: 1;
69 + margin-top: 10px;
70 +}
71 +#detect:hover{
72 + background-color: white;
73 + color: dimgray;
74 +}
...\ No newline at end of file ...\ No newline at end of file
1 +.all{
2 + width :100%;
3 + height :100%;
4 +}
5 +.top{
6 + width :100%;
7 + height :10%;
8 + float:left;
9 +}
10 +.title{
11 + width :70%;
12 + height :10%;
13 + float:left;
14 +}
15 +.title img{
16 + height: 80px;
17 + width : auto;
18 + margin-left : 20px;
19 + float:left;
20 +}.title img:hover{
21 + opacity:0.6;
22 +}
23 +.content{
24 + width :100%;
25 + height :90%;
26 +}
27 +p.float_left{
28 + float:left;
29 +}
30 +#explanation{
31 + width:35%;
32 + height:27.5%;
33 + position: absolute;
34 + right: 2%;
35 + bottom: 55%;
36 + text-align: center;
37 +}
38 +#explanation h1{
39 + margin-top:12%;
40 + color:dimgray;
41 +}
42 +#map {
43 + width:35%;
44 + height:50%;
45 + clear:both;
46 + border:solid 1px #4e73df;
47 + position: absolute;
48 + right: 2%;
49 + bottom: 3%;
50 +}
51 +#main{
52 + width:58%;
53 + height:78%;
54 + border:solid 5px #4e73df;
55 + position: absolute;
56 + left: 2%;
57 + bottom : 3%;
58 + overflow-y:auto;
59 + background-color: #7FB2F0;
60 +}
61 +.p{
62 + width:295px;
63 + height:295px;
64 + float : left;
65 + margin :1px;
66 + background-color: #4e73df;
67 +}
68 +.p img{
69 + width:100%;
70 + height:100%;
71 + object-fit:contain;
72 +}
73 +.ex{
74 + width: 147.5px;
75 + height:147.5px;
76 + float : left;
77 + margin :0.5px;
78 + background-color: #4e73df;
79 +}
80 +.ex img{
81 + width:100%;
82 + height:100%;
83 + object-fit:contain;
84 +}
...\ No newline at end of file ...\ No newline at end of file
1 +
2 +.all{
3 + width :100%;
4 + height :100%;
5 +}
6 +.top{
7 + width :100%;
8 + height :15%;
9 + float:left;
10 +}
11 +.title{
12 + width :80%;
13 + height :10%;
14 + float:left;
15 +}
16 +.title img{
17 + height: 80px;
18 + width : auto;
19 + margin-left : 20px;
20 + float:left;
21 +}
22 +.title img:hover{
23 + opacity:0.6;
24 +}
25 +#btn_area{
26 + width:20%;
27 + height :15%;
28 + float:left;
29 + vertical-align: middle;
30 +}
31 +#start{
32 + border: 1px solid #4e73df;
33 + background-color: #4e73df;
34 + line-height: 1;
35 + font-size: 17px;
36 + width: 150px;
37 + height :40px;
38 + padding:10px 15px;
39 + display: block;
40 + box-sizing: border-box;
41 + border-radius: 60px;
42 + color: white;
43 + font-weight: 100;
44 + letter-spacing: 0.01em;
45 + position: relative;
46 + z-index: 1;
47 + margin-top: -5px;
48 +}
49 +#next{
50 + border: 1px solid #4e73df;
51 + background-color: #4e73df;
52 + line-height: 1;
53 + font-size: 14px;
54 + width: 150px;
55 + height :40px;
56 + padding:10px 15px;
57 + display: block;
58 + box-sizing: border-box;
59 + border-radius: 60px;
60 + color: white;
61 + font-weight: 100;
62 + letter-spacing: 0.01em;
63 + position: relative;
64 + z-index: 1;
65 + visibility: hidden;
66 + margin-top: -5px;
67 +}
68 +#start:hover{
69 + background-color: white;
70 + color: #4e73df;
71 +}
72 +p.float_left{
73 + float:left;
74 +}
75 +.chart_cont{
76 + position:absolute;
77 + height:79%;
78 + width:27%;
79 + left : 3%;
80 + bottom :5%;
81 + overflow-y: auto;
82 + float:left;
83 + border:2px solid #4e73df;
84 +}
85 +.chart-container{
86 + position: relative;
87 + height:600px;
88 + width:280px;
89 +}
90 +#content{
91 + width :65%;
92 + height :79%;
93 + position: absolute;
94 + right : 3%;
95 + bottom:5%;
96 + overflow-y: auto;
97 + float:left;
98 + border:2px solid #4e73df;
99 +}
100 +.photo {
101 + width: 300px;
102 + height: 220px;
103 + margin : 5px;
104 + float:left;
105 + border:1px dashed #4e73df;
106 +}
107 +.p_title{
108 + width: 300px;
109 + height: 20px;
110 + float:left;
111 + text-align: center;
112 +}
113 +.p_title p{
114 + font-size : 13px;
115 + color: black;
116 + font-weight: bold;
117 + margin-top: -0.5px;
118 +}
119 +.image{
120 + height : 200px;
121 + width : 200px;
122 + text-align: center;
123 + float:left;
124 +}
125 +.image img{
126 + width:100%;
127 + height:100%;
128 + object-fit:contain;
129 +}
130 +.keyword{
131 + width :99%;
132 + height: 15%;
133 + float:left;
134 + text-align: center;
135 +}
136 +.k_content{
137 + width :99%;
138 + height: 85%;
139 + float:left;
140 + text-align: center;
141 + overflow-y: auto;
142 +}
143 +.keyword_photo{
144 + float:left;
145 + border:1px dashed #4e73df;
146 + height : 200px;
147 + width : 200px;
148 + text-align: center;
149 + margin : 10px;
150 +}
151 +.keyword_photo img{
152 + width:100%;
153 + height:100%;
154 + object-fit:contain;
155 +}
156 +.labels{
157 + width :100px;
158 + height : 200px;
159 + float :left;
160 + vertical-align: middle;
161 +}
162 +.labels p{
163 + font-size : 10px;
164 + margin-top: -0.2px;
165 + margin-bottom: -0.2px;
166 + margin-left :2px;
167 + color: navy;
168 +}
...\ No newline at end of file ...\ No newline at end of file
1 +.div_root{
2 + width:100%;
3 + height:100%;
4 + margin:0px;
5 +}
6 +.div_top{
7 + width:100%;
8 + height:20%;
9 + float:left;
10 +}
11 +.div_top img{
12 + margin-left: 20px;
13 + height:120px;
14 + float:left;
15 +}
16 +.div_top img:hover{
17 + opacity: 0.6;
18 +}
19 +.div_content{
20 + width : 100%;
21 + height: 80%;
22 + float:left;
23 +}
24 +.div_con_block{
25 + width:80%;
26 + height:25%;
27 + float:left;
28 + margin-left: 50px;
29 +}
30 +.div_con_block p{
31 + margin-left : 30px;
32 + margin-top: -10px;
33 + color : dimgray;
34 +}
35 +.div_con_block img{
36 + padding :20px;
37 + height : 100px;
38 +}
39 +.div_con_block img:hover{
40 + opacity: 0.5;
41 +}
42 +.fa-chevron-left{
43 + margin-top: 10px;
44 + margin-left :5px;
45 + margin-right : 5px;
46 + color: dimgray;
47 +}
48 +.fa-chevron-left:hover{
49 + opacity: 0.5;
50 +}
51 +.float_left{
52 + float :left;
53 +}
54 +#image{
55 + font-size: 15px;
56 + height :30px;
57 + width : 300px;
58 + float: left;
59 + margin:20px;
60 + border: 1px solid dimgray;
61 + background-color: dimgray;
62 +}
1 +
2 +.all{
3 + width :100%;
4 + height :100%;
5 +}
6 +.top{
7 + width :100%;
8 + height :15%;
9 + float:left;
10 +}
11 +#title{
12 + width :60%;
13 + height :15%;
14 + float:left;
15 +}
16 +#title img{
17 + height: 100px;
18 + width : auto;
19 + margin-left : 20px;
20 + float:left;
21 +}#title img:hover{
22 + opacity: 0.6;
23 +}
24 +#btn_area{
25 + width:40%;
26 + height :15%;
27 + float:left;
28 + vertical-align: middle;
29 +}
30 +#start{
31 + border: 1px solid dimgray;
32 + background-color: dimgray;
33 + line-height: 1;
34 + font-size: 17px;
35 + width: 150px;
36 + height :40px;
37 + padding:10px 15px;
38 + display: block;
39 + box-sizing: border-box;
40 + color: white;
41 + font-weight: 100;
42 + letter-spacing: 0.01em;
43 + position: relative;
44 + z-index: 1;
45 + margin-left : 20px;
46 +}
47 +#start:hover{
48 + background-color: white;
49 + color: dimgray;
50 +}
51 +button.p_btn{
52 + border: 1px solid dimgray;
53 + background-color: dimgray;
54 + line-height: 1;
55 + font-size: 17px;
56 + width: 50px;
57 + height :50px;
58 + padding:10px 15px;
59 + display: block;
60 + box-sizing: border-box;
61 + color: white;
62 + font-weight: 100;
63 + letter-spacing: 0.01em;
64 + position: relative;
65 + z-index: 1;
66 +}
67 +button.p_btn:hover{
68 + background-color: white;
69 + color: dimgray;
70 +}
71 +#date{
72 + border: 1px solid dimgray;
73 + background-color: white;
74 + line-height: 1;
75 + font-size: 17px;
76 + width: 200px;
77 + height :40px;
78 + padding:10px 15px;
79 + display: block;
80 + box-sizing: border-box;
81 + border-radius: 60px;
82 + color: dimgray;
83 + font-weight: 100;
84 + letter-spacing: 0.01em;
85 + position: relative;
86 + z-index: 1;
87 + margin-left: 10px;
88 +}
89 +p.float_left{
90 + float:left;
91 +}
92 +p.float_right{
93 + float:right;
94 +}
95 +#content{
96 + width :90%;
97 + height :80%;
98 + overflow-y: auto;
99 + position: absolute;
100 + left : 5%;
101 + bottom:5%;
102 + background-color: #FFFFFF;
103 +}
104 +/* -----------------------------------------------
105 +* Timeline
106 +* --------------------------------------------- */
107 +.main-timeline{
108 + font-family: 'Roboto Condensed', sans-serif;
109 + position: relative;
110 +}
111 +.main-timeline:after{
112 + content: '';
113 + display: block;
114 + clear: both;
115 +}
116 +.main-timeline:before{
117 + content: '';
118 + height: 100%;
119 + width: 7px;
120 + border-left: 7px dashed #999;
121 + transform: translateX(-50%);
122 + position: absolute;
123 + left: 50%;
124 + top: 0;
125 +}
126 +.main-timeline .timeline{
127 + width: 45%;
128 + padding: 0 0 0 40px;
129 + margin: 0 0 0 20px;
130 + float: right;
131 + position: relative;
132 +}
133 +.main-timeline .timeline:after{
134 + content: '';
135 + background-color: #6044F0;
136 + height: 35px;
137 + width: 40px;
138 + position: absolute;
139 + left: 0;
140 + top: 60px;
141 + clip-path: polygon(0 50%, 100% 0, 100% 100%);
142 +}
143 +.main-timeline .timeline-content{
144 + color: #555;
145 + text-align: center;
146 + padding: 35px 40px 35px;
147 + display: block;
148 + position: relative;
149 + z-index: 1;
150 +}
151 +.main-timeline .timeline-content:hover{ text-decoration: none; }
152 +.main-timeline .timeline-content:before,
153 +.main-timeline .timeline-content:after{
154 + content: '';
155 + background-color: #fff;
156 + border-radius: 50px 0;
157 + box-shadow: 0 0 10px -3px rgba(0,0,0,0.5);
158 + position: absolute;
159 + left: 10px;
160 + bottom: 10px;
161 + right: 0;
162 + top: 0;
163 + z-index: -1;
164 +}
165 +.main-timeline .timeline-content:after{
166 + background-color: transparent;
167 + box-shadow: none;
168 + border: 2px solid #6044F0;
169 + left: 0;
170 + bottom: 0;
171 + right: 10px;
172 + top: 10px;
173 +}
174 +.main-timeline .timeline-icon{
175 + color: #fff;
176 + background-color: #000;
177 + font-size: 25px;
178 + text-align: center;
179 + line-height: 50px;
180 + height: 50px;
181 + width: 50px;
182 + border-radius: 50%;
183 + position: absolute;
184 + left: 0;
185 + top: 0;
186 + z-index: 2;
187 +}
188 +.main-timeline .title{
189 + color: #6044F0;
190 + font-size: 20px;
191 + font-weight: 700;
192 + text-transform: uppercase;
193 + letter-spacing: 1px;
194 + margin: 0 0 5px;
195 +}
196 +.main-timeline .description{
197 + font-size: 15px;
198 + font-weight: 500;
199 + letter-spacing: 1px;
200 + margin: 0 0 0 10px;
201 +}
202 +.main-timeline .timeline:nth-child(even){
203 + float: left;
204 + padding: 0 40px 0 0;
205 + margin: 0 20px 0 0;
206 +}
207 +.main-timeline .timeline:nth-child(even):after{
208 + transform: rotateY(180deg);
209 + left: auto;
210 + right: 0;
211 +}
212 +.main-timeline .timeline:nth-child(even) .timeline-content:before,
213 +.main-timeline .timeline:nth-child(even) .timeline-content:after{
214 + border-radius: 0 50px;
215 +}
216 +.main-timeline .timeline:nth-child(even) .timeline-icon{
217 + left: auto;
218 + right: 0;
219 +}
220 +.main-timeline .timeline:nth-child(4n+2):after{ background-color: #FF3754; }
221 +.main-timeline .timeline:nth-child(4n+2) .timeline-content:after{ border-color: #FF3754; }
222 +.main-timeline .timeline:nth-child(4n+2) .title{ color: #FF3754; }
223 +.main-timeline .timeline:nth-child(4n+3):after{ background-color: #01C1E1; }
224 +.main-timeline .timeline:nth-child(4n+3) .timeline-content:after{ border-color: #01C1E1; }
225 +.main-timeline .timeline:nth-child(4n+3) .title{ color: #01C1E1; }
226 +.main-timeline .timeline:nth-child(4n+4):after{ background-color: #10B175; }
227 +.main-timeline .timeline:nth-child(4n+4) .timeline-content:after{ border-color: #10B175; }
228 +.main-timeline .timeline:nth-child(4n+4) .title{ color: #10B175; }
229 +@media screen and (max-width:767px){
230 + .main-timeline:before{ display: none; }
231 + .main-timeline .timeline,
232 + .main-timeline .timeline:nth-child(even){
233 + width: 100%;
234 + padding: 0 0 35px 0;
235 + margin: 0;
236 + }
237 + .main-timeline .timeline:last-child{ padding: 0; }
238 + .main-timeline .timeline:after,
239 + .main-timeline .timeline:nth-child(even):after{
240 + transform: translateX(-50%) rotate(-90deg);
241 + left: 50%;
242 + top: auto;
243 + bottom: 0;
244 + }
245 + .main-timeline .timeline:last-child:after{ display: none; }
246 +}
247 +@media screen and (max-width:576px){
248 + .main-timeline .title{ font-size: 18px; }
249 +}
250 +p.text-right{
251 + text-align: right;
252 +}
253 +.shadow-textarea textarea.form-control::placeholder {
254 + font-weight: 300;
255 +}
256 +.shadow-textarea textarea.form-control {
257 + padding-left: 0.8rem;
258 + padding-right: 0.8rem;
259 + width:80%;
260 + margin-top: 10px;
261 + margin-left:5px;
262 +}
263 +.fa-chevron-left{
264 + margin-left :5px;
265 + margin-right : 5px;
266 + color: dimgray;
267 +}
268 +.fa-chevron-left:hover{
269 + opacity: 0.5;
270 +}
...\ No newline at end of file ...\ No newline at end of file
1 -const { app, BrowserWindow, ipcMain } = require('electron') 1 +const { app, BrowserWindow, ipcMain, dialog } = require('electron')
2 const path = require('path') 2 const path = require('path')
3 const url = require('url') 3 const url = require('url')
4 +const vision = require('@google-cloud/vision');
4 5
5 // Keep a global reference of the window object, if you don't, the window will 6 // Keep a global reference of the window object, if you don't, the window will
6 // be closed automatically when the JavaScript object is garbage collected. 7 // be closed automatically when the JavaScript object is garbage collected.
...@@ -53,5 +54,152 @@ ipcMain.on("device-name", (e, arg) => { ...@@ -53,5 +54,152 @@ ipcMain.on("device-name", (e, arg) => {
53 win.webContents.send("device", arg); 54 win.webContents.send("device", arg);
54 }); 55 });
55 56
57 +//photos taken in selected dates
58 + ipcMain.on("photo", (e, arg) => {
59 + win.webContents.send("select_result", arg);
60 + });
61 +
62 + //open-file-dialog
63 + ipcMain.on('open-file-dialog', async (event) => {
64 +
65 + const result = await dialog.showOpenDialog({
66 + properties: ['openFile', 'openDirectory']
67 + })
68 + win.webContents.send('selected-directory',result);
69 + })
70 +
71 + //console 출력
72 + ipcMain.on('print', (e, arg)=>{
73 + console.log(arg);
74 + })
75 +
76 + //internet connect 확인
77 + /**
78 + * const check = require('check-internet-connected');
79 +
80 + const config = {
81 + timeout : 5000,
82 + retries : 3,
83 + domain : 'apple.com'
84 + }
85 +
86 + check(config)
87 + .then(()=>{
88 + console.log("Connection available");
89 + }).catch((err)=>{
90 + console.log("No connection", err);
91 + });
92 + */
93 + //이미지 라벨
94 + var label_result = new Array();
95 + ipcMain.on('image_labels', async (event, list) =>{
96 + label_result = [];
97 + await Promise.all(list.map(async (element)=>{
98 + var path = new String();
99 + path = element.path;
100 + var num = path.indexOf("DCIM");
101 + var folder_path = new String();
102 + folder_path = "./photos/" + path.substring(num);
103 + await quickstart(folder_path, element.display_name);
104 + }))
105 + //라벨 검출 결과 전송
106 + win.webContents.send('labels_result',label_result);
107 + console.log(label_result.length);
108 + })
109 +
110 + async function quickstart(path, name) {
111 +
112 + const client = new vision.ImageAnnotatorClient();
113 +
114 + // Performs label detection on the image file
115 + const [result] = await client.labelDetection(path);
116 + const labels = result.labelAnnotations;
117 +
118 + path = '../.'+path;
119 + var content = {path : path, name : name, labels : labels}
120 + label_result.push(content);
121 + }
122 +
123 +
124 + //detext unsafe image
125 + let detect_result = new Array();
126 +
127 + ipcMain.on("detect", async (e, result)=>{
128 + detect_result = [];
129 + await Promise.all(result.map(async (element)=>{
130 + var path = new String();
131 + path = element.path;
132 + var num = path.indexOf("DCIM");
133 + var folder_path = new String();
134 + folder_path = "./photos/" + path.substring(num);
135 + await detect(folder_path, element.display_name);
136 + }))
137 + win.webContents.send('detect_result', detect_result);
138 + console.log("detect_success");
139 + });
56 140
141 + async function detect(path, name){
142 + //const vision = require('@google-cloud/vision');
143 + // Creates a client
144 + const client = new vision.ImageAnnotatorClient();
145 + // Performs safe search detection on the local file
146 + const [result] = await client.safeSearchDetection(path);
147 + const detections = result.safeSearchAnnotation;
57 148
149 + var adult_sum = 0;
150 + var racy_sum = 0;
151 +
152 + if(detections.adult == "VERY_LIKELY"){
153 + adult_sum = 100;
154 + }
155 + else if(detections.adult == "LIKELY"){
156 + adult_sum = 80;
157 + }
158 + else if(detections.adult == "POSSIBLE"){
159 + adult_sum = 60;
160 + }
161 + else if(detections.adult == "UNLIKELY"){
162 + adult_sum = 40;
163 + }
164 + else if(detections.adult == "VERY_UNLIKELY"){
165 + adult_sum = 20;
166 + }
167 + else{
168 + adult_sum = 0;
169 + }
170 +
171 + if(detections.racy == "VERY_LIKELY"){
172 + racy_sum = 100;
173 + }
174 + else if(detections.racy == "LIKELY"){
175 + racy_sum = 80;
176 + }
177 + else if(detections.racy == "POSSIBLE"){
178 + racy_sum = 60;
179 + }
180 + else if(detections.racy == "UNLIKELY"){
181 + racy_sum = 40;
182 + }
183 + else if(detections.racy == "VERY_UNLIKELY"){
184 + racy_sum = 20;
185 + }
186 + else{
187 + racy_sum = 0;
188 + }
189 +
190 + var score = (adult_sum + racy_sum) / 2;
191 +
192 + path = '../.'+path;
193 +
194 + if(score>=60){
195 + var content = {path : path, name : name, score : score};
196 + detect_result.push(content);
197 + }
198 +
199 + }
200 + ipcMain.on('open-error-dialog', (event) => {
201 + dialog.showErrorBox('detected unsafe contents', '당신의 휴대폰에서 유해한 사진을 발견했습니다!')
202 + })
203 +//이전에 사용한 photos 폴더 삭제
204 +var rimraf = require("rimraf");
205 +rimraf("./photos", function(){console.log("")});
...\ No newline at end of file ...\ No newline at end of file
......
This diff is collapsed. Click to expand it.
...@@ -12,12 +12,15 @@ ...@@ -12,12 +12,15 @@
12 "electron": "^8.2.0" 12 "electron": "^8.2.0"
13 }, 13 },
14 "dependencies": { 14 "dependencies": {
15 + "@google-cloud/vision": "^2.0.0",
15 "appium-adb": "^7.27.1", 16 "appium-adb": "^7.27.1",
17 + "chart.js": "^2.9.3",
16 "jQuery": "^1.7.4", 18 "jQuery": "^1.7.4",
17 "jquery": "^3.5.0", 19 "jquery": "^3.5.0",
18 "mysql": "^2.18.1", 20 "mysql": "^2.18.1",
19 "node-adb": "^0.1.6", 21 "node-adb": "^0.1.6",
20 "python-shell": "^2.0.0", 22 "python-shell": "^2.0.0",
23 + "rimraf": "^3.0.2",
21 "socket.io": "^2.3.0" 24 "socket.io": "^2.3.0"
22 } 25 }
23 } 26 }
......
...@@ -32,12 +32,12 @@ ...@@ -32,12 +32,12 @@
32 </div> 32 </div>
33 <div id ="menu"> 33 <div id ="menu">
34 <div id="btn_group"> 34 <div id="btn_group">
35 - <button id="btn" onclick="location.href='menu5.html'">menu5</button> 35 + <button id="btn" onclick="location.href='photo_classification/photo_main.html'">menu5</button>
36 </div> 36 </div>
37 </div> 37 </div>
38 <div id ="menu"> 38 <div id ="menu">
39 <div id="btn_group"> 39 <div id="btn_group">
40 - <button id="btn" onclick="location.href='menu6.html'">menu6</button> 40 + <button id="btn" onclick="location.href='timeline.html'">menu6</button>
41 </div> 41 </div>
42 </div> 42 </div>
43 </div> 43 </div>
......
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=<sc>, initial-scale=1.0">
6 + <link rel="Stylesheet" href="../../assets/css/p_date.css">
7 + <title>Photo classification by date</title>
8 +</head>
9 +<body>
10 + <div class="content">
11 + <div class="win_top">
12 + <div id="title">
13 + <img src="../../assets/img/photo_date.png" onclick="history.go(-1)" class="float_left" title="Back to photo menu">
14 + </div>
15 + <div id="date">
16 + <p class="float_left"><button id="select">Select date</button></p>
17 + <p class="float_left"><button id="save_photo">Save photo</button></p>
18 + <p class="float_left" id="selected-date"></p>
19 + <p class="float_left" id="selected-file"></p>
20 + </div>
21 + </div>
22 +
23 + <div class="results" id="r">
24 + <h1 style="margin-top:300px; color:dimgray">날짜를 선택해 해당 기간동안의 사진을 확인하세요</h1>
25 + </div>
26 + </div>
27 +
28 +
29 +
30 + <script type="text/javascript">
31 + const { ipcRenderer } = require("electron");
32 + const { BrowserWindow } = require("electron").remote;
33 + var exec = require('child_process').exec, child;
34 +
35 + const btn = document.getElementById("select");
36 + const saveBtn = document.getElementById("save_photo");
37 +
38 + btn.addEventListener("click", () => {
39 + win = new BrowserWindow({
40 + width: 630,
41 + height: 100,
42 + frame: false,
43 + alwaysOnTop: true,
44 + webPreferences: {
45 + nodeIntegration: true
46 + }
47 + });
48 +
49 + //win.webContents.openDevTools();
50 + win.on("close", () => {
51 + win = null;
52 + });
53 + win.loadFile("./src/photo_classification/select_date.html");
54 + win.show();
55 +
56 + });
57 +
58 + saveBtn.addEventListener("click", () =>{
59 + var checkbox = document.getElementsByName('save');
60 + ipcRenderer.send('open-file-dialog');
61 + })
62 +
63 + ipcRenderer.on('selected-directory', (event, path) => {
64 + var parent_dir = new String();
65 + var num = __dirname.indexOf("src");
66 + parent_dir = __dirname.substring(0, num);
67 + if(!path.canceled){
68 + var checkbox = document.getElementsByName('save');
69 + checkbox.forEach(element => {
70 + if(element.checked){
71 + var loc = element.value.indexOf("photos");
72 + var imgpath = new String();
73 + imgpath = parent_dir+element.value.substring(loc).replace(/\//g,'\\').replace(/#%&!/g, " ");
74 + var command = 'copy "'+imgpath+'" '+path.filePaths[0];
75 + //document.getElementById('selected-file').innerHTML = command;
76 + exec(command, (error, stdout, stderr)=>{
77 + if(!error){
78 + document.getElementById('selected-file').innerHTML = "saved!";
79 + }
80 + });
81 + }
82 + })
83 + }
84 +
85 + })
86 +
87 + let result;
88 +
89 + ipcRenderer.on("select_result", (e, arg) => {
90 + result = arg.result;
91 + document.getElementById('selected-date').innerHTML = arg.start + " - " +arg.end;
92 + print_photo();
93 + });
94 +
95 + function print_photo(){
96 + const results = document.getElementById('r');
97 + var myHTML = '';
98 + for(var i = 0; i< result.length; i++){
99 + var path = new String();
100 + path = result[i].path;
101 + var num = path.indexOf("DCIM");
102 + var folder_path = new String();
103 + folder_path = "../../photos/"+ path.substring(num);
104 + myHTML += '<div class="photo"><div class="top"><img id="p" src="'+folder_path
105 + +'"></div><div class="bottom"><div class="name"><p id="title">'+result[i].display_name+'</p></div>';
106 + var replacement = folder_path.replace(/ /g, "#%&!");
107 + myHTML +="<div class='check'><input type='checkbox' name='save' value="+replacement+"></div></div></div>"
108 + }
109 + results.innerHTML = myHTML;
110 + saveBtn.style.visibility = "visible";
111 + };
112 + </script>
113 +</body>
114 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=<sc>, initial-scale=1.0">
6 + <script src="https://kit.fontawesome.com/e6f667a852.js" crossorigin="anonymous"></script>
7 + <link rel="Stylesheet" href="../../assets/css/p_detect.css">
8 + <title></title>
9 +</head>
10 +<body>
11 + <div class="content">
12 + <div class="win_top">
13 + <div id="title">
14 + <img src="../../assets/img/Detect unsafe Image.png" onclick="history.go(-1)" class="float_left" title="Back to photo menu">
15 + </div>
16 + <div id="date">
17 + <p class="float_left"><button id="detect">Start</button></p>
18 + </div>
19 + </div>
20 + <div class="results" id="r">
21 + <h1 style="margin-top:300px; color:dimgray">유해한 컨텐츠를 검사해 보세요</h1>
22 + </div>
23 + </div>
24 +</body>
25 +<script src="p_detect.js"></script>
26 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +var exec = require('child_process').exec, child;
2 +const { ipcRenderer } = require("electron");
3 +
4 +const dd = document.getElementById('detect');
5 +const r = document.getElementById('r');
6 + var mysql = require('mysql');
7 +
8 + var connection = mysql.createConnection({
9 + user:'root',
10 + password:'1234',
11 + database : 'dataextraction'
12 + })
13 +
14 +dd.addEventListener("click", ()=>{
15 +
16 + connection.connect();
17 + connection.query('SELECT * FROM photo', function(error, results, fields){
18 + if(error){
19 + }
20 + else{
21 + r.innerHTML = '<i class="fas fa-spinner fa-3x fa-spin" style="color:dimgray; position: absolute; bottom:47%; right:47%;"></i>';
22 + ipcRenderer.send("detect", results);
23 + }
24 + });
25 +});
26 +
27 +ipcRenderer.on('detect_result', (e, detect_result)=>{
28 + if(detect_result.length >0){
29 + r.style.border ="2px solid red";
30 + var myhtml = "<h1 style='font-size:1.5em'>유해 컨텐츠 "+detect_result.length+" 개 발견</h1>";
31 + detect_result.forEach(element => {
32 + myhtml+="<img src='"+element.path+"' id='image' onclick='showImage()' title='"+element.path+"'width=300px height=300px>";
33 + });
34 + r.innerHTML = myhtml;
35 + ipcRenderer.send('open-error-dialog')
36 + }
37 + else{
38 + r.innerHTML = "<h1 style='margin-top:300px; color:dimgray'>유해 컨텐츠 없음</h1>";
39 + }
40 +});
41 +
42 +function showImage(){
43 + var image = document.getElementById('image');
44 + var url=image.getAttribute('src');
45 + var imgWin = window.open(url,url, "width=500px, height=500px");
46 +};
47 +
48 +
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=<sc>, initial-scale=1.0">
6 + <link rel="Stylesheet" href="../../assets/css/p_loc.css">
7 + <title>Photo classification by location</title>
8 + <style></style>
9 +</head>
10 +<body>
11 + <div class='all'>
12 + <div class='top'>
13 + <div class='title'>
14 + <img src="../../assets/img/photo_loc.png" onclick="history.go(-1)" class="float_left" title="Back to photo menu">
15 + </div>
16 + </div>
17 + <div class='content'>
18 + <div id="main">
19 + <h1 style="margin-top:250px; color:dimgray; text-align: center;">지도의 마크를 클릭해 해당 사진과 인근 위치에서 찍힌 사진을 확인하세요.</h1>
20 + </div>
21 + <div id="explanation">
22 +
23 + </div>
24 + <div id="map"></div>
25 + </div>
26 + </div>
27 +
28 +
29 + <script type=text/javascript>
30 +
31 + var mysql = require('mysql');
32 + //mysql 연동
33 + var connection = mysql.createConnection({
34 + user:'root',
35 + password:'1234',
36 + database : 'dataextraction'
37 + })
38 +
39 + connection.connect();
40 + var list;
41 + function initMap() {
42 +
43 + connection.query('SELECT * FROM photo where latitude is not null', function(error, results, fields){
44 + if(error){
45 + }
46 + else{
47 + list = results;
48 + var first_p = {lat: Number(list[0].latitude), lng: Number(list[0].longitude)};
49 + var map = new google.maps.Map(document.getElementById('map'), {
50 + zoom: 8,
51 + center: first_p
52 + });
53 +
54 + list.forEach(element => {
55 + var latlng = {lat : Number(element.latitude), lng : Number(element.longitude)};
56 +
57 + var time = new Date(Number(element.date_added)*1000);
58 + var path = new String();
59 + path = element.path;
60 + var num = path.indexOf("DCIM");
61 + var folder_path = new String();
62 + folder_path = "../../photos/" + path.substring(num);
63 + var address = new String();
64 + var geocoder = new google.maps.Geocoder;
65 + geocoder.geocode({'location' : latlng}, function(results, status){
66 + var marker = new google.maps.Marker({
67 + position: latlng,
68 + map: map,
69 + title: element.display_name
70 + });
71 + if(status == 'OK'){
72 + if(results[0]){
73 + address = results[0].formatted_address;
74 + var contentString = '<div id="content">'+
75 + '<div id="siteNotice">'+
76 + '</div>'+
77 + '<h1 id="firstHeading" class="firstHeading">'+element.title+'</h1>'+
78 + '<div id="bodyContent">'+
79 + '<p><b>'+element.display_name+'</b></p><p><b>'+time+'</b </p><p>'+
80 + results[0].formatted_address+'</p></div>'+
81 + '</div>';
82 + var infowindow = new google.maps.InfoWindow({
83 + content: contentString,
84 + maxWidth: 300
85 + });
86 + marker.addListener('click', function() {
87 + infowindow.open(map, marker);
88 + p_group(element);
89 + });
90 + }
91 + else{
92 + var contentString = '<div id="content">'+
93 + '<div id="siteNotice">'+
94 + '</div>'+
95 + '<h1 id="firstHeading" class="firstHeading">'+element.title+'</h1>'+
96 + '<div id="bodyContent">'+
97 + '<p><b>'+element.display_name+'</b></p><p><b>'+time+'</b </p><p>('+
98 + latlng.lat+','+latlng.lng+'</p></div>'+
99 + '</div>';
100 + var infowindow = new google.maps.InfoWindow({
101 + content: contentString,
102 + maxWidth: 300
103 + });
104 + marker.addListener('click', function() {
105 + infowindow.open(map, marker);
106 + p_group(element);
107 + });
108 + }
109 + }
110 + else{
111 + var contentString = '<div id="content">'+
112 + '<div id="siteNotice">'+
113 + '</div>'+
114 + '<h1 id="firstHeading" class="firstHeading">'+element.title+'</h1>'+
115 + '<div id="bodyContent">'+
116 + '<p><b>'+element.display_name+'</b></p><p><b>'+time+'</b </p><p>('+
117 + latlng.lat+','+latlng.lng+')</p></div>'+
118 + '</div>';
119 + var infowindow = new google.maps.InfoWindow({
120 + content: contentString,
121 + maxWidth: 300
122 + });
123 + marker.addListener('click', function() {
124 + infowindow.open(map, marker);
125 + p_group(element);
126 + });
127 + }
128 + });
129 +
130 + });
131 + }
132 + })
133 + }
134 +
135 + function p_group(photo){
136 + const main = document.getElementById('main');
137 + var path = new String();
138 + path = photo.path;
139 + var num = path.indexOf("DCIM");
140 + var folder_path = new String();
141 + folder_path = "../../photos/" + path.substring(num);
142 + var myHTML = '';
143 + myHTML += '<div class="p"><img src="'+folder_path+'"></div>';
144 + list.forEach(element=>{
145 + if(element.title != photo.title){
146 + var hor = photo.latitude - Number(element.latitude);
147 + hor *=111;
148 + var ver = photo.longitude - Number(element.longitude);
149 + ver *=88;
150 + if(((hor*hor) + (ver*ver))<=25){
151 + main.innerHTML = "<p>Bye</p>"
152 + var path2 = new String();
153 + path2 = element.path;
154 + var num2 = path2.indexOf("DCIM");
155 + var folder_path2 = new String();
156 + folder_path2 = "../../photos/" + path2.substring(num2);
157 + myHTML += '<div class="ex"><img id="ex" src="'+folder_path2+'"></div>';
158 +
159 + }
160 + }
161 +
162 + });
163 + main.innerHTML = myHTML;
164 + document.getElementById('explanation').innerHTML = "<h1>[ "+photo.display_name+" ]</h1><h1>5km 인근 사진 모음</h1>"
165 + }
166 + </script>
167 +<script async defer
168 +src="http://maps.google.com/maps/api/js?key=API_KEY&callback=initMap&sensor=true">
169 +</script>
170 +</body>
171 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=<sc>, initial-scale=1.0">
6 + <link rel="Stylesheet" href="../../assets/css/p_ml.css">
7 + <script src="https://kit.fontawesome.com/e6f667a852.js" crossorigin="anonymous"></script>
8 + <title>Photo Analysis by Google vision api</title>
9 +</head>
10 +<body>
11 +<div class="all">
12 + <div class="top">
13 + <div class="title">
14 + <img src="../../assets/img/analysis.png" onclick="history.go(-1)" class="float_left" title="Back to photo menu">
15 + </div>
16 + <div id="btn_area">
17 + <p ><button id="start">Start Analysis</button></p>
18 + <p ><button id="next">Back to all photos</button></p>
19 + </div>
20 + </div>
21 + <div class ="chart_cont">
22 + <div class="chart-container">
23 + <canvas id="chart"></canvas>
24 + </div>
25 + </div>
26 +
27 + <div id="content">
28 + <h1 style="margin-top:250px; color:dimgray; text-align: center;">"Start Analysis" 버튼을 눌러 사진 분석을 시작하세요</h1>
29 + <h2 style="color:dimgray; text-align: center;">(시간이 다소 소요될 수 있습니다)</h2>
30 + </div>
31 +</div>
32 + <script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
33 + <script src="p_ml.js"></script>
34 +</body>
35 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +const { ipcRenderer } = require("electron");
2 +const { BrowserWindow } = require("electron").remote;
3 +const content = document.getElementById('content');
4 +const btn = document.getElementById('start');
5 +const next = document.getElementById('next');
6 +const Chart = require("chart.js");
7 +const ctx = document.getElementById("chart").getContext('2d');;
8 +var list_length = new Array();
9 +let l_list = new Array();
10 +let p_list = new Array();
11 +
12 +var mysql = require('mysql');
13 +var list;
14 +
15 +//mysql 연동
16 +var connection = mysql.createConnection({
17 + user:'root',
18 + password:'1234',
19 + database : 'dataextraction'
20 +})
21 +
22 +connection.connect();
23 +
24 +btn.addEventListener("click", ()=>{
25 + content.innerHTML = '<i class="fas fa-spinner fa-3x fa-spin" style="color:dimgray; position: absolute; bottom:45%; right:45%;"></i>';
26 +
27 + connection.query("SELECT * FROM photo" , function(error, results, fields){
28 + if(error){
29 + }
30 + else{
31 + list = results;
32 + ipcRenderer.send('image_labels', list );
33 + }
34 +
35 + });
36 +
37 +})
38 +
39 +var label_name = Array();
40 +var photo_list = Array();
41 +var label_result = Array();
42 +
43 +ipcRenderer.on("labels_result", (e, result) => {
44 + var myHTML = '';
45 + label_result = result;
46 + result.forEach(element=>{
47 + myHTML +="<div class='photo'><div class='p_title'><p>"+element.name+"</p></div>"
48 + myHTML += '<div class="image"><img src="'+element.path+'"></div><div class ="labels">';
49 + element.labels.forEach(label=>{
50 + myHTML+='<p> #'+label.description+'</p>';
51 + find_labellist(label.description, element.path);
52 + });
53 + myHTML+='</div></div>';
54 + })
55 + content.innerHTML = myHTML;
56 + make_chart();
57 +});
58 +
59 +function find_labellist(label, path){
60 + var idx = label_name.indexOf(label);
61 + if(idx == -1){
62 + label_name.push(label);
63 + photo_list.push([path.toString()]);
64 + }
65 + else{
66 + photo_list[idx].push(path.toString());
67 + }
68 +}
69 +
70 +function make_chart(){
71 + for(var i =0; i< photo_list.length; i++){
72 + for(var j = i+1; j <photo_list.length; j++){
73 + if(photo_list[j].length > photo_list[i].length){
74 + var tmp = Array();
75 + tmp = photo_list[i];
76 + photo_list[i] = photo_list[j];
77 + photo_list[j] = tmp;
78 + var str = String();
79 + str = label_name[i];
80 + label_name[i] = label_name[j];
81 + label_name[j] = str;
82 + }
83 + }
84 + }
85 + l_list = label_name;
86 + p_list = photo_list;
87 + myHTML = String();
88 + photo_list.forEach(element => {
89 + list_length.push(element.length);
90 + });
91 +
92 + var mychart = new Chart(ctx,{
93 + type: 'horizontalBar',
94 + data :{
95 + labels : label_name.slice(0, 20),
96 + datasets:[{
97 + label : "nums of images",
98 + data : list_length.slice(0, 20),
99 + borderSkipped:'top',
100 + borderWidth :1,
101 + borderColor : '#FCE2A9',
102 + backgroundColor:'#FCE2A9',
103 + hoverBorderWidth: 2,
104 + barPercentage: 0.8,
105 + categoryPercentage:1,
106 + }],
107 + },
108 + options:{
109 + maintainAspectRatio: false,
110 + title: {
111 + display: true,
112 + text: 'PHOTO KEYWORD'
113 + },
114 + scales: {
115 + xAxes: [{
116 + stacked: true,
117 + gridLines:{
118 + offsetGridLines :true,
119 + },
120 + ticks:{
121 + beginAtZero :true
122 + }
123 + }],
124 + yAxes: [{
125 + ticks :{
126 + fontSize : 10
127 + },
128 + stacked: true,
129 + }]
130 + },
131 + tooltips: {
132 + callbacks: {
133 + labelColor: function(tooltipItem, chart) {
134 + return {
135 + borderColor : '#FCE2A9',
136 + backgroundColor:'#FCE2A9',
137 + };
138 + },
139 + labelTextColor: function(tooltipItem, chart) {
140 + return '#FFFFFF';
141 + }
142 + }
143 + },
144 + onClick : function(e){
145 + var activePoints = mychart.getElementsAtEvent(e);
146 + var idx= activePoints[0]._index;
147 + var myHTML = '<div class="keyword"><h1>#'+label_name[idx]+'</h1></div><div class="k_content">';
148 + photo_list[idx].forEach(photo=>{
149 + myHTML += '<div class="keyword_photo"><img src="'+photo+'"></div>';
150 + });
151 + myHTML+="</div>"
152 + document.getElementById("next").style.visibility = "visible";
153 + content.style.overflowY = "hidden";
154 + content.innerHTML = myHTML;
155 + },
156 + layout:{
157 + padding:{
158 + left:0,
159 + right:0,
160 + top:10,
161 + bottom:0,
162 + }
163 + }
164 + }
165 +
166 + })
167 +}
168 +next.addEventListener("click", ()=>{
169 + var myHTML = '';
170 + label_result.forEach(element=>{
171 + myHTML +="<div class='photo'><div class='p_title'><p>"+element.name+"</p></div>"
172 + myHTML += '<div class="image"><img src="'+element.path+'"></div><div class ="labels">';
173 + element.labels.forEach(label=>{
174 + myHTML+='<p> #'+label.description+'</p>';
175 + });
176 + myHTML+='</div></div>';
177 +})
178 +content.innerHTML = myHTML;
179 +document.getElementById("next").style.visibility = "hidden";
180 +content.style.overflowY = "auto";
181 +});
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=<sc>, initial-scale=1.0">
6 + <link rel="Stylesheet" href="../../assets/css/photo_main.css">
7 + <title>Photo</title>
8 +</head>
9 +<body>
10 + <div class="div_root">
11 + <div class="div_top">
12 + <img src="../../assets/img/Photo.png" onclick="history.go(-1)" title="Back to main menu">
13 + </div>
14 + <div class="div_content">
15 + <div class="div_con_block">
16 + <img src="../../assets/img/photo_date.png" onclick="location.href='p_date.html'" title="날짜로 사진 분류">
17 + </div>
18 + <div class="div_con_block">
19 + <img src="../../assets/img/photo_loc.png" onclick="location.href='p_loc.html'" title="위치로 사진 분류">
20 + </div>
21 + <div class="div_con_block">
22 + <img src="../../assets/img/analysis.png" onclick="location.href='p_ml.html'" title="사진 분석(이미지 키워드 추출)">
23 + </div>
24 + <div class="div_con_block">
25 + <img src="../../assets/img/Detect unsafe Image.png" onclick="location.href='p_detect.html'" title="유해한 이미지 감지">
26 + </div>
27 + </div>
28 + </div>
29 + <script src="photo_main.js"></script>
30 +</body>
31 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +const {exec} = require('child_process');
2 +const { ipcRenderer } = require("electron");
3 +var fs = require('fs');
4 +var mysql = require('mysql');
5 +
6 + //mysql 연동
7 + var connection = mysql.createConnection({
8 + user:'root',
9 + password:'1234',
10 + database : 'dataextraction'
11 + })
12 +
13 +var testFolder = './';
14 +
15 +fs.readdir(testFolder, function(error, filelist){
16 + const index = filelist.indexOf("photos");
17 + if(index == -1){
18 + photo_extract();
19 + }
20 + else{
21 + ipcRenderer.send("print", "already pulled");
22 + }
23 + })
24 +
25 +function photo_extract(){
26 + connection.connect();
27 + connection.query('SELECT path FROM photo', function(error, results, fields){
28 + if(error){
29 + }
30 + if(results.length>0){
31 + var path = new String();
32 + path = results[0].path;
33 + var num = path.indexOf("DCIM");
34 + folder_path = path.substring(0, num+4);
35 + //var folder_path = "/storage/emulated/0/DCIM"; //test용 path
36 +
37 + exec("adb pull "+folder_path+" ./photos", (error, stdout, stderr)=>{
38 + if(error){
39 + ipcRenderer.send("print", "휴대폰이 연결되어 있는지 확인");
40 + }
41 + else{
42 + ipcRenderer.send("print", "succes");
43 + }
44 + });
45 + }
46 + });
47 +}
1 +<!DOCTYPE html>
2 +<html>
3 +<head>
4 + <meta charset="UTF-8">
5 + <title>Hello World!</title>
6 + <meta name="viewport" content="width=device-width, initial-scale=1, script-src 'self' 'unsafe-inline'" />
7 + <link rel="Stylesheet" media="all" type="text/css" href="bower_components/jquery-mobile-bower/css/jquery.mobile-1.4.5.css" />
8 + <link rel="Stylesheet" href="../../assets/css/p_date.css">
9 + <style type="text/css" media="all">
10 + body { cursor: default; }
11 + </style>
12 +</head>
13 +<body>
14 + <div class="date">
15 + <p class="float_left"><input type="date" id="start_date" ></p>
16 + <p class="float_left"><input type="date" id="end_date" ></p>
17 + <p class="float_left"><button id="submit">Submit</button></p>
18 + <p class="float_left"><button id="closeBtn">X</button></p>
19 + </div>
20 + <script src="select_date.js"></script>
21 +</body>
22 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +const {remote, ipcRenderer} = require("electron");
2 +
3 +const closeBtn = document.getElementById("closeBtn");
4 +
5 +closeBtn.addEventListener("click", () => {
6 + let window = remote.getCurrentWindow();
7 + window.close();
8 +});
9 +
10 + var mysql = require('mysql');
11 +
12 + //mysql 연동
13 + var connection = mysql.createConnection({
14 + user:'root',
15 + password:'1234',
16 + database : 'dataextraction'
17 + })
18 +
19 + connection.connect();
20 +
21 + //최대 선택 가능 날짜 설정
22 + var today = new Date();
23 + document.getElementById("start_date").max = today.toISOString().substring(0, 10);
24 + document.getElementById("end_date").max = today.toISOString().substring(0, 10);
25 +
26 + const btn = document.getElementById("submit");
27 +
28 +
29 + btn.addEventListener("click", () => {
30 + var start_date = new String(document.getElementById("start_date").value);
31 + var end_date = new String(document.getElementById("end_date").value);
32 +
33 +
34 + var st = new Date(start_date);
35 + var et = new Date(end_date);
36 +
37 + st.setHours(st.getHours() - 9);
38 + et.setHours(et.getHours() + 15);
39 + et.setMilliseconds(et.getMilliseconds() -1);
40 +
41 + var sTimestamp =st.getTime();
42 + var eTimestamp =et.getTime();
43 +
44 + connection.query('SELECT * FROM photo WHERE date_added > "'+sTimestamp+'" AND date_added <= "'+eTimestamp+'" ORDER BY date_added', function(error, results, fields){
45 + if(error){
46 + }
47 + else{
48 + var arg={
49 + result : results,
50 + start : start_date,
51 + end : end_date
52 + }
53 + ipcRenderer.send(
54 + "photo",
55 + arg
56 + );
57 + let window = remote.getCurrentWindow();
58 + window.close();
59 + }
60 +
61 + } )
62 +
63 + });
64 +
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=<sc>, initial-scale=1.0">
6 + <link rel="Stylesheet" href="../assets/css/timeline.css">
7 + <script src="https://kit.fontawesome.com/e6f667a852.js" crossorigin="anonymous"></script>
8 + <title>TimeLine</title>
9 +</head>
10 +<body>
11 +<div class="all">
12 + <div class="top">
13 + <div id="title">
14 + <img src="../assets/img/TimeLine.png" onclick="history.go(-1)" class="float_left" title="Back to main menu">
15 + </div>
16 + <div id="btn_area">
17 + <p class="float_left"><input type="date" id="date" ></p>
18 + <p class="float_left"><button id="start">타임라인 생성</button></p>
19 + </div>
20 + </div>
21 +
22 + <div id="content">
23 + <div class="container">
24 + <div class="row">
25 + <div class="col-md-12">
26 + <div class="main-timeline" id="main">
27 +
28 + </div>
29 + </div>
30 + </div>
31 + </div>
32 + </div>
33 +</div>
34 +
35 + <script src="timeline.js"></script>
36 +</body>
37 +</html>
...\ No newline at end of file ...\ No newline at end of file
This diff is collapsed. Click to expand it.