Moved common Jade code for project edit pages into projects/edit_layout.jade

This commit is contained in:
Sybren A. Stüvel 2017-05-24 17:07:17 +02:00
parent 207dacf816
commit f953f1e51b
4 changed files with 252 additions and 390 deletions

View File

@ -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 %}

View File

@ -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 %}

View File

@ -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 %}

View File

@ -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 %}