diff --git a/pillar/web/projects/routes.py b/pillar/web/projects/routes.py index 26fc120b..1c5598de 100644 --- a/pillar/web/projects/routes.py +++ b/pillar/web/projects/routes.py @@ -603,7 +603,8 @@ def edit_node_type(project_url, node_type_name): form.form_schema.data = json.dumps(form_schema, indent=4) form.dyn_schema.data = json.dumps(dyn_schema, indent=4) form.permissions.data = json.dumps(permissions, indent=4) - return render_template('projects/edit_node_type.html', + + return render_template('projects/edit_node_type_embed.html', form=form, project=project, api=api, diff --git a/src/styles/_project-sharing.sass b/src/styles/_project-sharing.sass index 90c6daec..aef546dc 100644 --- a/src/styles/_project-sharing.sass +++ b/src/styles/_project-sharing.sass @@ -160,10 +160,6 @@ ul.list-generic margin: 0 padding: 0 list-style: none - width: 350px - - +media-xs - width: 100% > li padding: 5px 0 diff --git a/src/templates/projects/edit.pug b/src/templates/projects/edit.pug index ed368870..e24883f0 100644 --- a/src/templates/projects/edit.pug +++ b/src/templates/projects/edit.pug @@ -80,22 +80,20 @@ ul.project-edit-tools | {% 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 %} diff --git a/src/templates/projects/edit_layout.pug b/src/templates/projects/edit_layout.pug index 24826231..55c92d7a 100644 --- a/src/templates/projects/edit_layout.pug +++ b/src/templates/projects/edit_layout.pug @@ -6,7 +6,7 @@ #project-side-container #project_sidebar ul.project-tabs - li.tabs-thumbnail( + li.tabs-thumbnail.active( title="About", data-toggle="tooltip", data-placement="left", @@ -83,9 +83,9 @@ script. /* UI Stuff */ $(window).on("load resize",function(){ - $('#project-container').css('height', $(window).height()); - $('#project_context-header').css('width', $('#project_context-container').width()); + containerResizeY($(window).height()); }); + | {% endblock %} | {% block footer_navigation %} diff --git a/src/templates/projects/edit_node_type.pug b/src/templates/projects/edit_node_type.pug deleted file mode 100644 index 7469d05e..00000000 --- a/src/templates/projects/edit_node_type.pug +++ /dev/null @@ -1,88 +0,0 @@ -| {% extends 'layout.html' %} - -| {% set title = 'edit_node_types' %} - -| {% block page_title %}Project {{ project.name }}{% endblock %} - -| {% block body %} -.container.box - form( - method='POST', - action="{{url_for('projects.edit_node_type', project_url=project.url, node_type_name=node_type['name'])}}") - - #blog_container.post-create - - | {% 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 %} - - #blog_index-sidebar - .blog_project-sidebar - input.btn.btn-default.button-create(type='submit', value="Update {{ node_type['name'] }}") - a.btn.btn-default.button-back(href="{{ url_for('projects.view', project_url=project.url) }}") - | Back to Project - - #blog_post-edit-container - #blog_post-edit-title - | Edit {{ node_type['name'] }} - - #blog_post-edit-form - | {% for field in form %} - | {% if field.name == 'csrf_token' %} - | {{ field }} - | {% else %} - | {% if field.type == 'HiddenField' %} - | {{ field }} - | {% else %} - .form-group(class="{{field.name}}{% if field.errors %} error{% endif %}") - | {{ field.label }} - | {{ field(class='form-control') }} - - | {% if field.errors %} - ul.error - | {% for error in field.errors %} - li {{ error }} - | {% endfor %} - | {% endif %} - - | {% endif %} - | {% endif %} - | {% endfor %} - -| {% endblock %} - -| {% block footer_scripts%} -script(src="https://cdn.jsdelivr.net/g/ace@1.2.3(noconflict/ace.js+noconflict/mode-json.js)") - -script. - var dynSchemaEditorContainer = $("
", {id: "dyn_schema_editor"}); - $(".form-group.dyn_schema").before(dynSchemaEditorContainer); - var dynSchemaEditor = ace.edit("dyn_schema_editor"); - dynSchemaEditor.getSession().setValue($("#dyn_schema").val()); - - var formSchemaEditorContainer = $("
", {id: "form_schema_editor"}); - $(".form-group.form_schema").before(formSchemaEditorContainer); - var formSchemaEditor = ace.edit("form_schema_editor"); - formSchemaEditor.getSession().setValue($("#form_schema").val()); - - var permissionsEditorContainer = $("
", {id: "permissions_editor"}); - $(".form-group.permissions").before(permissionsEditorContainer); - var permissionsEditor = ace.edit("permissions_editor"); - permissionsEditor.getSession().setValue($("#permissions").val()); - - $("form").submit(function(e) { - $("#dyn_schema").val(dynSchemaEditor.getSession().getValue()); - $("#form_schema").val(formSchemaEditor.getSession().getValue()); - $("#permissions").val(permissionsEditor.getSession().getValue()); - }); -| {% endblock %} - - diff --git a/src/templates/projects/edit_node_type_embed.pug b/src/templates/projects/edit_node_type_embed.pug new file mode 100644 index 00000000..876b4580 --- /dev/null +++ b/src/templates/projects/edit_node_type_embed.pug @@ -0,0 +1,94 @@ +form( + id="node-type-form", + method='POST', + action="{{url_for('projects.edit_node_type', project_url=project.url, node_type_name=node_type['name'])}}") + + | {% 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 %} + + .row + .col-md-9 + h3 Editing: {{ node_type['name'] }} + .col-md-3 + button.js-form-save.btn.btn-success.pull-right(style="margin-top: 15px;") + | Save Changes + + .row + .col-md-12 + | {% for field in form %} + | {% if field.name == 'csrf_token' %} + | {{ field }} + | {% else %} + | {% if field.type == 'HiddenField' %} + | {{ field }} + | {% else %} + .form-group(class="{{field.name}}{% if field.errors %} error{% endif %}") + | {{ field.label }} + | {{ field(class='form-control') }} + + | {% if field.errors %} + ul.error + | {% for error in field.errors %} + li {{ error }} + | {% endfor %} + | {% endif %} + + | {% endif %} + | {% endif %} + | {% endfor %} + + button.js-form-save.btn.btn-success.pull-right + | Save Changes + + +script. + $(document).ready(function(){ + var dynSchemaEditorContainer = $("
", {id: "dyn_schema_editor"}); + $(".form-group.dyn_schema").before(dynSchemaEditorContainer); + var dynSchemaEditor = ace.edit("dyn_schema_editor"); + dynSchemaEditor.getSession().setValue($("#dyn_schema").val()); + + var formSchemaEditorContainer = $("
", {id: "form_schema_editor"}); + $(".form-group.form_schema").before(formSchemaEditorContainer); + var formSchemaEditor = ace.edit("form_schema_editor"); + formSchemaEditor.getSession().setValue($("#form_schema").val()); + + var permissionsEditorContainer = $("
", {id: "permissions_editor"}); + $(".form-group.permissions").before(permissionsEditorContainer); + var permissionsEditor = ace.edit("permissions_editor"); + permissionsEditor.getSession().setValue($("#permissions").val()); + + + $('.js-form-save').on('click', function(e){ + e.preventDefault(); + + var $node_type_form = $('#node-type-form'); + var url = $node_type_form.attr('action'); + + // Update the hidden textareas by reading content of the editor + // before serializing the form + $("#dyn_schema").val(dynSchemaEditor.getSession().getValue()); + $("#form_schema").val(formSchemaEditor.getSession().getValue()); + $("#permissions").val(permissionsEditor.getSession().getValue()); + + var data = $node_type_form.serialize(); + + $.post(url, data, function(datata) { + }) + .done(function(){ + toastr.success("Node Type: {{ node_type['name'] | undertitle }}", "Saved") + }) + .fail(function(){ + toastr.error("Node Type: {{ node_type['name'] | undertitle }}", "Could not save") + }); + }); + }); diff --git a/src/templates/projects/edit_node_types.pug b/src/templates/projects/edit_node_types.pug index d0c07794..eaedbe56 100644 --- a/src/templates/projects/edit_node_types.pug +++ b/src/templates/projects/edit_node_types.pug @@ -10,22 +10,49 @@ span#project-edit-title | {% 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). + .row + .col-md-9 + 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 to be properly displayed. + .row + .col-md-4.col-sm-6 + h3 Node Types + + | {% if current_user.has_cap('edit-project-node-types') %} + ul.list-generic + | {% for node_type in project.node_types %} + li + a.js-item-open( + href="{{ url_for('projects.edit_node_type', project_url=project.url, node_type_name=node_type.name) }}", + data-url="{{ url_for('projects.edit_node_type', project_url=project.url, node_type_name=node_type.name) }}") + | {{ node_type.name | undertitle }} + .actions + span {{ node_type.name }} + | {% endfor %} + | {% endif %} + + .col-md-8.col-sm-6 + #node-edit-embed - | {% if current_user.has_cap('edit-project-node-types') %} - ul.list-generic - | {% 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 | undertitle }} - .actions - span {{ node_type.name }} - | {% endfor %} - | {% endif %} | {% endblock %} + +| {% block footer_scripts %} +script(src="//cdn.jsdelivr.net/g/ace@1.2.3(noconflict/ace.js+noconflict/mode-json.js)") +script. + + $('.js-item-open').on('click', function(e){ + e.preventDefault(); + + var item_url = $(this).data('url'); + + $.get(item_url, function(item_data) { + $('#node-edit-embed').html(item_data); + }) + .fail(function(xhr){ + toastr.error('Failed to open
' + xhr); + }); + }); + +| {% endblock footer_scripts %}