From 45a79fc40fbcb9ff71a856ca5aa1b72a7edbf7c4 Mon Sep 17 00:00:00 2001 From: Filip Maciejewski Date: Sun, 14 Jun 2020 22:25:39 +0200 Subject: [PATCH 1/5] Wrap mission widget into div --- templates/_partial/_mission_widget.html.twig | 88 ++++++++++---------- 1 file changed, 45 insertions(+), 43 deletions(-) diff --git a/templates/_partial/_mission_widget.html.twig b/templates/_partial/_mission_widget.html.twig index 143c9fd1..339d782f 100644 --- a/templates/_partial/_mission_widget.html.twig +++ b/templates/_partial/_mission_widget.html.twig @@ -1,51 +1,53 @@ - - -
- {% set mission_image = mission.image ?? 'https://via.placeholder.com/300x200.png?text=No%20mission%20image' %} - {% if lazy is defined and lazy %} - - {% else %} - - {%- endif %} -
- - - -
-

- {{ mission.title }} -

-
- {% if mission.state == constant('App\\Service\\Mission\\Enum\\MissionStateEnum::ARCHIVED') %} -
{{ mission.date|date('Y-m-d H:i') }}
+
+ +
+ {% set mission_image = mission.image ?? 'https://via.placeholder.com/300x200.png?text=No%20mission%20image' %} + {% if lazy is defined and lazy %} + {% else %} -
- - {{ mission.date|date('Y-m-d H:i') }} - - -
- - oogle - - - iCal + + {%- endif %} +
+ + + +
+

+ + {{ mission.title }} + +

+
+ {% if mission.state == constant('App\\Service\\Mission\\Enum\\MissionStateEnum::ARCHIVED') %} +
{{ mission.date|date('Y-m-d H:i') }}
+ {% else %} +
+ + {{ mission.date|date('Y-m-d H:i') }} + +
+ + oogle + + + iCal + +
-
- {% endif %} - - {{ 'Enlisted'|trans }} {{ mission.occupiedSlots }}/{{ mission.allSlots }} - + {% endif %} + + {{ 'Enlisted'|trans }} {{ mission.occupiedSlots }}/{{ mission.allSlots }} + +
-
- + - -
- {{ ((mission.description|u).truncate(350, '...'))|markdown_to_html }} + +
+ {{ ((mission.description|u).truncate(350, '...'))|markdown_to_html }} +
+
- - From 37cc10cc616809bc44e31ea475d0dc25e4e4e3ca Mon Sep 17 00:00:00 2001 From: Filip Maciejewski Date: Sun, 14 Jun 2020 22:25:53 +0200 Subject: [PATCH 2/5] Add hidden div with full mission description --- templates/_partial/_mission_widget.html.twig | 1 + 1 file changed, 1 insertion(+) diff --git a/templates/_partial/_mission_widget.html.twig b/templates/_partial/_mission_widget.html.twig index 339d782f..b44dd63a 100644 --- a/templates/_partial/_mission_widget.html.twig +++ b/templates/_partial/_mission_widget.html.twig @@ -48,6 +48,7 @@
{{ ((mission.description|u).truncate(350, '...'))|markdown_to_html }}
+
{{ mission.description|u|markdown_to_html }}
From 3121587be9754c1ce325e60b2c82ada3c3863ca2 Mon Sep 17 00:00:00 2001 From: Filip Maciejewski Date: Sun, 14 Jun 2020 22:26:17 +0200 Subject: [PATCH 3/5] Add mission modal template --- templates/_partial/_modal_mission.html.twig | 24 +++++++++++++++++++++ templates/default.html.twig | 1 + 2 files changed, 25 insertions(+) create mode 100644 templates/_partial/_modal_mission.html.twig diff --git a/templates/_partial/_modal_mission.html.twig b/templates/_partial/_modal_mission.html.twig new file mode 100644 index 00000000..7cbfa3f8 --- /dev/null +++ b/templates/_partial/_modal_mission.html.twig @@ -0,0 +1,24 @@ + diff --git a/templates/default.html.twig b/templates/default.html.twig index e1b4b82f..15380529 100644 --- a/templates/default.html.twig +++ b/templates/default.html.twig @@ -18,4 +18,5 @@ {% block javascripts %} {{ parent() }} {{ include('_partial/_modal.html.twig') }} + {{ include('_partial/_modal_mission.html.twig') }} {% endblock %} From 4a42b6b5d03eb9ccf054ad7e13a2bad0e5c82766 Mon Sep 17 00:00:00 2001 From: Filip Maciejewski Date: Sun, 14 Jun 2020 22:26:29 +0200 Subject: [PATCH 4/5] Add mission modal js code --- assets/app.js | 5 +++-- assets/{form.js => modal.js} | 24 ++++++++++++++++++++++++ 2 files changed, 27 insertions(+), 2 deletions(-) rename assets/{form.js => modal.js} (56%) diff --git a/assets/app.js b/assets/app.js index 1a66c985..60d45b7d 100644 --- a/assets/app.js +++ b/assets/app.js @@ -5,7 +5,7 @@ import yall from 'yall-js'; // Init Bootstrap jQuery plugins import 'bootstrap'; -import * as form from './form'; +import * as modal from './modal'; $(() => { $('[data-toggle="tooltip"]').tooltip(); @@ -22,7 +22,8 @@ $(() => { }); }); - form.initConfirmModals(); + modal.initConfirmModals(); + modal.initMissionModals(); // Image lazy loading yall(); diff --git a/assets/form.js b/assets/modal.js similarity index 56% rename from assets/form.js rename to assets/modal.js index 918bad6f..0c40b152 100644 --- a/assets/form.js +++ b/assets/modal.js @@ -34,3 +34,27 @@ export const initConfirmModals = () => { }); }); }; + +export const createMissionModal = (title, content) => { + let template = $('#modal-mission-template').html(); + template = template.replace('__content__', content); + template = template.replace('__title__', title); + + let $modal = $(template).modal({ + 'backdrop': 'static', + 'keyboard': false, + }); +}; + +export const initMissionModals = () => { + $('[data-mission-widget]').on('click', '[data-mission-title]', (e) => { + e.preventDefault(); + e.stopPropagation(); + + const $mission = jQuery(e.delegateTarget); + const title = $mission.find('[data-mission-title]').text(); + const description = $mission.find('[data-mission-description]').html(); + + createMissionModal(title, description) + }); +}; From 78796eda7c568405454d5c9fd6a46606eedfc6f6 Mon Sep 17 00:00:00 2001 From: Filip Maciejewski Date: Mon, 15 Jun 2020 00:07:00 +0200 Subject: [PATCH 5/5] Improve readability of missions.html.twig --- templates/home/missions/missions.html.twig | 85 +++++++++++----------- 1 file changed, 44 insertions(+), 41 deletions(-) diff --git a/templates/home/missions/missions.html.twig b/templates/home/missions/missions.html.twig index bed46bca..bd86b1c4 100644 --- a/templates/home/missions/missions.html.twig +++ b/templates/home/missions/missions.html.twig @@ -10,52 +10,55 @@ {% block content %}
+ {% if upcomingMissions is null or archivedMissions is null %} +
+

