wip: programme

This commit is contained in:
mco-system 2023-04-09 11:12:29 +11:00
parent a76b8e034a
commit 99d69e6af8
16 changed files with 373 additions and 127 deletions

View File

@ -49,7 +49,30 @@ except Exception as err:
def page_not_found(err): def page_not_found(err):
return redirect(url_for('index')) return redirect(url_for('index'))
# ------------------------------------------------------------------------------
# -- Custom filters
# ------------------------------------------------------------------------------
@app.template_filter('date2dmyhm')
def date2dmyhm(date):
splitted_date = date.split("-")
splitted_time = splitted_date[2].split("T")[1].split(":")
year, month, day = (splitted_date[0],
splitted_date[1],
splitted_date[2].split("T")[0])
hour, minutes = (splitted_time[0], splitted_time[1].split("+")[0])
return f"{day}/{month} {hour}:{minutes}"
@app.template_filter('toicon')
def date2dmyhm(slot_type):
slot_types = {"Projection": "fa-solid fa-film",
"Presentation Courte": "fa-solid fa-person-chalkboard",
"DJ Set": "fa-solid fa-guitar",
"Concert": "fa-solid fa-guitar",
"Présentation": "fa-solid fa-person-chalkboard",
"Table Ronde": "fa-solid fa-users-line",
"Atelier": "fa-solid fa-screwdriver-wrench",
"Exposition": "fa-solid fa-palette"}
return slot_types[slot_type]
# ------------------------------------------------------------------------------ # ------------------------------------------------------------------------------
# -- Routes # -- Routes
# ------------------------------------------------------------------------------ # ------------------------------------------------------------------------------

View File

@ -13,38 +13,116 @@
align-items: flex-start; align-items: flex-start;
align-content: flex-start; align-content: flex-start;
margin: 1em; margin: 1em;
border-radius: 5px;
border-color: var(--alt-color);
background-color: var(--main-color);
border-style: solid;
border-width: 1px;
font-size: 2em; font-size: 2em;
width: 25em; width: 22em;
}
.metadata, .data {
display: flex;
flex-direction: column;
justify-content: start;
align-items: flex-start;
align-content: flex-start;
padding: 0.5em;
border-style: solid;
height: 13em;
} }
.metadata { .metadata {
display: flex; width: 7.333em;
flex-direction: column; border-radius: 10px 0 0 10px;
justify-content: start; background-color: var(--alt-bg-color);
align-items: flex-start; color: var(--main-color);
align-content: flex-start; border-color: var(--main-color);
font-family: pfdintextcompprothin;
border-width: 1px 0 0px 1px;
} }
.data { .data {
display: flex; width: 14.666em;
flex-direction: column; background-color: var(--main-color);
justify-content: start; color: var(--alt-main-color);
align-items: flex-start; border-color: var(--main-color);
align-content: flex-start; border-width: 1px 1px 1px 0;
margin-left: 2em; font-family: pfdintextcompprothin;
overflow-y: auto;
} }
.speaker_avatar { .metadata > .button {
height: 50px; font-size: 1em;
width: 50px; margin-bottom: 1em;
} }
.data_img { .title {
height: 50px; font-family: pfdintextcomppromedium;
width: 50px; font-weight: 250;
margin-bottom: 0.5em;
}
.speakers {
font-family: pfdintextcompprothin;
font-weight: 250;
margin-bottom: 0.5em;
}
.speaker_details {
position: relative;
display: inline-block;
}
.speaker_details .details {
visibility: hidden;
background-color: var(--main-color);
color: var(--alt-main-color);
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
opacity: 0;
transform: translateX(2em) translateY(50%);
transition: opacity 1s;
}
.speaker_details .details::after {
content: "";
position: relative;
margin-left: -5px;
border-width: 5px;
}
.speaker_details:hover .details {
visibility: visible;
opacity: 1;
font-size: 0.7em;
padding: 0.2em;
}
.speaker_details > .details > img, .data > .abstract > img {
max-width: 200px;
max-height: 200px;
float: left;
margin: 0 0.5em 0.5em 0;
}
.speaker_details > .details > p {
text-align: justify;
font-size: 0.5em;
}
.data > .abstract > p {
text-align: justify;
font-size: 1em;
}
.data > .details {
font-family: pfdintextcomppromedium;
font-weight: 250;
margin-bottom: 0.5em;
}
.data > .resources > .resource > a {
color: var(--main-bg-color);
} }

View File

