mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-09 03:21:23 +00:00
Frontend copied into brandon.audio
This commit is contained in:
Brandon Thomas committed
1 parent
88c3fe71ad
commit
c5a8db7537
7 files changed
+436
-3
No files matched your search
@@ -12,3 +12,5 @@ web/*.js
|
||||
web/deploy/
|
||||
web/images/
|
||||
web/output/
|
||||
brandon.audio/deploy/
|
||||
brandon.audio/output/
|
||||
@@ -0,0 +1,10 @@
|
||||
<!doctype html>
|
||||
<html lang="en-US">
|
||||
<head>
|
||||
<title>Brandon Audio — Error</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Bad Error</h1>
|
||||
<p>This thing doesn't exist.</p>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,78 @@
|
||||
<!doctype html>
|
||||
<html lang="en-US">
|
||||
<head>
|
||||
<title>[brandon.audio]</title>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
||||
<meta name="viewport"
|
||||
content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
|
||||
<meta name="description" content="brandon.audio">
|
||||
<link rel="stylesheet" href="/assets/main.css" type="text/css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Fira+Sans" rel="stylesheet">
|
||||
<meta name="content_hash" content="asset_content_hash">
|
||||
<meta name="environment" content="DEVELOPMENT">
|
||||
<meta name="api_host" content="API_HOST">
|
||||
<meta name="cdn_host" content="CDN_HOST">
|
||||
</head>
|
||||
<body>
|
||||
<div id="animation"></div>
|
||||
<div id="logo">
|
||||
<h1>brandon.audio</h1>
|
||||
</div>
|
||||
<div id="main">
|
||||
<form>
|
||||
<div id="input-box">
|
||||
<input id="jungle" name="jungle" autocomplete="off">
|
||||
</div>
|
||||
|
||||
<div id="buttons">
|
||||
<div id="button-left">
|
||||
<button id="speak">Speak</button>
|
||||
</div>
|
||||
<div id="button-right">
|
||||
<button id="clear">Clear</button>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<aside class="hidden">
|
||||
<div id="about">
|
||||
<a href="#" id="close_top">[close]</a>
|
||||
|
||||
<h2>doop</h2>
|
||||
|
||||
<strong>darp</strong>
|
||||
|
||||
<p>yes</p>
|
||||
|
||||
<strong>dap</strong>
|
||||
|
||||
<p>no</p>
|
||||
|
||||
<a href="#" id="close_bottom">[close]</a>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<footer>
|
||||
<div id="footer-text">
|
||||
<p>
|
||||
Made in Atlanta by
|
||||
<a href="https://twitter.com/echelon">@echelon</a>.
|
||||
</p>
|
||||
<p>
|
||||
By using this, you agree to
|
||||
<a id="info" href="#">the things</a>.
|
||||
</p>
|
||||
</dvi>
|
||||
</footer>
|
||||
<script src="/assets/output/main.built.js"/></script>
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
||||
ga('create', 'UA-32811180-3', 'auto');
|
||||
ga('send', 'pageview');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,237 @@
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body,
|
||||
input,
|
||||
button {
|
||||
font-family: "Fira Sans";
|
||||
}
|
||||
|
||||
#main {
|
||||
margin: auto;
|
||||
max-width: 1000px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #333;
|
||||
font-family: "Happy Monkey";
|
||||
font-size: 3em;
|
||||
margin: 20px 0 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#animation canvas {
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
#logo {
|
||||
display: none;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#input-box {
|
||||
box-sizing: border-box;
|
||||
padding: 12px 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
pre {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
input {
|
||||
box-sizing: border-box;
|
||||
font-size: 1.2em;
|
||||
border: 1px solid #999;
|
||||
padding: 0.3em;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #e5e5e5;
|
||||
border: 0;
|
||||
color: #777;
|
||||
font-size: 1.2em;
|
||||
margin: 20px;
|
||||
min-width: 150px;
|
||||
padding: 0.75em;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#buttons {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#button-left {
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
#button-right {
|
||||
float: right;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
button#speak {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
button#clear {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
a:link, a:visited {
|
||||
color: #c75;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
aside {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
background-color: rgba(255,255,255,0.85);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
aside #about {
|
||||
padding: 20px 20px 50px;
|
||||
margin: auto;
|
||||
max-width: 1000px;
|
||||
}
|
||||
|
||||
#close_top,
|
||||
#close_bottom {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
footer {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 0em;
|
||||
overflow: auto;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
footer a:link,
|
||||
footer a:visited {
|
||||
color: #d86;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#footer-text {
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
/** RESPONSIVENESS */
|
||||
|
||||
@media screen and (min-width: 600px) {
|
||||
button {
|
||||
min-width: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1px) {
|
||||
#animation canvas {
|
||||
width: 200px;
|
||||
}
|
||||
#animation {
|
||||
height: 117px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 300px) {
|
||||
#animation canvas {
|
||||
width: 300px;
|
||||
}
|
||||
#animation {
|
||||
height: 176px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 400px) {
|
||||
#animation canvas {
|
||||
width: 400px;
|
||||
}
|
||||
#animation {
|
||||
height: 235px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 450px) {
|
||||
#animation canvas {
|
||||
width: 450px;
|
||||
}
|
||||
#animation {
|
||||
height: 264px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) {
|
||||
#animation canvas {
|
||||
width: 500px;
|
||||
}
|
||||
#animation {
|
||||
height: 293px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 600px) {
|
||||
#animation canvas {
|
||||
width: 600px;
|
||||
}
|
||||
#animation {
|
||||
height: 352px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 800px) {
|
||||
#animation canvas {
|
||||
width: 800px;
|
||||
}
|
||||
#animation {
|
||||
height: 470px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1000px) {
|
||||
#animation canvas {
|
||||
width: 800px;
|
||||
}
|
||||
#animation {
|
||||
height: 470px;
|
||||
}
|
||||
}
|
||||
|
||||
/** Hide footer when using onscreen keyboard. */
|
||||
@media screen and (max-height: 450px) {
|
||||
footer {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 740px) {
|
||||
footer p {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,2 @@
|
||||
User-agent: *
|
||||
Allow: /
|
||||
@@ -0,0 +1,104 @@
|
||||
|
||||
h1 {
|
||||
font-family: ubuntu, tahoma;
|
||||
font-size: 1.8em;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 1px solid #ccc;
|
||||
padding: 8px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
input#text {
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
input#vol {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #eee;
|
||||
border: 1px solid #ccc;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
select {
|
||||
background-color: #eee;
|
||||
border: 1px solid #ccc;
|
||||
padding: 7px;
|
||||
}
|
||||
|
||||
#control_elements {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
#control_elements {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
#main {
|
||||
margin: auto;
|
||||
width: 90%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.error input#text {
|
||||
border-color: #f55;
|
||||
background-color: #fee;
|
||||
color: #500;
|
||||
}
|
||||
|
||||
.ok input#text {
|
||||
border-color: #5a5;
|
||||
background-color: #efe;
|
||||
}
|
||||
|
||||
#typeahead {
|
||||
color: #777;
|
||||
font-style: italic;
|
||||
width: 100%;
|
||||
height: 1em;
|
||||
margin: 0 0 10px 0;
|
||||
overflow: hidden;
|
||||
/*text-overflow: ellipsis;*/
|
||||
}
|
||||
|
||||
#typeahead ul {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#typeahead li {
|
||||
display: inline;
|
||||
padding: 5px;
|
||||
border: 1px;
|
||||
}
|
||||
|
||||
#stats {
|
||||
margin: 20px 0;
|
||||
font-size: 0.8em;
|
||||
color #777;
|
||||
}
|
||||
|
||||
ul#stats {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
a:link, a:visited {
|
||||
color: #00f;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:active, a:hover {
|
||||
color: #00f;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@@ -18,7 +18,7 @@ upload_assets() {
|
||||
|
||||
# Calculate output directory.
|
||||
echo "> Calculate artifact SHA."
|
||||
pushd ./web/output > /dev/null
|
||||
pushd ./brandon.audio/output > /dev/null
|
||||
declare checksum=$(find . -type f -exec md5sum {} + | awk '{print $1}' | \
|
||||
sort | md5sum | awk '{print $1}')
|
||||
popd > /dev/null
|
||||
@@ -27,12 +27,12 @@ upload_assets() {
|
||||
|
||||
# Prep upload artifact.
|
||||
echo "> Prep upload of artifact ${checksum}."
|
||||
pushd ./web
|
||||
pushd ./brandon.audio
|
||||
|
||||
mkdir -p $output_dir
|
||||
cp *css $output_dir
|
||||
cp *html $output_dir
|
||||
cp output/* $output_dir
|
||||
#cp output/* $output_dir # FIXME(2019-01-30): Not sure why this isn't working. Needed?
|
||||
|
||||
# Modify URLs in index.html
|
||||
echo "> Modify asset paths, etc. in index.html."
|
||||
|
||||
Reference in new issue
Block a user