MWD / 2020-02-OSS-TermProject

Go to a project
Toggle navigation Toggle navigation pinning
이재호
cb979a68 1 parent f9204332

add output audio

Inline Side-by-side
Showing 7 changed files with 13 additions and 4 deletions
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
...@@ -13,7 +13,8 @@ router.get('/data', function(req, res, next){ ...@@ -13,7 +13,8 @@ router.get('/data', function(req, res, next){
13 id = req.query.id; 13 id = req.query.id;
14 14
15 data = { 15 data = {
16 - image : "/images/"+id+".jpg" 16 + image : "/images/"+id+".jpg",
17 + audio : "/audio/"+id+".mp3"
17 } 18 }
18 //데이터 확인 19 //데이터 확인
19 console.log(data); 20 console.log(data);
......
...@@ -16,7 +16,11 @@ ...@@ -16,7 +16,11 @@
16 <div id="check_image"> 16 <div id="check_image">
17 <img src="/images/1.jpg"> 17 <img src="/images/1.jpg">
18 </div> 18 </div>
19 - 19 + <div id = "check_audio">
20 + <!--초기값으로 '시작'이라는 음성을 사용 -->
21 + <!--auto play 기능을 위해 iframe 사용 -->
22 + <iframe src="/audios/4.mp3" allow="autoplay" id="audio" style="display:none"></iframe>
23 + </div>
20 <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.3.1/dist/tf.min.js"></script> 24 <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.3.1/dist/tf.min.js"></script>
21 <script src="https://cdn.jsdelivr.net/npm/@teachablemachine/image@0.8/dist/teachablemachine-image.min.js"></script> 25 <script src="https://cdn.jsdelivr.net/npm/@teachablemachine/image@0.8/dist/teachablemachine-image.min.js"></script>
22 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 26 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
...@@ -127,12 +131,16 @@ ...@@ -127,12 +131,16 @@
127 function process_json(json_data){ 131 function process_json(json_data){
128 var images = json_data.image; 132 var images = json_data.image;
129 var strDOM = ""; 133 var strDOM = "";
130 - 134 + var audio = json_data.audio;
135 + var audioName = "";
131 //이미지 태그 생성 136 //이미지 태그 생성
132 strDOM += '<img src="'+images+'">'; 137 strDOM += '<img src="'+images+'">';
133 - 138 + //오디오 태그 생성
139 + audioName += '<iframe src="' + audio + '" allow="autoplay" id="audio" style="display:none"></iframe>';
134 //#cehck_image div의 이미지 교체 140 //#cehck_image div의 이미지 교체
135 $('#check_image').html(strDOM); 141 $('#check_image').html(strDOM);
142 + //#check_audio div의 오디오 교체
143 + $('#check_audio').html(audioName);
136 } 144 }
137 145
138 </script> 146 </script>
......