mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-14 10:36:19 +02:00
Code Issues Releases Wiki Activity

eslint fixes

Browse Source
This commit is contained in:
Kushagra Gour
2018-06-17 22:19:44 +05:30
parent d185518911
commit fd4cfe9ec4
15 changed files with 226 additions and 239 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.json
View File

@ -183,6 +183,8 @@
"yoda": ["error", "never"], "yoda": ["error", "never"],
"brace-style": "off", "brace-style": "off",
"lines-around-comment": "off", "lines-around-comment": "off",
"arrow-body-style": "off",
"indent": "off",
"react/sort-comp": "off", "react/sort-comp": "off",
"react/jsx-no-bind": "off" "react/jsx-no-bind": "off"
}, },

2
package.json
View File

@ -7,7 +7,7 @@
"build": "preact build --template src/index.html --no-prerender", "build": "preact build --template src/index.html --no-prerender",
"serve": "preact build && preact serve", "serve": "preact build && preact serve",
"dev": "preact watch --template src/index.html --https --no-prerender", "dev": "preact watch --template src/index.html --https --no-prerender",
"lint": "eslint src/components/*.jsx", "lint": "eslint src/*.js src/components/*.jsx",
"test": "jest ./tests", "test": "jest ./tests",
"precommit": "lint-staged" "precommit": "lint-staged"
}, },

69
src/components/AskToImportModal.jsx
View File

@ -1,39 +1,40 @@
import { h, Component } from 'preact'; import { h } from 'preact';
import Modal from './Modal'; import Modal from './Modal';
export default class AskToImportModal extends Component { export function AskToImportModal({
render() { show,
return ( closeHandler,
<Modal oldSavedCreationsCount,
extraClasses="ask-to-import-modal" dontAskBtnClickHandler,
show={this.props.show} importBtnClickHandler
closeHandler={this.props.closeHandler} }) {
> return (
<h2>Import your creations in your account</h2> <Modal
extraClasses="ask-to-import-modal"
show={show}
closeHandler={closeHandler}
>
<h2>Import your creations in your account</h2>
<div> <div>
<p> <p>
You have <span>{this.props.oldSavedCreationsCount}</span> creations You have <span>{oldSavedCreationsCount}</span> creations saved in your
saved in your local machine. Do you want to import those creations local machine. Do you want to import those creations in your account
in your account so they are more secure and accessible anywhere? so they are more secure and accessible anywhere?
</p> </p>
<p> <p>
It's okay if you don't want to. You can simply logout and access It's okay if you don't want to. You can simply logout and access them
them anytime on this browser. anytime on this browser.
</p> </p>
<div class="flex flex-h-end"> <div class="flex flex-h-end">
<button onClick={this.props.dontAskBtnClickHandler} class="btn"> <button onClick={dontAskBtnClickHandler} class="btn">
Don't ask me again Don't ask me again
</button> </button>
<button <button onClick={importBtnClickHandler} class="btn btn--primary ml-1">
onClick={this.props.importBtnClickHandler} Yes, please import
class="btn btn--primary ml-1" </button>
>
Yes, please import
</button>
</div>
</div> </div>
</Modal> </div>
); </Modal>
} );
} }

1
src/components/CodeMirrorBox.jsx
View File

