diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/main/assets/scripts.js | 48 | ||||
-rw-r--r-- | src/main/resources/templates/layouts/default.html | 30 | ||||
-rw-r--r-- | src/main/resources/templates/views/index.html | 4 |
3 files changed, 57 insertions, 25 deletions
diff --git a/src/main/assets/scripts.js b/src/main/assets/scripts.js index 94f79424..2acc5502 100644 --- a/src/main/assets/scripts.js +++ b/src/main/assets/scripts.js @@ -6,6 +6,12 @@ import 'core-js/stable' import { embedLinksToX, embedAll, format } from '../../../vnext/src/utils/embed' import renderIcons from './icon' import svg4everybody from 'svg4everybody' +import { createRoot } from 'react-dom/client' +import { useState, useEffect } from 'react' + +import Message from '../../../vnext/src/ui/Message' +import { VisitorProvider } from '../../../vnext/src/ui/VisitorContext' +import { CookiesProvider } from 'react-cookie' /** * Autosize textarea @@ -590,6 +596,31 @@ function notificationsCheckPermissions(button) { } } +const Feed = () => { + const [messages, setMessages] = useState(/** @type { import('../../../vnext/src/api').Message[]? } */ (null)) + useEffect(() => { + let url = new URL(window.location.href) + fetch(url, { + headers: { + 'Accept': 'application/json' + }, + credentials: 'same-origin' + }) + .then(response => response.json()) + .then(json => { + setMessages(json) + }) + .catch(console.error) + }, []) + return messages ? ( + <> + { + messages.map(message => <Message key={message.mid} data={message} isThread={false} onToggleSubscription={() => {}} /> ) + } + </> + ) : 'Loading...' +} + /******************************************************************************/ function ready(fn) { @@ -601,12 +632,6 @@ function ready(fn) { } ready(() => { - elementClosest(window) - Array.from(document.querySelectorAll('textarea')).forEach((ta) => { - autosize(ta) - }) - svg4everybody() - renderIcons() var insertPMButtons = function(e) { e.target.classList.add('narrowpm') e.target.parentNode.insertAdjacentHTML('afterend', '<input type="submit" class="Button" value="OK"/>') @@ -629,6 +654,10 @@ ready(() => { if (content) { var pageMID = +content.getAttribute('data-mid') if (pageMID > 0) { + embedAll() + Array.from(document.querySelectorAll('textarea')).forEach((ta) => { + autosize(ta) + }) Array.from(document.querySelectorAll('li.msg')).forEach(li => { let showReplyFormBtn = li.querySelector('.a-thread-comment') if (showReplyFormBtn) { @@ -823,7 +852,6 @@ ready(() => { es.close() } }) - embedAll() const button = document.getElementById('notifications_toggle') if (button) { button.addEventListener('click', () => { @@ -831,4 +859,10 @@ ready(() => { }) notificationsCheckPermissions(button) } + let root = document.getElementById('feed') + createRoot(root).render( + <VisitorProvider> + <Feed /> + </VisitorProvider> + ) }) diff --git a/src/main/resources/templates/layouts/default.html b/src/main/resources/templates/layouts/default.html index c3dac5d4..77bdac9b 100644 --- a/src/main/resources/templates/layouts/default.html +++ b/src/main/resources/templates/layouts/default.html @@ -15,24 +15,24 @@ <meta property="fb:app_id" content="130568668304" /> <meta property="fb:pages" content="270127573154958" /> <meta name="viewport" content="width=device-width,initial-scale=1" /> - <meta name="msapplication-config" content="//i.juick.com/browserconfig.xml" /> + <meta name="msapplication-config" content="https://i.juick.com/browserconfig.xml" /> <meta name="msapplication-TileColor" content="#ffffff" /> - <meta name="msapplication-TileImage" content="//i.juick.com/ms-icon-144x144.png" /> + <meta name="msapplication-TileImage" content="https://i.juick.com/ms-icon-144x144.png" /> <meta name="theme-color" content="#ffffff" /> <meta name="apple-mobile-web-app-capable" content="yes" /> - <link rel="apple-touch-icon" sizes="57x57" href="//i.juick.com/apple-icon-57x57.png" /> - <link rel="apple-touch-icon" sizes="60x60" href="//i.juick.com/apple-icon-60x60.png" /> - <link rel="apple-touch-icon" sizes="72x72" href="//i.juick.com/apple-icon-72x72.png" /> - <link rel="apple-touch-icon" sizes="76x76" href="//i.juick.com/apple-icon-76x76.png" /> - <link rel="apple-touch-icon" sizes="114x114" href="//i.juick.com/apple-icon-114x114.png" /> - <link rel="apple-touch-icon" sizes="120x120" href="//i.juick.com/apple-icon-120x120.png" /> - <link rel="apple-touch-icon" sizes="144x144" href="//i.juick.com/apple-icon-144x144.png" /> - <link rel="apple-touch-icon" sizes="152x152" href="//i.juick.com/apple-icon-152x152.png" /> - <link rel="apple-touch-icon" sizes="180x180" href="//i.juick.com/apple-icon-180x180.png" /> - <link rel="icon" type="image/png" sizes="32x32" href="//i.juick.com/favicon-32x32.png" /> - <link rel="icon" type="image/png" sizes="96x96" href="//i.juick.com/favicon-96x96.png" /> - <link rel="icon" type="image/png" sizes="16x16" href="//i.juick.com/favicon-16x16.png" /> - <link rel="manifest" href="//i.juick.com/manifest.json" /> + <link rel="apple-touch-icon" sizes="57x57" href="https://i.juick.com/apple-icon-57x57.png" /> + <link rel="apple-touch-icon" sizes="60x60" href="https://i.juick.com/apple-icon-60x60.png" /> + <link rel="apple-touch-icon" sizes="72x72" href="https://i.juick.com/apple-icon-72x72.png" /> + <link rel="apple-touch-icon" sizes="76x76" href="https://i.juick.com/apple-icon-76x76.png" /> + <link rel="apple-touch-icon" sizes="114x114" href="https://i.juick.com/apple-icon-114x114.png" /> + <link rel="apple-touch-icon" sizes="120x120" href="https://i.juick.com/apple-icon-120x120.png" /> + <link rel="apple-touch-icon" sizes="144x144" href="https://i.juick.com/apple-icon-144x144.png" /> + <link rel="apple-touch-icon" sizes="152x152" href="https://i.juick.com/apple-icon-152x152.png" /> + <link rel="apple-touch-icon" sizes="180x180" href="https://i.juick.com/apple-icon-180x180.png" /> + <link rel="icon" type="image/png" sizes="32x32" href="https://i.juick.com/favicon-32x32.png" /> + <link rel="icon" type="image/png" sizes="96x96" href="https://i.juick.com/favicon-96x96.png" /> + <link rel="icon" type="image/png" sizes="16x16" href="https://i.juick.com/favicon-16x16.png" /> + <link rel="manifest" href="https://i.juick.com/manifest.json" /> </head> <body id="body" {% if visitor.uid > 0 %}data-hash="{{visitor.authHash}}"{% endif %}> diff --git a/src/main/resources/templates/views/index.html b/src/main/resources/templates/views/index.html index e85a3aa1..acb4685a 100644 --- a/src/main/resources/templates/views/index.html +++ b/src/main/resources/templates/views/index.html @@ -4,9 +4,7 @@ {% if noindex %} <!--noindex--> {% endif %} -{% for msg in msgs %} -{% include "views/partial/message" %} -{% endfor %} +<div id="feed">...</div> {% if nextpage | default('') is not empty %} <p class="page"><a href="{{ nextpage | raw }}" rel="prev">{{ i18n("messages","messages.next") }} →</a></p> {% endif %} |