nobigtech
/
fedilove
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added dayjs() + Improvements on meet.item template

This commit is contained in:
Niko 2022-02-15 01:22:23 +01:00
parent 09dd6c4dc1
commit 99423215b1
12 changed files with 58 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
web/data/assets/.gitkeep
View File

1
web/data/assets/js/dayjs/dayjs.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

10
web/data/assets/js/dayjs/dl-dayjs.sh Executable file
View File

@ -0,0 +1,10 @@
#!/bin/bash
# SOURCE: https://github.com/iamkun/dayjs/releases
VERSION=1.10.7
rm -f dayjs.min.js relativeTime.js updateLocale.js
rm -f es.js
wget "https://unpkg.com/dayjs@$VERSION/dayjs.min.js"
wget "https://unpkg.com/dayjs@$VERSION/plugin/relativeTime.js"
wget "https://unpkg.com/dayjs@$VERSION/plugin/updateLocale.js"
wget "https://unpkg.com/dayjs@$VERSION/locale/es.js"

1
web/data/assets/js/dayjs/es.js Normal file
View File

@ -0,0 +1 @@
!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o(require("dayjs")):"function"==typeof define&&define.amd?define(["dayjs"],o):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_locale_es=o(e.dayjs)}(this,(function(e){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=o(e),d={name:"es",monthsShort:"ene_feb_mar_abr_may_jun_jul_ago_sep_oct_nov_dic".split("_"),weekdays:"domingo_lunes_martes_miércoles_jueves_viernes_sábado".split("_"),weekdaysShort:"dom._lun._mar._mié._jue._vie._sáb.".split("_"),weekdaysMin:"do_lu_ma_mi_ju_vi_sá".split("_"),months:"enero_febrero_marzo_abril_mayo_junio_julio_agosto_septiembre_octubre_noviembre_diciembre".split("_"),weekStart:1,formats:{LT:"H:mm",LTS:"H:mm:ss",L:"DD/MM/YYYY",LL:"D [de] MMMM [de] YYYY",LLL:"D [de] MMMM [de] YYYY H:mm",LLLL:"dddd, D [de] MMMM [de] YYYY H:mm"},relativeTime:{future:"en %s",past:"hace %s",s:"unos segundos",m:"un minuto",mm:"%d minutos",h:"una hora",hh:"%d horas",d:"un día",dd:"%d días",M:"un mes",MM:"%d meses",y:"un año",yy:"%d años"},ordinal:function(e){return e+"º"}};return s.default.locale(d,null,!0),d}));

1
web/data/assets/js/dayjs/relativeTime.js Normal file
View File

@ -0,0 +1 @@
!function(r,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(r="undefined"!=typeof globalThis?globalThis:r||self).dayjs_plugin_relativeTime=e()}(this,(function(){"use strict";return function(r,e,t){r=r||{};var n=e.prototype,o={future:"in %s",past:"%s ago",s:"a few seconds",m:"a minute",mm:"%d minutes",h:"an hour",hh:"%d hours",d:"a day",dd:"%d days",M:"a month",MM:"%d months",y:"a year",yy:"%d years"};function i(r,e,t,o){return n.fromToBase(r,e,t,o)}t.en.relativeTime=o,n.fromToBase=function(e,n,i,d,u){for(var f,a,s,l=i.$locale().relativeTime||o,h=r.thresholds||[{l:"s",r:44,d:"second"},{l:"m",r:89},{l:"mm",r:44,d:"minute"},{l:"h",r:89},{l:"hh",r:21,d:"hour"},{l:"d",r:35},{l:"dd",r:25,d:"day"},{l:"M",r:45},{l:"MM",r:10,d:"month"},{l:"y",r:17},{l:"yy",d:"year"}],m=h.length,c=0;c<m;c+=1){var y=h[c];y.d&&(f=d?t(e).diff(i,y.d,!0):i.diff(e,y.d,!0));var p=(r.rounding||Math.round)(Math.abs(f));if(s=f>0,p<=y.r||!y.r){p<=1&&c>0&&(y=h[c-1]);var v=l[y.l];u&&(p=u(""+p)),a="string"==typeof v?v.replace("%d",p):v(p,n,y.l,s);break}}if(n)return a;var M=s?l.future:l.past;return"function"==typeof M?M(a):M.replace("%s",a)},n.to=function(r,e){return i(r,e,this,!0)},n.from=function(r,e){return i(r,e,this)};var d=function(r){return r.$u?t.utc():t()};n.toNow=function(r){return this.to(d(this),r)},n.fromNow=function(r){return this.from(d(this),r)}}}));

1
web/data/assets/js/dayjs/updateLocale.js Normal file
View File

