Tweaks to read-only details on shots and tasks

src/styles/_app_base.sass

@@ -214,6 +214,9 @@ input, input.form-control
 		border-bottom: thin solid $color-background-dark
 		vertical-align: middle
 
+		span.hint
+			color: $color-text-dark-hint
+
 	.table-cell-spacer
 		background-color: $color-background-light
 		width: 6px

src/styles/_tasks.sass

@@ -1,6 +1,6 @@
 .attract-box
 	margin: 10px
-	padding: 0 10px 10px
+	padding: 10px
 	+container-box
 
 	&.with-status
@@ -11,6 +11,7 @@
 		font-size: 1.6em
 	h2.item-name
 		padding-left: 5px
+		margin-top: 10px
 
 	.item-description
 		padding: 10px 5px
@@ -55,27 +56,28 @@
 	.table.item-properties
 		.table-body
 			text-shadow: 1px 1px 0 white
-			// background-color: darken(white, 2%)
 
 			.table-row
 				.table-cell
 					padding: 7px 10px
 					vertical-align: top
 					border: none
+					color: $color-text-dark-primary
 					@include status-color-property(color, '', 'dark')
 
 					&:first-child
-						width: 100px
+						width: 120px
 						text-align: right
 						font-weight: bold
 						padding-right: 10px
 						border-right: thin solid $color-background-dark
-						color: $color-text-dark-primary
-						// background-color: darken(white, 3%)
+						white-space: nowrap
 
 				&.properties-assignees
 					.table-cell span
 						display: block
+				&.properties-status
+					cursor: help
 
 
 #task-add

src/templates/attract/shots/view_shot_embed.jade

@@ -2,7 +2,7 @@
 	form#shot_form(onsubmit="return shot_save('{{shot._id}}', '{{ url_for('attract.shots.perproject.save', project_url=project['url'], shot_id=shot._id) }}')")
 		input(type='hidden',name='_etag',value='{{ shot._etag }}')
 		.input-transparent-group
-			h2(title="Shot names can only be updated from Blender.") {{ shot.name | hide_none }}
+			h2.item-name(title="Shot names can only be updated from Blender.") {{ shot.name | hide_none }}
 			button.copy-to-clipboard.btn.item-id(
 				style="margin-left: auto",
 				name="Copy to Clipboard",
@@ -11,6 +11,7 @@
 				title="Copy ID to clipboard")
 				| ID
 
+		| {% if 'PUT' in shot.allowed_methods %}
 		.input-transparent-group
 			textarea.input-transparent(
 				name="description",
@@ -34,31 +35,61 @@
 		.input-group-separator
 
 		.input-transparent-group
-			| {% if 'PUT' in shot.allowed_methods %}
+
 			button#item-save.btn.btn-default.btn-block(type=submit)
 				i.pi-check
 				|  Save Shot
-			| {% endif %}
+		| {% else %}
+		//- NOTE: read-only versions of the fields above.
+		| {% if shot.description %}
+		p.item-description {{ shot.description | hide_none }}
+		| {% endif %}
+
+		.table.item-properties
+			.table-body
+				.table-row.properties-status.js-help(
+					data-url="{{ url_for('attract.help', project_url=project.url) }}")
+					.table-cell Status
+					.table-cell(class="status-{{ shot.properties.status }}")
+						| {{ shot.properties.status | undertitle }}
+				| {% if shot.properties.notes %}
+				.table-row
+					.table-cell Notes
+					.table-cell
+						| {{ shot.properties.notes | hide_none }}
+				| {% endif %}
+		| {% endif %}
 
 .attract-box
-	dl.dl-horizontal.item-properties
-		dt Last update
-		dd {{ shot._updated | pretty_date }}
-		dt Cut-in
-		dd(title="Frame number of the first visible frame of this shot.")
-			| at frame {{ shot.properties.cut_in_timeline_in_frames }}
-		dt Duration in edit
-		dd(title="Duration of the visible part of this shot.")
-			| {{ shot.properties.duration_in_edit_in_frames }} frames
-		dt Trim start
-		dd(title="How many frames were trimmed off the start of the shot in the edit.")
-			| {{ shot.properties.trim_start_in_frames }} frames
+	.table.item-properties
+		.table-body
+			.table-row
+				.table-cell Last update
+				.table-cell(title="{{ shot._updated }}") {{ shot._updated | pretty_date }}
+			.table-row
+				.table-cell Cut-in
+				.table-cell(title="Frame number of the first visible frame of this shot.")
+					| at frame {{ shot.properties.cut_in_timeline_in_frames }}
+			.table-row
+				.table-cell Trim start
+				.table-cell(title="How many frames were trimmed off the start of the shot in the edit.")
+					| {{ shot.properties.trim_start_in_frames }} frames
+			.table-row
+				.table-cell Duration in edit
+				.table-cell(title="Duration of the visible part of this shot.")
+					| {{ shot.properties.duration_in_edit_in_frames }} frames
 
 #item-view-feed
 	#activities
+	| {% if config.DEBUG %}
+	pre.
+		{{ shot.to_dict() | pprint }}
+	| {% endif %}
 
 script.
 	new Clipboard('.copy-to-clipboard');
 
 	var url = "{{ url_for('.activities', project_url=project.url, shot_id=shot['_id']) }}";
 	load_activities(url);  // from 10_tasks.js
+
+	$('.js-help').openModalUrl('Help', "{{ url_for('attract.help', project_url=project.url) }}");

src/templates/attract/tasks/view_task_embed.jade

@@ -90,16 +90,18 @@
 		| {% if task.description %}
 		p.item-description {{ task.description | hide_none }}
 		| {% endif %}
+
 		.table.item-properties
 			.table-body
 				.table-row
 					.table-cell Task Type
 					.table-cell {{ task.properties.task_type | undertitle }}
-				.table-row
+				.table-row.properties-status.js-help(
+					data-url="{{ url_for('attract.help', project_url=project.url) }}")
 					.table-cell Status
 					.table-cell(class="status-{{ task.properties.status }}")
 						| {{ task.properties.status | undertitle }}
-				| {% if attract_context != 'shot' and task.parent %}
+				| {% if attract_context != 'shot' and task._parent_info %}
 				.table-row
 					.table-cell Shot
 					.table-cell
@@ -111,7 +113,7 @@
 						| {% for u in task.properties.assigned_to['users'] %}
 						span(title="{{ u.username }}") {{ u.full_name }}
 						| {% else %}
-						span Not assigned yet
+						span.hint Not assigned yet
 						| {% endfor %}
 
 		| {% endif %}
@@ -144,3 +146,5 @@ script.
 
 	$('#task-description').attr('rows',breaks + 4);
 	{% endif %}
+
+	$('.js-help').openModalUrl('Help', "{{ url_for('attract.help', project_url=project.url) }}");