diff --git a/src/styles/_project.sass b/src/styles/_project.sass
index 72f797b3..c90a7c0a 100644
--- a/src/styles/_project.sass
+++ b/src/styles/_project.sass
@@ -781,7 +781,7 @@ $node-preview-max-height-lg: 700px
filter: none
-section.node-row
+.node-row
display: flex
width: 100%
flex: row
@@ -799,19 +799,20 @@ section.node-row
background-color: white
position: relative
- &:nth-child(even), &:last-child
+ &:last-child,
+ &:nth-child(even)
border-right: none
&:last-child
border-bottom: none
&.texture-info
- padding: 10px 20px
color: $color-text-dark-secondary
- position: relative
- z-index: 1
+ list-style-type: none
+ margin: 0
+ padding: 10px 20px
- span
+ li
&:not(:first-child)
padding-left: 15px
@@ -820,6 +821,11 @@ section.node-row
top: -1px
right: 2px
+ &.status
+ margin-left: auto
+
+ &.pending
+ color: $color-danger
section.node-preview.texture
overflow: hidden
@@ -935,41 +941,40 @@ section.node-row
text-transform: uppercase
section.node-preview
+ +media-md
+ max-height: $node-preview-max-height-md
+ +media-lg
+ max-height: $node-preview-max-height-lg
+
+ align-items: center
+ background-color: black
+ color: $color-text-light-primary
+ display: flex
+ flex: 1
+ justify-content: center
+ max-height: 500px
+ min-height: 200px
overflow: hidden
iframe
width: 100%
- &.image,
- &.file,
- min-height: 200px
- flex: 1
- max-height: 500px
- background-color: black
- display: flex
- justify-content: center
- align-items: center
+ img
+ display: block
+ max-height: $node-preview-max-height-lg
+ max-width: 100%
+ object-fit: scale-down
- cursor: zoom-in
+ +media-xs
+ width: 100%
+media-md
max-height: $node-preview-max-height-md
+media-lg
max-height: $node-preview-max-height-lg
- img
- display: block
- max-height: $node-preview-max-height-lg
- max-width: 100%
- object-fit: scale-down
-
- +media-xs
- width: 100%
-
- +media-md
- max-height: $node-preview-max-height-md
- +media-lg
- max-height: $node-preview-max-height-lg
+ &.image
+ cursor: zoom-in
&.video
background-color: black
@@ -1040,6 +1045,45 @@ section.node-preview
object-fit: cover
width: 100%
+section.node-preview-forbidden
+ align-items: center
+ background-color: $color-background-nav
+ color: $color-text-light
+ cursor: default
+ display: flex
+ justify-content: center
+ min-height: 400px
+ position: relative
+
+ img
+ height: 130%
+ left: -60px
+ max-width: initial
+ filter: blur(30px)
+ object-fit: cover
+ opacity: .5
+ position: absolute
+ top: -60px
+ width: 130%
+ z-index: 0
+
+ > div
+ font-size: 1.4em
+ position: relative
+ z-index: 1
+
+ span
+ display: block
+
+ a
+ color: $color-text-light
+
+ &.btn
+ border-color: white
+ color: white
+
+ hr
+ opacity: .5
section.node-details-container
background-color: white
@@ -1071,215 +1115,23 @@ section.node-preview.group
width: 100%
max-width: 100%
- .node-title-details
- margin-left: auto
- line-height: 1em
+ .node-details-meta-actions
+ margin-left: auto
- & .date
- display: inline-block
- margin-right: 10px
- color: $color-text-dark-secondary
-
- & .status
- display: inline-block
- font-size: .9em
- text-transform: capitalize
- color: $color-text-dark-primary
- padding: 5px 15px
- border: thin solid $color-text-dark-hint
- border-radius: 3px
- cursor: default
-
- &.group
- .node-details-meta.preview
- .node-details-meta-list
- display: inline-block
-
- > li
- padding: 0 5px
-
- .node-details-meta-actions
- display: inline-block
-
- .btn-browsetoggle
- +button(lighten($color-background-nav, 20%), 3px)
- width: 48px
- text-align: center
- padding: 2px 4px
- i
- font-size: 1.3em
- padding: 0
- margin: 0
+ .btn-browsetoggle
+ +button(lighten($color-background-nav, 20%), 3px)
+ width: 48px
+ text-align: center
+ padding: 2px 4px
+ i
+ font-size: 1.3em
+ padding: 0
+ margin: 0
&.project
.node-details-title
padding: 10px 20px 0 20px
- ul.node-details-meta-list
- display: flex
- align-items: center
-
- list-style-type: none
- margin: 0
- padding: 0
-
- +media-xs
- font-size: .9em
- width: 100%
- max-width: 100%
-
- > li
- margin: 0
- padding: 0
- line-height: 1em
- float: left
-
- & a.btn
- padding: 4px 12px 5px 12px
- margin: 0
-
- &.date
- color: $color-text-dark-secondary
- padding-left: 5px
- margin-left: 5px
-
- &:before
- color: $color-text-dark-secondary
- position: relative
- content: 'ยท'
- left: -10px
- font-weight: 500
-
- span /* (updated x mins ago) */
- color: $color-text-dark-hint
- margin-left: 3px
- font-size: .9em
- text-transform: lowercase
-
- &.author
- color: $color-text-dark-primary
-
- &.status
- margin-right: 10px
- font-size: .9em
- text-transform: capitalize
- color: $color-text-dark-secondary
- font-weight: 300
- padding: 5px 15px
- border: thin solid $color-text-dark-hint
- border-radius: 3px
- cursor: default
-
- &.access
- color: $color-text-dark-primary
- cursor: default
- opacity: .5
- white-space: nowrap
-
- &:hover
- opacity: 1
-
- &.public
- border-color: $color-success
- color: $color-success
- padding: 0
- i
- font-size: 1.2em
- position: relative
- top: 1px
-
- span
- display: inline-block
-
-
- &.type
- text-transform: uppercase
- padding: 0 5px 0 15px
- cursor: default
- font-weight: 400
- color: $color-text-dark-hint
-
- +media-xs
- display: none
-
- /* .blend files are special snowflakes */
- span.blend
- display: inline-block
- padding: 0 35px 0 0
- font-size: 1.2em
- color: $color-text-dark-secondary
-
- &.access+li.node-details-meta-list-item.video.download,
- &.access+.tooltip+li.node-details-meta-list-item.video.download
- margin-left: 10px
-
- &.length
- padding: 0 5px 0 15px
- cursor: default
- font-weight: 400
- color: $color-text-dark-hint
- white-space: nowrap
-
- &.license
- color: $color-text-dark-secondary
-
- i
- color: $color-text-dark-primary
- font-size: 1.4em
- position: relative
- bottom: -2px
- left: -5px
-
- /* Download button */
- &.download
- align-self: flex-end
- padding: 0 0 0 10px
-
- /* Actual button */
- button
- +button($color-primary, 3px)
- position: relative
-
- padding:
- left: 20px
- right: 20px
-
- font-size: .9em
-
- i
- margin-right: 0
-
- /* Tweaks for specific icons */
- i.icon-dropdown-menu
- padding-left: 10px
-
- &.disabled
- border-color: $color-text-dark-hint
- color: $color-text-dark-hint
- +stripes(rgba($color-text-dark-hint, .1), rgba($color-text-dark-hint, .2), -45deg, 28px)
-
- /* Videos have dropdown caret, so paddit 5px less */
- &.video.download
- button
- padding-right: 10px
-
- &.file.download
- button
- +button($color-primary, 3px, true)
- padding:
- left: 15px
- right: 15px
-
- i
- margin-right: 0
-
- &.texture.download
- width: 100%
-
- &.open
- button
- box-shadow: none
-
.node-details-description
+node-details-description
padding-left: 20px
diff --git a/src/templates/nodes/custom/_node_details.pug b/src/templates/nodes/custom/_node_details.pug
deleted file mode 100644
index a4384169..00000000
--- a/src/templates/nodes/custom/_node_details.pug
+++ /dev/null
@@ -1,112 +0,0 @@
-.node-details-meta
- ul
- | {% if node.has_method('PUT') and (node.properties.status != 'published') %}
- li(class="status-{{ node.properties.status }}")
- | {{ node.properties.status | undertitle }}
- | {% endif %}
-
- li(title="Author")
- | {{ node.user.full_name }}
-
- li.dim(
- title="Created {{ node._created }} (updated {{ node._updated | pretty_date_time }})")
- | {{ node._created | pretty_date }}
-
- | {% if node.short_link %}
- li.shared
- a(href="{{ node.short_link }}")
- i.pi-share
- | Shared
- | {% endif %}
-
- li.left-side
-
- | {% if node.file %}
- li.dim(title="File size")
- | {{ node.file.length | filesizeformat }}
- li.dim(title="File format")
- | {{ node.file.content_type }}
- | {% endif %}
-
- | {% if node.permissions.world %}
- li.public(
- data-toggle="tooltip",
- data-placement="bottom",
- title="Anybody can download. Share it!")
- i.pi-lock-open
- span Public
- | {% endif %}
-
- | {% if node.file and (current_user.has_cap('subscriber') or node.permissions.world) %}
- li.download
- | {% if node.properties.content_type == 'video' %}
- | {% if node.file_variations %}
- button.btn.btn-default.dropdown-toggle(
- type="button",
- data-toggle="dropdown",
- aria-haspopup="true",
- aria-expanded="false")
- i.pi-download
- | Download
- i.pi-angle-down.icon-dropdown-menu
-
- ul.dropdown-menu
- | {% for variation in node.file_variations %}
- li
- a(href="{{ variation.link }}",
- title="Download this format",
- download)
- span.length {{ variation.length | filesizeformat }}
-
- span.format {{ variation.format }}
- span.size {{ variation.size }}
-
- | {% endfor %}
- | {% endif %}
- | {% else %}
- li.download
- a(
- title="Download {{ node.properties.content_type | undertitle }}",
- href="{{ node.file.link }}",
- download="{{ node.file.filename }}")
- button.btn(type="button")
- i.pi-download
- | Download
- | {% endif %}
-
- | {% elif current_user.has_cap('can-renew-subscription') %}
- li.download
- a.btn.btn-success(
- title="Renew your subscription to download",
- target="_blank",
- href="/renew")
- i.pi-heart
- | Renew subscription to download
-
- | {% elif current_user.is_authenticated %}
- li.download
- a.btn(
- title="Join Blender Cloud",
- href="{{ url_for('cloud.join') }}")
- i.pi-lock
- | Download
- | {% else %}
- li.download
- a.btn(
- title="Login to download {{ node.properties.content_type | undertitle }}",
- href="{{ url_for('users.login') }}")
- i.pi-lock
- | Download
- | {% endif %}
-
-| {% if node.properties.license_type %}
-a.node-details-license(
- href="https://creativecommons.org/licenses/",
- target="_blank")
- span.type
- i(class="pi-license-{{ node.properties.license_type }}")
- | License {{ node.properties.license_type }}
- | {% if node.properties.license_notes %}
- | — {{ node.properties.license_notes }}
- | {% endif %}
-| {% endif %}
diff --git a/src/templates/nodes/custom/_node_preview_forbidden.pug b/src/templates/nodes/custom/_node_preview_forbidden.pug
new file mode 100644
index 00000000..aa38db55
--- /dev/null
+++ b/src/templates/nodes/custom/_node_preview_forbidden.pug
@@ -0,0 +1,25 @@
+section.node-preview-forbidden
+ | {% if node.picture %}
+ img(src="{{ node.picture.thumbnail('t', api=api) }}")
+ | {% endif %}
+
+ div
+ p Available to Blender Cloud subscribers
+ hr
+ | {% if current_user.has_cap('can-renew-subscription') %}
+ p
+ small You have a subscription, it just needs to be renewed.
+ a.btn(href="/renew")
+ | #[i.pi-heart] Renew Subscription
+ | {% else %}
+ p
+ small Support Blender and get awesome stuff!
+ a.btn(href="{{ url_for('cloud.join') }}")
+ | #[i.pi-heart] Get a Subscription
+ | {% endif %}
+
+ | {% if current_user.is_anonymous %}
+ p
+ small Already a subscriber?
+ a.btn(href="{{ url_for('users.login') }}") Log In
+ | {% endif %}
diff --git a/src/templates/nodes/custom/_scripts.pug b/src/templates/nodes/custom/_scripts.pug
index 8b010ba0..05fbbc76 100644
--- a/src/templates/nodes/custom/_scripts.pug
+++ b/src/templates/nodes/custom/_scripts.pug
@@ -41,7 +41,7 @@ script(type="text/javascript").
{% endif %}
- // If we are im preview mode, update the image source
+ // If we are in preview mode, update the image source
if (page_overlay.classList.contains('active')) {
var node_preview = document.getElementById('node-preview');
@@ -73,7 +73,7 @@ script(type="text/javascript").
.html('
');
}
- $('#node-preview.image, #node-preview.file').click(function(e){
+ $('.js-node-preview-image').click(function(e){
e.preventDefault();
e.stopPropagation();
@@ -138,3 +138,12 @@ script(type="text/javascript").
}
{% endif %}
+
+ var $content_type = $(".js-type");
+ var type_value = $content_type.text();
+ var type_value_trimmed = type_value.substring(type_value.indexOf("/") + 1);
+ $content_type.text(type_value_trimmed);
+
+ if (type_value_trimmed == 'x-blender' || type_value_trimmed == 'blend'){
+ $content_type.html('');
+ };
diff --git a/src/templates/nodes/custom/asset/file/view_embed.pug b/src/templates/nodes/custom/asset/file/view_embed.pug
index b59178b3..3e1b5b87 100644
--- a/src/templates/nodes/custom/asset/file/view_embed.pug
+++ b/src/templates/nodes/custom/asset/file/view_embed.pug
@@ -1,54 +1 @@
-| {% block body %}
-
-#node-container
- #node-overlay
-
- | {% if node.picture %}
- section#node-preview.node-preview.file
- img.node-preview-thumbnail#node-preview-thumbnail(
- src="{{ node.picture.thumbnail('l', api=api) }}")
- | {% endif %}
-
-
- section.node-details-container.file
-
- .node-details-header
- .node-title#node-title
- | {{node.name}}
-
- | {% if node.description %}
- .node-details-description#node-description
- | {{ node | markdowned('description') }}
- | {% endif %}
-
- include ../../_node_details
-
- #comments-embed
- .comments-list-loading
- i.pi-spin
-
-include ../../_scripts
-
-| {% endblock %}
-
-| {% block footer_scripts %}
-script.
- // Generate GA pageview
- ga('send', 'pageview', location.pathname);
-
- var content_type = $("li.node-details-meta-list-item.type").text();
- var type_trimmed = content_type.substring(content_type.indexOf("/") + 1);
-
- if (type_trimmed == 'x-blender' || type_trimmed == 'blend'){
- type_trimmed = '';
- };
-
- $("li.node-details-meta-list-item.type").html(type_trimmed);
-
- $('.sorry').click(function() {
- $.get('/403', function(data) {
- $('#node-overlay').html(data).addClass('active');
- })
- });
-
-| {% endblock %}
+| {% extends "nodes/view_base.html" %}
diff --git a/src/templates/nodes/custom/asset/image/view.pug b/src/templates/nodes/custom/asset/image/view.pug
deleted file mode 100644
index 36bf706b..00000000
--- a/src/templates/nodes/custom/asset/image/view.pug
+++ /dev/null
@@ -1,4 +0,0 @@
-| {% extends 'layout.html' %}
-
-| {% block footer_scripts %}
-| {% endblock %}
diff --git a/src/templates/nodes/custom/asset/image/view_embed.pug b/src/templates/nodes/custom/asset/image/view_embed.pug
index e805e8d7..3e1b5b87 100644
--- a/src/templates/nodes/custom/asset/image/view_embed.pug
+++ b/src/templates/nodes/custom/asset/image/view_embed.pug
@@ -1,48 +1 @@
-| {% block body %}
-
-#node-container
- #node-overlay
-
- | {% if node.picture %}
- section#node-preview.node-preview.image
- img.node-preview-thumbnail#node-preview-thumbnail(
- src="{{ node.picture.thumbnail('l', api=api) }}")
- | {% endif %}
-
-
- section.node-details-container.image
-
- .node-details-header
- .node-title#node-title
- | {{node.name}}
-
- | {% if node.description %}
- .node-details-description#node-description
- | {{ node | markdowned('description') }}
- | {% endif %}
-
- include ../../_node_details
-
- #comments-embed
- .comments-list-loading
- i.pi-spin
-
-include ../../_scripts
-
-| {% endblock %}
-
-| {% block footer_scripts %}
-script.
- // Generate GA pageview
- ga('send', 'pageview', location.pathname);
-
- var content_type = $("li.node-details-meta-list-item.type").text();
- $("li.node-details-meta-list-item.type").text(content_type.substring(content_type.indexOf("/") + 1));
-
- $('.sorry').click(function() {
- $.get('/403', function(data) {
- $('#node-overlay').html(data).addClass('active');
- })
- });
-
-| {% endblock %}
+| {% extends "nodes/view_base.html" %}
diff --git a/src/templates/nodes/custom/asset/video/view.pug b/src/templates/nodes/custom/asset/video/view.pug
deleted file mode 100644
index d13e9d53..00000000
--- a/src/templates/nodes/custom/asset/video/view.pug
+++ /dev/null
@@ -1,6 +0,0 @@
-| {% extends 'layout.html' %}
-| {% from '_macros/_file_uploader_javascript.html' import render_file_uploader_javascript %}
-
-| {% block footer_scripts %}
-| {{render_file_uploader_javascript()}}
-| {% endblock %}
diff --git a/src/templates/nodes/custom/asset/video/view_embed.pug b/src/templates/nodes/custom/asset/video/view_embed.pug
index 368b329c..72cd5a73 100644
--- a/src/templates/nodes/custom/asset/video/view_embed.pug
+++ b/src/templates/nodes/custom/asset/video/view_embed.pug
@@ -1,60 +1,53 @@
-| {% block body %}
+| {% extends "nodes/view_base.html" %}
-#node-container
- #node-overlay
+| {% block node_preview %}
+| {% if node.video_sources %}
+section.node-preview.video
+ video#videoplayer.video-js(
+ controls,
+ data-setup="{}",
+ preload="auto",
+ poster="{% if node.picture %}{{ node.picture.thumbnail('l', api=api) }}{% endif %}")
+ | {% for source in node.video_sources %}
+ source(
+ src="{{ source.src }}",
+ type="{{ source.type }}")
+ | {% endfor %}
+ p.vjs-no-js.
+ To view this video please enable JavaScript, and consider upgrading to a web browser that
+ supports HTML5 video
+| {% else %}
+| {% include 'nodes/custom/_node_preview_forbidden.html' %}
+| {% endif %}
+| {% endblock node_preview %}
- section.node-preview.video
- | {% if node.video_sources %}
- video#videoplayer.video-js(
- controls,
- data-setup="{}",
- preload="auto",
- poster="{% if node.picture %}{{ node.picture.thumbnail('l', api=api) }}{% endif %}")
- | {% for source in node.video_sources %}
- source(
- src="{{ source.src }}",
- type="{{ source.type }}")
- | {% endfor %}
- p.vjs-no-js.
- To view this video please enable JavaScript, and consider upgrading to a web browser that
- supports HTML5 video
- | {% else %}
- .video-dummy.sorry(
- style="{% if node.picture %}background-image: url({{ node.picture.thumbnail('l', api=api) }});{% endif %}")
- .video-dummy-content
- .video-dummy-content-text
- span Available to Blender Cloud subscribers
- span
- small Support Blender and get awesome stuff!
- hr
- | {% if current_user.has_cap('can-renew-subscription') %}
- a.subscribe(href="/renew") You have a subscription, it just needs to be renewed. Renew your subscription now!
- | {% else %}
- a.subscribe(href="{{ url_for('cloud.join') }}") Subscribe to Blender Cloud.
- | {% endif %}
- | {% if current_user.is_anonymous %}
- a(href="{{ url_for('users.login') }}") Already a subscriber? Log in
- | {% endif %}
- | {% endif %}
+| {% block node_download %}
+| {% if node.file_variations %}
+button.btn.btn-default.dropdown-toggle(
+ type="button",
+ data-toggle="dropdown",
+ aria-haspopup="true",
+ aria-expanded="false")
+ i.pi-download
+ | Download
+ i.pi-angle-down.icon-dropdown-menu
+
+ul.dropdown-menu
+ | {% for variation in node.file_variations %}
+ li
+ a(href="{{ variation.link }}",
+ title="Download this format",
+ download)
+ span.length {{ variation.length | filesizeformat }}
+
+ span.format {{ variation.format }}
+ span.size {{ variation.size }}
+ | {% endfor %}
+| {% endif %}
+| {% endblock node_download %}
- section.node-details-container.video
-
- .node-details-header
- .node-title#node-title
- | {{node.name}}
-
- | {% if node.description %}
- .node-details-description#node-description
- | {{ node | markdowned('description') }}
- | {% endif %}
-
- include ../../_node_details
-
- #comments-embed
- .comments-list-loading
- i.pi-spin
-
+| {% block node_scripts %}
script(type="text/javascript").
{% if node.video_sources %}
@@ -114,17 +107,6 @@ script(type="text/javascript").
}
};
- {% endif %}
+ {% endif %} // if node.video_sources
- $(function(){
- // Generate GA pageview
- ga('send', 'pageview', location.pathname);
-
- var content_type = $("li.node-details-meta-list-item.type").text();
- $("li.node-details-meta-list-item.type").text(content_type.substring(content_type.indexOf("/") + 1));
-
- });
-
-include ../../_scripts
-
-| {% endblock %}
+| {% endblock node_scripts %}
diff --git a/src/templates/nodes/custom/comment/list_embed_base.pug b/src/templates/nodes/custom/comment/list_embed_base.pug
index 7ffa47d9..e42ca2ba 100644
--- a/src/templates/nodes/custom/comment/list_embed_base.pug
+++ b/src/templates/nodes/custom/comment/list_embed_base.pug
@@ -55,9 +55,9 @@
| Only project members can comment.
| {% elif current_user.has_cap('can-renew-subscription') %}
i.pi-heart
- a(href='/renew', target='_blank') Renew your subscription to join the conversation!
+ | Join the conversation! #[a(href='/renew', target='_blank') Renew your subscription] to comment.
| {% else %}
- | Join the conversations! Subscribe to Blender Cloud now.
+ | Join the conversation! #[a(href="https://store.blender.org/product/membership/") Subscribe to Blender Cloud] to comment.
| {% endif %}
| {% else %}
diff --git a/src/templates/nodes/custom/group/view_embed.pug b/src/templates/nodes/custom/group/view_embed.pug
index 2167293d..e3f9ea55 100644
--- a/src/templates/nodes/custom/group/view_embed.pug
+++ b/src/templates/nodes/custom/group/view_embed.pug
@@ -1,11 +1,11 @@
| {% block body %}
#node-container
- section.node-preview.group
- .node-title#node-title
- | {{node.name}}
+ section.node-details-container
+ .node-details-header
+ .node-title#node-title
+ | {{node.name}}
- .node-details-meta.preview
.node-details-meta-actions
.btn-browsetoggle(
title="Toggle between list/grid view",
@@ -18,6 +18,7 @@
| {{ node | markdowned('description') }}
| {% endif %}
+
section.node-children.group
| {% if children %}
diff --git a/src/templates/nodes/custom/group_hdri/view_embed.pug b/src/templates/nodes/custom/group_hdri/view_embed.pug
index a230f5dc..85df0649 100644
--- a/src/templates/nodes/custom/group_hdri/view_embed.pug
+++ b/src/templates/nodes/custom/group_hdri/view_embed.pug
@@ -4,11 +4,6 @@
.texture-title#node-title
| {{node.name}}
- | {% if node.picture %}
- .texture-backdrop(
- style="background-image: url({{ node.picture.thumbnail('m', api=api) }})")
- | {% endif %}
-
| {% if node.description %}
section.node-row
.node-details-description
diff --git a/src/templates/nodes/custom/group_texture/view_embed.pug b/src/templates/nodes/custom/group_texture/view_embed.pug
index 9254c5a0..6316a746 100644
--- a/src/templates/nodes/custom/group_texture/view_embed.pug
+++ b/src/templates/nodes/custom/group_texture/view_embed.pug
@@ -4,11 +4,6 @@
.texture-title#node-title
| {{node.name}}
- | {% if node.picture %}
- .texture-backdrop(
- style="background-image: url({{ node.picture.thumbnail('m', api=api) }})")
- | {% endif %}
-
| {% if node.description %}
section.node-row
.node-details-description
diff --git a/src/templates/nodes/custom/hdri/view_embed.pug b/src/templates/nodes/custom/hdri/view_embed.pug
index 1adc9b0c..2fc00288 100644
--- a/src/templates/nodes/custom/hdri/view_embed.pug
+++ b/src/templates/nodes/custom/hdri/view_embed.pug
@@ -1,144 +1,62 @@
-| {% block body %}
+| {% extends "nodes/view_base.html" %}
-#node-container.texture
- #node-overlay
- section.node-preview
- | {% if node.picture %}
- iframe(
- id='vrview_window'
- width='100%',
- height='450px',
- scrolling='no',
- frameborder='0',
- allowfullscreen='',
- src="{{url_for('main.vrview', preview=node.picture.thumbnail('l', api=api), image=node.picture.thumbnail('h', api=api), default_yaw=(node.properties.default_yaw or 0))}}")
- | {% endif %}
+| {% block node_preview %}
+| {% if node.picture %}
+iframe(
+id='vrview_window'
+width='100%',
+height='450px',
+scrolling='no',
+frameborder='0',
+allowfullscreen='',
+src="{{url_for('main.vrview', preview=node.picture.thumbnail('l', api=api), image=node.picture.thumbnail('h', api=api), default_yaw=(node.properties.default_yaw or 0))}}")
+| {% else %}
+section.node-preview
+ h3 Missing Preview
+| {% endif %}
+| {% endblock node_preview %}
- section.node-details-container
+| {% block node_details_meta_extra %}
+| {% if write_access %}
+li.node-details-meta-list-item
+ a.btn#copy_yaw(
+ href='javascript:void(0);'
+ title='Copies current yaw of panorama to the clipboard, so you can set it as default yaw.'
+ ) Copy yaw
+| {% endif %}
+| {% endblock node_details_meta_extra %}
- .node-details-header
- .node-title#node-title
- | {{node.name}}
+| {% block node_download %}
+| {% if node.properties.files %}
+button.btn.btn-default.dropdown-toggle(
+ title="Download HDRI",
+ type="button",
+ data-toggle="dropdown",
+ aria-haspopup="true",
+ aria-expanded="false")
+ i.pi-download
+ | Download
+ i.pi-angle-down.icon-dropdown-menu
- .node-details-meta.header
- ul.node-details-meta-list
- | {% if node.permissions.world %}
- li.node-details-meta-list-item.access.public(
- data-toggle="tooltip",
- data-placement="bottom",
- title="Anybody can download. Share it!")
- i.pi-lock-open
- span Public
- | {% endif %}
+ul.dropdown-menu
+ | {% for var in node.properties.files %}
+ li
+ a(href="{{ var.file.link }}",
+ title="Download this HDRi format",
+ download)
+ span.length {{ var.file.length | filesizeformat }}
+ span.format {{ var.file.format | hide_none }}
+ span.size {{ var.resolution }}
- | {% if node.properties.license_type %}
- | {% if node.properties.license_notes %}
- li.node-details-meta-list-item.video.license(
- id="asset-license",
- data-toggle="popover",
- data-placement="left",
- data-trigger="hover",
- data-content="{{ node.properties.license_notes }}",
- title="{{ node.properties.license_type }}")
+ | {% endfor %}
+| {% endif %}
+| {% endblock node_download %}
- i(class="pi-license-{{ node.properties.license_type }}")
- | {% else %}
- li.node-details-meta-list-item.video.license(
- id="asset-license",
- data-toggle="tooltip",
- data-placement="bottom",
- title="{{ node.properties.license_type }}")
- i(class="pi-license-{{ node.properties.license_type }}")
- | {% endif %}
- | {% endif %}
+| {% block node_comments %}{% endblock %}
- | {% if write_access %}
- li.node-details-meta-list-item
- a.btn#copy_yaw(
- href='javascript:void(0);'
- title='Copies current yaw of panorama to the clipboard, so you can set it as default yaw.'
- ) Copy yaw
- | {% endif %}
-
- | {% if node.properties.files %}
- li.btn-group.node-details-meta-list-item.video.download(
- title="Download HDRI")
- button.btn.btn-default.dropdown-toggle(
- type="button",
- data-toggle="dropdown",
- aria-haspopup="true",
- aria-expanded="false")
- i.pi-download
- i.pi-angle-down.icon-dropdown-menu
-
- ul.dropdown-menu
- | {% for var in node.properties.files %}
- li
- a(href="{{ var.file.link }}",
- title="Download this HDRi format",
- download)
- span.length {{ var.file.length | filesizeformat }}
-
- span.format {{ var.file.format | hide_none }}
- span.size {{ var.resolution }}
-
- | {% endfor %}
- | {% else %}
- li.btn-group.node-details-meta-list-item.video.download.disabled(
- title="Download HDRi")
- button.btn.btn-default.sorry(type="button")
- i.pi-lock
- i.pi-download
- | {% endif %}
-
- | {% if node.description %}
- .node-details-description#node-description
- | {{ node | markdowned('description') }}
- | {% endif %}
-
- | {% if node.properties.license_notes %}
- .node-details-meta.license
- | {{ node.properties.license_notes }}
- | {% endif %}
-
- .node-details-meta.footer
- ul.node-details-meta-list
- li.node-details-meta-list-item.status
- | {{ node.properties.status | undertitle }}
-
- li.node-details-meta-list-item.author
- | {{ node.user.full_name }}
-
- li.node-details-meta-list-item.date(title="Created {{ node._created }}")
- | {{ node._created | pretty_date }}
- | {% if (node._created | pretty_date) != (node._updated | pretty_date) %}
- span(title="Updated {{ node._updated }}") (updated {{ node._updated | pretty_date }})
- | {% endif %}
-
-
-include ../_scripts
-
-| {% endblock %}
-
-| {% block footer_scripts %}
+| {% block node_scripts %}
script(src="{{ url_for('static_pillar', filename='assets/js/vendor/clipboard.min.js')}}")
-
script.
- $('#asset-license').popover();
- // Generate GA pageview
- ga('send', 'pageview', location.pathname);
-
-
- $('.sorry').click(function() {
- $.get('/403', function(data) {
- $('#node-overlay').html(data).show().addClass('active');
- })
- });
-
- $('#node-overlay').click(function(){
- $(this).removeClass('active').hide().html();
- });
-
$().ready(function () {
new Clipboard('#copy_yaw', {
text: function(trigger) {
@@ -150,8 +68,7 @@ script.
}
})
.on('success', function(e) {
- $(e.trigger).flashOnce();
+ $(e.trigger).flashOnce();
});
});
-
-| {% endblock %}
+| {% endblock node_scripts %}
diff --git a/src/templates/nodes/custom/storage/index_embed.pug b/src/templates/nodes/custom/storage/index_embed.pug
deleted file mode 100644
index b1615608..00000000
--- a/src/templates/nodes/custom/storage/index_embed.pug
+++ /dev/null
@@ -1,53 +0,0 @@
-| {% block body %}
-
-#node-container
-
- section.node-details-container.storage
-
- .node-details-header
- .node-title
- | {{node.name}}
-
-
- section.node-children.storage
-
- | {% if node.children %}
- | {% for child in node.children %}
-
- a(href="#", data-node_id="{{ node._id }}" data-path="{{ child['path'] }}", title="{{ child['name'] }}", class="item_icon")
- .list-node-children-item
- .list-node-children-item-thumbnail
-
- .list-node-children-item-thumbnail-icon
- | {% if child['content_type'] == 'video' %}
- i.pi-film
- | {% elif child['content_type'] == 'image' %}
- i.pi-image
- | {% elif child['content_type'] == 'file' %}
- i.pi-document
- | {% elif child['content_type'] == 'binary' %}
- i.pi-file-archive
- | {% else %}
- i.pi-folder
- | {% endif %}
-
- .list-node-children-item-name
-
- span {{ child['name'] }}
-
- | {% endfor %}
- | {% endif %}
-
- script.
- $('a.item_icon').click(function(e){
- // When clicking on a node preview, we load its content
- e.preventDefault;
- var nodeId = $(this).data('node_id');
- var path = $(this).data('path');
- displayStorage(nodeId, path);
- // Update tree with current selection
- //$('#project_tree').jstree('select_node', 'n_' + nodeId);
- });
-
-| {% endblock %}
-
diff --git a/src/templates/nodes/custom/storage/view_embed.pug b/src/templates/nodes/custom/storage/view_embed.pug
deleted file mode 100644
index e77efe88..00000000
--- a/src/templates/nodes/custom/storage/view_embed.pug
+++ /dev/null
@@ -1,33 +0,0 @@
-| {% block body %}
-
-#node-container
-
- section.node-details-container.storage
-
- .node-details-header
- .node-title
- | {{node.name}}
-
- //- .node-details-description
- //- | {{node.description}}
-
- .node-details-meta
-
- ul.node-details-meta-list
- li.node-details-meta-list-item.status
- | {{node.status}}
-
- li.node-details-meta-list-item.date(title="Created {{ node._created | pretty_date }}")
- | {{ node._updated | pretty_date }}
-
- li.node-details-meta-list-item.file.length
- | {{ node.length | filesizeformat }}
-
- li.node-details-meta-list-item.file.download
- a(href="{% if node.has_method('GET') %}{{ node.download_link }}{% else %}{{ url_for('users.login') }}{% endif %}")
- button.btn.btn-default(type="button")
- | Download
-
-
-| {% endblock %}
-
diff --git a/src/templates/nodes/custom/texture/view_embed.pug b/src/templates/nodes/custom/texture/view_embed.pug
index 707a3ba1..e6d90184 100644
--- a/src/templates/nodes/custom/texture/view_embed.pug
+++ b/src/templates/nodes/custom/texture/view_embed.pug
@@ -33,24 +33,23 @@
span Public
| {% endif %}
- section.node-row.texture-info
+ ul.node-row.texture-info
| {% if node.properties.files %}
- span.texture-info-files
+ li
i.pi-texture
| {{ node.properties.files|length }} map{% if node.properties.files|length != 1 %}s{% endif %}
| {% endif %}
- span.texture-info-seamless
+
+ li
i.pi-puzzle
| {% if not node.properties.is_tileable %}Not {% endif %}Seamless
- | {% if node.has_method('PUT') %}
+
| {# Display publishing status only to editors #}
- span.texture-info-status
- | {% if node.properties.status == 'published' %}
- i.pi-laugh
- | {% else %}
- i.pi-displeased
- | {% endif %}
- | {{ node.properties.status }}
+ | {% if node.has_method('PUT') %}
+ li.status(
+ class="{{ node.properties.status }}",
+ title="Status")
+ | Status: #[strong {{ node.properties.status | undertitle }}]
| {% endif %}
| {% for f in node.properties.files %}
diff --git a/src/templates/nodes/view_base.pug b/src/templates/nodes/view_base.pug
new file mode 100644
index 00000000..f29be228
--- /dev/null
+++ b/src/templates/nodes/view_base.pug
@@ -0,0 +1,140 @@
+| {% block body %}
+#node-container
+ #node-overlay
+
+ | {% block node_preview %}
+ | {% if node.picture %}
+ | {% if current_user.has_cap('subscriber') %}
+ section#node-preview.node-preview.image.js-node-preview-image
+ img.node-preview-thumbnail#node-preview-thumbnail(
+ src="{{ node.picture.thumbnail('l', api=api) }}")
+ | {% else %}
+ | {% include 'nodes/custom/_node_preview_forbidden.html' %}
+ | {% endif %}
+ | {% endif %}
+ | {% endblock node_preview %}
+
+ | {% block node_details %}
+ section.node-details-container
+
+ | {# NAME #}
+ .node-details-header
+ .node-title#node-title
+ | {{node.name}}
+
+
+ | {# DESCRIPTION #}
+ | {% if node.description %}
+ .node-details-description#node-description
+ | {{ node | markdowned('description') }}
+ | {% endif %}
+
+
+ | {# LICENSE #}
+ | {% if node.properties.license_type %}
+ a.node-details-license(
+ href="https://creativecommons.org/licenses/",
+ target="_blank")
+ span.type
+ i(class="pi-license-{{ node.properties.license_type }}")
+ | License {{ node.properties.license_type }}
+ | {% if node.properties.license_notes %}
+ | — {{ node.properties.license_notes }}
+ | {% endif %}
+ | {% endif %}
+
+
+ | {# DETAILS #}
+ .node-details-meta
+ ul
+ | {% if node.has_method('PUT') and (node.properties.status != 'published') %}
+ li(class="status-{{ node.properties.status }}")
+ | {{ node.properties.status | undertitle }}
+ | {% endif %}
+
+ li(title="Author")
+ | {{ node.user.full_name }}
+
+ li.dim(
+ title="Created {{ node._created }} (updated {{ node._updated | pretty_date_time }})")
+ | {{ node._created | pretty_date }}
+
+ | {% if node.short_link %}
+ li.shared
+ a(href="{{ node.short_link }}")
+ i.pi-share
+ | Shared
+ | {% endif %}
+
+ li.left-side
+
+ | {% if node.file %}
+ li.dim(title="File size")
+ | {{ node.file.length | filesizeformat }}
+ li.dim.js-type(title="File format")
+ | {{ node.file.content_type }}
+ | {% endif %}
+
+ | {% if node.permissions.world %}
+ li.public(
+ data-toggle="tooltip",
+ data-placement="bottom",
+ title="Anybody can download. Share it!")
+ i.pi-lock-open
+ span Public
+ | {% endif %}
+
+ | {% block node_details_meta_extra %}{% endblock %}
+
+ li.download
+ | {% if (current_user.has_cap('subscriber') or node.permissions.world) and (node.file or node.properties.files) %}
+ | {% block node_download %}
+ a(
+ title="Download {{ node.properties.content_type | undertitle }}",
+ href="{{ node.file.link }}",
+ download="{{ node.file.filename }}")
+ button.btn(type="button")
+ i.pi-download
+ | Download
+ | {% endblock node_download %}
+
+ | {% elif current_user.has_cap('can-renew-subscription') %}
+ a.btn.btn-success(
+ title="Renew your subscription to download",
+ target="_blank",
+ href="/renew")
+ i.pi-heart
+ | Renew Subscription
+
+ | {% elif current_user.is_authenticated %}
+ .btn.disabled
+ i.pi-lock
+ | Download
+
+ | {% else %}
+ a.btn(
+ title="Login to download {{ node.properties.content_type | undertitle }}",
+ href="{{ url_for('users.login') }}")
+ i.pi-lock
+ | Download
+ | {% endif %}
+
+ | {% endblock node_details %}
+
+ | {% block node_comments %}
+ #comments-embed
+ .comments-list-loading
+ i.pi-spin
+ | {% endblock node_comments %}
+
+| {% include 'nodes/custom/_scripts.html' %}
+
+| {% endblock %}
+
+
+| {% block node_scripts %}{% endblock %}
+| {% block footer_scripts %}
+script.
+ // Generate analytics pageview
+ ga('send', 'pageview', location.pathname);
+| {% endblock %}
diff --git a/src/templates/projects/view_embed.pug b/src/templates/projects/view_embed.pug
index fddd8e5d..ffa2ac30 100644
--- a/src/templates/projects/view_embed.pug
+++ b/src/templates/projects/view_embed.pug
@@ -22,17 +22,6 @@
| {% endif %}
section.node-details-container.project
-
- | {# Hide for now
- .node-details-header
- .node-title-details
- .date(title="Last updated {{ project._updated | pretty_date }}") {{ project._created | pretty_date }}
-
- | {% if project.status %}
- .status {{project.status}}
- | {% endif %}
- | #}
-
.node-details-title
h1
a(href="{{ url_for( 'projects.view', project_url=project.url) }}") {{ project.name }}