app/templates/components/dashboard/quick-update/item.hbs
<div class="quick-update-media-wrapper" data-entry-id={{entry.id}}>
{{#unless entry.isDeleted}}
<div class="overlay-panel">
{{! Update actions }}
<div class="quick-update-actions">
<div class="action-wrapper">
{{#unless isCompleted}}
<div class="quick-update--input-wrapper">
{{!-- @TODO: Editor Modal
<a href="#" class="pop-out hint--left hint--bounce hint--rounded" aria-label={{t "dashboard.quick-update.overlay.popout"}}>
<svg viewBox="0 0 50 50">
<path style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" d="M 3 8 C 2.735 8 2.4799687 8.1059688 2.2929688 8.2929688 C 2.1049688 8.4799688 2 8.735 2 9 L 2 26.267578 C 2.294 26.096578 2.636 26 3 26 L 4 26 L 4 10 L 46 10 L 46 44 L 30 44 L 30 45 C 30 45.364 29.903422 45.706 29.732422 46 L 47 46 C 47.265 46 47.520031 45.895031 47.707031 45.707031 C 47.895031 45.520031 48 45.265 48 45 L 48 9 C 48 8.735 47.895031 8.4809688 47.707031 8.2929688 C 47.520031 8.1049688 47.265 8 47 8 L 3 8 z M 36 13 A 1.0001 1.0001 0 1 0 36 15 L 39.585938 15 L 29.292969 25.292969 A 1.0001 1.0001 0 1 0 30.707031 26.707031 L 41 16.414062 L 41 20 A 1.0001 1.0001 0 1 0 43 20 L 43 13 L 36 13 z M 3 28 A 1.0001 1.0001 0 0 0 2 29 L 2 45 A 1.0001 1.0001 0 0 0 3 46 L 27 46 A 1.0001 1.0001 0 0 0 28 45 L 28 29 A 1.0001 1.0001 0 0 0 27 28 L 3 28 z" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible"></path>
</svg>
</a>
--}}
{{one-way-textarea updatePostText
update=(action (mut updatePostText))
placeholder=(t "dashboard.quick-update.overlay.editor.placeholder"
type=entry.media.modelType
number=nextProgress)
}}
</div>
<div class="update-actions">
<a href={{href-to (concat entry.media.modelType ".show." (if (eq entry.media.modelType "anime") "episodes" "chapters") ".show") entry.media.slug nextProgress}}>
{{t "dashboard.quick-update.overlay.discussion"}}
</a>
<button class="button button--primary button--quick-update hint--left hint--medium hint--bounce hint--rounded" aria-label={{t buttonTooltipText}} onclick={{perform updateEntryTask}}>
{{#if updateEntryTask.isRunning}}
{{loading-spinner}}
{{else if canComplete}}
{{t "dashboard.quick-update.overlay.button.complete"}}
{{else}}
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26">
<path d="M13,0.188C5.924,0.188,0.188,5.924,0.188,13S5.924,25.813,13,25.813S25.813,20.076,25.813,13 S20.076,0.188,13,0.188z M19.736,9.035l-6.871,10.132c-0.206,0.303-0.528,0.504-0.848,0.504s-0.675-0.175-0.9-0.399l-4.032-4.033 c-0.274-0.275-0.274-0.722,0-0.996l0.996-0.998c0.274-0.272,0.722-0.272,0.995,0l2.623,2.623l5.705-8.414 c0.217-0.32,0.657-0.403,0.979-0.187l1.166,0.791C19.869,8.275,19.953,8.715,19.736,9.035z"></path>
</svg>
{{t "dashboard.quick-update.overlay.button.update" type=entry.media.modelType number=nextProgress}}
{{/if}}
</button>
<a href="#" class="quick-update--modal hint--left hint--bounce hint--rounded" aria-label={{t "dashboard.quick-update.overlay.edit"}} {{action (toggle "showLibraryEditModal" this)}}>
<svg width="26" height="26" viewBox="0 0 26 26">
<path d="M 3 0 C 1.344 0 0 1.343 0 3 L 0 21 C 0 22.656 1.344 24 3 24 L 12.4375 24 L 13 22 L 3 22 C 2.449 22 2 21.551 2 21 L 2 4 L 22 4 L 22 12.4375 C 22.414 12.2345 22.86775 12.125 23.34375 12.125 C 23.56775 12.125 23.786 12.1405 24 12.1875 L 24 3 C 24 1.343 22.656 0 21 0 L 3 0 z M 5 8 L 5 10 L 7 10 L 7 8 L 5 8 z M 9 8 L 9 10 L 19 10 L 19 8 L 9 8 z M 5 12 L 5 14 L 7 14 L 7 12 L 5 12 z M 9 12 L 9 14 L 19 14 L 19 12 L 9 12 z M 23.28125 14.09375 C 23.008375 14.09225 22.73775 14.19875 22.53125 14.40625 L 21.3125 15.625 L 24.34375 18.6875 L 25.5625 17.4375 C 25.9775 17.0225 25.9815 16.3575 25.5625 15.9375 L 24.0625 14.40625 C 23.8535 14.19575 23.554125 14.09525 23.28125 14.09375 z M 5 16 L 5 18 L 7 18 L 7 16 L 5 16 z M 9 16 L 9 18 L 16.09375 18 L 18.09375 16 L 9 16 z M 20.28125 16.59375 L 15.34375 21.5 C 15.27675 21.555 15.2135 21.62875 15.1875 21.71875 L 14.125 25.34375 C 14.078 25.50075 14.135 25.66525 14.25 25.78125 C 14.336 25.86625 14.4455 25.90625 14.5625 25.90625 C 14.6045 25.90625 14.6465 25.888 14.6875 25.875 L 18.28125 24.8125 C 18.36525 24.7885 18.445 24.7495 18.5 24.6875 L 23.4375 19.78125 L 20.28125 16.59375 z M 16 22.15625 L 17.53125 22.46875 L 17.84375 24.03125 L 15.8125 24.625 L 15.40625 24.1875 L 16 22.15625 z"></path>
</svg>
</a>
</div>
{{else}}
{{! Rating }}
<div class="quick-update--rate">
{{library-entry/state
libraryEntry=entry
media=entry.media
showHeader=false
hideProgress=true
hideRemove=true
}}
</div>
{{/unless}}
</div>
</div>
</div>
{{! Media information }}
<div class="quick-update-title-block row">
<div class="poster-thumb">
{{lazy-image src=(image entry.media.posterImage "medium")}}
</div>
<div class="title-info col-sm">
<h6 class="series-title">
<a class="update--entry-title" href={{href-to (concat entry.media.modelType ".show") entry.media.slug}}>
{{entry.media.computedTitle}}
</a>
<small>
{{capitalize entry.media.modelType}}
{{#if entry.media.year}}
· {{entry.media.year}}
{{/if}}
</small>
</h6>
<div class="series-progress">
{{! Progress }}
{{#if entry.media.unitCount}}
<div class="progress">
<span class="progress-bar">
<span role="presentation" class="progress-completed" style={{completedPercent}}></span>
</span>
</div>
{{/if}}
<span class="progress-units">
{{unitText}}
</span>
</div>
</div>
</div>
{{! Media Poster }}
<div class="quick-update-poster">
<div class="poster-overlay"></div>
{{lazy-image src=(image mediaPosterURL "medium")}}
</div>
{{/unless}}
</div>
{{! Modals }}
{{#if showLibraryEditModal}}
{{to-elsewhere named="modal" send=(component "modals/library-edit"
libraryEntry=entry
saveEntry=updateEntry
removeEntry=removeEntry
onClose=(toggle-action "showLibraryEditModal" this)
)}}
{{/if}}