Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: add 'Open Web UI' button to the welcome page #769

Merged
merged 4 commits into from
Oct 2, 2019
Merged

feat: add 'Open Web UI' button to the welcome page #769

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
6154fd6
add 'Open Web UI' button to the welcome page
colinfruit Sep 28, 2019
4e1e013
update welcome button css
colinfruit Oct 2, 2019
9e05a45
add webextension/polyfill for brave
colinfruit Oct 2, 2019
69a7ceb
remove unnecessary class
colinfruit Oct 2, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 6 additions & 2 deletions add-on/src/landing-pages/welcome/page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ function createWelcomePage (i18n) {
return function welcomePage (state, emit) {
const isIpfsOnline = state.isIpfsOnline
const peerCount = state.peerCount
const onOpenWebUi = () => emit('openWebUi')

// Set translated title
document.title = i18n.getMessage('page_landingWelcome_title')
Expand All @@ -25,7 +26,7 @@ function createWelcomePage (i18n) {
<div class="flex flex-column flex-row-l">
<div id="left-col" class="min-vh-100 flex flex-column justify-center items-center bg-navy white">
${renderCompanionLogo(i18n, isIpfsOnline)}
${isIpfsOnline ? renderWelcome(i18n, peerCount) : renderInstallSteps(i18n, isIpfsOnline)}
${isIpfsOnline ? renderWelcome(i18n, peerCount, onOpenWebUi) : renderInstallSteps(i18n, isIpfsOnline)}
</div>

<div id="right-col" class="min-vh-100 flex flex-column justify-around items-center">
Expand Down Expand Up @@ -55,7 +56,7 @@ const renderCompanionLogo = (i18n, isIpfsOnline) => {
`
}

const renderWelcome = (i18n, peerCount) => {
const renderWelcome = (i18n, peerCount, onOpenWebUi) => {
const anchorClass = 'white link underline-under hover-aqua'
const copyClass = 'mv0 tc lh-copy f5'
const svgWidth = 80
Expand Down Expand Up @@ -84,6 +85,9 @@ const renderWelcome = (i18n, peerCount) => {
</div>
<p class="${copyClass}">${renderTranslatedSpans('page_landingWelcome_welcome_peers', [peerCount], 'class="aqua fw6"')}</p>
<p class="${copyClass} mb4">${renderTranslatedLinks('page_landingWelcome_welcome_discover', ['https://github.com/ipfs-shipyard/ipfs-companion#features'], `target="_blank" class="${anchorClass}"`)}</p>
<div class="mt4 f5 flex justify-center items-center">
<button class="pv3 ph4 b navy br2 bn bg-white hover-bg-white-90 pointer" onclick=${onOpenWebUi}>${i18n.getMessage('panel_openWebui')}</button>
</div>
</div>
`
}
Expand Down
14 changes: 13 additions & 1 deletion add-on/src/landing-pages/welcome/store.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,38 @@
'use strict'
/* eslint-env browser, webextensions */
const browser = require('webextension-polyfill')

function createWelcomePageStore (i18n, runtime) {
return function welcomePageStore (state, emitter) {
state.isIpfsOnline = null
state.peerCount = null
state.webuiRootUrl = null
let port
emitter.on('DOMContentLoaded', async () => {
emitter.emit('render')
port = runtime.connect({ name: 'browser-action-port' })
port.onMessage.addListener(async (message) => {
if (message.statusUpdate) {
const webuiRootUrl = message.statusUpdate.webuiRootUrl
const peerCount = message.statusUpdate.peerCount
const isIpfsOnline = peerCount > -1
if (isIpfsOnline !== state.isIpfsOnline || peerCount !== state.peerCount) {
if (isIpfsOnline !== state.isIpfsOnline || peerCount !== state.peerCount || webuiRootUrl !== state.webuiRootUrl) {
state.webuiRootUrl = webuiRootUrl
state.isIpfsOnline = isIpfsOnline
state.peerCount = peerCount
emitter.emit('render')
}
}
})
})

emitter.on('openWebUi', async () => {
try {
browser.tabs.create({ url: state.webuiRootUrl })
} catch (error) {
console.error(`Unable Open Web UI due to ${error}`)
}
})
}
}

Expand Down