@ -0,0 +1 @@
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_plugin_updateLocale=n()}(this,(function(){"use strict";return function(e,n,t){t.updateLocale=function(e,n){var o=t.Ls[e];if(o)return(n?Object.keys(n):[]).forEach((function(e){o[e]=n[e]})),o}}}));

7
web/src/_templates/app/header.php
View File

@ -4,10 +4,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- TODO: include later
<link rel="manifest" href="/manifest.json">
<script type="application/javascript" src="/js/dayjs.min.js"></script>
<script type="application/javascript" src="/js/relativeTime.js"></script>
<script type="application/javascript" src="/js/updateLocale.js"></script>
-->
<script type="application/javascript" src="/assets/js/dayjs/dayjs.min.js"></script>
<script type="application/javascript" src="/assets/js/dayjs/relativeTime.js"></script>
<script type="application/javascript" src="/assets/js/dayjs/updateLocale.js"></script>
<script type="application/javascript" src="/assets/js/dayjs/es.js"></script>
<link rel="stylesheet" href="/assets/fonts/fork-awesome.min.css">
<?php tpl_styles(['normalize', 'base', 'app']) ?>

29
web/src/app/css/app.css
View File

@ -123,26 +123,39 @@ main {
background: linear-gradient(to right, #00000082, #00000063, #00000063, #00000082);
}
.meet.item .status { color: #fff }
.meet.item .status-content {
padding: 2em 1em;
background: #000000a8;
margin-bottom: 1em;
border-radius: 4px;
padding: 1em;
box-shadow: 0px 0px 1em #0000008c;
margin-bottom: 1em;
}
.meet.item .status-content .text {
margin: 0;
text-align: justify;
font-size: 1.2em;
word-break: break-word;
}
.meet.item .status-content pre {
font-family: inherit !important;
margin: 0 !important;
}
.meet.item .status .profile { padding: 1em 2em; }
.meet.item .status .date {
width: max-content;
float: right;
position: relative;
top: -1em;
left: -1em;
background: #00000057;
padding: .3em .4em .3em .2em;
border-radius: 10px;
border-bottom: 1px solid #ffffff3d;
font-size: .8em;
}
.meet.item .content {
display: grid;
}
.meet.item .status {
padding: 1em;
color: #fff;
}
.item .acct {
font-size: .8em;
opacity: .7;

1
web/src/app/css/base.css
View File

@ -18,6 +18,7 @@ body {
.fixed-top { position: fixed; top: 0 }
.fixed-bottom { position: fixed; bottom: 0 }
.absolute { position: absolute }
.absolute-top { position: absolute; top: 0 }
.absolute-bottom { position: absolute; bottom: 0 }

2
web/src/app/js/app.js
View File

@ -123,6 +123,8 @@ function scriptPageHandler(modname, cfg) {
}
window.onload = function(e) {
dayjs.extend(window.dayjs_plugin_relativeTime);
dayjs.extend(window.dayjs_plugin_updateLocale);
if (getNormalizedURI() === app.vars.app_dir) {
scriptPageHandler('pages.home', { exact: '' });
scriptPageHandler('pages.meet', { exact: 'meet' });

5
web/src/app/js/pages/meet.js
View File

@ -12,14 +12,19 @@ app.pages.meet = {
var tpl = app.template.fill(json[i], app.template.get('meet.item'),
function (k,v) {
if (k === 'account.name') return capitalize(v);
if (k === 'date') return dayjs(parseInt(v)).fromNow(true);
});
var item = json[i];
var icon = app.vars.default_icon;
if (item.account.avatar !== undefined &&
item.account.avatar.length > 0)
icon = item.account.avatar[0].url[0];
var textClr = item.text_color;
if (textClr === undefined)
textClr = '#00000094';
tpl = tpl.replaceAll('{avatar}', htmlescape(icon));
tpl = tpl.replaceAll('{actionsHeight}', '6em');
tpl = tpl.replaceAll('{textColor}', htmlescape(textClr));
dom.innerHTML += tpl;
}
}; _();

15
web/src/app/js/templates/meet/item.html
View File

@ -12,10 +12,17 @@
</div>
<div>
<div class="status fixed-bottom width-max"
style="bottom: {actionsHeight}">
<div style="max-width: 38em; width: 100%;">
<div class="status-content">
<p class="text">{.text}</p>
style="bottom: {actionsHeight}; max-width: 40em">
<div class="flex width-max">
<div class="absolute width-max">
<div class="date">
<i class="fa fa-clock-o fa-fw">
</i>{.date}
</div>
</div>
<div class="status-content center width-max"
style="background: {textColor};">
<div class="text"><pre>{.text}</pre></div>
</div>
</div>
<div class="profile flex">