diff options
Diffstat (limited to 'src/application/templates/modern/components')
6 files changed, 307 insertions, 0 deletions
diff --git a/src/application/templates/modern/components/alert_error.twig b/src/application/templates/modern/components/alert_error.twig new file mode 100644 index 0000000..ba14ba5 --- /dev/null +++ b/src/application/templates/modern/components/alert_error.twig @@ -0,0 +1,8 @@ +<div class="alert alert-danger" role="alert"> + <svg viewBox="0 0 24 24" class="icon"><circle cx="12" cy="12" r="10"/><path d="m15 9-6 6"/><path d="m9 9 6 6"/></svg> + {% if message starts with "?!HTML::" %} + {{ message|slice(8)|raw }} + {% else %} + <span>{{ message }}</span> + {% endif %} +</div> diff --git a/src/application/templates/modern/components/alert_info.twig b/src/application/templates/modern/components/alert_info.twig new file mode 100644 index 0000000..6559ac2 --- /dev/null +++ b/src/application/templates/modern/components/alert_info.twig @@ -0,0 +1,8 @@ +<div class="alert alert-info" role="alert"> + <svg viewBox="0 0 24 24" class="icon"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/></svg> + {% if message starts with "?!HTML::" %} + {{ message|slice(8)|raw }} + {% else %} + <span>{{ message }}</span> + {% endif %} +</div> diff --git a/src/application/templates/modern/components/alert_success.twig b/src/application/templates/modern/components/alert_success.twig new file mode 100644 index 0000000..ed64ce5 --- /dev/null +++ b/src/application/templates/modern/components/alert_success.twig @@ -0,0 +1,8 @@ +<div class="alert alert-success" role="alert"> + <svg viewBox="0 0 24 24" class="icon"><circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/></svg> + {% if message starts with "?!HTML::" %} + {{ message|slice(8)|raw }} + {% else %} + <span>{{ message }}</span> + {% endif %} +</div> diff --git a/src/application/templates/modern/components/post.twig b/src/application/templates/modern/components/post.twig new file mode 100644 index 0000000..5ceb46e --- /dev/null +++ b/src/application/templates/modern/components/post.twig @@ -0,0 +1,180 @@ +{%- set fileAttachments = attachments|filter(a => not (a.mimeType starts with "image/" or a.mimeType starts with "video/")) -%} +{%- set imageAttachments = attachments|filter(a => a.mimeType starts with "image/" or a.mimeType starts with "video/") -%} + +{%- set canReply = + not post.deleted + and not topic.isLocked + and currentUser is not null + and currentUser.hasPermission(permission("CREATE_OWN_POST")) +-%} + +{%- set canEdit = + not post.deleted + and not topic.isLocked + and currentUser is not null + and ( + ( + postAuthor is not null + and postAuthor.id == currentUser.id + and postAuthor.hasPermission(permission("EDIT_OWN_POST")) + ) + or currentUser.hasPermission(permission("EDIT_OTHER_POST")) + ) -%} + +{%- set canDelete = + not post.deleted + and currentUser is not null + and ( + ( + postAuthor is not null + and postAuthor.id == currentUser.id + and postAuthor.hasPermission(permission("DELETE_OWN_POST")) + ) + or currentUser.hasPermission(permission("DELETE_OTHER_POST")) + ) -%} + +{%- set canViewAttachments = currentUser is not null -%} + +{%- set your_are_the_author = + currentUser is not null + and postAuthor is not null + and currentUser.id == postAuthor.id +-%} + +{%- set is_op = + topicAuthor is not null + and postAuthor is not null + and postAuthor.id == topicAuthor.id +-%} + +{% if post.deleted %} + <div class="post" id="post-{{ post.id }}"> + <div class="post-pfp"> + <div class="media-object" style="width:64px"></div> + </div> + <div class="post-body"> + <div class="post-status post-status-danger"> + <svg viewBox="0 0 24 24" class="icon"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg> + <em>{{ __("This post has been deleted") }}</em> + </div> + </div> + </div> +{% else %} + <div class="post" data-text="{{ post.content }}" style="overflow: visible;" data-post-id="{{ post.id }}"> + <div id="post-{{ post.id }}" class="post-anchor"></div> + {% if not hide_pfp %} + <div class="post-pfp"> + {% if postAuthor %} + {% if hide_actions %} + <img class="media-object" alt="{{ __("Profile picture") }}" src="?_action=profilepicture&user={{ postAuthor.id|url_encode }}" width="64" height="64"> + {% else %} + <a href="?_action=viewuser&user={{ postAuthor.id|url_encode }}"> + <img class="media-object" alt="{{ __("Profile picture") }}" src="?_action=profilepicture&user={{ postAuthor.id|url_encode }}" width="64" height="64"> + </a> + {% endif %} + {% else %} + <div class="media-object" style="width:64px;height:64px"></div> + {% endif %} + </div> + {% endif %} + <div class="post-body" style="overflow: visible;"> + <div class="post-title"> + {% if not hide_actions %} + <div class="pull-right title-controls"> + <a href="#post-{{ post.id }}" class="btn btn-iconic" title="{{ __("Permalink") }}"> + <svg viewBox="0 0 24 24" class="icon"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg> + </a> + {% if canReply %} + <button data-post-id="{{ post.id }}" class="btn js-only _reply-post btn-iconic" title="{{ __("Reply to post") }}"> + <svg viewBox="0 0 24 24" class="icon"><polyline points="9 17 4 12 9 7"/><path d="M20 18v-2a4 4 0 0 0-4-4H4"/></svg> + </button> + {% endif %} + {% if canEdit %} + <button data-post-id="{{ post.id }}" class="btn js-only _edit-post btn-iconic" title="{{ __("Edit post") }}"> + <svg viewBox="0 0 24 24" class="icon"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/><path d="m15 5 4 4"/></svg> + </button> + {% endif %} + {% if canDelete %} + <form action="?_action=deletepost" method="post"> + <input type="hidden" name="post" value="{{ post.id }}"> + <button type="submit" class="btn btn-danger btn-iconic" title="{{ __("Delete post") }}"> + <svg viewBox="0 0 24 24" class="icon"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/></svg> + </button> + </form> + {% endif %} + </div> + {% endif %} + {% if postAuthor %} + {% if hide_actions %} + {{ postAuthor.displayName }} + {% else %} + <a href="?_action=viewuser&user={{ postAuthor.id|url_encode }}">{{ postAuthor.displayName }}</a> + {% if is_op %} + <svg viewBox="0 0 24 24" class="icon is-op icon-in-text"><title>{{ __("Created this topic") }}</title><path d="m11 7.601-5.994 8.19a1 1 0 0 0 .1 1.298l.817.818a1 1 0 0 0 1.314.087L15.09 12"/><path d="M16.5 21.174C15.5 20.5 14.372 20 13 20c-2.058 0-3.928 2.356-6 2-2.072-.356-2.775-3.369-1.5-4.5"/><circle cx="16" cy="7" r="5"/></svg> + {% endif %} + {% endif %} + {% if your_are_the_author %} + <svg viewBox="0 0 24 24" class="icon is-you icon-in-text"><title>{{ __("You") }}</title><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg> + {% endif %} + {% else %} + <em class="text-muted">{{ __("(deleted)") }}</em> + {% endif %} + <div class="post-info"> + <span class="_time">{{ post.postDate.format("c") }}</span> + {% if post.edited %} + <em class="text-muted">{{ __("(edited)") }}</em> + {% endif %} + </div> + </div> + <div class="post-main"> + <div class="post-content">{{ renderPost(post.content) }}</div> + {% if imageAttachments|length > 0 %} + <div class="post-images"> + {% for attachment in imageAttachments %} + {% if hide_actions %} + <span class="image-attachment" title="{{ attachment.name }}"> + <img class="image-attachment-image" src="?_action=thumb&attachment={{ attachment.id|url_encode }}" alt="" width="100"> + </span> + {% else %} + <a class=" + image-attachment + attachment + {{ attachment.mimeType starts with "video/" ? "video-attachment" }} + " href="?_action=attachment&attachment={{ attachment.id|url_encode }}" title="{{ attachment.name }}" data-attachment-id="{{ attachment.id }}"> + <img class="image-attachment-image" src="?_action=thumb&attachment={{ attachment.id|url_encode }}" alt="" width="100"> + {% if not canViewAttachments %} + <svg viewBox="0 0 24 24" class="attachment-lock icon"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg> + {% elseif attachment.mimeType starts with "video/" %} + <svg viewBox="0 0 24 24" class="video-player-icon icon"><circle cx="12" cy="12" r="10"/><polygon points="10 8 16 12 10 16 10 8"/></svg> + {% endif %} + </a> + {% endif %} + {% endfor %} + </div> + {% endif %} + </div> + {% if fileAttachments|length > 0 %} + <div class="post-attachments"> + <div class="btn-toolbar"> + <div class="btn-group"> + {% for attachment in fileAttachments %} + {% if hide_actions %} + <button>{{ attachment.name }}</button> + {% else %} + <a class="btn attachment" href="?_action=attachment&attachment={{ attachment.id|url_encode }}"> + {% if not canViewAttachments %} + <svg viewBox="0 0 24 24" class="icon"><circle cx="12" cy="12" r="10"/><path d="m4.9 4.9 14.2 14.2"/></svg> + {% else %} + <svg viewBox="0 0 24 24" class="icon"><path d="m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48"/></svg> + {% endif %} + <span>{{ attachment.name }}</span> + </a> + {% endif %} + {% endfor %} + </div> + </div> + </div> + {% endif %} + </div> + </div> +{% endif %} diff --git a/src/application/templates/modern/components/richtext_editor.twig b/src/application/templates/modern/components/richtext_editor.twig new file mode 100644 index 0000000..3a2874d --- /dev/null +++ b/src/application/templates/modern/components/richtext_editor.twig @@ -0,0 +1,35 @@ +<div class="richtext-editor"> + <div class="rt-toolbar" role="toolbar"> + <div class="rt-group" role="group"> + <button data-area="#{{ id }}" title="{{ __("Bold") }}" data-editor-command="bold" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><path d="M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8"/></svg> + </button> + <button data-area="#{{ id }}" title="{{ __("Italic") }}" data-editor-command="italic" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><line x1="19" x2="10" y1="4" y2="4"/><line x1="14" x2="5" y1="20" y2="20"/><line x1="15" x2="9" y1="4" y2="20"/></svg> + </button> + <button data-area="#{{ id }}" title="{{ __("Underlined") }}" data-editor-command="underline" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><path d="M6 4v6a6 6 0 0 0 12 0V4"/><line x1="4" x2="20" y1="20" y2="20"/></svg> + </button> + <button data-area="#{{ id }}" title="{{ __("Strikethrough") }}" data-editor-command="strikethrough" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><path d="M16 4H9a3 3 0 0 0-2.83 4"/><path d="M14 12a4 4 0 0 1 0 8H6"/><line x1="4" x2="20" y1="12" y2="12"/></svg> + </button> + </div> + <div class="rt-group" role="group"> + <button data-area="#{{ id }}" title="{{ __("Superscript") }}" data-editor-command="sup" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><path d="m4 19 8-8"/><path d="m12 19-8-8"/><path d="M20 12h-4c0-1.5.442-2 1.5-2.5S20 8.334 20 7.002c0-.472-.17-.93-.484-1.29a2.105 2.105 0 0 0-2.617-.436c-.42.239-.738.614-.899 1.06"/></svg> + </button> + <button data-area="#{{ id }}" title="{{ __("Subscript") }}" data-editor-command="sub" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><path d="m4 5 8 8"/><path d="m12 5-8 8"/><path d="M20 19h-4c0-1.5.44-2 1.5-2.5S20 15.33 20 14c0-.47-.17-.93-.48-1.29a2.11 2.11 0 0 0-2.62-.44c-.42.24-.74.62-.9 1.07"/></svg> + </button> + </div> + <div class="rt-group" role="group"> + <button data-area="#{{ id }}" title="{{ __("Quote") }}" data-editor-command="quote" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><path d="M17 6H3"/><path d="M21 12H8"/><path d="M21 18H8"/><path d="M3 12v6"/></svg> + </button> + <button data-area="#{{ id }}" title="{{ __("Spoiler") }}" data-editor-command="spoiler" type="button" class="btn btn-iconic"> + <svg viewBox="0 0 24 24" class="icon"><path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/></svg> + </button> + </div> + </div> + <textarea class="form-control" id="{{ id }}" name="{{ name }}" required rows="12" cols="60"></textarea> +</div> diff --git a/src/application/templates/modern/components/topic_log.twig b/src/application/templates/modern/components/topic_log.twig new file mode 100644 index 0000000..853dc20 --- /dev/null +++ b/src/application/templates/modern/components/topic_log.twig @@ -0,0 +1,68 @@ +{%- set user = "" -%} +{%- if postAuthor is null -%} + {%- set user = __("(deleted)")|e("html") -%} +{%- else -%} + {%- set user = + '<a href="?_action=viewuser&user=' + ~ postAuthor.id|url_encode|e("html") + ~ '">' + ~ postAuthor.displayName|e("html") + ~ '</a>' + -%} +{%- endif -%} + +<div class="post log" id="post-{{ logMessage.id }}"> + <div class="post-pfp"> + {% if postAuthor %} + {% if hideActions %} + <img class="media-object" alt="{{ __("Profile picture") }}" src="?_action=profilepicture&user={{ postAuthor.id|url_encode }}" width="64" height="64"> + {% else %} + <a href="?_action=viewuser&user={{ postAuthor.id|url_encode }}"> + <img class="media-object" alt="{{ __("Profile picture") }}" src="?_action=profilepicture&user={{ postAuthor.id|url_encode }}" width="64" height="64"> + </a> + {% endif %} + {% else %} + <div class="media-object" style="width:64px;height:64px"></div> + {% endif %} + </div> + <div class="post-body"> + {% if logMessage.type == constant("mystic\\forum\\orm\\TopicLogMessage::LOCKED") %} + <div class="post-status post-status-warning"> + <svg viewBox="0 0 24 24" class="icon"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg> + <span> + <em>{{ __("%user% locked this topic", { + "user": user, + }) }}</em> + <br> + <small class="_time">{{ logMessage.postDate.format("c") }}</small> + </span> + </div> + {% elseif logMessage.type == constant("mystic\\forum\\orm\\TopicLogMessage::UNLOCKED") %} + <div class="post-status post-status-success"> + <svg viewBox="0 0 24 24" class="icon"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 9.9-1"/></svg> + <span> + <em>{{ __("%user% unlocked this topic", { + "user": user, + }) }}</em> + <br> + <small class="_time">{{ logMessage.postDate.format("c") }}</small> + </span> + </div> + {% elseif logMessage.type == constant("mystic\\forum\\orm\\TopicLogMessage::TITLE_CHANGED") %} + <div class="post-status post-status-info"> + <svg viewBox="0 0 24 24" class="icon"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/><path d="m15 5 4 4"/></svg> + <span> + <em>{{ __("%user% changed the title of this topic from %old_title% to %new_title%", { + "user": user, + "old_title": '<strong>' ~ logMessage.params.old_value|default(__("unknown"))|e("html") ~ '</strong>', + "new_title": '<strong>' ~ logMessage.params.new_value|default(__("unknown"))|e("html") ~ '</strong>', + }) }}</em> + <br> + <small class="_time">{{ logMessage.postDate.format("c") }}</small> + </span> + </div> + {% else %} + {{ __("unknown") }} + {% endif %} + </div> +</div> |