Development

This commit is contained in:
Jonatan Nilsson 2022-07-26 02:55:37 +00:00
parent ebd3cd4d26
commit 0cbb96f23c
5 changed files with 74 additions and 43 deletions

21
api/article/util.mjs Normal file
View file

@ -0,0 +1,21 @@
export function parseArticles(articles) {
for (let i = 0; i < articles.length; i++) {
parseArticle(articles[i])
}
return articles
}
export function parseArticle(article) {
if (!article) {
return null
}
if (article.banner_path) {
article.banner_path = 'https://cdn.nfp.is' + article.banner_path
article.banner_prefix = 'https://cdn.nfp.is' + article.banner_prefix
}
if (article.media_path) {
article.media_path = 'https://cdn.nfp.is' + article.media_path
article.media_prefix = 'https://cdn.nfp.is' + article.media_prefix
}
return article
}

View file

@ -1,4 +1,5 @@
import { parseFile } from '../file/util.mjs'
import { parseArticle, parseArticles } from '../article/util.mjs'
export async function getTree(ctx) {
let res = await ctx.db.safeCallProc('pages_get_tree', [])
@ -32,9 +33,9 @@ export async function getPage(ctx, path, page = 0, per_page = 10) {
let out = {
page: res.results[0][0] || null,
articles: res.results[1],
articles: parseArticles(res.results[1]),
total_articles: res.results[2][0].total_articles,
featured: res.results[4][0] || null
featured: parseArticle(res.results[4][0]),
}
out.articles.forEach(article => {
article.files = []

View file

@ -74,23 +74,23 @@ const Frontpage = {
view: function(vnode) {
var deviceWidth = window.innerWidth
var bannerPath = ''
var bannerPath = this.data.featured && this.data.featured.banner_prefix
if (this.data.featured && this.data.featured.banner) {
if (bannerPath) {
var pixelRatio = window.devicePixelRatio || 1
if (deviceWidth < 400 && pixelRatio <= 1) {
bannerPath = window.supportsavif
&& this.data.featured.banner.small_url_avif
|| this.data.featured.banner.small_url
} else if ((deviceWidth < 800 && pixelRatio <= 1)
|| (deviceWidth < 600 && pixelRatio > 1)) {
bannerPath = window.supportsavif
&& this.data.featured.banner.medium_url_avif
|| this.data.featured.banner.medium_url
if ((deviceWidth < 720 && pixelRatio <= 1)
|| (deviceWidth < 360 && pixelRatio <= 2)) {
bannerPath += '_small'
} else if ((deviceWidth < 1300 && pixelRatio <= 1)
|| (deviceWidth < 650 && pixelRatio <= 2)) {
bannerPath += '_medium'
} else {
bannerPath = window.supportsavif
&& this.data.featured.banner.large_url_avif
|| this.data.featured.banner.large_url
bannerPath += '_large'
}
if (window.supportsavif) {
bannerPath += '.avif'
} else {
bannerPath += '.jpg'
}
}

View file

@ -37,11 +37,11 @@ const FileUpload = {
}, [
this.preview || media
? vnode.attrs.useimg
? [ m('img', { src: this.preview && this.preview.preview || media.large_url }), m('div.showicon')]
? [ m('img', { src: this.preview && this.preview.preview || media }), m('div.showicon')]
: m('a.display.inside', {
href: this.preview && this.preview.preview || media.large_url,
href: this.preview && this.preview.preview || media,
style: {
'background-image': 'url("' + (this.preview && this.preview.preview || media.large_url) + '")',
'background-image': 'url("' + (this.preview && this.preview.preview || media) + '")',
},
}, m('div.showicon'))
: m('div.inside.showbordericon')

View file

@ -2,32 +2,40 @@ const Fileinfo = require('./fileinfo')
const Newsitem = {
oninit: function(vnode) {
if (vnode.attrs.article.media) {
this.srcsetJpeg = vnode.attrs.article.media.small_url + ' 500w, '
+ vnode.attrs.article.media.medium_url + ' 800w '
if (vnode.attrs.article.media.small_url_avif) {
this.srcsetAvif = vnode.attrs.article.media.small_url_avif + ' 500w, '
+ vnode.attrs.article.media.medium_url_avif + ' 800w '
} else {
this.srcsetAvif = null
}
let article = vnode.attrs.article
if (article.media_prefix) {
this.fallbackImage = article.media_prefix + '_small.jpg'
this.srcsetJpeg = article.media_prefix + '_small.jpg' + ' 720w, '
+ article.media_prefix + '_medium.jpg' + ' 1300w, '
+ article.media_prefix + '_large.jpg'
this.srcsetAvif = article.media_prefix + '_small.avif' + ' 720w, '
+ article.media_prefix + '_medium.avif' + ' 1300w, '
+ article.media_prefix + '_large.avif'
this.coverSizes = '(max-width: 639px) calc(100vw - 40px), '
+ '(max-width: 1000px) 300px, '
+ '400px'
} else {
this.fallbackImage = null
this.srcsetJpeg = null
this.srcsetAvif = null
this.coverSizes = null
}
},
view: function(vnode) {
let article = vnode.attrs.article
return m('newsitem', [
m(m.route.Link,
{ href: '/article/' + vnode.attrs.article.path, class: 'title' },
m('h3', [vnode.attrs.article.name])
{ href: '/article/' + article.path, class: 'title' },
m('h3', [article.name])
),
m('div.newsitemcontent', [
vnode.attrs.article.media
this.fallbackImage
? m(m.route.Link, {
class: 'cover',
href: '/article/' + vnode.attrs.article.path,
href: '/article/' + article.path,
},
m('picture', [
this.srcsetAvif ? m('source', {
@ -38,28 +46,29 @@ const Newsitem = {
m('img', {
srcset: this.srcsetJpeg,
sizes: this.coverSizes,
alt: 'Image for news item ' + vnode.attrs.article.name,
src: vnode.attrs.article.media.small_url }),
alt: 'Image for news item ' + article.name,
src: this.fallbackImage,
}),
])
)
: null,
m('div.entrycontent', {
class: vnode.attrs.article.media ? '' : 'extrapadding',
class: article.media ? '' : 'extrapadding',
}, [
(vnode.attrs.article.content
? m('.fr-view', m.trust(vnode.attrs.article.content))
(article.content
? m('.fr-view', m.trust(article.content))
: null),
(vnode.attrs.article.files && vnode.attrs.article.files.length
? vnode.attrs.article.files.map(function(file) {
(article.files && article.files.length
? article.files.map(function(file) {
return m(Fileinfo, { file: file, trim: true })
})
: null),
m('span.entrymeta', [
'Posted ',
(vnode.attrs.article.page_path ? 'in' : ''),
(vnode.attrs.article.page_path ? m(m.route.Link, { href: '/page/' + vnode.attrs.article.page_path }, vnode.attrs.article.page_name) : null),
'at ' + (vnode.attrs.article.publish_at.replace('T', ' ').split('.')[0]).substr(0, 16),
' by ' + (vnode.attrs.article.admin_name || 'Admin'),
(article.page_path ? 'in' : ''),
(article.page_path ? m(m.route.Link, { href: '/page/' + article.page_path }, article.page_name) : null),
'at ' + (article.publish_at.replace('T', ' ').split('.')[0]).substr(0, 16),
' by ' + (article.admin_name || 'Admin'),
]),
]),
]),