diff options
Diffstat (limited to 'templates')
-rw-r--r-- | templates/artwork/artwork_template.twig | 54 | ||||
-rw-r--r-- | templates/artwork/artwork_view.twig | 10 | ||||
-rw-r--r-- | templates/base.twig | 30 | ||||
-rw-r--r-- | templates/card/card.twig | 13 | ||||
-rw-r--r-- | templates/card/card_add.twig | 43 | ||||
-rw-r--r-- | templates/card/card_display.twig | 48 | ||||
-rw-r--r-- | templates/card/card_edit.twig | 30 | ||||
-rw-r--r-- | templates/card/card_list.twig | 43 | ||||
-rw-r--r-- | templates/card/card_meta_template.twig | 21 | ||||
-rw-r--r-- | templates/card/card_template.twig | 103 | ||||
-rw-r--r-- | templates/card/card_view.twig | 11 | ||||
-rw-r--r-- | templates/dashboard.twig | 58 | ||||
-rw-r--r-- | templates/root.twig | 11 |
13 files changed, 293 insertions, 182 deletions
diff --git a/templates/artwork/artwork_template.twig b/templates/artwork/artwork_template.twig new file mode 100644 index 0000000..fe55f6a --- /dev/null +++ b/templates/artwork/artwork_template.twig @@ -0,0 +1,54 @@ +{% if artworkSettings.isPreview == true %} + <div class="content"> + {% if artworkSettings.artworkHeader != "" %} + <h4>{{ artworkSettings.artworkHeader }}</h4> + {% endif %} + + <div class="row"> + <div class="column column-5"> + {% if artworkSettings.isVotable == true %} + <!--TODO: vote artworks--> + <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> + {{ artwork.getVotesTotal() }} + <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> + {% endif %} + </div> + <div class="column column-95"> + <div> + <img class="image" src='{{ artwork.path }}'> + </div> + <div> + <button onclick="location.href='/card/{{ card.id }}/artwork/{{ artwork.id }}'">View Artwork</button> + </div> + </div> + </div> + </div> +{% else %} + <section id="artwork" class="content"> + <h3>Artwork</h3> + </section> + + <div class="content"> + <!-- TODO: what is there to edit? or just remove? and add new? --> + <button onclick="location.href='/card/{{ card.id }}'">Goto Card</button> + <button>Remove Artwork</button> + </div> + + <div class="content"> + <div class="row"> + <div class="column column-5"> + {% if artworkSettings.isVotable == true %} + <!--TODO: vote artworks--> + <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> + {{ artwork.getVotesTotal() }} + <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> + {% endif %} + </div> + <div class="column column-95"> + <div> + <img class="image" src='{{ artwork.path }}'> + </div> + </div> + </div> + </div> +{% endif %} diff --git a/templates/artwork/artwork_view.twig b/templates/artwork/artwork_view.twig new file mode 100644 index 0000000..3eb1c65 --- /dev/null +++ b/templates/artwork/artwork_view.twig @@ -0,0 +1,10 @@ +{% extends 'card/card.twig' %} + +{% block pagecontent %} + {% set artworkSettings = { + "artworkHeader": "", + "isPreview": false, + "isVotable": true + } %} + {{ include('artwork/artwork_template.twig') }} +{% endblock %}
\ No newline at end of file diff --git a/templates/base.twig b/templates/base.twig index 758b6f8..825c09c 100644 --- a/templates/base.twig +++ b/templates/base.twig @@ -4,21 +4,37 @@ {{ parent() }} <!-- SimpleCSS --> <link rel="stylesheet" href="https://cdn.simplecss.org/simple.min.css"> + <!-- Fork Awesome Icons --> + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous"> + <!-- Splide --> + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@splidejs/splide@latest/dist/css/splide.min.css"> + <!-- override --> <link rel="stylesheet" href="/css/style.css"/> +{% endblock %} - <!-- Fork Awesome Icons --> - <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous"> +{% block js %} + {{ parent() }} + <!-- Splide --> + <script src="https://cdn.jsdelivr.net/npm/@splidejs/splide@latest/dist/js/splide.min.js"></script> + <script src="/js/splides.js"></script> + + <!-- nav --> + <script src="/js/nav_highlight.js"></script> {% endblock %} {% block body %} <header> <nav> <a href="/dashboard">Dashboard</a> - <a href="/card/list">Cards</a> - <a href="/events/list">Events</a> - <a href="/news/list">News</a> - <a href="https://gitlab.com/DRogueRonin/elements">Gitlab</a> + <a href="/card">Cards</a> + <!-- + <a href="/events">Events</a> + --> + <!-- + <a href="/news">News</a> + --> + <a href="https://gitlab.com/DRogueRonin/elements" target="_blank">Gitlab</a> </nav> <h1>Elements</h1> <p>{% block subtitle %}{% endblock %}</p> @@ -27,6 +43,6 @@ {% block main %}{% endblock %} </main> <footer> - visit <a href="https://gitlab.com/DRogueRonin/elements">Gitlab</a> + visit <a href="https://gitlab.com/DRogueRonin/elements" target="_blank">Gitlab</a> </footer> {% endblock %} diff --git a/templates/card/card.twig b/templates/card/card.twig index fcf6bd0..211f6e3 100644 --- a/templates/card/card.twig +++ b/templates/card/card.twig @@ -4,13 +4,14 @@ Cards {% endblock %} {% block main %} - <div class="content content-header"> - <button onclick="location.href='/card/list'">Overview</button> + <section class="content"> + <button onclick="location.href='/card'">Overview</button> + <!-- + TODO + <button onclick="location.href='/card/{{ cardOfTheDay.id }}'">Card Of The Day</button> + --> <button onclick="location.href='/card/add'">New Card</button> - </div> - <div class="content content-header"> - <h3>{% block pagetitle %}{% endblock %}</h3> - </div> + </section> <div style="align-content: center;"> {% block pagecontent %}{% endblock %} diff --git a/templates/card/card_add.twig b/templates/card/card_add.twig index db91fc4..0a90aea 100644 --- a/templates/card/card_add.twig +++ b/templates/card/card_add.twig @@ -1,47 +1,24 @@ {% extends 'card/card.twig' %} {% block pagetitle %} - Edit Card + Add Card {% endblock %} {% block pagecontent %} <div class="content"> - <form action="/card/{{ card.id }}/edit" method="post" enctype="multipart/form-data"> - {% for meta in card.meta %} + <form action="/card/add" method="post" enctype="multipart/form-data"> + {% for key, field in fields %} <p> - <label>{{ meta.key }}</label><br> - <input type="text" name="{{ meta.key }}" value="{{ meta.value }}"> + <label>{{ key }}</label><br> + <input type="text" name="meta[{{ field }}]"> </p> {% endfor %} - <input type="submit" value="Save"> + <!-- TODO: add artworks when adding a card? --> + <h4>Artworks</h4> + <input type="file" name="images[]" multiple> + + <input type="submit" value="Add"> </form> </div> {% endblock %} -{% block pagetitle %} - Add Card -{% endblock %} -{% block pagecontent %} - <form action="/card/add" method="post" enctype="multipart/form-data"> - {% for key, field in fields %} - <p> - <label>{{ key }}</label><br> - <input type="text" name="{{ field }}"> - </p> - {% endfor %} - - <!-- - {% for meta in card.meta %} - <p> - <label>{{ meta.key }}</label><br> - <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled> - </p> - {% endfor %} - --> - - <h4>Artworks</h4> - <input type="file" name="images[]" multiple> - - <input type="submit" value="Add"> - </form> -{% endblock %} diff --git a/templates/card/card_display.twig b/templates/card/card_display.twig deleted file mode 100644 index 7b2ed3e..0000000 --- a/templates/card/card_display.twig +++ /dev/null @@ -1,48 +0,0 @@ -{% extends 'card/card.twig' %} - -{% block pagetitle %} - Show Card -{% endblock %} -{% block pagecontent %} - <div class="content"> - <button onclick="location.href='/card/{{ card.id }}/edit'">Edit</button> - </div> - - <div class="content"> - <div class="row"> - <div class="column column-5"> - <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> - {{ card.getVotesTotal() }} - <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> - </div> - <div class="column column-95"> - {% for meta in card.meta %} - <p> - <label>{{ meta.key }}</label><br> - <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled> - </p> - {% endfor %} - </div> - </div> - </div> - - <div class="content content-header"> - <h3>Artworks</h3> - </div> - - {% for artwork in card.artworks %} - <div class="content"> - <div class="row"> - <div class="column column-5"> - <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> - {{ artwork.getVotesTotal() }} - <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> - </div> - <div class="column column-95"> - <img class="image" src='{{ artwork.path }}'> - <button onclick="location.href='/artwork/{{ artwork.id }}'">Show</button> - </div> - </div> - </div> - {% endfor %} -{% endblock %} diff --git a/templates/card/card_edit.twig b/templates/card/card_edit.twig index b066437..4d13efa 100644 --- a/templates/card/card_edit.twig +++ b/templates/card/card_edit.twig @@ -1,36 +1,24 @@ {% extends 'card/card.twig' %} -{% block pagetitle %} - Edit Card -{% endblock %} {% block pagecontent %} + <section class="content"> + <h3>Edit Card</h3> + </section> + + <div class="content"> + <button onclick="location.href='/card/{{ card.id }}'">Goto Card</button> + </div> + <div class="content"> <form action="/card/{{ card.id }}/edit" method="post" enctype="multipart/form-data"> {% for meta in card.meta %} <p> <label>{{ meta.key }}</label><br> - <input type="text" name="{{ meta.key }}" value="{{ meta.value }}"> + <input type="text" name="meta[{{ meta.key }}]" value="{{ meta.value }}"> </p> {% endfor %} <input type="submit" value="Save"> </form> </div> - - <div class="content content-header"> - <h3>Edit Artworks</h3> - </div> - - <div class="content"> - <button>Add Artwork</button> - </div> - - {% for artwork in card.artworks %} - <div class="content"> - <img class="image" src='{{ artwork.path }}'> - <button onclick="location.href='/artwork/{{ artwork.id }}/edit'">Edit</button> - <button>Remove</button> - </div> - {% endfor %} - {% endblock %}
\ No newline at end of file diff --git a/templates/card/card_list.twig b/templates/card/card_list.twig index b6d8bbe..a233df9 100644 --- a/templates/card/card_list.twig +++ b/templates/card/card_list.twig @@ -1,38 +1,17 @@ {% extends 'card/card.twig' %} -{% block pagetitle %} -List -{% endblock %} {% block pagecontent %} + <section class="content"> + <h3>Cards</h3> + </section> + {% for card in cards %} - <div class="content"> - <div class="row"> - <div class="column column-5"> - <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> - {{ card.getVotesTotal() }} - <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> - </div> - <div class="column column-95"> - <table> - <thead> - <tr> - {% for meta in card.getAllMeta() %} - <th>{{ meta.key }}</th> - {% endfor %} - </tr> - </thead> - <tbody> - <tr> - {% for meta in card.getAllMeta() %} - <td>{{ meta.value }}</td> - {% endfor %} - </tr> - </tbody> - </table> - <button onclick="location.href='/card/{{ card.id }}'">Card</button> - <button onclick="location.href='/card/{{ card.id }}/artworks'">Artworks</button> - </div> - </div> - </div> + {% set cardSettings = { + "cardHeader": "", + "isPreview": true, + "isVotable": true, + "showArtworks": true + } %} + {{ include('card/card_template.twig') }} {% endfor %} {% endblock %} diff --git a/templates/card/card_meta_template.twig b/templates/card/card_meta_template.twig new file mode 100644 index 0000000..d57cdd8 --- /dev/null +++ b/templates/card/card_meta_template.twig @@ -0,0 +1,21 @@ +<div class="row"> + <div class="column column-5"> + <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data"> + <input type="hidden" name="value" value="1"> + <button type="submit" class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> + </form> + {{ card.getVotesTotal() }} + <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data"> + <input type="hidden" name="value" value="-1"> + <button type="submit" class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> + </form> + </div> + <div class="column column-95"> + {% for meta in card.meta %} + <p> + <label>{{ meta.key }}</label><br> + <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled> + </p> + {% endfor %} + </div> +</div>
\ No newline at end of file diff --git a/templates/card/card_template.twig b/templates/card/card_template.twig new file mode 100644 index 0000000..411ec2f --- /dev/null +++ b/templates/card/card_template.twig @@ -0,0 +1,103 @@ +{% if cardSettings.isPreview == true %} + <div class="content"> + {% if cardSettings.cardHeader != "" %} + <h4>{{ cardSettings.cardHeader }}</h4> + {% endif %} + + <div class="row"> + <div class="column column-5"> + {% if cardSettings.isVotable == true %} + <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data"> + <input type="hidden" name="value" value="1"> + <button type="submit" class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> + </form> + {{ card.getVotesTotal() }} + <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data"> + <input type="hidden" name="value" value="-1"> + <button type="submit" class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> + </form> + {% endif %} + </div> + <div class="column column-95"> + {% for meta in card.meta %} + <p> + <label>{{ meta.key }}</label><br> + <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled> + </p> + {% endfor %} + + {% if cardSettings.showArtworks == true %} + {% if card.artworks|length > 0 %} + <div class="splide"> + <div class="splide__track"> + <ul class="splide__list"> + {% for artwork in card.artworks %} + <li class="splide__slide"> + <img class="image" src='{{ artwork.path }}'> + </li> + {% endfor %} + </ul> + </div> + </div> + {% endif %} + {% endif %} + + <button onclick="location.href='/card/{{ card.id }}'">View Card</button> + </div> + </div> + </div> +{% else %} + <section id="card" class="content"> + <h3>Card</h3> + </section> + + <div class="content"> + <button onclick="location.href='/card/{{ card.id }}/edit'">Edit Card</button> + </div> + + <div class="content"> + <div class="row"> + <div class="column column-5"> + {% if cardSettings.isVotable == true %} + <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data"> + <input type="hidden" name="value" value="1"> + <button type="submit" class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> + </form> + {{ card.getVotesTotal() }} + <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data"> + <input type="hidden" name="value" value="-1"> + <button type="submit" class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> + </form> + {% endif %} + </div> + <div class="column column-95"> + {% for meta in card.meta %} + <p> + <label>{{ meta.key }}</label><br> + <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled> + </p> + {% endfor %} + </div> + </div> + </div> + + {% if cardSettings.showArtworks == true %} + <section id="artworks" class="content"> + <h3>Artworks</h3> + </section> + + <div class="content"> + <!-- TODO --> + <button>Add Artwork</button> + </div> + + {% for artwork in card.artworks %} + {% set artworkSettings = { + "artworkHeader": "", + "isPreview": true, + "isVotable": true + } %} + {{ include('artwork/artwork_template.twig') }} + {% endfor %} + {% endif %} +{% endif %} diff --git a/templates/card/card_view.twig b/templates/card/card_view.twig new file mode 100644 index 0000000..3b84b26 --- /dev/null +++ b/templates/card/card_view.twig @@ -0,0 +1,11 @@ +{% extends 'card/card.twig' %} + +{% block pagecontent %} + {% set cardSettings = { + "cardHeader": "", + "isPreview": false, + "isVotable": true, + "showArtworks": true + } %} + {{ include('card/card_template.twig') }} +{% endblock %} diff --git a/templates/dashboard.twig b/templates/dashboard.twig index 97534bf..0e10193 100644 --- a/templates/dashboard.twig +++ b/templates/dashboard.twig @@ -4,39 +4,41 @@ Dashboard {% endblock %} {% block main %} - <div class="content content-header"> + <section class="content"> <h3>Hello World</h3> - </div> - <div class="content content-header"> + </section> + + <section class="content"> <h3>Cards</h3> - </div> - <div class="content"> - <h4>Card of the day</h4> - <div class="row"> - <div class="column column-5"> - <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button> - {{ cardOfTheDay.getVotesTotal() }} - <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button> - </div> - <div class="column column-95"> - {% for meta in cardOfTheDay.meta %} - <p> - <label>{{ meta.key }}</label><br> - <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled> - </p> - {% endfor %} - </div> - <button onclick="location.href='/card/{{ cardOfTheDay.id }}'">Card</button> - <button onclick="location.href='/card/{{ cardOfTheDay.id }}/artworks'">Artworks</button> - </div> - </div> + </section> + + {% set card = cardOfTheDay %} + {% set cardSettings = { + "cardHeader": "Card Of The Day", + "isPreview": true, + "isVotable": true, + "showArtworks": true + } %} + {{ include('card/card_template.twig') }} + + <!-- + TODO <div class="content"> <h4>Updates to my cards</h4> </div> - <div class="content content-header"> + --> + + <!-- + TODO + <section class="content"> <h3>Events</h3> - </div> - <div class="content content-header"> + </section> + --> + + <!-- + TODO + <section class="content"> <h3>News</h3> - </div> + </section> + --> {% endblock %} diff --git a/templates/root.twig b/templates/root.twig index 9c3534e..8be64dd 100644 --- a/templates/root.twig +++ b/templates/root.twig @@ -1,14 +1,11 @@ -<html> +<html> <link rel="/favicon.ico" href="#"> + <head> <title>Elements</title> - {% block css %}{% endblock %} </head> <body> -{% block body %}{% endblock %} -<script> - -</script> -{% block js %}{% endblock %} + {% block body %}{% endblock %} + {% block js %}{% endblock %} </body> </html>
\ No newline at end of file |