Commit b70602db authored by Michael Henretty's avatar Michael Henretty

Merge branch 'master' of github.com:mozilla/voice-web into activate

parents 25bde127 65c4ed4e
......@@ -646,6 +646,39 @@ header.active {
background: none;
}
#install-app {
position: fixed;
bottom: 0;
left: 0; right: 0;
background-color: rgba(61, 254, 253, 0.9);
height: 3rem;
line-height: 3rem;
vertical-align: middle;
cursor: pointer;
text-align: center;
color: white;
font-weight: bold;
z-index: var(--top-z-index);
transform: translateY(3rem);
transition: transform 0.2s linear;
}
@media (max-width: 600px) {
.safari #install-app {
transform: translateY(0);
}
.safari #install-app.hide {
transform: translateY(3rem);
}
}
#install-app a {
position: absolute;
right: 0;
height: 100%;
width: 3rem;
color: white;
}
/**
* We have two different page transition types:
......
......@@ -2,7 +2,7 @@ import { h, render } from 'preact';
import User from './user';
import API from './api';
import Pages from './components/pages';
import { isFocus, isNativeIOS } from './utility';
import { isSafari, isFocus, isNativeIOS } from './utility';
import DebugBox from './components/debug-box';
const LOAD_DELAY = 500; // before pulling the curtain
......@@ -54,6 +54,10 @@ export default class App {
document.body.classList.add('focus');
}
if (isSafari()) {
document.body.classList.add('safari');
}
this.user = new User();
this.api = new API(this.user);
this.loaded = false;
......
import { h, Component } from 'preact';
import { getItunesURL } from '../utility';
import Logo from './logo';
import Icon from './icon';
import PrivacyContent from './privacy-content';
......@@ -83,6 +84,18 @@ export default class Pages extends Component<PagesProps, PagesState> {
this.renderUser = this.renderUser.bind(this);
this.linkNavigate = this.linkNavigate.bind(this);
this.clearRobot = this.clearRobot.bind(this);
this.openInApp = this.openInApp.bind(this);
this.closeOpenInApp = this.closeOpenInApp.bind(this);
}
private openInApp() {
window.location.href = getItunesURL();
}
private closeOpenInApp(evt) {
evt.stopPropagation();
evt.preventDefault();
document.getElementById('install-app').classList.add('hide');
}
private getCurrentPageName() {
......@@ -270,6 +283,8 @@ export default class Pages extends Component<PagesProps, PagesState> {
let className = pageName + (this.state.recording ? ' recording' : '');
return <div id="main" className={className}>
<div onClick={this.openInApp} id="install-app">Open in App
<a onClick={this.closeOpenInApp}>X</a></div>
<header className={(this.state.isMenuVisible || this.state.scrolled ?
'active' : '')}>
<Logo navigate={this.props.navigate}/>
......
......@@ -8,7 +8,8 @@ import AudioWeb, { AudioInfo } from './record/audio-web';
import ListenBox from '../listen-box';
import ProgressButton from '../progress-button';
import ERROR_MSG from '../../../error-msg';
import { isFocus, countSyllables, isNativeIOS, generateGUID } from '../../utility';
import { getItunesURL, isFocus, countSyllables, isNativeIOS, generateGUID }
from '../../utility';
import confirm from '../confirm';
const SET_COUNT = 3;
......@@ -243,7 +244,7 @@ export default class RecordPage extends Component<RecordProps, RecordState> {
<Icon type="chrome" />Chrome</a>
</p>
<p><b>iOS</b> users can download our free app:</p>
<a target="_blank" href="https://itunes.apple.com/us/app/project-common-voice-by-mozilla/id1240588326"><img src="/img/appstore.svg" /></a>
<a target="_blank" href={getItunesURL()}><img src="/img/appstore.svg" /></a>
</div>;
}
......
......@@ -42,6 +42,14 @@ export function isFocus(): boolean {
return navigator.userAgent.indexOf('Focus') !== -1;
}
export function isSafari(): boolean {
return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
}
export function isProduction(): boolean {
return window.location.origin === 'https://voice.mozilla.org';
}
export function getItunesURL(): string {
return 'https://itunes.apple.com/us/app/project-common-voice-by-mozilla/id1240588326';
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment