sam_oneal/fx_cast
1
0
Fork 0
mirror of https://github.com/hensm/fx_cast.git synced 2026-06-08 08:39:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Detect and offer platform-specific bridge download

Browse Source
This commit is contained in:
hensm
2019-03-14 15:17:22 +00:00
parent 410d6a267b
commit c8df4f985c
4 changed files with 144 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
docs/index.css
View File

@@ -1,6 +1,6 @@
:root.theme-light {
--page-color: white;
--page-color: var(--white-100);
--text-color-primary: var(--grey-90);
--text-color-secondary: var(--grey-50);
}
@@ -41,14 +41,14 @@ body {
body {
display: flex;
margin: initial;
margin: initial;`
}
.container {
align-items: center;
display: grid;
font-size: 13px;
margin: auto;
margin-top: 10vh;
min-width: 480px;
grid-row-gap: 2rem;
grid-template-areas:
@@ -57,33 +57,27 @@ body {
"download preview"
"footer preview";
grid-template-columns: min-content min-content;
grid-template-rows: min-content min-content min-content min-content;
grid-template-rows: min-content min-content 1fr min-content;
overflow-x: hidden;
padding: 2rem 6rem;
}
.main {
display: contents;
}
.main-header {
.site-header {
align-self: flex-end;
align-items: flex-end;
display: flex;
flex-direction: column;
grid-area: header;
justify-content: flex-end;
}
.main-content {
display: contents;
margin-top: 5rem;
}
.main-title {
.site-header__title {
font-size: 5rem;
font-weight: 400;
margin-bottom: 0.5rem;
}
.main-subtitle {
.site-header__subtitle {
background-color: var(--text-color-secondary);
color: var(--page-color);
font-size: 2.75rem;
@@ -91,6 +85,10 @@ body {
margin-right: -1rem;
}
.site-content {
display: contents;
}
.description {
font-size: 1.75rem;
grid-area: description;
@@ -98,11 +96,11 @@ body {
text-align: right;
width: 45ch;
}
.discription__disclaimer {
.description__disclaimer {
color: var(--text-color-secondary);
font-size: 0.8em;
}
.discription__prerelease {
.description__prerelease {
color: var(--red-50);
font-size: 0.8em;
font-weight: bolder;
@@ -117,34 +115,48 @@ body {
align-items: flex-end;
display: flex;
flex-direction: column;
font-size: 2rem;
grid-area: download;
margin-top: 1rem;
position: relative;
}
.download__ext,
.download__app .app-list__app {
font-size: 0.85em;
.download__app {
font-size: 1.75rem;
margin-bottom: 0.5em;
}
.download__app-other {
margin-top: 1em;
}
.download__app-other > summary {
cursor: pointer;
text-align: right;
margin-bottom: 0.5rem;
}
.app-list {
align-items: center;
column-gap: 1rem;
display: grid;
grid-template-columns: min-content min-content min-content min-content;
grid-template-rows: min-content min-content;
margin-top: 1rem;
row-gap: 0.5rem;
align-items: flex-start;
display: flex;
}
.app-list > *:not(:first-child) {
margin-left: 1rem;
}
.app-list__platform {
display: flex;
flex-direction: column;
}
.app-list__app {
cursor: pointer;
}
.app-list__label {
color: var(--text-color-secondary);
font-size: 1.75rem;
.app-list__platform > .app-list__app + .app-list__app {
margin-top: 0.5rem;
}
.app-list__app-label {
@@ -156,7 +168,7 @@ body {
}
.app-list__rpm {
grid-column-start: 4;
grid-column-start: 3;
}
@@ -182,8 +194,9 @@ body {
align-self: flex-start;
grid-row-start: 2;
margin-left: -60px;
width: 462px;
position: relative;
top: calc(-30px + 1rem);
width: 462px;
}
.footer {

69
docs/index.html
View File

@@ -12,37 +12,38 @@
</head>
<body>
<div class="container">
<div class="main">
<header class="main-header">
<h1 class="main-title">fx_cast</h1>
<h2 class="main-subtitle">chromecast for firefox</h2>
</header>
<main class="main-content">
<section class="description">
<p>
Enables Chromecast support for casting web apps (like Netflix or BBC iPlayer), HTML5 video and screen/tab sharing.
</p>
<p class="discription__disclaimer">
Requires a native bridge app to connect with receiver devices. Currently supported on Windows, macOS and Linux.
</p>
<p class="discription__prerelease">
No full public release yet! Pre-release beta version is incomplete and likely buggy.
</p>
</section>
<section class="download">
<a class="download__ext btn btn--puffy btn--primary" disabled title="No available download found">
<img class="btn__icon" src="icons/extension_light.svg" alt="">
Firefox Extension
</a>
<div class="download__app">
<div class="app-list">
<div class="app-list__label">Bridge:</div>
<a class="app-list__app app-list__win btn btn--puffy" disabled title="No available download found">
Windows
</a>
<a class="app-list__app app-list__mac btn btn--puffy" disabled title="No available download found">
macOS
</a>
<header class="site-header">
<h1 class="site-header__title">fx_cast</h1>
<h2 class="site-header__subtitle">chromecast for firefox</h2>
</header>
<main class="site-content">
<section class="description">
<p>
Enables Chromecast support for casting web apps (like Netflix or BBC iPlayer), HTML5 video and screen/tab sharing.
</p>
<p class="description__disclaimer">
Requires a native bridge app to connect with receiver devices. Currently supported on Windows, macOS and Linux.
</p>
<p class="description__prerelease">
No full public release yet! Pre-release beta version is incomplete and likely buggy.
</p>
</section>
<section class="download">
<a class="download__ext btn btn--puffy btn--primary" disabled title="No available download found">
<img class="btn__icon" src="icons/extension_light.svg" alt="">
Firefox Extension
</a>
<a class="download__app btn btn--puffy" disabled title="No available download found"></a>
<details class="download__app-other">
<summary>Other bridge downloads</summary>
<div class="app-list">
<a class="app-list__app app-list__win btn btn--puffy" disabled title="No available download found">
Windows
</a>
<a class="app-list__app app-list__mac btn btn--puffy" disabled title="No available download found">
macOS
</a>
<div class="app-list__platform app-list__platform--linux">
<a class="app-list__app app-list__deb btn btn--puffy" disabled title="No available download found">
Linux
<span class="app-list__app-label">deb</span>
@@ -53,9 +54,9 @@
</a>
</div>
</div>
</section>
</main>
</div>
</details>
</section>
</main>
<img class="preview preview--bg"
alt="Screenshot preview, background"

70
docs/index.js
View File

@@ -1,5 +1,47 @@
"use strict";
const downloadAppBtn = document.querySelector(".download__app");
const downloadAppOther = document.querySelector(".download__app-other");
const downloadAppOtherSummary = downloadAppOther.querySelector(":scope > summary");
// Ext download button
const downloadExtBtn = document.querySelector(".download__ext");
// App download buttons
const appListWinBtn = document.querySelector(".app-list__win");
const appListMacBtn = document.querySelector(".app-list__mac");
const appListDebBtn = document.querySelector(".app-list__deb");
const appListRpmBtn = document.querySelector(".app-list__rpm");
let platform;
switch (navigator.platform) {
case "Win32":
case "Win64":
platform = "win";
downloadAppBtn.textContent = "Windows Bridge";
appListWinBtn.hidden = true;
break;
case "MacIntel":
platform = "mac";
downloadAppBtn.textContent = "macOS Bridge";
appListMacBtn.hidden = true;
break;
default:
/**
* Hide default download button and display other downloads
* without details summary.
*/
downloadAppBtn.remove();
downloadAppOther.open = true;
downloadAppOtherSummary.hidden = true;
}
const ENDPOINT_URL = "https://api.github.com/repos/hensm/fx_cast/releases/latest";
fetch(ENDPOINT_URL)
@@ -11,16 +53,6 @@ function onResponse (res) {
for (const asset of res.assets) {
const { browser_download_url } = asset;
// Ext download button
const downloadExtBtn = document.querySelector(".download__ext");
// App download buttons
const appListWinBtn = document.querySelector(".app-list__win");
const appListMacBtn = document.querySelector(".app-list__mac");
const appListDebBtn = document.querySelector(".app-list__deb");
const appListRpmBtn = document.querySelector(".app-list__rpm");
switch (asset.name.match(/.*\.(.*)$/).pop()) {
case "xpi":
downloadExtBtn.href = browser_download_url;
@@ -50,6 +82,24 @@ function onResponse (res) {
break;
}
}
if (platform) {
switch (platform) {
case "win":
downloadAppBtn.href = appListWinBtn.href;
break;
case "mac":
downloadAppBtn.href = appListMacBtn.href;
break;
default: {
return;
}
}
downloadAppBtn.removeAttribute("disabled");
downloadAppBtn.removeAttribute("title");
}
}
function onError (err) {

5
docs/photon.css
View File

@@ -44,7 +44,6 @@ select.btn:-moz-focusring {
background-color: var(--btn-bg);
border-radius: 2px;
color: var(--btn-color);
display: inline-flex;
font-size: 13px;
font-weight: 400;
height: var(--btn-height);
@@ -52,6 +51,10 @@ select.btn:-moz-focusring {
padding: 0 var(--btn-padding);
}
.btn:not([hidden]) {
display: inline-flex;
}
.btn--primary {
--btn-bg: var(--blue-60);
--btn-bg-hover: var(--blue-70);