@ -12,7 +12,6 @@ export default class CodeMirrorBox extends Component {
} }
initEditor() { initEditor() {
const options = this.props.options;
this.cm = CodeMirror.fromTextArea(this.textarea, this.props.options); this.cm = CodeMirror.fromTextArea(this.textarea, this.props.options);
if (this.props.onChange) { if (this.props.onChange) {
this.cm.on('change', this.props.onChange); this.cm.on('change', this.props.onChange);

15
src/components/ContentWrap.jsx
View File

@ -11,6 +11,9 @@ import { deferred } from '../deferred';
import CssSettingsModal from './CssSettingsModal'; import CssSettingsModal from './CssSettingsModal';
const minCodeWrapSize = 33; const minCodeWrapSize = 33;
/* global htmlCodeEl, jsCodeEl, cssCodeEl, logCountEl
*/
export default class ContentWrap extends Component { export default class ContentWrap extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
@ -141,8 +144,8 @@ export default class ContentWrap extends Component {
} else { } else {
// we need to store user script in external JS file to prevent inline-script // we need to store user script in external JS file to prevent inline-script
// CSP from affecting it. // CSP from affecting it.
writeFile('script.js', blobjs, function() { writeFile('script.js', blobjs, () => {
writeFile('preview.html', blob, function() { writeFile('preview.html', blob, () => {
var origin = chrome.i18n.getMessage() var origin = chrome.i18n.getMessage()
? `chrome-extension://${chrome.i18n.getMessage('@@extension_id')}` ? `chrome-extension://${chrome.i18n.getMessage('@@extension_id')}`
: `${location.origin}`; : `${location.origin}`;
@ -150,7 +153,7 @@ export default class ContentWrap extends Component {
if (this.detachedWindow) { if (this.detachedWindow) {
this.detachedWindow.postMessage(src, '*'); this.detachedWindow.postMessage(src, '*');
} else { } else {
frame.src = src; this.frame.src = src;
} }
}); });
}); });
@ -248,9 +251,9 @@ export default class ContentWrap extends Component {
result[1].code || '', result[1].code || '',
result[2].code || '' result[2].code || ''
); );
result.forEach(result => { result.forEach(resultItem => {
if (result.errors) { if (resultItem.errors) {
this.showErrors(result.errors.lang, result.errors.data); this.showErrors(resultItem.errors.lang, resultItem.errors.data);
} }
}); });
}); });

2
src/components/LibraryAutoSuggest.jsx
View File

@ -90,7 +90,7 @@ export class LibraryAutoSuggest extends Component {
onKeyDown(event) { onKeyDown(event) {
var selectedItemElement; var selectedItemElement;
if (!this.isShowingSuggestions) { if (!this.isShowingSuggestions) {
return false; return;
} }
if (event.keyCode === 27) { if (event.keyCode === 27) {

1
src/components/Login.jsx
View File

@ -1,5 +1,4 @@
import { h, Component } from 'preact'; import { h, Component } from 'preact';
import { jsLibs, cssLibs } from '../libraryList';
import { trackEvent } from '../analytics'; import { trackEvent } from '../analytics';
import { auth } from '../auth'; import { auth } from '../auth';

228
src/components/MainHeader.jsx
View File

@ -1,131 +1,123 @@
import { h, Component } from 'preact'; import { h } from 'preact';
import { A } from './common'; import { A } from './common';
const DEFAULT_PROFILE_IMG = const DEFAULT_PROFILE_IMG =
"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='#ccc' d='M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z' /%3E%3C/svg%3E"; "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='#ccc' d='M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z' /%3E%3C/svg%3E";
export default class Header extends Component { export function MainHeader(props) {
render() { return (
return ( <div class="main-header">
<div class="main-header"> <input
<input type="text"
type="text" id="titleInput"
id="titleInput" title="Click to edit"
title="Click to edit" class="item-title-input"
class="item-title-input" value={props.title}
value={this.props.title} onBlur={props.titleInputBlurHandler}
onBlur={this.props.titleInputBlurHandler} />
/> <div class="main-header__btn-wrap flex flex-v-center">
<div class="main-header__btn-wrap flex flex-v-center"> <a
<a id="runBtn"
id="runBtn" class="hide flex flex-v-center hint--rounded hint--bottom-left"
class="hide flex flex-v-center hint--rounded hint--bottom-left" aria-label="Run preview (Ctrl/⌘ + Shift + 5)"
aria-label="Run preview (Ctrl/⌘ + Shift + 5)" onClick={props.runBtnClickHandler}
onClick={this.props.runBtnClickHandler} >
> <svg style="width: 14px; height: 14px;">
<svg style="width: 14px; height: 14px;"> <use xlinkHref="#play-icon" />
<use xlinkHref="#play-icon" /> </svg>Run
</svg>Run </a>
</a>
<A <A
onClick={this.props.addLibraryBtnHandler} onClick={props.addLibraryBtnHandler}
data-event-category="ui" data-event-category="ui"
data-event-action="addLibraryButtonClick" data-event-action="addLibraryButtonClick"
class="flex-v-center hint--rounded hint--bottom-left" class="flex-v-center hint--rounded hint--bottom-left"
aria-label="Add a JS/CSS library" aria-label="Add a JS/CSS library"
>
Add library
<span
id="js-external-lib-count"
style={`display:${props.externalLibCount ? 'inline' : 'none'}`}
class="count-label"
> >
Add library {props.externalLibCount}
<span </span>
id="js-external-lib-count" </A>
style={`display:${
this.props.externalLibCount ? 'inline' : 'none'
}`}
class="count-label"
>
{this.props.externalLibCount}
</span>
</A>
<a <a
class="flex flex-v-center hint--rounded hint--bottom-left" class="flex flex-v-center hint--rounded hint--bottom-left"
aria-label="Start a new creation" aria-label="Start a new creation"
onClick={this.props.newBtnHandler} onClick={props.newBtnHandler}
>
<svg
style="vertical-align:middle;width:14px;height:14px"
viewBox="0 0 24 24"
> >
<svg <path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" />
style="vertical-align:middle;width:14px;height:14px" </svg>New
viewBox="0 0 24 24" </a>
> <a
<path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" /> id="saveBtn"
</svg>New class={`flex flex-v-center hint--rounded hint--bottom-left ${
</a> props.isSaving ? 'is-loading' : ''
<a } ${props.unsavedEditCount ? 'is-marked' : 0}`}
id="saveBtn" aria-label="Save current creation (Ctrl/⌘ + S)"
class={`flex flex-v-center hint--rounded hint--bottom-left ${ onClick={props.saveBtnHandler}
this.props.isSaving ? 'is-loading' : '' >
} ${this.props.unsavedEditCount ? 'is-marked' : 0}`} <svg
aria-label="Save current creation (Ctrl/⌘ + S)" style="vertical-align:middle;width:14px;height:14px"
onClick={this.props.saveBtnHandler} viewBox="0 0 24 24"
> >
<svg <path d="M15,9H5V5H15M12,19A3,3 0 0,1 9,16A3,3 0 0,1 12,13A3,3 0 0,1 15,16A3,3 0 0,1 12,19M17,3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V7L17,3Z" />
style="vertical-align:middle;width:14px;height:14px" </svg>
viewBox="0 0 24 24" <svg class="btn-loader" width="15" height="15" stroke="#fff">
> <use xlinkHref="#loader-icon" />
<path d="M15,9H5V5H15M12,19A3,3 0 0,1 9,16A3,3 0 0,1 12,13A3,3 0 0,1 15,16A3,3 0 0,1 12,19M17,3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V7L17,3Z" /> </svg>
</svg> Save
<svg class="btn-loader" width="15" height="15" stroke="#fff"> </a>
<use xlinkHref="#loader-icon" /> <a
</svg> id="openItemsBtn"
Save class={`flex flex-v-center hint--rounded hint--bottom-left ${
</a> props.isFetchingItems ? 'is-loading' : ''
<a }`}
id="openItemsBtn" aria-label="Open a saved creation (Ctrl/⌘ + O)"
class={`flex flex-v-center hint--rounded hint--bottom-left ${ onClick={props.openBtnHandler}
this.props.isFetchingItems ? 'is-loading' : '' >
}`} <svg
aria-label="Open a saved creation (Ctrl/⌘ + O)" style="width:14px;height:14px;vertical-align:middle;"
onClick={this.props.openBtnHandler} viewBox="0 0 24 24"
> >
<svg <path d="M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z" />
style="width:14px;height:14px;vertical-align:middle;" </svg>
viewBox="0 0 24 24" <svg class="btn-loader" width="15" height="15" stroke="#fff">
> <use xlinkHref="#loader-icon" />
<path d="M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z" /> </svg>
</svg> Open
<svg class="btn-loader" width="15" height="15" stroke="#fff"> </a>
<use xlinkHref="#loader-icon" /> <A
</svg> onClick={props.loginBtnHandler}
Open data-event-category="ui"
</a> data-event-action="loginButtonClick"
<A class="hide-on-login flex flex-v-center hint--rounded hint--bottom-left"
onClick={this.props.loginBtnHandler} aria-label="Login/Signup"
data-event-category="ui" >
data-event-action="loginButtonClick" Login/Signup
class="hide-on-login flex flex-v-center hint--rounded hint--bottom-left" </A>
aria-label="Login/Signup" <A
> onClick={props.profileBtnHandler}
Login/Signup data-event-category="ui"
</A> data-event-action="headerAvatarClick"
<A aria-label="See profile or Logout"
onClick={this.props.profileBtnHandler} class="hide-on-logout hint--rounded hint--bottom-left"
data-event-category="ui" >
data-event-action="headerAvatarClick" <img
aria-label="See profile or Logout" id="headerAvatarImg"
class="hide-on-logout hint--rounded hint--bottom-left" width="20"
> src={props.user ? props.user.photoURL || DEFAULT_PROFILE_IMG : ''}
<img class="main-header__avatar-img"
id="headerAvatarImg" />
width="20" </A>
src={
this.props.user
? this.props.user.photoURL || DEFAULT_PROFILE_IMG
: ''
}
class="main-header__avatar-img"
/>
</A>
</div>
</div> </div>
); </div>
} );
} }

2
src/components/Modal.jsx
View File

@ -19,7 +19,7 @@ export default class Modal extends Component {
} }
} }
componentDidUpdate(prevProps) { componentDidUpdate(prevProps) {
if (this.props.show != prevProps.show) { if (this.props.show !== prevProps.show) {
document.body.classList[this.props.show ? 'add' : 'remove']( document.body.classList[this.props.show ? 'add' : 'remove'](
'overlay-visible' 'overlay-visible'
); );

1
src/components/SavedItemPane.jsx
View File

@ -165,7 +165,6 @@ export default class SavedItemPane extends Component {
searchInputHandler(e) { searchInputHandler(e) {
const text = e.target.value; const text = e.target.value;
let el;
if (!text) { if (!text) {
this.setState({ this.setState({
filteredItems: this.items filteredItems: this.items

2
src/components/SplitPane.jsx
View File

@ -1,6 +1,5 @@
import { h, Component } from 'preact'; import { h, Component } from 'preact';
import Split from 'split.js'; import Split from 'split.js';
import { log } from '../utils';
export class SplitPane extends Component { export class SplitPane extends Component {
// shouldComponentUpdate(nextProps, nextState) { // shouldComponentUpdate(nextProps, nextState) {
@ -34,7 +33,6 @@ export class SplitPane extends Component {
options.onDragStart = this.props.onDragStart; options.onDragStart = this.props.onDragStart;
} }
// log('SIZE UPDATTED', ...options);
this.splitInstance = Split( this.splitInstance = Split(
this.props.children.map(node => '#' + node.attributes.id), this.props.children.map(node => '#' + node.attributes.id),
options options

112
src/components/SupportDeveloperModal.jsx
View File

@ -1,68 +1,62 @@
import { h, Component } from 'preact'; import { h } from 'preact';
import Modal from './Modal'; import Modal from './Modal';
export default class SupportDeveloperModal extends Component { export function SupportDeveloperModal({ show, closeHandler }) {
render() { return (
return ( <Modal extraClasses="pledge-modal" show={show} closeHandler={closeHandler}>
<Modal <div class="tac">
extraClasses="pledge-modal" <h1>Support the Developer</h1>
show={this.props.show} <p>
closeHandler={this.props.closeHandler} Hi,{' '}
>
<div class="tac">
<h1>Support the Developer</h1>
<p>
Hi,{' '}
<a
href="https://kushagragour.in"
target="_blank"
rel="noopener noreferrer"
>
Kushagra
</a>{' '}
here! Web Maker is a free and open-source project. To keep myself
motivated for working on such open-source and free{' '}
<a
href="https://kushagragour.in/lab/"
target="_blank"
rel="noopener noreferrer"
>
side projects
</a>, I am accepting donations. Your pledge, no matter how small,
will act as an appreciation towards my work and keep me going
forward making Web Maker more awesome🔥. So please consider
donating. 🙏🏼 (could be as small as $1/month).
</p>
<div
class="flex flex-h-center"
id="onboardDontShowInTabOptionBtn"
d-click="onDontShowInTabClicked"
>
<a
class="onboard-selection"
href="https://patreon.com/kushagra"
target="_blank"
rel="noopener noreferrer"
aria-label="Make a monthly pledge on Patreon"
>
<img src="patreon.png" height="60" alt="Become a patron image" />
<h3 class="onboard-selection-text">
Make a monthly pledge on Patreon
</h3>
</a>
</div>
<a <a
href="https://www.paypal.me/kushagragour" href="https://kushagragour.in"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
aria-label="Make a one time donation on Paypal"
> >
Or, make a one time donation Kushagra
</a>{' '}
here! Web Maker is a free and open-source project. To keep myself
motivated for working on such open-source and free{' '}
<a
href="https://kushagragour.in/lab/"
target="_blank"
rel="noopener noreferrer"
>
side projects
</a>, I am accepting donations. Your pledge, no matter how small, will
act as an appreciation towards my work and keep me going forward
making Web Maker more awesome🔥. So please consider donating. 🙏🏼
(could be as small as $1/month).
</p>
<div
class="flex flex-h-center"
id="onboardDontShowInTabOptionBtn"
d-click="onDontShowInTabClicked"
>
<a
class="onboard-selection"
href="https://patreon.com/kushagra"
target="_blank"
rel="noopener noreferrer"
aria-label="Make a monthly pledge on Patreon"
>
<img src="patreon.png" height="60" alt="Become a patron image" />
<h3 class="onboard-selection-text">
Make a monthly pledge on Patreon
</h3>
</a> </a>
</div> </div>
</Modal>
); <a
} href="https://www.paypal.me/kushagragour"
target="_blank"
rel="noopener noreferrer"
aria-label="Make a one time donation on Paypal"
>
Or, make a one time donation
</a>
</div>
</Modal>
);
} }

25
src/components/app.jsx
View File

@ -1,6 +1,9 @@
/* global htmlCodeEl, cssCodeEl, jsCodeEl, runBtn
*/
import { h, Component } from 'preact'; import { h, Component } from 'preact';
import MainHeader from './MainHeader.jsx'; import { MainHeader } from './MainHeader.jsx';
import ContentWrap from './ContentWrap.jsx'; import ContentWrap from './ContentWrap.jsx';
import Footer from './Footer.jsx'; import Footer from './Footer.jsx';
import SavedItemPane from './SavedItemPane.jsx'; import SavedItemPane from './SavedItemPane.jsx';
@ -27,10 +30,10 @@ import firebase from 'firebase/app';
import 'firebase/auth'; import 'firebase/auth';
import { Profile } from './Profile'; import { Profile } from './Profile';
import { auth } from '../auth'; import { auth } from '../auth';
import SupportDeveloperModal from './SupportDeveloperModal'; import { SupportDeveloperModal } from './SupportDeveloperModal';
import { KeyboardShortcutsModal } from './KeyboardShortcutsModal'; import { KeyboardShortcutsModal } from './KeyboardShortcutsModal';
import { takeScreenshot } from '../takeScreenshot'; import { takeScreenshot } from '../takeScreenshot';
import AskToImportModal from './AskToImportModal'; import { AskToImportModal } from './AskToImportModal';
import { Alerts } from './Alerts'; import { Alerts } from './Alerts';
import Portal from 'preact-portal'; import Portal from 'preact-portal';
import { HelpModal } from './HelpModal'; import { HelpModal } from './HelpModal';
@ -329,7 +332,6 @@ export default class App extends Component {
this.setState({ this.setState({
savedItems: { ...this.state.savedItems } savedItems: { ...this.state.savedItems }
}); });
var a = 343478798793397;
this.toggleSavedItemsPane(); this.toggleSavedItemsPane();
// HACK: Set overflow after sometime so that the items can animate without getting cropped. // HACK: Set overflow after sometime so that the items can animate without getting cropped.
@ -409,12 +411,11 @@ export default class App extends Component {
this.setState({ isAddLibraryModalOpen: true }); this.setState({ isAddLibraryModalOpen: true });
} }
closeSavedItemsPane() { closeSavedItemsPane() {
document.body.classList[this.state.isSavedItemPaneOpen ? 'add' : 'remove'](
'overlay-visible'
);
this.setState({ this.setState({
isSavedItemPaneOpen: false isSavedItemPaneOpen: false
}); });
document.body.classList.remove('overlay-visible');
if (this.editorWithFocus) { if (this.editorWithFocus) {
this.editorWithFocus.focus(); this.editorWithFocus.focus();
} }
@ -611,8 +612,8 @@ export default class App extends Component {
window.localStorage[LocalStorageKeys.LOGIN_AND_SAVE_MESSAGE_SEEN] = true; window.localStorage[LocalStorageKeys.LOGIN_AND_SAVE_MESSAGE_SEEN] = true;
if (!answer) { if (!answer) {
trackEvent('ui', LocalStorageKeys.LOGIN_AND_SAVE_MESSAGE_SEEN, 'login'); trackEvent('ui', LocalStorageKeys.LOGIN_AND_SAVE_MESSAGE_SEEN, 'login');
closeAllOverlays(); this.closeAllOverlays();
loginModal.classList.add('is-modal-visible'); this.setState({ isLoginModalOpen: true });
return; return;
} }
trackEvent('ui', LocalStorageKeys.LOGIN_AND_SAVE_MESSAGE_SEEN, 'local'); trackEvent('ui', LocalStorageKeys.LOGIN_AND_SAVE_MESSAGE_SEEN, 'local');
@ -817,7 +818,6 @@ export default class App extends Component {
return false; return false;
} }
codepenBtnClickHandler(e) { codepenBtnClickHandler(e) {
debugger;
if (this.state.currentItem.cssMode === CssModes.ACSS) { if (this.state.currentItem.cssMode === CssModes.ACSS) {
alert("Oops! CodePen doesn't supports Atomic CSS currently."); alert("Oops! CodePen doesn't supports Atomic CSS currently.");
e.preventDefault(); e.preventDefault();
@ -888,7 +888,7 @@ export default class App extends Component {
e.preventDefault(); e.preventDefault();
trackEvent('ui', 'exportBtnClicked'); trackEvent('ui', 'exportBtnClicked');
} }
screenshotBtnClickHandler() { screenshotBtnClickHandler(e) {
this.contentWrap.getDemoFrame(frame => { this.contentWrap.getDemoFrame(frame => {
takeScreenshot(frame.getBoundingClientRect()); takeScreenshot(frame.getBoundingClientRect());
}); });
@ -1203,8 +1203,7 @@ export default class App extends Component {
<path d="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z" /> <path d="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z" />
</symbol> </symbol>
<symbol id="loader-icon" viewBox="0 0 44 44"> <symbol id="loader-icon" viewBox="0 0 44 44">
{'{'}/* By Sam Herbert (@sherb), for everyone. More @ {/* By Sam Herbert (@sherb), for everyone. More http://goo.gl/7AJzbL */}
http://goo.gl/7AJzbL */{'}'}
<g fill="none" fillRule="evenodd" strokeWidth={10}> <g fill="none" fillRule="evenodd" strokeWidth={10}>
<circle cx={22} cy={22} r={1}> <circle cx={22} cy={22} r={1}>
<animate <animate

1
src/components/common.jsx
View File

@ -1,5 +1,4 @@
import { h, Component } from 'preact'; import { h, Component } from 'preact';
import { log } from '../utils';
import { trackEvent } from '../analytics'; import { trackEvent } from '../analytics';
class Clickable extends Component { class Clickable extends Component {

2
src/takeScreenshot.js
View File

@ -1,4 +1,5 @@
import { handleDownloadsPermission } from './utils'; import { handleDownloadsPermission } from './utils';
import { trackEvent } from './analytics';
function saveScreenshot(dataURI) { function saveScreenshot(dataURI) {
// convert base64 to raw binary data held in a string // convert base64 to raw binary data held in a string
@ -91,6 +92,7 @@ export function takeScreenshot(boundRect) {
s.textContent = s.textContent =
'[class*="hint"]:after, [class*="hint"]:before { display: none!important; }'; '[class*="hint"]:after, [class*="hint"]:before { display: none!important; }';
document.body.appendChild(s); document.body.appendChild(s);
import { trackEvent } from './analytics';
function onImgLoad(image) { function onImgLoad(image) {
var c = document.createElement('canvas'); var c = document.createElement('canvas');