{{ 'Something went wrong while fetching missions list...'|trans }}

+

{{ 'Try again later'|trans }}

+
+ {% else %}
- {% if upcomingMissions is null or archivedMissions is null %} -

{{ 'Something went wrong while fetching missions list...'|trans }}

-

{{ 'Try again later'|trans }}

- {% else %} - -

{{ 'Upcoming missions'|trans }}

+ +

{{ 'Upcoming missions'|trans }}

- {% for missionsRow in upcomingMissions|reverse|batch(3) %} - -
- {% for mission in missionsRow %} - {# @var mission \App\Service\Mission\Dto\MissionDto #} - -
- {% include '_partial/_mission_widget.html.twig' with {'mission': mission} %} -
- - {% endfor %} -
- - {% endfor %} -
+ {% for missionsRow in upcomingMissions|reverse|batch(3) %} + +
+ {% for mission in missionsRow %} + {# @var mission \App\Service\Mission\Dto\MissionDto #} + +
+ {% include '_partial/_mission_widget.html.twig' with {'mission': mission} %} +
+ + {% endfor %} +
+ + {% endfor %} + + - -
- -

{{ 'Completed missions'|trans }}

+ +
+ +

{{ 'Completed missions'|trans }}

- {% for missionsRow in archivedMissions|batch(3) %} - -
- {% for mission in missionsRow %} - {# @var mission \App\Service\Mission\Dto\MissionDto #} - -
- {% include '_partial/_mission_widget.html.twig' with {'mission': mission, 'lazy': true} %} -
- - {% endfor %} -
- - {% endfor %} - {% endif %} + {% for missionsRow in archivedMissions|batch(3) %} + +
+ {% for mission in missionsRow %} + {# @var mission \App\Service\Mission\Dto\MissionDto #} + +
+ {% include '_partial/_mission_widget.html.twig' with {'mission': mission, 'lazy': true} %} +
+ + {% endfor %} +
+ + {% endfor %}
- + + {% endif %}
{% endblock %}