From f953f1e51b5ff9598345a109ef30fbbb2045c2c1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sybren=20A=2E=20St=C3=BCvel?= Date: Wed, 24 May 2017 17:07:17 +0200 Subject: [PATCH] Moved common Jade code for project edit pages into projects/edit_layout.jade --- src/templates/projects/edit.jade | 233 +++++++------------- src/templates/projects/edit_layout.jade | 87 ++++++++ src/templates/projects/edit_node_types.jade | 123 ++--------- src/templates/projects/sharing.jade | 199 ++++++----------- 4 files changed, 252 insertions(+), 390 deletions(-) create mode 100644 src/templates/projects/edit_layout.jade diff --git a/src/templates/projects/edit.jade b/src/templates/projects/edit.jade index b1832282..ed368870 100644 --- a/src/templates/projects/edit.jade +++ b/src/templates/projects/edit.jade @@ -1,172 +1,100 @@ -| {% extends 'layout.html' %} - +| {% extends 'projects/edit_layout.html' %} | {% set title = 'edit' %} - | {% block page_title %}Edit {{ project.name }}{% endblock %} -| {% block body %} -#project-container - #project-side-container - #project_sidebar - ul.project-tabs - li.tabs-thumbnail( - title="About", - data-toggle="tooltip", - data-placement="left", - class="{% if title == 'about' %}active {% endif %}{% if project.picture_square %}image{% endif %}") - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - #project-loading - i.pi-spin - | {% if project.picture_square %} - img(src="{{ project.picture_square.thumbnail('b', api=api) }}") - | {% else %} - i.pi-home - | {% endif %} - li.tabs-browse( - title="Browse", - data-toggle="tooltip", - data-placement="left") - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - i.pi-tree-flow - | {% if not project.is_private %} - li.tabs-search( - title="Search", - data-toggle="tooltip", - data-placement="left") - a(href="{{url_for('projects.search', project_url=project.url, _external=True)}}") - i.pi-search - | {% endif %} +| {% block project_context_header %} +span#project-edit-title + | Edit Project - .project_nav-toggle-btn( - title="Expand Navigation [T]", - data-toggle="tooltip", - data-placement="right") - i.pi-angle-double-left +ul.project-edit-tools - #project_nav - #project_nav-container - #project_nav-header - .project-title - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - | {{ project.name }} + // Edit Mode + li.button-cancel + a#item_cancel.project-mode-edit( + href="{{url_for('projects.view', project_url=project.url, _external=True)}}", + title="Cancel changes") + i.button-cancel-icon.pi-back + | Go to Project - // TODO - make list a macro - #project_tree.edit - ul.project_nav-edit-list - li(class="{% if title == 'edit' %}active{% endif %}") - a(href="{{ url_for('projects.edit', project_url=project.url) }}") - i.pi-list - | Overview - li(class="{% if title == 'sharing' %}active{% endif %}") - a(href="{{ url_for('projects.sharing', project_url=project.url) }}") - i.pi-share - | Sharing - li(class="{% if title == 'edit_node_types' %}active{% endif %}") - a(href="{{ url_for('projects.edit_node_types', project_url=project.url) }}") - i.pi-puzzle - | Node Types - | {% for ext in ext_pages %} - li(class="{% if title == ext.name %}active{% endif %}") - a(href="{{ url_for('projects.edit_extension', project_url=project.url, extension_name=ext.name) }}") - i(class="pi-{{ext.icon}}") - | {{ext.name | title}} - | {% endfor %} - .project_split(title="Toggle Navigation [T]") + li.button-save + a#item_save.project-mode-edit( + href="#", + title="Save changes") + i.button-save-icon.pi-check + | Save Changes +| {% endblock %} - #project_context-container - #project_context-header - span#status-bar +| {% block project_context %} +#node-edit-container + form( + id="node-edit-form" + method='POST', + action="{{url_for('projects.edit', project_url=project.url)}}") - span#project-edit-title - | Edit Project + | {% with errors = errors %} + | {% if errors %} + | {% for field in errors %} + .alert.alert-danger(role='alert') + strong {{field}} + | {% for message in errors[field] %} + | {{message}}| + | {% endfor %} + | {% endfor %} + | {% endif %} + | {% endwith %} - ul.project-edit-tools + | {% for field in form %} - // Edit Mode - li.button-cancel - a#item_cancel.project-mode-edit( - href="{{url_for('projects.view', project_url=project.url, _external=True)}}", - title="Cancel changes") - i.button-cancel-icon.pi-back - | Go to Project + | {% if field.name == 'csrf_token' %} + | {{ field }} + | {% else %} + | {% if field.type == 'HiddenField' %} + | {{ field }} + | {% else %} - li.button-save - a#item_save.project-mode-edit( - href="#", - title="Save changes") - i.button-save-icon.pi-check - | Save Changes - #project_context - #node-edit-container - form( - id="node-edit-form" - method='POST', - action="{{url_for('projects.edit', project_url=project.url)}}") + | {% if field.name not in hidden_fields %} - | {% with errors = errors %} - | {% if errors %} - | {% for field in errors %} - .alert.alert-danger(role='alert') - strong {{field}} - | {% for message in errors[field] %} - | {{message}}| - | {% endfor %} - | {% endfor %} - | {% endif %} - | {% endwith %} + .form-group(class="{{field.name}}{% if field.errors %} error{% endif %}") + | {{ field.label }} + | {% if field.name == 'picture' %} + | {% if post.picture %} + img.node-preview-thumbnail(src="{{ post.picture.thumbnail('m', api=api) }}") + a(href="#", class="file_delete", data-field-name="picture", data-file_id="{{post.picture._id}}") Delete + | {% endif %} + | {% endif %} + | {{ field(class='form-control') }} - | {% for field in form %} + | {% if field.errors %} + ul.error + | {% for error in field.errors %} + li {{ error }} + | {% endfor %} + | {% endif %} - | {% if field.name == 'csrf_token' %} - | {{ field }} - | {% else %} - | {% if field.type == 'HiddenField' %} - | {{ field }} - | {% else %} + | {% else %} + | {{ field(class='hidden') }} + | {% endif %} - | {% if field.name not in hidden_fields %} + | {% endif %} + | {% endif %} - .form-group(class="{{field.name}}{% if field.errors %} error{% endif %}") - | {{ field.label }} - | {% if field.name == 'picture' %} - | {% if post.picture %} - img.node-preview-thumbnail(src="{{ post.picture.thumbnail('m', api=api) }}") - a(href="#", class="file_delete", data-field-name="picture", data-file_id="{{post.picture._id}}") Delete - | {% endif %} - | {% endif %} - | {{ field(class='form-control') }} - - | {% if field.errors %} - ul.error - | {% for error in field.errors %} - li {{ error }} - | {% endfor %} - | {% endif %} - - | {% else %} - | {{ field(class='hidden') }} - | {% endif %} - - | {% endif %} - | {% endif %} - - | {% endfor %} + | {% endfor %} - ul.project-edit-tools.bottom - li.button-cancel - a#item_cancel.project-mode-edit( - href="{{url_for('projects.view', project_url=project.url, _external=True)}}", - title="Cancel changes") - i.button-cancel-icon.pi-back - | Go to Project + ul.project-edit-tools.bottom + li.button-cancel + a#item_cancel.project-mode-edit( + href="{{url_for('projects.view', project_url=project.url, _external=True)}}", + title="Cancel changes") + i.button-cancel-icon.pi-back + | Go to Project - li.button-save - a#item_save.project-mode-edit( - href="#", - title="Save changes") - i.button-save-icon.pi-check - | Save Changes + li.button-save + a#item_save.project-mode-edit( + href="#", + title="Save changes") + i.button-save-icon.pi-check + | Save Changes | {% endblock %} @@ -238,8 +166,3 @@ script(type="text/javascript"). }); | {% endblock %} - -| {% block footer_navigation %} -| {% endblock %} -| {% block footer %} -| {% endblock %} diff --git a/src/templates/projects/edit_layout.jade b/src/templates/projects/edit_layout.jade new file mode 100644 index 00000000..f4ca6fe6 --- /dev/null +++ b/src/templates/projects/edit_layout.jade @@ -0,0 +1,87 @@ +| {% extends 'layout.html' %} +| {% block page_title %}Edit {{ project.name }}{% endblock %} + +| {% block body %} +#project-container + #project-side-container + #project_sidebar + ul.project-tabs + li.tabs-thumbnail( + title="About", + data-toggle="tooltip", + data-placement="left", + class="{% if title == 'about' %}active {% endif %}{% if project.picture_square %}image{% endif %}") + a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") + #project-loading + i.pi-spin + | {% if project.picture_square %} + img(src="{{ project.picture_square.thumbnail('b', api=api) }}") + | {% else %} + i.pi-home + | {% endif %} + li.tabs-browse( + title="Browse", + data-toggle="tooltip", + data-placement="left") + a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") + i.pi-tree-flow + | {% if not project.is_private %} + li.tabs-search( + title="Search", + data-toggle="tooltip", + data-placement="left") + a(href="{{url_for('projects.search', project_url=project.url, _external=True)}}") + i.pi-search + | {% endif %} + + .project_nav-toggle-btn( + title="Expand Navigation [T]", + data-toggle="tooltip", + data-placement="right") + i.pi-angle-double-left + + #project_nav + #project_nav-container + #project_nav-header + .project-title + a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") + | {{ project.name }} + + // TODO - make list a macro + #project_tree.edit + ul.project_nav-edit-list + li(class="{% if title == 'edit' %}active{% endif %}") + a(href="{{ url_for('projects.edit', project_url=project.url) }}") + i.pi-list + | Overview + li(class="{% if title == 'sharing' %}active{% endif %}") + a(href="{{ url_for('projects.sharing', project_url=project.url) }}") + i.pi-share + | Sharing + li(class="{% if title == 'edit_node_types' %}active{% endif %}") + a(href="{{ url_for('projects.edit_node_types', project_url=project.url) }}") + i.pi-puzzle + | Node Types + | {% for ext in ext_pages %} + li(class="{% if title == ext.name %}active{% endif %}") + a(href="{{ url_for('projects.edit_extension', project_url=project.url, extension_name=ext.name) }}") + i(class="pi-{{ext.icon}}") + | {{ext.name | title}} + | {% endfor %} + .project_split(title="Toggle Navigation [T]") + + #project_context-container + #project_context-header + span#status-bar + | {% block project_context_header %} + | {% endblock %} + + #project_context + | {% block project_context %} + | {% endblock %} +| {% endblock %} + +| {% block footer_navigation %} +| {% endblock %} +| {% block footer %} +| {% endblock %} diff --git a/src/templates/projects/edit_node_types.jade b/src/templates/projects/edit_node_types.jade index 2404cb32..0cfa0178 100644 --- a/src/templates/projects/edit_node_types.jade +++ b/src/templates/projects/edit_node_types.jade @@ -1,106 +1,29 @@ -| {% extends 'layout.html' %} - +| {% extends 'projects/edit_layout.html' %} | {% set title = 'edit_node_types' %} - | {% block page_title %}Node Types: {{ project.name }}{% endblock %} -| {% block body %} -#project-container - #project-side-container - #project_sidebar - ul.project-tabs - li.tabs-thumbnail( - title="About", - data-toggle="tooltip", - data-placement="left", - class="{% if title == 'about' %}active {% endif %}{% if project.picture_square %}image{% endif %}") - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - #project-loading - i.pi-spin - | {% if project.picture_square %} - img(src="{{ project.picture_square.thumbnail('b', api=api) }}") - | {% else %} - i.pi-home - | {% endif %} - li.tabs-browse( - title="Browse", - data-toggle="tooltip", - data-placement="left") - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - i.pi-tree-flow - | {% if not project.is_private %} - li.tabs-search( - title="Search", - data-toggle="tooltip", - data-placement="left") - a(href="{{url_for('projects.search', project_url=project.url, _external=True)}}") - i.pi-search - | {% endif %} - - .project_nav-toggle-btn( - title="Expand Navigation [T]", - data-toggle="tooltip", - data-placement="right") - i.pi-angle-double-left - - #project_nav - #project_nav-container - #project_nav-header - .project-title - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - | {{ project.name }} - - // TODO - make list a macro - #project_tree.edit - ul.project_nav-edit-list - li(class="{% if title == 'edit' %}active{% endif %}") - a(href="{{ url_for('projects.edit', project_url=project.url) }}") - i.pi-list - | Overview - li(class="{% if title == 'sharing' %}active{% endif %}") - a(href="{{ url_for('projects.sharing', project_url=project.url) }}") - i.pi-share - | Sharing - li(class="{% if title == 'edit_node_types' %}active{% endif %}") - a(href="{{ url_for('projects.edit_node_types', project_url=project.url) }}") - i.pi-puzzle - | Node Types - - .project_split(title="Toggle Navigation [T]") - - - #project_context-container - #project_context-header - span#status-bar - - span#project-edit-title - | Edit Project - - #project_context - #node-edit-container - div(id="node-edit-form") - h3 Node Types (coming soon) - p. - Nodes are all the items that can be found in a project. - Everything is a node: a file, a folder, a comment. They are - defined with custom properties and properly presented to you. - When we add support for new node types in the future, it means we - allow the creation of new items (such as textures). - - | {% if current_user.has_role('admin') %} - ul - | {% for node_type in project.node_types %} - li - a(href="{{ url_for('projects.edit_node_type', project_url=project.url, node_type_name=node_type.name) }}") - | {{node_type.name}} - | {% endfor %} - | {% endif %} - +| {% block project_context_header %} +span#project-edit-title + | Edit Project Node Types | {% endblock %} -| {% block footer_scripts %} -| {% endblock %} -| {% block footer_navigation %} -| {% endblock %} -| {% block footer %} +| {% block project_context %} +#node-edit-container + div(id="node-edit-form") + h3 Node Types + p. + Nodes are all the items that can be found in a project. + Everything is a node: a file, a folder, a comment. They are + defined with custom properties and properly presented to you. + When we add support for new node types in the future, it means we + allow the creation of new items (such as textures). + + | {% if current_user.has_role('admin') %} + ul + | {% for node_type in project.node_types %} + li + a(href="{{ url_for('projects.edit_node_type', project_url=project.url, node_type_name=node_type.name) }}") + | {{node_type.name}} + | {% endfor %} + | {% endif %} | {% endblock %} diff --git a/src/templates/projects/sharing.jade b/src/templates/projects/sharing.jade index 23a373f1..e69be3dc 100644 --- a/src/templates/projects/sharing.jade +++ b/src/templates/projects/sharing.jade @@ -1,143 +1,72 @@ -| {% extends 'layout.html' %} - +| {% extends 'projects/edit_layout.html' %} | {% set title = 'sharing' %} - | {% block page_title %}Sharing: {{ project.name }}{% endblock %} -| {% block body %} -#project-container - #project-side-container - #project_sidebar - ul.project-tabs - li.tabs-thumbnail( - title="About", - data-toggle="tooltip", - data-placement="left", - class="{% if title == 'about' %}active {% endif %}{% if project.picture_square %}image{% endif %}") - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - #project-loading - i.pi-spin - | {% if project.picture_square %} - img(src="{{ project.picture_square.thumbnail('b', api=api) }}") - | {% else %} - i.pi-home - | {% endif %} - li.tabs-browse( - title="Browse", - data-toggle="tooltip", - data-placement="left") - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - i.pi-tree-flow - | {% if not project.is_private %} - li.tabs-search( - title="Search", - data-toggle="tooltip", - data-placement="left") - a(href="{{url_for('projects.search', project_url=project.url, _external=True)}}") - i.pi-search - | {% endif %} - - .project_nav-toggle-btn( - title="Expand Navigation [T]", - data-toggle="tooltip", - data-placement="right") - i.pi-angle-double-left - - #project_nav - #project_nav-container - #project_nav-header - .project-title - a(href="{{url_for('projects.view', project_url=project.url, _external=True)}}") - | {{ project.name }} - - // TODO - make list a macro - #project_tree.edit - ul.project_nav-edit-list - li(class="{% if title == 'edit' %}active{% endif %}") - a(href="{{ url_for('projects.edit', project_url=project.url) }}") - i.pi-list - | Overview - li(class="{% if title == 'sharing' %}active{% endif %}") - a(href="{{ url_for('projects.sharing', project_url=project.url) }}") - i.pi-share - | Sharing - li(class="{% if title == 'edit_node_types' %}active{% endif %}") - a(href="{{ url_for('projects.edit_node_types', project_url=project.url) }}") - i.pi-puzzle - | Node Types - - .project_split(title="Toggle Navigation [T]") - - #project_context-container - #project_context-header - span#status-bar - - span#project-edit-title - | Manage team members for this project - - #project_context - #node-edit-container - #node-edit-form - .col-md-6 - | {% if (project.user == current_user.objectid or current_user.has_role('admin')) %} - .sharing-users-search - .form-group - input#user-select.form-control( - name='contacts', - type='text', - placeholder='Add team members by name') - | {% else %} - .sharing-users-search - .disabled Only project owners & admins can manage users - | {% endif %} - - - ul.sharing-users-list - | {% for user in users %} - li.sharing-users-item( - user-id="{{ user['_id'] }}", - class="{% if current_user.objectid == user['_id'] %}self{% endif %}") - .sharing-users-avatar - img(src="{{ user['avatar'] }}") - .sharing-users-details - span.sharing-users-name - | {{user['full_name']}} - | {% if project.user == user['_id'] and current_user.objectid == user['_id'] %} - small (You, owner) - | {% elif project.user == user['_id'] %} - small (Owner) - | {% elif current_user.objectid == user['_id'] %} - small (You) - | {% endif %} - span.sharing-users-extra {{user['username']}} - .sharing-users-action - | {# Only allow deletion if we are: admin, project owners, or current_user in the team #} - | {% if current_user.has_role('admin') or (project.user == current_user.objectid) or (current_user.objectid == user['_id']) %} - - | {% if project.user == user['_id'] %} - span - i.pi-happy(title="Hi boss!") - | {% elif current_user.objectid == user['_id'] %} - button.user-remove(title="Leave this project") Leave - | {% else %} - button.user-remove(title="Remove this user from your project") - i.pi-trash - | {% endif %} - - | {% endif %} - | {% endfor %} - - .col-md-6 - .sharing-users-info - h4 What can team members do? - p. - Team members are able to upload new content to the project, - as well as view, edit, delete, and comment on the content - previously created. - +| {% block project_context_header %} +span#project-edit-title + | Manage team members for this project | {% endblock %} -| {% block footer_navigation %} +| {% block project_context %} +#node-edit-container + #node-edit-form + .col-md-6 + | {% if (project.user == current_user.objectid or current_user.has_role('admin')) %} + .sharing-users-search + .form-group + input#user-select.form-control( + name='contacts', + type='text', + placeholder='Add team members by name') + | {% else %} + .sharing-users-search + .disabled Only project owners & admins can manage users + | {% endif %} + + + ul.sharing-users-list + | {% for user in users %} + li.sharing-users-item( + user-id="{{ user['_id'] }}", + class="{% if current_user.objectid == user['_id'] %}self{% endif %}") + .sharing-users-avatar + img(src="{{ user['avatar'] }}") + .sharing-users-details + span.sharing-users-name + | {{user['full_name']}} + | {% if project.user == user['_id'] and current_user.objectid == user['_id'] %} + small (You, owner) + | {% elif project.user == user['_id'] %} + small (Owner) + | {% elif current_user.objectid == user['_id'] %} + small (You) + | {% endif %} + span.sharing-users-extra {{user['username']}} + .sharing-users-action + | {# Only allow deletion if we are: admin, project owners, or current_user in the team #} + | {% if current_user.has_role('admin') or (project.user == current_user.objectid) or (current_user.objectid == user['_id']) %} + + | {% if project.user == user['_id'] %} + span + i.pi-happy(title="Hi boss!") + | {% elif current_user.objectid == user['_id'] %} + button.user-remove(title="Leave this project") Leave + | {% else %} + button.user-remove(title="Remove this user from your project") + i.pi-trash + | {% endif %} + + | {% endif %} + | {% endfor %} + + .col-md-6 + .sharing-users-info + h4 What can team members do? + p. + Team members are able to upload new content to the project, + as well as view, edit, delete, and comment on the content + previously created. + | {% endblock %} | {% block footer_scripts %}