@ -10,8 +10,10 @@
:root { :root {
--main-bg-color: #e6007e; --main-bg-color: #e6007e;
--alt-bg-color: #E59730;
--alt2-bg-color: #9EBF43;
--main-color: #ffffff; --main-color: #ffffff;
--alt-color: #1A000D; --alt-main-color: #1A000D;
} }
* { * {
@ -30,7 +32,7 @@ body {
} }
.black { .black {
color: var(--alt-color); color: var(--alt-main-color);
} }
.thin { .thin {
@ -56,18 +58,10 @@ body {
width: inherit; width: inherit;
} }
.cursor {
width: 0;
height: 0;
border-left: 0.75em solid transparent;
border-right: 0.75em solid transparent;
border-bottom: 0.75em solid var(--alt-color);
}
a { a {
font-family: pfdintextcomppromedium; font-family: pfdintextcomppromedium;
font-weight: 250; font-weight: 250;
color: var(--alt-color); color: var(--alt-main-color);
transition-property: color; transition-property: color;
transition-duration: 1s; transition-duration: 1s;
text-decoration: wavy; text-decoration: wavy;
@ -137,10 +131,6 @@ a:hover {
width: 100vw; width: 100vw;
} }
#cursorbar {
margin-top: 1em;
}
#blah { #blah {
margin: 2em 0 2em; margin: 2em 0 2em;
font-size: 2em; font-size: 2em;

View File

@ -1,12 +1,13 @@
.tooltip { .tooltip, .planning_tooltip {
position: relative; position: relative;
display: inline-block; display: inline-block;
} }
.tooltip .tooltiptext { .tooltip .tooltiptext {
visibility: hidden; visibility: hidden;
background-color: var(--main-color); background-color: var(--main-color);
color: var(--alt-color); color: var(--alt-main-color);
text-align: center; text-align: center;
border-radius: 6px; border-radius: 6px;
padding: 5px 0; padding: 5px 0;
@ -19,7 +20,7 @@
transition: opacity 1s; transition: opacity 1s;
} }
.tooltip .tooltiptext::after { .tooltip .tooltiptext::after, .planning_tooltip .planning_tooltiptext::after {
content: ""; content: "";
position: absolute; position: absolute;
top: 100%; top: 100%;
@ -28,9 +29,25 @@
border-width: 5px; border-width: 5px;
} }
.tooltip:hover .tooltiptext { .tooltip:hover .tooltiptext, .planning_tooltip:hover .planning_tooltiptext {
visibility: visible; visibility: visible;
opacity: 1; opacity: 1;
font-size: 0.7em; font-size: 0.7em;
padding: 0.2em; padding: 0.2em;
} }
.planning_tooltip .planning_tooltiptext {
visibility: hidden;
background-color: var(--main-color);
color: var(--alt-main-color);
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
opacity: 0;
transform: translateX(2em) translateY(-3em);
transition: opacity 1s;
}

View File

@ -68,9 +68,9 @@
<span class="tooltiptext thin">Expositions</span> <span class="tooltiptext thin">Expositions</span>
</i> </i>
<i class="button tooltip black fa-solid fa-person-chalkboard" <i class="button tooltip black fa-solid fa-person-chalkboard"
title="Conférences" title="Présentation"
alt="Conférences"> alt="Présentation">
<span class="tooltiptext thin">Conférences</span> <span class="tooltiptext thin">Présentation</span>
</i> </i>
</div> </div>
</body> </body>

View File

@ -9,33 +9,51 @@
{% for slot in slots %} {% for slot in slots %}
<div class="slot"> <div class="slot">
<div class="metadata"> <div class="metadata">
<div class="title">{{slot["title"]}}</div> <i class="button planning_tooltip black {{slot['submission_type']['fr'] | toicon }}"
title="{{slot['submission_type']['fr']}}"
alt="{{slot['submission_type']['fr']}}">
<span class="planning_tooltiptext thin">{{slot['submission_type']['fr']}}</span><span class="title white">{{slot["title"]}}</span>
</i>
<div class="speakers"> <div class="speakers">
{% for speaker in slot["speakers"] %} {% for speaker in slot["speakers"] %}
<div class="speaker"> {{speaker["name"] | title}}
<div class="name">{{speaker["name"]}}</div> <i class="speaker_details fa-solid fa-user">
<img class="speaker_avatar" src="{{speaker['avatar']}}"/> {% if speaker['avatar'] or speaker["biography"] %}
<div class="speaker_biography">{{speaker["biography"]}}</div> <div class="details">
{% if speaker['avatar'] %}
<img src="{{speaker['avatar']}}" />
{% endif %}
{% if speaker['biography'] %}
<p class="thin">{{speaker["biography"]}}</p>
{% endif %}
</div> </div>
{% endif %}
</i> {{ ", " if not loop.last else "" }}
{% endfor %} {% endfor %}
</div> </div>
<div class="type">{{slot["submission_type"]["fr"]}}</div>
<div class="start">{{slot["slot"]["start"]}}</div>
<div class="duration">{{slot["duration"]}}</div>
<div class="room">{{slot["slot"]["room"]["fr"]}}</div>
<div class="locale">{{slot["content_locale"]}}</div>
</div> </div>
<div class="data"> <div class="data">
<div class="abstract">{{slot["abstract"]}}</div> <div class="details">
<div class="description">{{slot["description"]}}</div> <div class="room">{{slot["slot"]["room"]["fr"]}}</div>
<div class="start">{{slot["slot"]["start"] | date2dmyhm}} - {{slot["duration"]}} minutes ({{slot["content_locale"] | capitalize}})</div>
</div>
<div class="abstract">
{% if slot['image'] %}
<img class="data_img" src="{{slot['image']}}"/> <img class="data_img" src="{{slot['image']}}"/>
{% endif %}
<p>{{slot["abstract"]}}</p>
</div>
<div class="description">{{slot["description"]}}</div>
{% if slot["resources"] %}
<div class="resources"> <div class="resources">
<h3>Ressources</h3>
{% for resource in slot["resources"] %} {% for resource in slot["resources"] %}
<div class="resources"> <div class="resource">
<a href="{{resource['resource']}}">{{resource["description"]}}</a> <a class="thin" href="{{resource['resource']}}">{{resource["description"]}}</a>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
{% endif %}
</div> </div>
</div> </div>
{% endfor %} {% endfor %}

View File

@ -23,7 +23,6 @@ install_requires =
gunicorn gunicorn
pyYAML pyYAML
requests requests
pandas
[options.packages.find] [options.packages.find]
where = src where = src

View File

@ -5,8 +5,6 @@ Summary: "THSF website"
Home-page: https://git.tetalab.org/tetalab/thsf.net Home-page: https://git.tetalab.org/tetalab/thsf.net
Author: Doug Le Tough Author: Doug Le Tough
Author-email: doug@redatomik.org Author-email: doug@redatomik.org
License: UNKNOWN
Platform: UNKNOWN
Classifier: Programming Language :: Python :: 3 Classifier: Programming Language :: Python :: 3
Classifier: License :: OSI Approved :: MIT License Classifier: License :: OSI Approved :: MIT License
Classifier: Operating System :: OS Independent Classifier: Operating System :: OS Independent
@ -50,5 +48,3 @@ Le processus de publication est le suivant:
Aucun contrôle de qualité ou de tests n'est mis en place. Vous êtes seuls sur le coup. Aucun contrôle de qualité ou de tests n'est mis en place. Vous êtes seuls sur le coup.
Soyez responsable et **testez vos modifications sur votre machine locale avant de fusionner votre branche** sur la branche `master`. Soyez responsable et **testez vos modifications sur votre machine locale avant de fusionner votre branche** sur la branche `master`.

View File

@ -2,7 +2,6 @@ flask
gunicorn gunicorn
pyYAML pyYAML
requests requests
pandas
[dev] [dev]
twine twine

View File

@ -49,7 +49,30 @@ except Exception as err:
def page_not_found(err): def page_not_found(err):
return redirect(url_for('index')) return redirect(url_for('index'))
# ------------------------------------------------------------------------------
# -- Custom filters
# ------------------------------------------------------------------------------
@app.template_filter('date2dmyhm')
def date2dmyhm(date):
splitted_date = date.split("-")
splitted_time = splitted_date[2].split("T")[1].split(":")
year, month, day = (splitted_date[0],
splitted_date[1],
splitted_date[2].split("T")[0])
hour, minutes = (splitted_time[0], splitted_time[1].split("+")[0])
return f"{day}/{month} {hour}:{minutes}"
@app.template_filter('toicon')
def date2dmyhm(slot_type):
slot_types = {"Projection": "fa-solid fa-film",
"Presentation Courte": "fa-solid fa-person-chalkboard",
"DJ Set": "fa-solid fa-guitar",
"Concert": "fa-solid fa-guitar",
"Présentation": "fa-solid fa-person-chalkboard",
"Table Ronde": "fa-solid fa-users-line",
"Atelier": "fa-solid fa-screwdriver-wrench",
"Exposition": "fa-solid fa-palette"}
return slot_types[slot_type]
# ------------------------------------------------------------------------------ # ------------------------------------------------------------------------------
# -- Routes # -- Routes
# ------------------------------------------------------------------------------ # ------------------------------------------------------------------------------

View File

@ -13,38 +13,116 @@
align-items: flex-start; align-items: flex-start;
align-content: flex-start; align-content: flex-start;
margin: 1em; margin: 1em;
border-radius: 5px;
border-color: var(--alt-color);
background-color: var(--main-color);
border-style: solid;
border-width: 1px;
font-size: 2em; font-size: 2em;
width: 25em; width: 22em;
}
.metadata, .data {
display: flex;
flex-direction: column;
justify-content: start;
align-items: flex-start;
align-content: flex-start;
padding: 0.5em;
border-style: solid;
height: 13em;
} }
.metadata { .metadata {
display: flex; width: 7.333em;
flex-direction: column; border-radius: 10px 0 0 10px;
justify-content: start; background-color: var(--alt-bg-color);
align-items: flex-start; color: var(--main-color);
align-content: flex-start; border-color: var(--main-color);
font-family: pfdintextcompprothin;
border-width: 1px 0 0px 1px;
} }
.data { .data {
display: flex; width: 14.666em;
flex-direction: column; background-color: var(--main-color);
justify-content: start; color: var(--alt-main-color);
align-items: flex-start; border-color: var(--main-color);
align-content: flex-start; border-width: 1px 1px 1px 0;
margin-left: 2em; font-family: pfdintextcompprothin;
overflow-y: auto;
} }
.speaker_avatar { .metadata > .button {
height: 50px; font-size: 1em;
width: 50px; margin-bottom: 1em;
} }
.data_img { .title {
height: 50px; font-family: pfdintextcomppromedium;
width: 50px; font-weight: 250;
margin-bottom: 0.5em;
}
.speakers {
font-family: pfdintextcompprothin;
font-weight: 250;
margin-bottom: 0.5em;
}
.speaker_details {
position: relative;
display: inline-block;
}
.speaker_details .details {
visibility: hidden;
background-color: var(--main-color);
color: var(--alt-main-color);
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
opacity: 0;
transform: translateX(2em) translateY(50%);
transition: opacity 1s;
}
.speaker_details .details::after {
content: "";
position: relative;
margin-left: -5px;
border-width: 5px;
}
.speaker_details:hover .details {
visibility: visible;
opacity: 1;
font-size: 0.7em;
padding: 0.2em;
}
.speaker_details > .details > img, .data > .abstract > img {
max-width: 200px;
max-height: 200px;
float: left;
margin: 0 0.5em 0.5em 0;
}
.speaker_details > .details > p {
text-align: justify;
font-size: 0.5em;
}
.data > .abstract > p {
text-align: justify;
font-size: 1em;
}
.data > .details {
font-family: pfdintextcomppromedium;
font-weight: 250;
margin-bottom: 0.5em;
}
.data > .resources > .resource > a {
color: var(--main-bg-color);
} }

