천현우 / Voicoding

Go to a project
Toggle navigation Toggle navigation pinning
민병수
3ef3e13b 2 parents f48d90c1 f14d0fe4

Merge branch 'html-home' into 'main' 

Html home



See merge request !4
Inline Side-by-side
Showing 11 changed files with 178 additions and 112 deletions
......@@ -15,7 +15,7 @@ a{
color:var(--text-color);
}
.menu{
.voi_menu{
display:flex;
justify-content:space-between;
align-items:center;
......@@ -25,10 +25,12 @@ a{
.menu_bar_content li:hover{
background-color:var(--accent-color);
border-radius: 4px;
color:var(--text-color);
}
.menu_bar_icons li:hover{
background-color:var(--accent-color);
border-radius: 4px;
color:var(--text-color);
}
.menu_bar_logo{
font-size: 20px;
......@@ -37,6 +39,9 @@ a{
.menu_bar_logo i{
color:var(--accent-color);
}
.basic:hover{
color:var(--text-color);
}
.menu_bar_content{
display:flex;
list-style: none;
......@@ -54,13 +59,17 @@ a{
padding: 8px 12px;
}
.menu_toggle{
color:var(--text-color);
display: none;
position: absolute;
right:32px;
font-size: 24px;
}
.menu_toggle:hover{
color:var(--text-color);
}
@media screen and (max-width: 500px) {
.menu{
.voi_menu{
flex-direction: column;
align-items: flex-start;
padding: 8px 24px;
......@@ -82,6 +91,7 @@ a{
}
.menu_toggle{
display: block;
color:var(--text-color);
}
.menu_bar_content.active,
.menu_bar_icons.active{
......@@ -109,25 +119,35 @@ button:hover{
margin: 23px;
}
#output{
width:50%;
margin-left:20px;
margin:20px;
display:flex;
border: 3px solid var(--accent-color);
align-items:center;
height:700px;
background-color:rgba(0,0,0,.87);
color:var(--text-color);
}
#recordButton{
line-height: 22px;
font-size:50px;
}
#transcribeButton{
line-height: 22px;
font-size:50px;
}
.output_bar{
display:flex;
justify-content:space-around;
justify-content:center;
color:black;
border: 3px solid var(--accent-color);
margin: 20px;
font-size:100px;
}
.ttp{
.basic{
color:var(--text-color);
font-size:20px;
}
.fas.fa-arrow-circle-down{
color:var(--background-color);
font-size:70px;
display:block;
text-align:center;
}
\ No newline at end of file
......
......@@ -6,27 +6,29 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Voicoding</title>
<script src="https://kit.fontawesome.com/a5f26fa106.js" crossorigin="anonymous"></script>
<script src="menu.js" defer></script>
<script defer src="https://kit.fontawesome.com/a5f26fa106.js" crossorigin="anonymous"></script>
<script defer src="menu.js"></script>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet">
<script src="https://cdn.rawgit.com/mattdiamond/Recorderjs/08e7abd9/dist/recorder.js"></script>
<script defer src="https://cdn.rawgit.com/mattdiamond/Recorderjs/08e7abd9/dist/recorder.js"></script>
<script defer src="client.js"></script>
<meta name="description" content="Free and open-source online code editor that allows you to write and execute code from a rich set of languages.">
<meta name="keywords" content="online editor, online code editor, online ide, online compiler, online interpreter, run code online, learn programming online,
online debugger, programming in browser, online code runner, online code execution, debug online, debug C code online, debug C++ code online,
programming online, snippet, snippets, code snippet, code snippets, pastebin, execute code, programming in browser, run c online, run C++ online,
run java online, run python online, run ruby online, run c# online, run rust online, run pascal online, run basic online">
online debugger, programming in browser, online code runner, online code execution, debug online, debug C code online, debug C++ code online,
programming online, snippet, snippets, code snippet, code snippets, pastebin, execute code, programming in browser, run c online, run C++ online,
run java online, run python online, run ruby online, run c# online, run rust online, run pascal online, run basic online">
<meta name="author" content="Herman Zvonimir Došilović">
<meta property="og:title" content="Judge0 IDE - Free and open-source online code editor">
<meta property="og:description" content="Free and open-source online code editor that allows you to write and execute code from a rich set of languages.">
<meta property="og:image" content="https://raw.githubusercontent.com/judge0/ide/master/.github/wallpaper.png">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/golden-layout/1.5.9/goldenlayout.min.js" integrity="sha256-NhJAZDfGgv4PiB+GVlSrPdh3uc75XXYSM4su8hgTchI=" crossorigin="anonymous"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/golden-layout/1.5.9/goldenlayout.min.js" integrity="sha256-NhJAZDfGgv4PiB+GVlSrPdh3uc75XXYSM4su8hgTchI=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/golden-layout/1.5.9/css/goldenlayout-base.css" integrity="sha256-oIDR18yKFZtfjCJfDsJYpTBv1S9QmxYopeqw2dO96xM=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/golden-layout/1.5.9/css/goldenlayout-dark-theme.css" integrity="sha256-ygw8PvSDJJUGLf6Q9KIQsYR3mOmiQNlDaxMLDOx9xL0=" crossorigin="anonymous" />
<script>
var require = {
......@@ -37,53 +39,49 @@
}
};
</script>
<script src="https://unpkg.com/monaco-editor/min/vs/loader.js"></script>
<script src="https://unpkg.com/monaco-editor@0.23.0/min/vs/editor/editor.main.nls.js"></script>
<script src="https://unpkg.com/monaco-editor@0.23.0/min/vs/editor/editor.main.js"></script>
<script defer src="https://unpkg.com/monaco-editor/min/vs/loader.js"></script>
<script defer src="https://unpkg.com/monaco-editor@0.23.0/min/vs/editor/editor.main.nls.js"></script>
<script defer src="https://unpkg.com/monaco-editor@0.23.0/min/vs/editor/editor.main.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js" integrity="sha256-t8GepnyPmw9t+foMh3mKNvcorqNHamSKtKRxxpUEgFI=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" integrity="sha256-9mbkOfVho3ZPXfM7W8sV2SndrGDuh7wuyLjtsWeTI1Q=" crossorigin="anonymous" />
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js" integrity="sha256-t8GepnyPmw9t+foMh3mKNvcorqNHamSKtKRxxpUEgFI=" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css?family=Exo+2" rel="stylesheet">
<script type="text/javascript" src="third_party/download.js"></script>
<script type="text/javascript" defer src="third_party/download.js"></script>
<script type="text/javascript" src="js/ide.js" defer></script>
<script type="text/javascript" defer src="js/ide.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" integrity="sha256-9mbkOfVho3ZPXfM7W8sV2SndrGDuh7wuyLjtsWeTI1Q=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js" integrity="sha256-t8GepnyPmw9t+foMh3mKNvcorqNHamSKtKRxxpUEgFI=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<link type="text/css" rel="stylesheet" href="css/ide.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/golden-layout/1.5.9/goldenlayout.min.js" integrity="sha256-NhJAZDfGgv4PiB+GVlSrPdh3uc75XXYSM4su8hgTchI=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/golden-layout/1.5.9/css/goldenlayout-base.css" integrity="sha256-oIDR18yKFZtfjCJfDsJYpTBv1S9QmxYopeqw2dO96xM=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/golden-layout/1.5.9/css/goldenlayout-dark-theme.css" integrity="sha256-ygw8PvSDJJUGLf6Q9KIQsYR3mOmiQNlDaxMLDOx9xL0=" crossorigin="anonymous" />
<title>Judge0 IDE - Free and open-source online code editor</title>
<link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
<link rel="icon" href="./favicon.ico" type="image/x-icon">
<script async defer src="https://www.googletagmanager.com/gtag/js?id=G-RHNJ50BJ2F"></script>
<script>
var require = {
paths: {
"vs": "https://unpkg.com/monaco-editor/min/vs",
"monaco-vim": "https://unpkg.com/monaco-vim/dist/monaco-vim",
"monaco-emacs": "https://unpkg.com/monaco-emacs/dist/monaco-emacs"
}
};
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-RHNJ50BJ2F');
</script>
<script src="https://unpkg.com/monaco-editor/min/vs/loader.js"></script>
<script src="https://unpkg.com/monaco-editor@0.23.0/min/vs/editor/editor.main.nls.js"></script>
<script src="https://unpkg.com/monaco-editor@0.23.0/min/vs/editor/editor.main.js"></script>
<script defer type="text/javascript">window.$crisp=[];window.CRISP_WEBSITE_ID="ee4621ff-c682-44ac-8cfa-1835beddb98a";(function(){d=document;s=d.createElement("script"); src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>
</head>
<body>
<nav class="menu">
<nav class="voi_menu">
<div class="menu_bar_logo">
<i class="fas fa-microphone-alt"></i>
<a href="Voico_Home.html">Voicoding</a>
<a class = "basic" href="Voico_Menu.html">Voicoding</a>
</div>
<ul class="menu_bar_content">
<a href="Voico_Home.html"><li>Home</li></a>
<a href="\Manual.txt"><li>Manual</li></a>
<a href="Voico_Info.html"><li>info</li></a>
<a class = "basic" href="Voico_Home.html"><li>Home</li></a>
<a class = "basic" href="\Manual.txt"><li>Manual</li></a>
<a class = "basic" href="Voico_Info.html"><li>Info</li></a>
</ul>
<ul class="menu_bar_icons">
<li><a = href="https://www.instagram.com/waterinbottle48/"><i class="fab fa-instagram"></i></a></li>
<li><a = href="http://khuhub.khu.ac.kr/2019102168/Voicoding"><i class="fab fa-github"></i></a></li>
<li><a class = "basic" href="https://www.instagram.com/waterinbottle48/"><i class="fab fa-instagram"></i></a></li>
<li><a class = "basic" href="http://khuhub.khu.ac.kr/2019102168/Voicoding"><i class="fab fa-github"></i></a></li>
</ul>
<a href="#" class="menu_toggle"><i class="fas fa-bars"></i></a>
</nav>
......@@ -92,16 +90,106 @@
<button id="transcribeButton" disabled>To text</button>
</div>
<div class="output_bar">
<h3>Transcription Raw Data</h3>
<h3 style= "width:174.462px; text-align:center">TTP</h3>
<h2>Transcription Raw Data</h2>
</div>
<div id="output"></div>
<div class="ttp">
<div class="item no-left-padding borderless">
<button id="run-btn" class="ui primary labeled icon button"><i class="play icon"></i>Run (F9)</button>
<i class="fas fa-arrow-circle-down"></i>
<div class="output_bar">
<h2>TTP</h2>
</div>
<div id="site-navigation" class="ui small inverted menu" style="margin:20px 20px 0px 20px;">
<div id="site-header" class="header item">
</div>
<div id="site-content"></div>
<div class="left menu" >
<div class="ui dropdown item site-links on-hover">
File <i class="dropdown icon"></i>
<div class="menu">
<a class="item" target="_blank" href="/"><i class="file code icon"></i> New File</a>
<div class="item" onclick="downloadSource()"><i class="download icon"></i> Download</div>
<div id="insert-template-btn" class="item"><i class="file code outline icon"></i> Insert template
for current language</div>
</div>
</div>
<div class="item borderless">
</div>
<div class="item fitted borderless wide screen only">
<div class="ui input">
<p id="compiler-options" type="text" placeholder="Compiler options"></p>
</div>
</div>
<div class="item borderless wide screen only">
<div class="ui input">
<p id="command-line-arguments" type="text" placeholder="Command line arguments"></p>
</div>
</div>
<div class="item no-left-padding borderless">
<button id="run-btn" class="ui primary labeled icon button"><i class="play icon"></i>Run (F9)</button>
</div>
</div>
</div>
<div id="site-content"style="margin:0px 20px 20px 20px;"></div>
<div id="site-modal" class="ui modal">
<div class="header">
<i class="close icon"></i>
<span id="title"></span>
</div>
<div class="scrolling content"></div>
<div class="actions">
<div class="ui small labeled icon cancel button">
<i class="remove icon"></i>
Close (ESC)
</div>
</div>
</div>
<div id="site-settings" class="ui modal">
<i class="close icon"></i>
<div class="header">
<i class="cog icon"></i>
Settings
</div>
<div class="content">
<div class="ui form">
<div class="inline fields">
<label>Editor Mode</label>
<div class="field">
<div class="ui radio checkbox">
<input type="radio" name="editor-mode" value="normal" checked="checked">
<label>Normal</label>
</div>
</div>
<div class="field">
<div class="ui radio checkbox">
<input type="radio" name="editor-mode" value="vim">
<label>Vim</label>
</div>
</div>
<div class="field">
<div class="ui radio checkbox">
<input type="radio" name="editor-mode" value="emacs">
<label>Emacs</label>
</div>
</div>
</div>
<div class="inline field">
<div class="ui checkbox">
<input type="checkbox" name="redirect-output">
<label>Redirect stderr to stdout</label>
</div>
</div>
</div>
</div>
</div>
<div id="editor-status-line"></div>
</body>
</html>
\ No newline at end of file
......
......@@ -13,7 +13,7 @@ a{
color:var(--text-color);
}
.menu{
.voi_menu{
display:flex;
justify-content:space-between;
align-items:center;
......
......@@ -12,7 +12,7 @@
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet">
</head>
<body>
<nav class="menu">
<nav class="voi_menu">
<div class="menu_bar_logo">
<i class="fas fa-microphone-alt"></i>
<a href="Voico_Home.html">Voicoding</a>
......
......@@ -13,7 +13,7 @@ a{
color:var(--text-color);
}
.menu{
.voi_menu{
display:flex;
justify-content:space-between;
align-items:center;
......
......@@ -12,7 +12,7 @@
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet">
</head>
<body>
<nav class="menu">
<nav class="voi_menu">
<div class="menu_bar_logo">
<i class="fas fa-microphone-alt"></i>
<a href="Voico_Home.html">Voicoding</a>
......
body {
background: url(/images/judge0_background.png) no-repeat center center fixed;
-webkit-background-size: cover;
......@@ -87,6 +86,7 @@ body {
}
#site-content {
display:flex;
height: calc(100% - 45px - 19px);
}
......
......@@ -141,8 +141,8 @@ function localStorageGetItem(key) {
}
function showMessages() {
var width = $updates.offset().left - parseFloat($updates.css("padding-left")) -
$navigationMessage.parent().offset().left - parseFloat($navigationMessage.parent().css("padding-left")) - 5;
var width = 100//$updates.offset().left - parseFloat($updates.css("padding-left")) -
//$navigationMessage.parent().offset().left - parseFloat($navigationMessage.parent().css("padding-left")) - 5;
if (width < 200 || messagesData === undefined) {
return;
......@@ -255,7 +255,7 @@ function getIdFromURI() {
}
function downloadSource() {
var value = parseInt($selectLanguage.val());
var value = parseInt(71);
download(sourceEditor.getValue(), fileNames[value], "text/plain");
}
......@@ -308,7 +308,7 @@ function run() {
var sourceValue = encode(sourceEditor.getValue());
var stdinValue = encode(stdinEditor.getValue());
var languageId = resolveLanguageId($selectLanguage.val());
var languageId = resolveLanguageId(71);
var compilerOptions = $compilerOptions.val();
var commandLineArguments = $commandLineArguments.val();
......@@ -393,21 +393,21 @@ function fetchSubmission(submission_token) {
function changeEditorLanguage() {
monaco.editor.setModelLanguage(sourceEditor.getModel(), $selectLanguage.find(":selected").attr("mode"));
currentLanguageId = parseInt($selectLanguage.val());
currentLanguageId = parseInt(71);
$(".lm_title")[0].innerText = fileNames[currentLanguageId];
apiUrl = resolveApiUrl($selectLanguage.val());
apiUrl = resolveApiUrl(71);
}
function insertTemplate() {
currentLanguageId = parseInt($selectLanguage.val());
currentLanguageId = parseInt(71);
sourceEditor.setValue(sources[currentLanguageId]);
changeEditorLanguage();
}
function loadRandomLanguage() {
// $selectLanguage.dropdown("set selected", values[Math.floor(Math.random() * $selectLanguage[0].length)]);
$selectLanguage.dropdown("set selected", 71);
apiUrl = resolveApiUrl($selectLanguage.val());
//$selectLanguage.dropdown("set selected", 71);
apiUrl = resolveApiUrl(71);
insertTemplate();
}
......@@ -591,7 +591,7 @@ $(document).ready(function () {
changeEditorMode();
sourceEditor.getModel().onDidChangeContent(function (e) {
currentLanguageId = parseInt($selectLanguage.val());
currentLanguageId = parseInt(71);
isEditorDirty = sourceEditor.getValue() != sources[currentLanguageId];
});
......
let rec = null;
let audioStream = null;
const recordButton = document.getElementById("recordButton");
const transcribeButton = document.getElementById("transcribeButton");
recordButton.addEventListener("click", startRecording);
transcribeButton.addEventListener("click", transcribeText);
let cnt = 0;
function startRecording() {
let constraints = { audio: true, video:false }
recordButton.disabled = true;
transcribeButton.disabled = false;
navigator.mediaDevices.getUserMedia(constraints).then(function(stream) {
const audioContext = new window.AudioContext();
audioStream = stream;
const input = audioContext.createMediaStreamSource(stream);
rec = new Recorder(input, { numChannels:1 })
rec.record()
}).catch(function(err) {
recordButton.disabled = false;
transcribeButton.disabled = true;
});
}
function transcribeText() {
transcribeButton.disabled = true;
recordButton.disabled = false;
rec.stop();
audioStream.getAudioTracks()[0].stop();
rec.exportWAV(uploadSoundData);
}
function uploadSoundData(blob) {
let filename = new Date().toISOString();
let xhr = new XMLHttpRequest();
let formData = new FormData();
xhr.onload = function(e) {
if(this.readyState === 4) {
document.getElementById("output").innerHTML += `${cnt++}: ${JSON.parse(e.target.responseText)}<br>`;
}
};
formData.append("audio_data", blob, filename);
xhr.open("POST", "/upload_sound", true);
xhr.send(formData);
}
\ No newline at end of file
File mode changed
......@@ -3,7 +3,7 @@ const multer = require('multer');
const fs = require('fs');
const upload = multer();
const app = express();
const port = 5501;
const port = 5500;
app.use(express.static('Voicoding_web'));
app.use(express.static('./'));
async function testGoogleTextToSpeech(audioBuffer) {
......