|
<!DOCTYPE html> |
|
<html> |
|
|
|
<head> |
|
<title>ChatDev</title> |
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> |
|
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> |
|
<script src="https://cdn.jsdelivr.net/npm/marked@3.0.7/marked.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/prism.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/components/prism-markup.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/components/prism-javascript.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/plugins/line-numbers/prism-line-numbers.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/plugins/copy-to-clipboard/prism-copy-to-clipboard.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.8/clipboard.min.js"></script> |
|
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/highlight.min.js"></script> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.8/clipboard.min.js"></script> |
|
<script src="static/js/main.js"></script> |
|
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> |
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/themes/prism-okaidia.min.css"> |
|
<link rel="stylesheet" href="static/css/style.css"> |
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/styles/monokai-sublime.min.css"> |
|
<script> |
|
hljs.initHighlightingOnLoad(); |
|
</script> |
|
</head> |
|
|
|
<body style="margin: 120px; background-color: rgb(41, 41, 41);"> |
|
<div class="d-flex justify-content-center"> |
|
<img src="static/figures/title.png" alt="ChatDev Title" id="title-image" style="width: 100%; max-width: 500px;"> |
|
</div> |
|
<main class="container" id="form" style="width: auto; height: 58%; background-color:rgb(97, 97, 92); font-size: 24px; overflow: hidden; border-radius: 1rem; font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; font-weight: bolder; text-shadow: 0px 0px 0px rgb(252, 252, 252); color: aliceblue;"> |
|
<form action="https://nathantq-chatdev.hf.space/download" method="post"> |
|
<div style="display: flex; flex-direction: column; justify-content: center; align-items: center;"> |
|
|
|
<label for="api_key">What is your OpenAI API key?</label> |
|
<input name="api_key" id="api_key" placeholder="sk-xxx" style="width:800px; font-size: 68%;" required/> |
|
|
|
<label for="task">What is your task name?</label> |
|
<input name="task" id="task" placeholder="Develop a basic Gomoku game." style="width:800px; font-size: 68%;" required/> |
|
|
|
|
|
<label for="config">Choose software type you want?</label> |
|
<select name="config" id="config" style="width:800px; font-size: 68%; height: 30px;" required> |
|
<option value="Default">Without images</option> |
|
<option value="Art">With generated images</option> |
|
</select> |
|
|
|
<button style="margin: 20px; border-radius: 0.5rem; font-weight: bolder; text-shadow: 0px 0px 0px rgb(252, 252, 252); color: aliceblue; background-color: rgb(58, 58, 218);">Get Started</button> |
|
</div> |
|
</form> |
|
<div style="display: flex; flex-direction: column; justify-content: center; align-items: center;"> |
|
<label for="config">Click after the Chief Product Officer send manual:</label> |
|
<a href="/Outputs.zip" download="Outputs.zip"> |
|
<button margin: style="margin:20px; border-radius: 0.5rem; font-weight: bolder; text-shadow: 0px 0px 0px rgb(252, 252, 252); color: aliceblue; background-color: rgb(226, 67, 160);">Download</button> |
|
</a> |
|
</div> |
|
</main> |
|
|
|
<div class="container d-flex flex-column" id="chat-box" style="background-color: rgb(97, 97, 92); border-radius: 1rem"></div> |
|
<script> |
|
var container = document.getElementById("chat-box"); |
|
container.scrollTop = container.scrollHeight; |
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script src="static/js/main.js"></script> |
|
</body> |
|
|
|
|
|
|
|
|
|
|
|
</html> |
|
|
|
|