민병수

Merge branch 'html-home' into 'main'

Html home



See merge request !4
...@@ -15,7 +15,7 @@ a{ ...@@ -15,7 +15,7 @@ a{
15 color:var(--text-color); 15 color:var(--text-color);
16 16
17 } 17 }
18 -.menu{ 18 +.voi_menu{
19 display:flex; 19 display:flex;
20 justify-content:space-between; 20 justify-content:space-between;
21 align-items:center; 21 align-items:center;
...@@ -25,10 +25,12 @@ a{ ...@@ -25,10 +25,12 @@ a{
25 .menu_bar_content li:hover{ 25 .menu_bar_content li:hover{
26 background-color:var(--accent-color); 26 background-color:var(--accent-color);
27 border-radius: 4px; 27 border-radius: 4px;
28 + color:var(--text-color);
28 } 29 }
29 .menu_bar_icons li:hover{ 30 .menu_bar_icons li:hover{
30 background-color:var(--accent-color); 31 background-color:var(--accent-color);
31 border-radius: 4px; 32 border-radius: 4px;
33 + color:var(--text-color);
32 } 34 }
33 .menu_bar_logo{ 35 .menu_bar_logo{
34 font-size: 20px; 36 font-size: 20px;
...@@ -37,6 +39,9 @@ a{ ...@@ -37,6 +39,9 @@ a{
37 .menu_bar_logo i{ 39 .menu_bar_logo i{
38 color:var(--accent-color); 40 color:var(--accent-color);
39 } 41 }
42 +.basic:hover{
43 + color:var(--text-color);
44 +}
40 .menu_bar_content{ 45 .menu_bar_content{
41 display:flex; 46 display:flex;
42 list-style: none; 47 list-style: none;
...@@ -54,13 +59,17 @@ a{ ...@@ -54,13 +59,17 @@ a{
54 padding: 8px 12px; 59 padding: 8px 12px;
55 } 60 }
56 .menu_toggle{ 61 .menu_toggle{
62 + color:var(--text-color);
57 display: none; 63 display: none;
58 position: absolute; 64 position: absolute;
59 right:32px; 65 right:32px;
60 font-size: 24px; 66 font-size: 24px;
61 } 67 }
68 +.menu_toggle:hover{
69 + color:var(--text-color);
70 +}
62 @media screen and (max-width: 500px) { 71 @media screen and (max-width: 500px) {
63 - .menu{ 72 + .voi_menu{
64 flex-direction: column; 73 flex-direction: column;
65 align-items: flex-start; 74 align-items: flex-start;
66 padding: 8px 24px; 75 padding: 8px 24px;
...@@ -82,6 +91,7 @@ a{ ...@@ -82,6 +91,7 @@ a{
82 } 91 }
83 .menu_toggle{ 92 .menu_toggle{
84 display: block; 93 display: block;
94 + color:var(--text-color);
85 } 95 }
86 .menu_bar_content.active, 96 .menu_bar_content.active,
87 .menu_bar_icons.active{ 97 .menu_bar_icons.active{
...@@ -109,25 +119,35 @@ button:hover{ ...@@ -109,25 +119,35 @@ button:hover{
109 margin: 23px; 119 margin: 23px;
110 } 120 }
111 #output{ 121 #output{
112 - width:50%; 122 + margin:20px;
113 - margin-left:20px;
114 display:flex; 123 display:flex;
115 - border: 3px solid var(--accent-color); 124 + align-items:center;
116 height:700px; 125 height:700px;
126 + background-color:rgba(0,0,0,.87);
127 + color:var(--text-color);
117 } 128 }
118 #recordButton{ 129 #recordButton{
119 line-height: 22px; 130 line-height: 22px;
131 + font-size:50px;
120 } 132 }
121 #transcribeButton{ 133 #transcribeButton{
122 line-height: 22px; 134 line-height: 22px;
135 + font-size:50px;
123 } 136 }
124 .output_bar{ 137 .output_bar{
125 display:flex; 138 display:flex;
126 - justify-content:space-around; 139 + justify-content:center;
127 color:black; 140 color:black;
128 - border: 3px solid var(--accent-color);
129 margin: 20px; 141 margin: 20px;
142 + font-size:100px;
130 } 143 }
131 -.ttp{ 144 +.basic{
132 - 145 + color:var(--text-color);
146 + font-size:20px;
147 +}
148 +.fas.fa-arrow-circle-down{
149 + color:var(--background-color);
150 + font-size:70px;
151 + display:block;
152 + text-align:center;
133 } 153 }
...\ No newline at end of file ...\ No newline at end of file
......
This diff is collapsed. Click to expand it.
...@@ -13,7 +13,7 @@ a{ ...@@ -13,7 +13,7 @@ a{
13 color:var(--text-color); 13 color:var(--text-color);
14 14
15 } 15 }
16 -.menu{ 16 +.voi_menu{
17 display:flex; 17 display:flex;
18 justify-content:space-between; 18 justify-content:space-between;
19 align-items:center; 19 align-items:center;
......
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
12 <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet"> 12 <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet">
13 </head> 13 </head>
14 <body> 14 <body>
15 - <nav class="menu"> 15 + <nav class="voi_menu">
16 <div class="menu_bar_logo"> 16 <div class="menu_bar_logo">
17 <i class="fas fa-microphone-alt"></i> 17 <i class="fas fa-microphone-alt"></i>
18 <a href="Voico_Home.html">Voicoding</a> 18 <a href="Voico_Home.html">Voicoding</a>
......
...@@ -13,7 +13,7 @@ a{ ...@@ -13,7 +13,7 @@ a{
13 color:var(--text-color); 13 color:var(--text-color);
14 14
15 } 15 }
16 -.menu{ 16 +.voi_menu{
17 display:flex; 17 display:flex;
18 justify-content:space-between; 18 justify-content:space-between;
19 align-items:center; 19 align-items:center;
......
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
12 <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet"> 12 <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet">
13 </head> 13 </head>
14 <body> 14 <body>
15 - <nav class="menu"> 15 + <nav class="voi_menu">
16 <div class="menu_bar_logo"> 16 <div class="menu_bar_logo">
17 <i class="fas fa-microphone-alt"></i> 17 <i class="fas fa-microphone-alt"></i>
18 <a href="Voico_Home.html">Voicoding</a> 18 <a href="Voico_Home.html">Voicoding</a>
......
1 -
2 body { 1 body {
3 background: url(/images/judge0_background.png) no-repeat center center fixed; 2 background: url(/images/judge0_background.png) no-repeat center center fixed;
4 -webkit-background-size: cover; 3 -webkit-background-size: cover;
...@@ -87,6 +86,7 @@ body { ...@@ -87,6 +86,7 @@ body {
87 } 86 }
88 87
89 #site-content { 88 #site-content {
89 + display:flex;
90 height: calc(100% - 45px - 19px); 90 height: calc(100% - 45px - 19px);
91 } 91 }
92 92
......
...@@ -141,8 +141,8 @@ function localStorageGetItem(key) { ...@@ -141,8 +141,8 @@ function localStorageGetItem(key) {
141 } 141 }
142 142
143 function showMessages() { 143 function showMessages() {
144 - var width = $updates.offset().left - parseFloat($updates.css("padding-left")) - 144 + var width = 100//$updates.offset().left - parseFloat($updates.css("padding-left")) -
145 - $navigationMessage.parent().offset().left - parseFloat($navigationMessage.parent().css("padding-left")) - 5; 145 + //$navigationMessage.parent().offset().left - parseFloat($navigationMessage.parent().css("padding-left")) - 5;
146 146
147 if (width < 200 || messagesData === undefined) { 147 if (width < 200 || messagesData === undefined) {
148 return; 148 return;
...@@ -255,7 +255,7 @@ function getIdFromURI() { ...@@ -255,7 +255,7 @@ function getIdFromURI() {
255 } 255 }
256 256
257 function downloadSource() { 257 function downloadSource() {
258 - var value = parseInt($selectLanguage.val()); 258 + var value = parseInt(71);
259 download(sourceEditor.getValue(), fileNames[value], "text/plain"); 259 download(sourceEditor.getValue(), fileNames[value], "text/plain");
260 } 260 }
261 261
...@@ -308,7 +308,7 @@ function run() { ...@@ -308,7 +308,7 @@ function run() {
308 308
309 var sourceValue = encode(sourceEditor.getValue()); 309 var sourceValue = encode(sourceEditor.getValue());
310 var stdinValue = encode(stdinEditor.getValue()); 310 var stdinValue = encode(stdinEditor.getValue());
311 - var languageId = resolveLanguageId($selectLanguage.val()); 311 + var languageId = resolveLanguageId(71);
312 var compilerOptions = $compilerOptions.val(); 312 var compilerOptions = $compilerOptions.val();
313 var commandLineArguments = $commandLineArguments.val(); 313 var commandLineArguments = $commandLineArguments.val();
314 314
...@@ -393,21 +393,21 @@ function fetchSubmission(submission_token) { ...@@ -393,21 +393,21 @@ function fetchSubmission(submission_token) {
393 393
394 function changeEditorLanguage() { 394 function changeEditorLanguage() {
395 monaco.editor.setModelLanguage(sourceEditor.getModel(), $selectLanguage.find(":selected").attr("mode")); 395 monaco.editor.setModelLanguage(sourceEditor.getModel(), $selectLanguage.find(":selected").attr("mode"));
396 - currentLanguageId = parseInt($selectLanguage.val()); 396 + currentLanguageId = parseInt(71);
397 $(".lm_title")[0].innerText = fileNames[currentLanguageId]; 397 $(".lm_title")[0].innerText = fileNames[currentLanguageId];
398 - apiUrl = resolveApiUrl($selectLanguage.val()); 398 + apiUrl = resolveApiUrl(71);
399 } 399 }
400 400
401 function insertTemplate() { 401 function insertTemplate() {
402 - currentLanguageId = parseInt($selectLanguage.val()); 402 + currentLanguageId = parseInt(71);
403 sourceEditor.setValue(sources[currentLanguageId]); 403 sourceEditor.setValue(sources[currentLanguageId]);
404 changeEditorLanguage(); 404 changeEditorLanguage();
405 } 405 }
406 406
407 function loadRandomLanguage() { 407 function loadRandomLanguage() {
408 // $selectLanguage.dropdown("set selected", values[Math.floor(Math.random() * $selectLanguage[0].length)]); 408 // $selectLanguage.dropdown("set selected", values[Math.floor(Math.random() * $selectLanguage[0].length)]);
409 - $selectLanguage.dropdown("set selected", 71); 409 + //$selectLanguage.dropdown("set selected", 71);
410 - apiUrl = resolveApiUrl($selectLanguage.val()); 410 + apiUrl = resolveApiUrl(71);
411 insertTemplate(); 411 insertTemplate();
412 } 412 }
413 413
...@@ -591,7 +591,7 @@ $(document).ready(function () { ...@@ -591,7 +591,7 @@ $(document).ready(function () {
591 changeEditorMode(); 591 changeEditorMode();
592 592
593 sourceEditor.getModel().onDidChangeContent(function (e) { 593 sourceEditor.getModel().onDidChangeContent(function (e) {
594 - currentLanguageId = parseInt($selectLanguage.val()); 594 + currentLanguageId = parseInt(71);
595 isEditorDirty = sourceEditor.getValue() != sources[currentLanguageId]; 595 isEditorDirty = sourceEditor.getValue() != sources[currentLanguageId];
596 }); 596 });
597 597
......
1 -let rec = null;
2 -let audioStream = null;
3 -const recordButton = document.getElementById("recordButton");
4 -const transcribeButton = document.getElementById("transcribeButton");
5 -recordButton.addEventListener("click", startRecording);
6 -transcribeButton.addEventListener("click", transcribeText);
7 -let cnt = 0;
8 -function startRecording() {
9 - let constraints = { audio: true, video:false }
10 - recordButton.disabled = true;
11 - transcribeButton.disabled = false;
12 - navigator.mediaDevices.getUserMedia(constraints).then(function(stream) {
13 - const audioContext = new window.AudioContext();
14 - audioStream = stream;
15 - const input = audioContext.createMediaStreamSource(stream);
16 - rec = new Recorder(input, { numChannels:1 })
17 - rec.record()
18 - }).catch(function(err) {
19 - recordButton.disabled = false;
20 - transcribeButton.disabled = true;
21 - });
22 -}
23 -function transcribeText() {
24 - transcribeButton.disabled = true;
25 - recordButton.disabled = false;
26 - rec.stop();
27 - audioStream.getAudioTracks()[0].stop();
28 - rec.exportWAV(uploadSoundData);
29 -}
30 -function uploadSoundData(blob) {
31 - let filename = new Date().toISOString();
32 - let xhr = new XMLHttpRequest();
33 - let formData = new FormData();
34 - xhr.onload = function(e) {
35 - if(this.readyState === 4) {
36 - document.getElementById("output").innerHTML += `${cnt++}: ${JSON.parse(e.target.responseText)}<br>`;
37 - }
38 - };
39 - formData.append("audio_data", blob, filename);
40 - xhr.open("POST", "/upload_sound", true);
41 - xhr.send(formData);
42 -}
...\ No newline at end of file ...\ No newline at end of file
File mode changed
...@@ -3,7 +3,7 @@ const multer = require('multer'); ...@@ -3,7 +3,7 @@ const multer = require('multer');
3 const fs = require('fs'); 3 const fs = require('fs');
4 const upload = multer(); 4 const upload = multer();
5 const app = express(); 5 const app = express();
6 -const port = 5501; 6 +const port = 5500;
7 app.use(express.static('Voicoding_web')); 7 app.use(express.static('Voicoding_web'));
8 app.use(express.static('./')); 8 app.use(express.static('./'));
9 async function testGoogleTextToSpeech(audioBuffer) { 9 async function testGoogleTextToSpeech(audioBuffer) {
......