View File

@ -10,8 +10,10 @@
:root { :root {
--main-bg-color: #e6007e; --main-bg-color: #e6007e;
--alt-bg-color: #E59730;
--alt2-bg-color: #9EBF43;
--main-color: #ffffff; --main-color: #ffffff;
--alt-color: #1A000D; --alt-main-color: #1A000D;
} }
* { * {
@ -30,7 +32,7 @@ body {
} }
.black { .black {
color: var(--alt-color); color: var(--alt-main-color);
} }
.thin { .thin {
@ -56,18 +58,10 @@ body {
width: inherit; width: inherit;
} }
.cursor {
width: 0;
height: 0;
border-left: 0.75em solid transparent;
border-right: 0.75em solid transparent;
border-bottom: 0.75em solid var(--alt-color);
}
a { a {
font-family: pfdintextcomppromedium; font-family: pfdintextcomppromedium;
font-weight: 250; font-weight: 250;
color: var(--alt-color); color: var(--alt-main-color);
transition-property: color; transition-property: color;
transition-duration: 1s; transition-duration: 1s;
text-decoration: wavy; text-decoration: wavy;
@ -137,10 +131,6 @@ a:hover {
width: 100vw; width: 100vw;
} }
#cursorbar {
margin-top: 1em;
}
#blah { #blah {
margin: 2em 0 2em; margin: 2em 0 2em;
font-size: 2em; font-size: 2em;

View File

@ -1,12 +1,13 @@
.tooltip { .tooltip, .planning_tooltip {
position: relative; position: relative;
display: inline-block; display: inline-block;
} }
.tooltip .tooltiptext { .tooltip .tooltiptext {
visibility: hidden; visibility: hidden;
background-color: var(--main-color); background-color: var(--main-color);
color: var(--alt-color); color: var(--alt-main-color);
text-align: center; text-align: center;
border-radius: 6px; border-radius: 6px;
padding: 5px 0; padding: 5px 0;
@ -19,7 +20,7 @@
transition: opacity 1s; transition: opacity 1s;
} }
.tooltip .tooltiptext::after { .tooltip .tooltiptext::after, .planning_tooltip .planning_tooltiptext::after {
content: ""; content: "";
position: absolute; position: absolute;
top: 100%; top: 100%;
@ -28,9 +29,25 @@
border-width: 5px; border-width: 5px;
} }
.tooltip:hover .tooltiptext { .tooltip:hover .tooltiptext, .planning_tooltip:hover .planning_tooltiptext {
visibility: visible; visibility: visible;
opacity: 1; opacity: 1;
font-size: 0.7em; font-size: 0.7em;
padding: 0.2em; padding: 0.2em;
} }
.planning_tooltip .planning_tooltiptext {
visibility: hidden;
background-color: var(--main-color);
color: var(--alt-main-color);
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
opacity: 0;
transform: translateX(2em) translateY(-3em);
transition: opacity 1s;
}

View File

@ -68,9 +68,9 @@
<span class="tooltiptext thin">Expositions</span> <span class="tooltiptext thin">Expositions</span>
</i> </i>
<i class="button tooltip black fa-solid fa-person-chalkboard" <i class="button tooltip black fa-solid fa-person-chalkboard"
title="Conférences" title="Présentation"
alt="Conférences"> alt="Présentation">
<span class="tooltiptext thin">Conférences</span> <span class="tooltiptext thin">Présentation</span>
</i> </i>
</div> </div>
</body> </body>

View File

@ -9,33 +9,51 @@
{% for slot in slots %} {% for slot in slots %}
<div class="slot"> <div class="slot">
<div class="metadata"> <div class="metadata">
<div class="title">{{slot["title"]}}</div> <i class="button planning_tooltip black {{slot['submission_type']['fr'] | toicon }}"
title="{{slot['submission_type']['fr']}}"
alt="{{slot['submission_type']['fr']}}">
<span class="planning_tooltiptext thin">{{slot['submission_type']['fr']}}</span><span class="title white">{{slot["title"]}}</span>
</i>
<div class="speakers"> <div class="speakers">
{% for speaker in slot["speakers"] %} {% for speaker in slot["speakers"] %}
<div class="speaker"> {{speaker["name"] | title}}
<div class="name">{{speaker["name"]}}</div> <i class="speaker_details fa-solid fa-user">
<img class="speaker_avatar" src="{{speaker['avatar']}}"/> {% if speaker['avatar'] or speaker["biography"] %}
<div class="speaker_biography">{{speaker["biography"]}}</div> <div class="details">
{% if speaker['avatar'] %}
<img src="{{speaker['avatar']}}" />
{% endif %}
{% if speaker['biography'] %}
<p class="thin">{{speaker["biography"]}}</p>
{% endif %}
</div> </div>
{% endif %}
</i> {{ ", " if not loop.last else "" }}
{% endfor %} {% endfor %}
</div> </div>
<div class="type">{{slot["submission_type"]["fr"]}}</div>
<div class="start">{{slot["slot"]["start"]}}</div>
<div class="duration">{{slot["duration"]}}</div>
<div class="room">{{slot["slot"]["room"]["fr"]}}</div>
<div class="locale">{{slot["content_locale"]}}</div>
</div> </div>
<div class="data"> <div class="data">
<div class="abstract">{{slot["abstract"]}}</div> <div class="details">
<div class="description">{{slot["description"]}}</div> <div class="room">{{slot["slot"]["room"]["fr"]}}</div>
<div class="start">{{slot["slot"]["start"] | date2dmyhm}} - {{slot["duration"]}} minutes ({{slot["content_locale"] | capitalize}})</div>
</div>
<div class="abstract">
{% if slot['image'] %}
<img class="data_img" src="{{slot['image']}}"/> <img class="data_img" src="{{slot['image']}}"/>
{% endif %}
<p>{{slot["abstract"]}}</p>
</div>
<div class="description">{{slot["description"]}}</div>
{% if slot["resources"] %}
<div class="resources"> <div class="resources">
<h3>Ressources</h3>
{% for resource in slot["resources"] %} {% for resource in slot["resources"] %}
<div class="resources"> <div class="resource">
<a href="{{resource['resource']}}">{{resource["description"]}}</a> <a class="thin" href="{{resource['resource']}}">{{resource["description"]}}</a>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
{% endif %}
</div> </div>
</div> </div>
{% endfor %} {% endfor %}

View File

@ -1 +1 @@
3629 81518