diff --git a/web/package.json b/web/package.json index 80deb556..0d64b6f3 100644 --- a/web/package.json +++ b/web/package.json @@ -50,9 +50,10 @@ "react-highlight": "0.10.0", "react-router-dom": "next", "react-select": "1.0.0-rc.4", + "react-spinners": "0.2.6", "rx": "^4.1.0", "rx-connect": "0.7.0", - "rxjs": "^5.4.2", + "rxjs": "5.4.2", "xterm": "3.1.0" }, "peerDependencies": { diff --git a/web/src/components/Log/index.js b/web/src/components/Log/index.js index 81f75bbb..e4748ae5 100644 --- a/web/src/components/Log/index.js +++ b/web/src/components/Log/index.js @@ -45,9 +45,8 @@ export default class Log extends Component { this.term.writeln(colors.fg.getRgb(2, 3, 4) + "Initialize...\n\r" + colors.reset); this.subscription = this.props$ - .map(({session, origin}) => ({session, origin})) - .distinctUntilChanged() - .filter(it => it && it.session && it.origin) + .filter(it => it && it.session && it.origin && it.browser) + .distinctUntilChanged((prev, {origin}) => prev.origin === origin) .map(({session}) => { const wsProxyUrl = urlTo(window.location.href); return `ws://${wsProxyUrl.host}/ws/logs/${session}`; @@ -85,8 +84,7 @@ export default class Log extends Component { }) }) }) - .do(msg => this.term.write(msg)) - .subscribe(); + .subscribe(msg => this.term.write(msg)); } componentWillUnmount() { diff --git a/web/src/components/Session/SessionInfo.js b/web/src/components/Session/SessionInfo.js index cb213b72..e1bb8017 100644 --- a/web/src/components/Session/SessionInfo.js +++ b/web/src/components/Session/SessionInfo.js @@ -1,4 +1,5 @@ import React from "react"; +import { BeatLoader } from 'react-spinners'; import "./style.scss"; @@ -10,6 +11,11 @@ const SessionInfo = (props) => {
+ {browser.quota} {browser.quota && (/)} {browser.caps.browserName} diff --git a/web/src/components/Session/index.js b/web/src/components/Session/index.js index cda835c3..6cf5445a 100644 --- a/web/src/components/Session/index.js +++ b/web/src/components/Session/index.js @@ -16,7 +16,7 @@ export default class Session extends Component { browser }}/> -
+ {browser && (
- -
+
)}
); } diff --git a/web/src/components/Session/style.scss b/web/src/components/Session/style.scss index ff398abf..4e23b571 100644 --- a/web/src/components/Session/style.scss +++ b/web/src/components/Session/style.scss @@ -3,6 +3,10 @@ $background-color-lighter: #3d444c; .session { height: 100%; width: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; &__interactive { display: flex; @@ -37,6 +41,7 @@ $background-color-lighter: #3d444c; min-width: 350px; border-bottom: 1px dashed $background-color-lighter; margin: 15px 0; + flex-shrink: 0; .session-browser { line-height: 40px; diff --git a/web/src/containers/Stats/style.scss b/web/src/containers/Stats/style.scss index f0416e6b..1b0434ae 100644 --- a/web/src/containers/Stats/style.scss +++ b/web/src/containers/Stats/style.scss @@ -11,6 +11,7 @@ $border-section-color: #353b42; align-items: center; position: relative; padding-top: 40px; + flex-shrink: 0; &__section-title { color: #666; diff --git a/web/src/containers/Viewport/style.scss b/web/src/containers/Viewport/style.scss index 0853b849..de3ea48e 100644 --- a/web/src/containers/Viewport/style.scss +++ b/web/src/containers/Viewport/style.scss @@ -21,9 +21,9 @@ body { } .viewport { + height: 100%; width: 100%; display: flex; - flex-wrap: wrap; position: relative; padding-top: 60px; flex-direction: column; diff --git a/web/yarn.lock b/web/yarn.lock index 065a7f46..8a47b87f 100644 --- a/web/yarn.lock +++ b/web/yarn.lock @@ -2,6 +2,21 @@ # yarn lockfile v1 +"@babel/helper-module-imports@7.0.0-beta.32": + version "7.0.0-beta.32" + resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.0.0-beta.32.tgz#8126fc024107c226879841b973677a4f4e510a03" + dependencies: + "@babel/types" "7.0.0-beta.32" + lodash "^4.2.0" + +"@babel/types@7.0.0-beta.32": + version "7.0.0-beta.32" + resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.0.0-beta.32.tgz#c317d0ecc89297b80bbcb2f50608e31f6452a5ff" + dependencies: + esutils "^2.0.2" + lodash "^4.2.0" + to-fast-properties "^2.0.0" + abbrev@1: version "1.1.0" resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.0.tgz#d0554c2256636e2f56e7c2e5ad183f859428d81f" @@ -411,6 +426,12 @@ babel-loader@7.0.0: loader-utils "^1.0.2" mkdirp "^0.5.1" +babel-macros@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/babel-macros/-/babel-macros-1.2.0.tgz#39e47ed6d286d4a98f1948d8bab45dac17e4e2d4" + dependencies: + cosmiconfig "3.1.0" + babel-messages@^6.23.0: version "6.23.0" resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e" @@ -423,6 +444,19 @@ babel-plugin-check-es2015-constants@^6.3.13: dependencies: babel-runtime "^6.22.0" +babel-plugin-emotion@^8.0.12, babel-plugin-emotion@^8.0.6: + version "8.0.12" + resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-8.0.12.tgz#2ed844001416b0ae2ff787a06b1804ec5f531c89" + dependencies: + "@babel/helper-module-imports" "7.0.0-beta.32" + babel-macros "^1.2.0" + babel-plugin-syntax-jsx "^6.18.0" + convert-source-map "^1.5.0" + emotion-utils "^8.0.12" + find-root "^1.1.0" + source-map "^0.5.7" + touch "^1.0.0" + babel-plugin-react-transform@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/babel-plugin-react-transform/-/babel-plugin-react-transform-2.0.2.tgz#515bbfa996893981142d90b1f9b1635de2995109" @@ -473,7 +507,7 @@ babel-plugin-syntax-function-bind@^6.8.0: version "6.13.0" resolved "https://registry.yarnpkg.com/babel-plugin-syntax-function-bind/-/babel-plugin-syntax-function-bind-6.13.0.tgz#48c495f177bdf31a981e732f55adc0bdd2601f46" -babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0: +babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0: version "6.18.0" resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946" @@ -1164,6 +1198,10 @@ chalk@^1.0.0, chalk@^1.1.0, chalk@^1.1.1, chalk@^1.1.3: strip-ansi "^3.0.0" supports-color "^2.0.0" +change-emitter@^0.1.2: + version "0.1.6" + resolved "https://registry.yarnpkg.com/change-emitter/-/change-emitter-0.1.6.tgz#e8b2fe3d7f1ab7d69a32199aff91ea6931409515" + chokidar@^1.4.3, chokidar@^1.6.0: version "1.6.1" resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-1.6.1.tgz#2f4447ab5e96e50fb3d789fd90d4c72e0e4c70c2" @@ -1378,6 +1416,10 @@ convert-source-map@^1.1.0: version "1.4.0" resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.4.0.tgz#e3dad195bf61bfe13a7a3c73e9876ec14a0268f3" +convert-source-map@^1.5.0: + version "1.5.1" + resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.5.1.tgz#b8278097b9bc229365de5c62cf5fcaed8b5599e5" + cookie-signature@1.0.6: version "1.0.6" resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c" @@ -1398,6 +1440,15 @@ core-util-is@~1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7" +cosmiconfig@3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-3.1.0.tgz#640a94bf9847f321800403cd273af60665c73397" + dependencies: + is-directory "^0.3.1" + js-yaml "^3.9.0" + parse-json "^3.0.0" + require-from-string "^2.0.1" + create-ecdh@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.0.tgz#888c723596cdf7612f6498233eebd7a35301737d" @@ -1780,6 +1831,19 @@ emojis-list@^2.0.0: version "2.1.0" resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389" +emotion-utils@^8.0.12: + version "8.0.12" + resolved "https://registry.yarnpkg.com/emotion-utils/-/emotion-utils-8.0.12.tgz#5e0fd72db3008f26ce4f80b1972df08841df2168" + +emotion@^8.0.8: + version "8.0.12" + resolved "https://registry.yarnpkg.com/emotion/-/emotion-8.0.12.tgz#03de11ce26b1b2401c334b94d438652124c514c6" + dependencies: + babel-plugin-emotion "^8.0.12" + emotion-utils "^8.0.12" + stylis "^3.3.2" + stylis-rule-sheet "^0.0.5" + encodeurl@~1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.1.tgz#79e3d58655346909fe6f0f45a5de68103b294d20" @@ -1809,7 +1873,7 @@ errno@^0.1.3: dependencies: prr "~0.0.0" -error-ex@^1.2.0: +error-ex@^1.2.0, error-ex@^1.3.1: version "1.3.1" resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.1.tgz#f855a86ce61adc4e8621c3cda21e7a7612c3a8dc" dependencies: @@ -2017,6 +2081,10 @@ esprima@^3.1.1: version "3.1.3" resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633" +esprima@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.0.tgz#4499eddcd1110e0b218bacf2fa7f7f59f55ca804" + esrecurse@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/esrecurse/-/esrecurse-4.1.0.tgz#4713b6536adf7f2ac4f327d559e7756bff648220" @@ -2199,6 +2267,18 @@ fbjs@^0.8.1, fbjs@^0.8.4, fbjs@^0.8.9: setimmediate "^1.0.5" ua-parser-js "^0.7.9" +fbjs@^0.8.16: + version "0.8.16" + resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db" + dependencies: + core-js "^1.0.0" + isomorphic-fetch "^2.1.1" + loose-envify "^1.0.0" + object-assign "^4.1.0" + promise "^7.1.1" + setimmediate "^1.0.5" + ua-parser-js "^0.7.9" + figures@^1.3.5: version "1.7.0" resolved "https://registry.yarnpkg.com/figures/-/figures-1.7.0.tgz#cbe1e3affcf1cd44b80cadfed28dc793a9701d2e" @@ -2269,6 +2349,10 @@ find-cache-dir@^0.1.1: mkdirp "^0.5.1" pkg-dir "^1.0.0" +find-root@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4" + find-up@^1.0.0: version "1.1.2" resolved "https://registry.yarnpkg.com/find-up/-/find-up-1.1.2.tgz#6b2e9822b1a2ce0a60ab64d610eccad53cb24d0f" @@ -2554,6 +2638,10 @@ hoist-non-react-statics@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-1.2.0.tgz#aa448cf0986d55cc40773b17174b7dd066cb7cfb" +hoist-non-react-statics@^2.3.1: + version "2.5.0" + resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.0.tgz#d2ca2dfc19c5a91c5a6615ce8e564ef0347e2a40" + home-or-tmp@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/home-or-tmp/-/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8" @@ -2802,6 +2890,10 @@ is-date-object@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/is-date-object/-/is-date-object-1.0.1.tgz#9aa20eb6aeebbff77fbd33e74ca01b33581d3a16" +is-directory@^0.3.1: + version "0.3.1" + resolved "https://registry.yarnpkg.com/is-directory/-/is-directory-0.3.1.tgz#61339b6f2475fc772fd9c9d83f5c8575dc154ae1" + is-dotfile@^1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/is-dotfile/-/is-dotfile-1.0.2.tgz#2c132383f39199f8edc268ca01b9b007d205cc4d" @@ -2993,6 +3085,13 @@ js-yaml@^3.5.1: argparse "^1.0.7" esprima "^3.1.1" +js-yaml@^3.9.0: + version "3.11.0" + resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.11.0.tgz#597c1a8bd57152f26d622ce4117851a51f5ebaef" + dependencies: + argparse "^1.0.7" + esprima "^4.0.0" + js-yaml@~3.7.0: version "3.7.0" resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.7.0.tgz#5c967ddd837a9bfdca5f2de84253abe8a1c03b80" @@ -3485,6 +3584,12 @@ node-sass@^4.5.0: dependencies: abbrev "1" +nopt@~1.0.10: + version "1.0.10" + resolved "https://registry.yarnpkg.com/nopt/-/nopt-1.0.10.tgz#6ddd21bd2a31417b92727dd585f8a6f37608ebee" + dependencies: + abbrev "1" + normalize-package-data@^2.3.2, normalize-package-data@^2.3.4: version "2.3.6" resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.3.6.tgz#498fa420c96401f787402ba21e600def9f981fff" @@ -3671,6 +3776,12 @@ parse-json@^2.2.0: dependencies: error-ex "^1.2.0" +parse-json@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-3.0.0.tgz#fa6f47b18e23826ead32f263e744d0e1e847fb13" + dependencies: + error-ex "^1.3.1" + parseurl@~1.3.1: version "1.3.1" resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.1.tgz#c8ab8c9223ba34888aa64a297b28853bec18da56" @@ -4046,6 +4157,14 @@ promise@^7.1.1: dependencies: asap "~2.0.3" +prop-types@^15.5.10: + version "15.6.1" + resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.1.tgz#36644453564255ddda391191fb3a125cbdf654ca" + dependencies: + fbjs "^0.8.16" + loose-envify "^1.3.1" + object-assign "^4.1.1" + prop-types@^15.5.4, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@~15.5.7: version "15.5.8" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.8.tgz#6b7b2e141083be38c8595aa51fc55775c7199394" @@ -4168,6 +4287,13 @@ react-dom@^15.5.4: object-assign "^4.1.0" prop-types "~15.5.7" +react-emotion@^8.0.6: + version "8.0.12" + resolved "https://registry.yarnpkg.com/react-emotion/-/react-emotion-8.0.12.tgz#3dd94c151197e2e3399e34e3e118df141b5ebb7b" + dependencies: + babel-plugin-emotion "^8.0.12" + emotion-utils "^8.0.12" + react-highlight@0.10.0: version "0.10.0" resolved "https://registry.yarnpkg.com/react-highlight/-/react-highlight-0.10.0.tgz#d386f9dceab867dc0dcc2364153fb1cc7645d046" @@ -4218,6 +4344,16 @@ react-select@1.0.0-rc.4: prop-types "^15.5.8" react-input-autosize "^1.1.3" +react-spinners@^0.2.6: + version "0.2.6" + resolved "https://registry.yarnpkg.com/react-spinners/-/react-spinners-0.2.6.tgz#15ba678d07636c3cf760563b0efb7b2566f465cb" + dependencies: + babel-plugin-emotion "^8.0.6" + emotion "^8.0.8" + prop-types "^15.5.10" + react-emotion "^8.0.6" + recompose "0.26.0" + react-transform-catch-errors@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/react-transform-catch-errors/-/react-transform-catch-errors-1.0.2.tgz#1b4d4a76e97271896fc16fe3086c793ec88a9eeb" @@ -4317,6 +4453,15 @@ rechoir@^0.6.2: dependencies: resolve "^1.1.6" +recompose@0.26.0: + version "0.26.0" + resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.26.0.tgz#9babff039cb72ba5bd17366d55d7232fbdfb2d30" + dependencies: + change-emitter "^0.1.2" + fbjs "^0.8.1" + hoist-non-react-statics "^2.3.1" + symbol-observable "^1.0.4" + redbox-react@^1.2.2: version "1.3.4" resolved "https://registry.yarnpkg.com/redbox-react/-/redbox-react-1.3.4.tgz#3d882bb62cc7c8f6256279d12f05c6a5a96d24c6" @@ -4453,6 +4598,10 @@ require-directory@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42" +require-from-string@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/require-from-string/-/require-from-string-2.0.1.tgz#c545233e9d7da6616e9d59adfb39fc9f588676ff" + require-main-filename@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/require-main-filename/-/require-main-filename-1.0.1.tgz#97f717b69d48784f5f526a6c5aa8ffdda055a4d1" @@ -4743,6 +4892,10 @@ source-map@0.5.x, source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, sourc version "0.5.6" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412" +source-map@^0.5.7: + version "0.5.7" + resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc" + spdx-correct@~1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-1.0.2.tgz#4b3073d933ff51f3912f03ac5519498a4150db40" @@ -4886,6 +5039,14 @@ style-loader@0.16.1: dependencies: loader-utils "^1.0.2" +stylis-rule-sheet@^0.0.5: + version "0.0.5" + resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.5.tgz#ebae935cc1f6fb31b9b62dba47f2ea8b833dad9f" + +stylis@^3.3.2: + version "3.5.0" + resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.5.0.tgz#016fa239663d77f868fef5b67cf201c4b7c701e1" + supports-color@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7" @@ -4970,10 +5131,20 @@ to-fast-properties@^1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.2.tgz#f3f5c0c3ba7299a7ef99427e44633257ade43320" +to-fast-properties@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e" + toposort@^1.0.0: version "1.0.3" resolved "https://registry.yarnpkg.com/toposort/-/toposort-1.0.3.tgz#f02cd8a74bd8be2fc0e98611c3bacb95a171869c" +touch@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/touch/-/touch-1.0.0.tgz#449cbe2dbae5a8c8038e30d71fa0ff464947c4de" + dependencies: + nopt "~1.0.10" + tough-cookie@~2.3.0: version "2.3.2" resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.3.2.tgz#f081f76e4c85720e6c37a5faced737150d84072a"