Skip to content

Commit

Permalink
feat(app): Add support for WASI enabled WASM apps
Browse files Browse the repository at this point in the history
  • Loading branch information
FranklinWaller committed Oct 28, 2019
1 parent b3e2db8 commit 81cff64
Show file tree
Hide file tree
Showing 31 changed files with 6,368 additions and 1,712 deletions.
13 changes: 7 additions & 6 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,19 @@
<title>PlayOS</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> -->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<!-- <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> -->
<!-- <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> -->
<!-- <link rel="manifest" href="./manifest.webmanifest"> -->
<!-- <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"> -->
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="./manifest.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="theme-color" content="#ffffff">
<link rel="stylesheet" type="text/css" href="./res/css/xterm.css" media="screen" />
</head>
<body>
<div id="app"></div>
<script src="./index.js" charset="utf-8"></script>
<script src="build/index.js" charset="utf-8"></script>
</body>
</html>
1 change: 0 additions & 1 deletion index.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import './src/scss/index.scss';
import InstanceBag from './src/js/InstanceBag';
import Configuration from './src/js/Configuration';
import packageJson from './package.json';
import web3 from 'web3';

// injectTapEventPlugin();

Expand Down
7,440 changes: 5,841 additions & 1,599 deletions package-lock.json

Large diffs are not rendered by default.

30 changes: 21 additions & 9 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
"build:prod": "cross-env NODE_ENV=production webpack --config ./webpack.config.js",
"docs": "documentation build ./src > ./docs/codebase.md --shallow false --format md --sort-order alpha",
"release": "standard-version",
"start": "parcel index.html",
"start": "cross-env NODE_ENV=development webpack-dev-server --config ./webpack.config.js --open true --port 3000 --inline",
"test": "jest",
"lint": "eslint ./src/ --cache --ignore-pattern .gitignore"
},
Expand All @@ -25,22 +25,27 @@
"@material-ui/icons": "^4.5.1",
"@types/react-loadable": "^5.5.2",
"@types/react-resizable": "^1.7.1",
"@wasmer/wasm-terminal": "^0.3.2",
"@wasmer/wasm-transformer": "^0.3.2",
"babel-polyfill": "^6.26.0",
"classnames": "^2.2.6",
"connected-react-router": "^6.5.2",
"cross-env": "^6.0.3",
"css-loader": "^3.2.0",
"ethers": "^4.0.38",
"inherits": "^2.0.4",
"material-ui": "^0.20.2",
"material-ui-dialogs": "^1.3.0",
"playos-sdk": "^1.8.0",
"postcss-modules": "^1.4.1",
"prop-types": "^15.7.2",
"react": "^16.10.2",
"react": "^16.11.0",
"react-code-input": "^3.8.1",
"react-dom": "^16.10.2",
"react-dom": "^16.11.0",
"react-draggable": "^4.0.3",
"react-loadable": "^5.5.0",
"react-redux": "^7.1.1",
"react-resizable": "^1.8.0",
"react-resizable": "^1.9.0",
"react-rnd": "^10.1.1",
"react-router": "^5.1.2",
"react-router-dom": "^5.1.2",
Expand All @@ -51,8 +56,14 @@
"redux": "^4.0.4",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.3.0",
"sass-loader": "^8.0.0",
"style-loader": "^1.0.0",
"terminal-in-react": "^4.3.1",
"web3": "^1.2.1",
"ts-loader": "^6.2.1",
"web3": "^1.2.2",
"webpack": "^4.41.2",
"webpack-cli": "^3.3.9",
"webpack-dev-server": "^3.9.0",
"whatwg-fetch": "^3.0.0"
},
"devDependencies": {
Expand All @@ -61,14 +72,15 @@
"@babel/preset-env": "7.6.3",
"@babel/preset-react": "7.6.3",
"@types/classnames": "^2.2.9",
"@types/react": "^16.9.9",
"@types/react-dom": "^16.9.2",
"@types/react": "^16.9.11",
"@types/react-dom": "^16.9.3",
"@types/react-redux": "^7.1.5",
"@types/react-router": "^5.1.2",
"@types/react-router-redux": "^5.0.18",
"@types/react-swipeable-views": "^0.13.0",
"@types/web3": "^1.0.20",
"babel-eslint": "10.0.3",
"babel-loader": "^8.0.6",
"documentation": "12.1.2",
"eslint": "6.5.1",
"eslint-config-airbnb": "^18.0.1",
Expand All @@ -78,8 +90,8 @@
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.16.0",
"eslint-summary": "^1.0.0",
"jest": "^24.8.0",
"node-sass": "^4.12.0",
"jest": "^24.9.0",
"node-sass": "^4.13.0",
"standard-version": "^7.0.0",
"typescript": "^3.6.4"
}
Expand Down
171 changes: 171 additions & 0 deletions res/css/xterm.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,171 @@
/**
* Copyright (c) 2014 The xterm.js authors. All rights reserved.
* Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)
* https://github.com/chjj/term.js
* @license MIT
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*
* Originally forked from (with the author's permission):
* Fabrice Bellard's javascript vt100 for jslinux:
* http://bellard.org/jslinux/
* Copyright (c) 2011 Fabrice Bellard
* The original design remains. The terminal itself
* has been extended to include xterm CSI codes, among
* other features.
*/

