design and authors

master
km0 3 years ago
parent 081eb0459c
commit bf3e214513

@ -12,7 +12,7 @@ def display():
db = get_db()
branches = db.execute(
"SELECT content, branch, parent FROM branches"
"SELECT content, branch, parent, username FROM branches"
).fetchall()
streams = []

@ -16,15 +16,16 @@ def draw(parent=None):
if request.method == 'POST':
content = request.form.get('content')
branch = request.form.get('branch')
username = request.form.get('username')
if request.is_json:
data = request.get_json()
content = data['content']
branch = data['branch']
username = data['username']
db.execute(
'INSERT INTO branches (content, parent, branch) VALUES (?, ?, ?)',
(content, parent, branch,)
'INSERT INTO branches (content, parent, branch, username) VALUES (?, ?, ?, ?)',
(content, parent, branch, username)
)
db.commit()
print(url_for('share.share', branch=f"{branch}"))
@ -58,10 +59,11 @@ def last():
if request.method == 'POST':
content = request.form['content']
branch = request.form['branch']
username = request.form['username']
db.execute(
'INSERT INTO branches (content, parent, branch) VALUES (?, ?, ?)',
(content, parent, branch,)
'INSERT INTO branches (content, parent, branch, username) VALUES (?, ?, ?, ?)',
(content, parent, branch, username)
)
db.commit()
print(url_for('share.share', branch=f"{branch}"))
@ -80,9 +82,11 @@ def new():
content = request.form['content']
branch = request.form['branch']
username = request.form['username']
db.execute(
'INSERT INTO branches (content, parent, branch) VALUES (?, ?, ?)',
(content, parent, branch,)
'INSERT INTO branches (content, parent, branch, username) VALUES (?, ?, ?, ?)',
(content, parent, branch, username)
)
db.commit()
return redirect(url_for('share.share', branch=branch))

@ -4,5 +4,6 @@ CREATE TABLE branches (
id INTEGER PRIMARY KEY AUTOINCREMENT,
branch TEXT NOT NULL,
content TEXT NOT NULL,
parent TEXT NOT NULL
parent TEXT NOT NULL,
username TEXT
);

@ -10,6 +10,21 @@
position: absolute;
}
.svg-container {
display: inline-block;
margin: 0;
padding: 0;
position: relative;
}
.author {
position: absolute;
left: 50%;
bottom: 50px;
font-size: 1rem;
background-color: white;
}
.branches {
overflow-x: auto;
overflow-y: hidden;

@ -2,9 +2,27 @@ html,
body {
margin: 0;
background-color: var(--background);
color: var(--color);
font-size: 1.25rem;
}
* {
box-sizing: border-box;
}
a {
color: currentColor;
text-decoration: none;
}
a:hover {
color: tomato;
}
nav {
text-align: center;
}
nav > * + * {
margin-left: 1ch;
}

@ -0,0 +1,43 @@
header {
text-align: center;
padding: 1rem;
}
header object {
width: 100vmin;
height: auto;
margin: 0 auto;
}
object svg {
width: 100%;
}
header h1 {
font-size: 2rem;
font-weight: normal;
margin: 0;
}
main {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top: 100px;
}
main > * + * {
margin-top: 1rem;
}
@media (max-width: 767.98px) {
header object {
width: 75vw;
}
header h1 {
font-size: 1rem;
}
}

@ -24,5 +24,5 @@ button.clipboard {
}
button.clipboard:hover {
color: dodgerblue;
color: tomato;
}

@ -1,3 +1,4 @@
:root {
--background: #ddd;
--background: #edd;
--color: black;
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 6.8 KiB

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Exquisite Branch</title>
<link rel="stylesheet" href="{{url_for('static', filename='css/variables.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/global.css')}}" />
{%block head %}{%endblock%}
</head>
<body>
<nav>
{%block nav %}
<a href="{{url_for('home.home')}}">Home</a>
<a href="{{url_for('display.display')}}">Results</a>
{% endblock %}
</nav>
{%block contents %} {%endblock%}
</body>
</html>

@ -1,37 +1,49 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Display</title>
<link rel="stylesheet" href="{{url_for('static', filename='css/variables.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/global.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/display.css')}}" />
</head>
<body>
<h1>Exquisite Branch</h1>
{%extends 'base.html' %} {%block head %}
<div class="streams">
{% for stream in streams %}
<div
class="stream"
style="color: rgb({{ range(0, 255) | random }},{{ range(0, 255) | random }},{{ range(0, 255) | random }}); transform: translate({{ range(-5, 5) | random }}px, {{ range(-5, 5) | random }}px)"
<link rel="stylesheet" href="{{url_for('static', filename='css/display.css')}}" />
<title>Display</title>
{%endblock%} {%block nav%}
<a href="{{url_for('home.home')}}">Home</a>
<a href="{{url_for('draw.last')}}">Draw</a>
{%endblock%} {%block contents%}
<h1>Exquisite Branch</h1>
<div class="streams">
{% for stream in streams %}
<div
class="stream"
style="color: rgb({{ range(0, 255) | random }},{{ range(0, 255) | random }},{{ range(0, 255) | random }}); transform: translate({{ range(-5, 5) | random }}px, {{ range(-5, 5) | random }}px)"
>
{% for branch in stream %}
<div class="svg-container">
{{branch['content'] | safe}}
<span
class="author"
style="transform: translate({{ range(-50, 50) | random }}px, {{ range(-10, 10) | random }}px"
>
{% for branch in stream %} {{branch['content'] | safe}} {%endfor%}
</div>
{%endfor%}
{{ branch['username']}}
</span>
</div>
{%endfor%}
</div>
{%endfor%}
</div>
{{colors}}
{{colors}}
<h2>Branches</h2>
<div class="branches">
{% for stream in streams %}
<div class="branch">
{% for branch in stream %} {{branch['content'] | safe}} {%endfor%}
</div>
{%endfor%}
<h2>Branches</h2>
<div class="branches">
{% for stream in streams %}
<div class="branch">
{% for branch in stream %}
<div class="svg-container">
{{branch['content'] | safe}}
<span class="author"> {{ branch['username']}} </span>
</div>
</body>
</html>
{%endfor%}
</div>
{%endfor%}
</div>
{%endblock%}

@ -1,54 +1,51 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Draw</title>
{%extends 'base.html' %} {%block head %}
<title>Draw</title>
<link rel="stylesheet" href="{{url_for('static', filename='css/draw.css')}}" />
<script src="{{url_for('static', filename='js/draw.js')}}" defer></script>
<script src="{{url_for('static', filename='js/draw.js')}}" defer></script>
{%endblock%} {%block nav%}
<a href="{{url_for('home.home')}}">Home</a>
<a href="{{url_for('display.display')}}">Results</a>
<link rel="stylesheet" href="{{url_for('static', filename='css/variables.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/global.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/draw.css')}}" />
</head>
<body>
<h1>Draw</h1>
<div id="divSmoothingFactor">
<label for="cmbBufferSize">Buffer size:</label>
<select id="cmbBufferSize">
<option value="1">1 - No smoothing</option>
<option value="4">4 - Sharp curves</option>
<option value="8" selected="selected">8 - Smooth curves</option>
<option value="12">12 - Very smooth curves</option>
<option value="16">16 - Super smooth curves</option>
<option value="20">20 - Hyper smooth curves</option>
</select>
</div>
{%endblock%} {%block contents%}
<div id="svg-container">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
id="svgElement"
x="0px"
y="0px"
width="500px"
height="500px"
viewBox="0 0 500 500"
enable-background="new 0 0 500 500"
xml:space="preserve"
data-parent="{{parent or None}}"
data-branch="{{branch}}"
></svg>
<div id="previous">{% if content %} {{content|safe}} {% endif %}</div>
</div>
<h1>Draw</h1>
<form method="POST">
<input type="hidden" name="branch" value="{{branch}}" />
<input type="hidden" name="content" />
<input type="submit" />
</form>
</body>
</html>
<div id="divSmoothingFactor">
<label for="cmbBufferSize">Smoothing</label>
<select id="cmbBufferSize">
<option value="1">1 - No smoothing</option>
<option value="4">4 - Sharp curves</option>
<option value="8" selected="selected">8 - Smooth curves</option>
<option value="12">12 - Very smooth curves</option>
<option value="16">16 - Super smooth curves</option>
<option value="20">20 - Hyper smooth curves</option>
</select>
</div>
<div id="svg-container">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
id="svgElement"
x="0px"
y="0px"
width="500px"
height="500px"
viewBox="0 0 500 500"
enable-background="new 0 0 500 500"
xml:space="preserve"
data-parent="{{parent or None}}"
data-branch="{{branch}}"
></svg>
<div id="previous">{% if content %} {{content|safe}} {% endif %}</div>
</div>
<form method="POST">
<input type="hidden" name="branch" value="{{branch}}" />
<input type="hidden" name="content" />
<input type="text" name="username" placeholder="Name" />
<input type="submit" />
</form>
{%endblock%}

@ -7,11 +7,21 @@
<title>Exquisite Branch</title>
<link rel="stylesheet" href="{{url_for('static', filename='css/variables.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/global.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/home.css')}}" />
</head>
<body>
<h1>Exquisite Branch</h1>
<a href="{{url_for('draw.new')}}">Start new</a> <br />
<a href="{{url_for('draw.last')}}">Continue from last</a> <br />
<a href="{{url_for('display.display')}}">Display results</a>
<header class="title">
<object
data="{{url_for('static', filename='img/logo.svg')}}"
type="image/svg+xml"
></object>
<h1>really exquisite indeed</h1>
</header>
<main>
<a href="{{url_for('draw.new')}}">Start new</a> <br />
<a href="{{url_for('draw.last')}}">Continue from last</a> <br />
<a href="{{url_for('display.display')}}">Display results</a>
</main>
</body>
</html>

@ -1,24 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Share</title>
<link rel="stylesheet" href="{{url_for('static', filename='css/variables.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/global.css')}}" />
<link rel="stylesheet" href="{{url_for('static', filename='css/share.css')}}" />
{%extends 'base.html' %} {%block head %}
<title>Share</title>
<link rel="stylesheet" href="{{url_for('static', filename='css/share.css')}}" />
<script src="{{url_for('static', filename='js/copy.js')}}" defer></script>
<script src="{{url_for('static', filename='js/copy.js')}}" defer></script>
</head>
<body>
<div class="share">
Send this link to your friends:
<a
href="{{url_for('draw.draw', parent=branch)}}"
data-copy="{{ url_for('draw.draw', parent=branch, _external=True, _scheme='https')}}"
>{{ url_for('draw.draw', parent=branch, _external=True, _scheme='https')}}</a
>
</div>
</body>
</html>
{%endblock%} {%block nav %}
<a href="{{url_for('home.home')}}">Home</a>
<a href="{{url_for('display.display')}}">Results</a>
{% endblock %} {%block contents %}
<div class="share">
Send this link to your friends:
<a
href="{{url_for('draw.draw', parent=branch)}}"
data-copy="{{ url_for('draw.draw', parent=branch, _external=True, _scheme='https')}}"
>{{ url_for('draw.draw', parent=branch, _external=True, _scheme='https')}}</a
>
</div>
{%endblock%}

Loading…
Cancel
Save