ayo/cozy
ayo/cozy
1
Fork 0
Code Issues 2 Pull requests 1 Projects Releases Packages Wiki Activity Actions

Merge pull request #59 from ayoayco/feat/home-link

Browse source 
feat: home link
This commit is contained in:
Ayo Ayco 2023-06-19 10:15:01 +02:00 committed by GitHub
commit 361754fbb4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 19 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/components/AddressBar.astro
View file

@ -6,17 +6,19 @@ export interface Props {
}
const { url } = Astro.props;
const placeholder = 'Type the URL of an article here';
const placeholder = 'Type the article URL here';
---
<div class="address-bar">
<form>
<button aria-label="Home" class="left-buttons" type="button" id="app-home" name="app-home" onclick="history.go(-1); return false;" hidden>
<Icon name="ic:outline-arrow-back-ios" />
<button aria-label="Home" class="left-buttons" type="button" id="app-home" name="app-home" onclick="window.location.href='/'; return false;" hidden>
<Icon name="ic:round-library-books" />
</button>
<button aria-label="Back" class="left-buttons" type="button" id="app-back" name="app-back" onclick="history.go(-1); return false;" hidden>
<Icon name="ic:round-arrow-back-ios" />
</button>
<input type="url" id="app-url" name="url" value={url} placeholder={placeholder} required />
<button aria-label="Submit" class="right-buttons" type="submit" id="submit">
<!-- <Icon name="ic:outline-arrow-forward-ios" /> -->
<Icon name="ri:ai-generate" />
</button>
<button aria-label="GitHub" class="right-buttons" type="button" id="gh-link" onclick="window.open('https://github.com/ayoayco/cozy', '_blank');" hidden>
@ -27,16 +29,18 @@ const placeholder = 'Type the URL of an article here';
<script>
const ghLink = document.getElementById('gh-link') as HTMLButtonElement;
const homeBtn = document.getElementById('app-home') as HTMLButtonElement;
const backLink = document.getElementById('app-back') as HTMLButtonElement;
const homeLink = document.getElementById('app-home') as HTMLButtonElement;
const urlInput = document.getElementById('app-url') as HTMLInputElement;
const submitBtn = document.getElementById('submit') as HTMLButtonElement;
// if js is enabled, show the home button and github link
// if js is enabled, show the back button and github link
ghLink.removeAttribute('hidden');
homeBtn.removeAttribute('hidden');
backLink.removeAttribute('hidden');
homeLink.removeAttribute('hidden');
if (urlInput.value === '') {
homeBtn.setAttribute('disabled', 'true');
backLink.setAttribute('disabled', 'true');
submitBtn.setAttribute('disabled', 'true');
}
@ -77,6 +81,7 @@ const placeholder = 'Type the URL of an article here';
}
:global(button#app-home),
:global(button#app-back),
:global(button#submit),
:global(button#gh-link) {
border: 0px;

1
src/components/Library.astro
View file

@ -80,6 +80,7 @@ const {postDivSelector, skipSave = false} = Astro.props;
if (!url) {
url = window.location.href;
isHome = true;
console.log('>>> ishome', isHome);
} else {
// replace scrollPosition
localStorage.setItem('scrollPosition', window.scrollY.toString());

6
src/utils/library.ts
View file

@ -73,7 +73,7 @@ export function renderPost(responseText, url, postDivSelector: string, preventPu
postDiv.innerHTML = newPost.innerHTML
const appUrl = document.getElementById('app-url') as HTMLInputElement;
const cozyUrl = html.querySelector('meta[property="cozy:url"]')?.getAttribute('content');
const homeBtn = document.getElementById('app-home') as HTMLButtonElement;
const backBtn = document.getElementById('app-back') as HTMLButtonElement;
const submitBtn = document.getElementById('submit') as HTMLButtonElement;
@ -82,11 +82,11 @@ export function renderPost(responseText, url, postDivSelector: string, preventPu
if(cozyUrl !== '/') {
appUrl.value = cozyUrl || '';
homeBtn.removeAttribute('disabled');
backBtn.removeAttribute('disabled');
submitBtn.removeAttribute('disabled');
} else {
appUrl.value = '';
homeBtn.setAttribute('disabled', 'true');
backBtn.setAttribute('disabled', 'true');
submitBtn.setAttribute('disabled', 'true');
}