/**
* Default styles for xterm.js
*/

.xterm {
font-feature-settings: "liga" 0;
position: relative;
user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
}

.xterm.focus,
.xterm:focus {
outline: none;
}

.xterm .xterm-helpers {
position: absolute;
top: 0;
/**
* The z-index of the helpers must be higher than the canvases in order for
* IMEs to appear on top.
*/
z-index: 5;
}

.xterm .xterm-helper-textarea {
/*
* HACK: to fix IE's blinking cursor
* Move textarea out of the screen to the far left, so that the cursor is not visible.
*/
position: absolute;
opacity: 0;
left: -9999em;
top: 0;
width: 0;
height: 0;
z-index: -5;
/** Prevent wrapping so the IME appears against the textarea at the correct position */
white-space: nowrap;
overflow: hidden;
resize: none;
}

.xterm .composition-view {
/* TODO: Composition position got messed up somewhere */
background: #000;
color: #FFF;
display: none;
position: absolute;
white-space: nowrap;
z-index: 1;
}

.xterm .composition-view.active {
display: block;
}

.xterm .xterm-viewport {
/* On OS X this is required in order for the scroll bar to appear fully opaque */
background-color: #000;
overflow-y: scroll;
cursor: default;
position: absolute;
right: 0;
left: 0;
top: 0;
bottom: 0;
}

.xterm .xterm-screen {
position: relative;
}

.xterm .xterm-screen canvas {
position: absolute;
left: 0;
top: 0;
}

.xterm .xterm-scroll-area {
visibility: hidden;
}

.xterm-char-measure-element {
display: inline-block;
visibility: hidden;
position: absolute;
top: 0;
left: -9999em;
line-height: normal;
}

.xterm {
cursor: text;
}

.xterm.enable-mouse-events {
/* When mouse events are enabled (eg. tmux), revert to the standard pointer cursor */
cursor: default;
}

.xterm.xterm-cursor-pointer {
cursor: pointer;
}

.xterm.column-select.focus {
/* Column selection mode */
cursor: crosshair;
}

.xterm .xterm-accessibility,
.xterm .xterm-message {
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
z-index: 10;
color: transparent;
}

.xterm .live-region {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
overflow: hidden;
}

.xterm-dim {
opacity: 0.5;
}

.xterm-underline {
text-decoration: underline;
}
11 changes: 7 additions & 4 deletions src/js/App.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,16 @@
import React from 'react';
import ReactDOM from 'react-dom';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Provider } from 'react-redux';

import { Route } from 'react-router';
import { Route, Redirect } from 'react-router';
import { HashRouter } from 'react-router-dom';
import { ConnectedRouter } from 'connected-react-router';

// Layouts
import DefaultLayout from './layout/DefaultLayout';

import store, { history } from './store';
import LoadableStoreApp from './apps/Store';

export default class App {
domId: string;
Expand All @@ -23,7 +24,9 @@ export default class App {
<Provider store={store}>
<ConnectedRouter history={history}>
<HashRouter>
<Route path="/" component={DefaultLayout} />
{/* <Redirect from="/" to="/os/choose" /> */}
<Route path="/store" component={LoadableStoreApp} />
<Route path="/os" component={DefaultLayout} />
</HashRouter>
</ConnectedRouter>
</Provider>,
Expand Down
24 changes: 24 additions & 0 deletions src/js/apps/Store/Store.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import * as React from 'react';
import AppHeader from '../../components/molecules/AppHeader/index';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import ListItemText from '@material-ui/core/ListItemText';

function StoreApp() {
return (
<div>
<AppHeader
title="Store"
menu={
<List>
<ListItem>
<ListItemText primary="Hello" />
</ListItem>
</List>
}
/>
</div>
);
}

export default StoreApp;
15 changes: 15 additions & 0 deletions src/js/apps/Store/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import * as React from 'react';
import * as Loadable from 'react-loadable';

function Loading() {
return (
<div>Loading</div>
);
}

const LoadableStoreApp = Loadable({
loader: () => import('./Store'),
loading: Loading,
});

export default LoadableStoreApp;
17 changes: 17 additions & 0 deletions src/js/components/molecules/AppHeader/AppHeader.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.menuButton {
color: white !important;
}

.appBar {
width: calc(100% - 240px) !important;
float: right;
}

.drawer {

:global {
.MuiPaper-root {
width: 240px;
}
}
}
Loading

0 comments on commit 81cff64

Please sign in to comment.