chaas/debshots
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Design overhaul of details page

Browse source
This commit is contained in:
Christoph Haas 2020-10-20 00:22:41 +02:00
parent 986b42145e
commit adb76650da
4 changed files with 90 additions and 107 deletions
Download patch file Download diff file Expand all files Collapse all files

2
app/views/packages/_details_rightbox.slim
View file

@ -1,6 +1,6 @@
// Right-side panel on details page to display further information
// about a package.
.bigpanel.sticky data-sticky=true data-anchor="details"
.bigpanel.sticky data-sticky=true data-anchor="metadata"
// long description
p.subtitle
= fa_icon 'info-circle'

143
app/views/packages/details.slim
View file

@ -3,87 +3,90 @@
= render 'receive_upload'
.packagepage
h1 =@package.name
h1 = @package.name
.grid-x.grid-padding-x.packagepage
#details.small-7.medium-7.cell.packagepage
p.subtitle = @package.description
h2 = @package.description
- if @package.screenshots_pending.length > 0
div.callout.warning
p
' New screenshots have been uploaded for this package.
' They still need to be approved by a moderator before they are publicly visible.
' Please check again later.
.grid-x.grid-margin-x
.small-7.medium-7.cell
/ Left column contains images
- if screenshots_visible_to_user(@package).count > 0
.grid-x.grid-margin-y.grid-margin-x.align-middle
- screenshots_visible_to_user(@package).each_with_index do |screenshot, idx|
/ Display the first screenshot as a large image
- if idx==0
.small-12.medium-12.cell
.margin-bottom-3
- if screenshots_visible_to_user(@package).count > 0
- screenshots_visible_to_user(@package).each do |screenshot|
.listview
.text-center
/a.black.fancybox href =url_for(screenshot.image.variant(resize_to_limit: [800,600])) rel='fancybox-thumb' title=screenshot.caption
/ Fancybox image viewer: http://fancyapps.com/fancybox/3/docs/#usage
/ TODO: de-duplicate
a href =url_for(screenshot.large_watermarked) rel='fancybox-thumb' title=screenshot.caption data-fancybox='gallery' data-caption=screenshot_caption(screenshot)
.image-with-zoom-icon
= image_tag(url_for(screenshot.image), alt: screenshot.caption, class: 'thumbnail')
a href =url_for(screenshot.large_watermarked) rel='fancybox-thumb' title=screenshot.caption data-fancybox='gallery'
.image-with-zoom-icon
= image_tag(url_for(screenshot.image), alt: screenshot.caption)
.magnifying-glass-icon
i.fa.fa-search
/.imgcaption =screenshot_caption(screenshot)
.magnifying-glass-icon
i.fa.fa-search
.imgcaption
- if screenshot.description.present?
= screenshot.description
' ∙
- if screenshot.version.present?
' from version #{screenshot.version} ∙
' #{time_ago_in_words(screenshot.created_at)} ago
// Has the unmoderated screenshot been uploaded by the current user?
- if screenshot_uploaded_by_current_user?(screenshot)
span.label.warning
| Uploaded by you
- unless screenshot.approved
| (but not public yet)
- if user_signed_in? and current_user.is_admin?
.imgcaption
span.label.secondary #{screenshot.adminstatus}
.imgcaption
= screenshot.description
// Show detailed information about the screenshot object when in dev mode
/ - if Rails.env == 'development'
/ p
/ tt
/ = screenshot.inspect
/ Display further screenshots as smaller images
- else
.small-6.medium-6.cell
.margin-bottom-3
a href =url_for(screenshot.large_watermarked) rel='fancybox-thumb' title=screenshot.caption data-fancybox='gallery' data-caption=screenshot_caption(screenshot)
.image-with-zoom-icon
= image_tag(url_for(screenshot.image), alt: screenshot.caption, class: 'thumbnail')
.magnifying-glass-icon
i.fa.fa-search
/.imgcaption =screenshot_caption(screenshot)
.imgcaption
= screenshot.description
// Has the unmoderated screenshot been uploaded by the current user?
- if screenshot_uploaded_by_current_user?(screenshot)
span.label.warning
| Uploaded by you
- unless screenshot.approved
| (but not public yet)
- if user_signed_in? and current_user.is_admin?
.imgcaption
span.label.secondary #{screenshot.adminstatus}
// Is the user an admin?
// TODO: fix dropdowns – do not enforce javascript
- if user_signed_in? and current_user.is_admin?
= render(partial: 'admin_dropdown', locals: {screenshot: screenshot})
// or does the screenshot belong to the user (determined by session cookie)
- elsif user_signed_in? and screenshot.user == current_user
= render(partial: 'user_dropdown', locals: {screenshot: screenshot})
// Show detailed information about the screenshot object when in dev mode
/ - if Rails.env == 'development'
/ p
/ tt
/ = screenshot.inspect
// or is the user not related to the screenshot and the screenshot is public?
// TODO: Move to a seperate page with a form
//- elsif screenshot.approved
// = render(partial: 'report_dropdown', locals: {screenshot: screenshot})
// Is the user an admin?
// TODO: fix dropdowns – do not enforce javascript
/ - if user_signed_in? and current_user.is_admin?
/ = render(partial: 'admin_dropdown', locals: {screenshot: screenshot})
// or does the screenshot belong to the user (determined by session cookie)
/ - elsif user_signed_in? and screenshot.user == current_user
/ = render(partial: 'user_dropdown', locals: {screenshot: screenshot})
- else
.listview
// or is the user not related to the screenshot and the screenshot is public?
// TODO: Move to a seperate page with a form
//- elsif screenshot.approved
// = render(partial: 'report_dropdown', locals: {screenshot: screenshot})
- else
/.listview
img src='/images/dummy/no-screenshots-available.svg' width='100%' style='padding: 0 10%'
// Load reviews from the Ubuntu API through our own (cached) URL.
// Use asynchronous load to keep loading times low if the review
// was not yet cached.
/ #reviews data-package-reviews-url=package_reviews_path(@package.name)
.small-5.medium-5.cell data-sticky-container=true
= render(partial: 'details_rightbox', locals: {pkg: @package})
/ javascript:
/ $( function() {
/ load_reviews()
/ })
#metadata.small-5.medium-5.cell
/ Right column contains metadata about the package.
/ #metadata is the anchor for this sticky container.
= render(partial: 'details_rightbox', locals: {pkg: @package})