Merge pull request #93 from lbryio/build-with-webpack
Convert to ES6 Modules
This commit is contained in:
alexliebowitz
GitHub
commit
a4303fe1ad
31 changed files with 520 additions and 78 deletions
6
.babelrc
Normal file
6
.babelrc
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"presets": [
|
||||
"es2015",
|
||||
"react"
|
||||
],
|
||||
}
|
||||
239
.eslintrc.js
Normal file
239
.eslintrc.js
Normal file
|
|
@ -0,0 +1,239 @@
|
|||
module.exports = {
|
||||
"extends": "airbnb",
|
||||
"plugins": [
|
||||
"react",
|
||||
"jsx-a11y",
|
||||
"import"
|
||||
],
|
||||
"env": {
|
||||
"browser": true,
|
||||
},
|
||||
// Grabbed from https://gist.github.com/cletusw/e01a85e399ab563b1236
|
||||
"rules": {
|
||||
////////// Possible Errors //////////
|
||||
|
||||
"no-comma-dangle": 0, // disallow trailing commas in object literals
|
||||
"no-cond-assign": 0, // disallow assignment in conditional expressions
|
||||
"no-console": 0, // disallow use of console (off by default in the node environment)
|
||||
"no-constant-condition": 0, // disallow use of constant expressions in conditions
|
||||
"no-control-regex": 0, // disallow control characters in regular expressions
|
||||
"no-debugger": 0, // disallow use of debugger
|
||||
"no-dupe-keys": 0, // disallow duplicate keys when creating object literals
|
||||
"no-empty": 0, // disallow empty statements
|
||||
"no-empty-class": 0, // disallow the use of empty character classes in regular expressions
|
||||
"no-ex-assign": 0, // disallow assigning to the exception in a catch block
|
||||
"no-extra-boolean-cast": 0, // disallow double-negation boolean casts in a boolean context
|
||||
"no-extra-parens": 0, // disallow unnecessary parentheses (off by default)
|
||||
"no-extra-semi": 0, // disallow unnecessary semicolons
|
||||
"no-func-assign": 0, // disallow overwriting functions written as function declarations
|
||||
"no-inner-declarations": 0, // disallow function or variable declarations in nested blocks
|
||||
"no-invalid-regexp": 0, // disallow invalid regular expression strings in the RegExp constructor
|
||||
"no-irregular-whitespace": 0, // disallow irregular whitespace outside of strings and comments
|
||||
"no-negated-in-lhs": 0, // disallow negation of the left operand of an in expression
|
||||
"no-obj-calls": 0, // disallow the use of object properties of the global object (Math and JSON) as functions
|
||||
"no-regex-spaces": 0, // disallow multiple spaces in a regular expression literal
|
||||
"no-reserved-keys": 0, // disallow reserved words being used as object literal keys (off by default)
|
||||
"no-sparse-arrays": 0, // disallow sparse arrays
|
||||
"no-unreachable": 0, // disallow unreachable statements after a return, throw, continue, or break statement
|
||||
"use-isnan": 0, // disallow comparisons with the value NaN
|
||||
"valid-jsdoc": 0, // Ensure JSDoc comments are valid (off by default)
|
||||
"valid-typeof": 0, // Ensure that the results of typeof are compared against a valid string
|
||||
|
||||
|
||||
////////// Best Practices //////////
|
||||
|
||||
"block-scoped-var": 0, // treat var statements as if they were block scoped (off by default)
|
||||
"complexity": 0, // specify the maximum cyclomatic complexity allowed in a program (off by default)
|
||||
"consistent-return": 0, // require return statements to either always or never specify values
|
||||
"curly": 0, // specify curly brace conventions for all control statements
|
||||
"default-case": 0, // require default case in switch statements (off by default)
|
||||
"dot-notation": 0, // encourages use of dot notation whenever possible
|
||||
"eqeqeq": 0, // require the use of === and !==
|
||||
"guard-for-in": 0, // make sure for-in loops have an if statement (off by default)
|
||||
"no-alert": 0, // disallow the use of alert, confirm, and prompt
|
||||
"no-caller": 0, // disallow use of arguments.caller or arguments.callee
|
||||
"no-div-regex": 0, // disallow division operators explicitly at beginning of regular expression (off by default)
|
||||
"no-else-return": 0, // disallow else after a return in an if (off by default)
|
||||
"no-empty-label": 0, // disallow use of labels for anything other then loops and switches
|
||||
"no-eq-null": 0, // disallow comparisons to null without a type-checking operator (off by default)
|
||||
"no-eval": 0, // disallow use of eval()
|
||||
"no-extend-native": 0, // disallow adding to native types
|
||||
"no-extra-bind": 0, // disallow unnecessary function binding
|
||||
"no-fallthrough": 0, // disallow fallthrough of case statements
|
||||
"no-floating-decimal": 0, // disallow the use of leading or trailing decimal points in numeric literals (off by default)
|
||||
"no-implied-eval": 0, // disallow use of eval()-like methods
|
||||
"no-iterator": 0, // disallow usage of __iterator__ property
|
||||
"no-labels": 0, // disallow use of labeled statements
|
||||
"no-lone-blocks": 0, // disallow unnecessary nested blocks
|
||||
"no-loop-func": 0, // disallow creation of functions within loops
|
||||
"no-multi-spaces": 0, // disallow use of multiple spaces
|
||||
"no-multi-str": 0, // disallow use of multiline strings
|
||||
"no-native-reassign": 0, // disallow reassignments of native objects
|
||||
"no-new": 0, // disallow use of new operator when not part of the assignment or comparison
|
||||
"no-new-func": 0, // disallow use of new operator for Function object
|
||||
"no-new-wrappers": 0, // disallows creating new instances of String, Number, and Boolean
|
||||
"no-octal": 0, // disallow use of octal literals
|
||||
"no-octal-escape": 0, // disallow use of octal escape sequences in string literals, such as var foo = "Copyright \251";
|
||||
"no-process-env": 0, // disallow use of process.env (off by default)
|
||||
"no-proto": 0, // disallow usage of __proto__ property
|
||||
"no-redeclare": 0, // disallow declaring the same variable more then once
|
||||
"no-return-assign": 0, // disallow use of assignment in return statement
|
||||
"no-script-url": 0, // disallow use of javascript: urls.
|
||||
"no-self-compare": 0, // disallow comparisons where both sides are exactly the same (off by default)
|
||||
"no-sequences": 0, // disallow use of comma operator
|
||||
"no-unused-expressions": 0, // disallow usage of expressions in statement position
|
||||
"no-void": 0, // disallow use of void operator (off by default)
|
||||
"no-warning-comments": 0, // disallow usage of configurable warning terms in comments, e.g. TODO or FIXME (off by default)
|
||||
"no-with": 0, // disallow use of the with statement
|
||||
"radix": 0, // require use of the second argument for parseInt() (off by default)
|
||||
"vars-on-top": 0, // requires to declare all vars on top of their containing scope (off by default)
|
||||
"wrap-iife": 0, // require immediate function invocation to be wrapped in parentheses (off by default)
|
||||
"yoda": 0, // require or disallow Yoda conditions
|
||||
|
||||
|
||||
////////// Strict Mode //////////
|
||||
|
||||
"global-strict": 0, // (deprecated) require or disallow the "use strict" pragma in the global scope (off by default in the node environment)
|
||||
"no-extra-strict": 0, // (deprecated) disallow unnecessary use of "use strict"; when already in strict mode
|
||||
"strict": 0, // controls location of Use Strict Directives
|
||||
|
||||
|
||||
////////// Variables //////////
|
||||
|
||||
"no-catch-shadow": 0, // disallow the catch clause parameter name being the same as a variable in the outer scope (off by default in the node environment)
|
||||
"no-delete-var": 0, // disallow deletion of variables
|
||||
"no-label-var": 0, // disallow labels that share a name with a variable
|
||||
"no-shadow": 0, // disallow declaration of variables already declared in the outer scope
|
||||
"no-shadow-restricted-names": 0, // disallow shadowing of names such as arguments
|
||||
"no-undef": 1, // disallow use of undeclared variables unless mentioned in a /*global */ block
|
||||
"no-undef-init": 0, // disallow use of undefined when initializing variables
|
||||
"no-undefined": 0, // disallow use of undefined variable (off by default)
|
||||
"no-unused-vars": 0, // disallow declaration of variables that are not used in the code
|
||||
"no-use-before-define": 0, // disallow use of variables before they are defined
|
||||
|
||||
|
||||
////////// Node.js //////////
|
||||
|
||||
"handle-callback-err": 0, // enforces error handling in callbacks (off by default) (on by default in the node environment)
|
||||
"no-mixed-requires": 0, // disallow mixing regular variable and require declarations (off by default) (on by default in the node environment)
|
||||
"no-new-require": 0, // disallow use of new operator with the require function (off by default) (on by default in the node environment)
|
||||
"no-path-concat": 0, // disallow string concatenation with __dirname and __filename (off by default) (on by default in the node environment)
|
||||
"no-process-exit": 0, // disallow process.exit() (on by default in the node environment)
|
||||
"no-restricted-modules": 0, // restrict usage of specified node modules (off by default)
|
||||
"no-sync": 0, // disallow use of synchronous methods (off by default)
|
||||
|
||||
|
||||
////////// Stylistic Issues //////////
|
||||
|
||||
"brace-style": 0, // enforce one true brace style (off by default)
|
||||
"camelcase": 0, // require camel case names
|
||||
"comma-spacing": 0, // enforce spacing before and after comma
|
||||
"comma-style": 0, // enforce one true comma style (off by default)
|
||||
"consistent-this": 0, // enforces consistent naming when capturing the current execution context (off by default)
|
||||
"eol-last": 0, // enforce newline at the end of file, with no multiple empty lines
|
||||
"func-names": 0, // require function expressions to have a name (off by default)
|
||||
"func-style": 0, // enforces use of function declarations or expressions (off by default)
|
||||
"key-spacing": 0, // enforces spacing between keys and values in object literal properties
|
||||
"max-nested-callbacks": 0, // specify the maximum depth callbacks can be nested (off by default)
|
||||
"new-cap": 0, // require a capital letter for constructors
|
||||
"new-parens": 0, // disallow the omission of parentheses when invoking a constructor with no arguments
|
||||
"no-array-constructor": 0, // disallow use of the Array constructor
|
||||
"no-inline-comments": 0, // disallow comments inline after code (off by default)
|
||||
"no-lonely-if": 0, // disallow if as the only statement in an else block (off by default)
|
||||
"no-mixed-spaces-and-tabs": 0, // disallow mixed spaces and tabs for indentation
|
||||
"no-multiple-empty-lines": 0, // disallow multiple empty lines (off by default)
|
||||
"no-nested-ternary": 0, // disallow nested ternary expressions (off by default)
|
||||
"no-new-object": 0, // disallow use of the Object constructor
|
||||
"no-space-before-semi": 0, // disallow space before semicolon
|
||||
"no-spaced-func": 0, // disallow space between function identifier and application
|
||||
"no-ternary": 0, // disallow the use of ternary operators (off by default)
|
||||
"no-trailing-spaces": 0, // disallow trailing whitespace at the end of lines
|
||||
"no-underscore-dangle": 0, // disallow dangling underscores in identifiers
|
||||
"no-wrap-func": 0, // disallow wrapping of non-IIFE statements in parens
|
||||
"one-var": 0, // allow just one var statement per function (off by default)
|
||||
"operator-assignment": 0, // require assignment operator shorthand where possible or prohibit it entirely (off by default)
|
||||
"padded-blocks": 0, // enforce padding within blocks (off by default)
|
||||
"quote-props": 0, // require quotes around object literal property names (off by default)
|
||||
"quotes": 0, // specify whether double or single quotes should be used
|
||||
"semi": 0, // require or disallow use of semicolons instead of ASI
|
||||
"sort-vars": 0, // sort variables within the same declaration block (off by default)
|
||||
"space-after-function-name": 0, // require a space after function names (off by default)
|
||||
"space-after-keywords": 0, // require a space after certain keywords (off by default)
|
||||
"space-before-blocks": 0, // require or disallow space before blocks (off by default)
|
||||
"space-in-brackets": 0, // require or disallow spaces inside brackets (off by default)
|
||||
"space-in-parens": 0, // require or disallow spaces inside parentheses (off by default)
|
||||
"space-infix-ops": 0, // require spaces around operators
|
||||
"space-return-throw-case": 0, // require a space after return, throw, and case
|
||||
"space-unary-ops": 0, // Require or disallow spaces before/after unary operators (words on by default, nonwords off by default)
|
||||
"spaced-line-comment": 0, // require or disallow a space immediately following the // in a line comment (off by default)
|
||||
"wrap-regex": 0, // require regex literals to be wrapped in parentheses (off by default)
|
||||
|
||||
|
||||
////////// ECMAScript 6 //////////
|
||||
|
||||
"no-var": 0, // require let or const instead of var (off by default)
|
||||
"generator-star": 0, // enforce the position of the * in generator functions (off by default)
|
||||
|
||||
|
||||
////////// Legacy //////////
|
||||
|
||||
"max-depth": 0, // specify the maximum depth that blocks can be nested (off by default)
|
||||
"max-len": 0, // specify the maximum length of a line in your program (off by default)
|
||||
"max-params": 0, // limits the number of parameters that can be used in the function declaration. (off by default)
|
||||
"max-statements": 0, // specify the maximum number of statement allowed in a function (off by default)
|
||||
"no-bitwise": 0, // disallow use of bitwise operators (off by default)
|
||||
"no-plusplus": 0, // disallow use of unary operators, ++ and -- (off by default)
|
||||
|
||||
// There were other errors that were being thrown
|
||||
"import/newline-after-import": 0,
|
||||
"object-curly-spacing": 0,
|
||||
"space-before-function-paren": 0,
|
||||
"no-restricted-syntax": 0,
|
||||
"no-unneeded-ternary": 0,
|
||||
"react/prefer-es6-class": 0,
|
||||
"arrow-parens": 0,
|
||||
"jsx-quotes": 0,
|
||||
"react/sort-comp": 0,
|
||||
"react/no-unescaped-entities": 0,
|
||||
"object-shorthand": 0,
|
||||
"jsx-a11y/label-has-for": 0,
|
||||
"no-mixed-operators": 0,
|
||||
"react/jsx-no-bind": 0,
|
||||
"no-duplicate-case": 0,
|
||||
"react/jsx-filename-extension": 0,
|
||||
"jsx-a11y/img-has-alt": 0,
|
||||
"react/self-closing-comp": 0,
|
||||
"prefer-const": 0,
|
||||
"one-var-declaration-per-line": 0,
|
||||
"react/jsx-indent": 0,
|
||||
"react/jsx-curly-spacing": 0,
|
||||
"react/prefer-stateless-function": 0,
|
||||
"react/jsx-indent-props": 0,
|
||||
"react/no-find-dom-node": 0,
|
||||
"react/no-unused-prop-types": 0,
|
||||
"react/jsx-no-undef": 0,
|
||||
"react/no-string-refs": 0,
|
||||
"react/jsx-first-prop-new-line": 0,
|
||||
"comma-dangle": 0,
|
||||
"react/no-multi-comp": 0,
|
||||
"spaced-comment": 0,
|
||||
"jsx-a11y/anchor-has-content": 0,
|
||||
"semi-spacing": 0,
|
||||
"no-param-reassign": 0,
|
||||
"react/jsx-no-target-blank": 0,
|
||||
"prefer-arrow-callback": 0,
|
||||
"react/jsx-space-before-closing": 0,
|
||||
"react/forbid-prop-types": 0,
|
||||
"indent": 0,
|
||||
"import/no-unresolved": 0,
|
||||
"react/jsx-boolean-value": 0,
|
||||
"prefer-template": 0,
|
||||
"react/jsx-wrap-multilines": 0,
|
||||
"keyword-spacing": 0,
|
||||
"react/jsx-closing-bracket-location": 0,
|
||||
"react/react-in-jsx-scope": 0,
|
||||
"no-useless-escape": 0,
|
||||
"no-continue": 0,
|
||||
"react/prop-types": 0
|
||||
}
|
||||
};
|
||||
BIN
dist.zip
BIN
dist.zip
Binary file not shown.
34
dist/index.html
vendored
34
dist/index.html
vendored
|
|
@ -20,38 +20,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="canvas"></div>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.2/react.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.2/react-dom.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-modal/1.5.2/react-modal.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.7.4/polyfill.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Clamp.js/0.5.1/clamp.min.js"></script>
|
||||
<script src="./js/mediaelement/jquery.js"></script>
|
||||
<script src="./js/mediaelement/mediaelement-and-player.min.js"></script>
|
||||
<script src="./js/lbry.js?i=0"></script>
|
||||
<script src="./js/lighthouse.js?i=0"></script>
|
||||
<script src="./js/component/common.js?i=0"></script>
|
||||
<script src="./js/component/form.js?i=0"></script>
|
||||
<script src="./js/component/link.js?i=0"></script>
|
||||
<script src="./js/component/menu.js?i=0"></script>
|
||||
<script src="./js/component/modal.js?i=0"></script>
|
||||
<script src="./js/component/header.js?i=0"></script>
|
||||
<script src="./js/component/drawer.js?i=0"></script>
|
||||
<script src="./js/component/splash.js?i=0"></script>
|
||||
<script src="./js/component/load_screen.js?i=0"></script>
|
||||
<script src="./js/page/discover.js?i=0"></script>
|
||||
<script src="./js/page/settings.js?i=0"></script>
|
||||
<script src="./js/page/help.js?i=0"></script>
|
||||
<script src="./js/page/watch.js?i=0"></script>
|
||||
<script src="./js/page/report.js?i=0"></script>
|
||||
<script src="./js/page/my_files.js?i=0"></script>
|
||||
<script src="./js/page/publish.js?i=0"></script>
|
||||
<script src="./js/page/start.js?i=0"></script>
|
||||
<script src="./js/page/claim_code.js?i=0"></script>
|
||||
<script src="./js/page/referral.js?i=0"></script>
|
||||
<script src="./js/page/wallet.js?i=0"></script>
|
||||
<script src="./js/page/show.js?i=0"></script>
|
||||
<script src="./js/page/wallet.js?i=0"></script>
|
||||
<script src="./js/app.js?i=0"></script>
|
||||
<script src="./js/main.js?i=0"></script>
|
||||
<script src="./js/bundle.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
27
js/app.js
27
js/app.js
|
|
@ -1,3 +1,23 @@
|
|||
import React from 'react';
|
||||
import lbry from './lbry.js';
|
||||
import SettingsPage from './page/settings.js';
|
||||
import HelpPage from './page/help.js';
|
||||
import WatchPage from './page/watch.js';
|
||||
import ReportPage from './page/report.js';
|
||||
import MyFilesPage from './page/my_files.js';
|
||||
import StartPage from './page/start.js';
|
||||
import ClaimCodePage from './page/claim_code.js';
|
||||
import ReferralPage from './page/referral.js';
|
||||
import WalletPage from './page/wallet.js';
|
||||
import DetailPage from './page/show.js';
|
||||
import PublishPage from './page/publish.js';
|
||||
import DiscoverPage from './page/discover.js';
|
||||
import SplashScreen from './component/splash.js';
|
||||
import Drawer from './component/drawer.js';
|
||||
import Header from './component/header.js';
|
||||
import Modal from './component/modal.js';
|
||||
import {Link} from './component/link.js';
|
||||
|
||||
var App = React.createClass({
|
||||
_error_key_labels: {
|
||||
connectionString: 'API connection string',
|
||||
|
|
@ -167,10 +187,6 @@ var App = React.createClass({
|
|||
case 'send':
|
||||
case 'receive':
|
||||
return <WalletPage viewingPage={this.state.viewingPage} />;
|
||||
case 'send':
|
||||
return <SendPage />;
|
||||
case 'receive':
|
||||
return <ReceivePage />;
|
||||
case 'show':
|
||||
return <DetailPage name={this.state.pageArgs} />;
|
||||
case 'publish':
|
||||
|
|
@ -220,3 +236,6 @@ var App = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
export default App;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
//component/icon.js
|
||||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import $clamp from 'clamp';
|
||||
|
||||
var Icon = React.createClass({
|
||||
//component/icon.js
|
||||
export let Icon = React.createClass({
|
||||
propTypes: {
|
||||
style: React.PropTypes.object,
|
||||
fixed: React.PropTypes.bool,
|
||||
|
|
@ -13,7 +16,7 @@ var Icon = React.createClass({
|
|||
}
|
||||
});
|
||||
|
||||
var TruncatedText = React.createClass({
|
||||
export let TruncatedText = React.createClass({
|
||||
propTypes: {
|
||||
lines: React.PropTypes.number,
|
||||
height: React.PropTypes.string,
|
||||
|
|
@ -39,7 +42,7 @@ var TruncatedText = React.createClass({
|
|||
}
|
||||
});
|
||||
|
||||
var BusyMessage = React.createClass({
|
||||
export let BusyMessage = React.createClass({
|
||||
propTypes: {
|
||||
message: React.PropTypes.string
|
||||
},
|
||||
|
|
@ -59,7 +62,7 @@ var toolTipStyle = {
|
|||
backgroundColor: '#fff',
|
||||
fontSize: '14px',
|
||||
};
|
||||
var ToolTip = React.createClass({
|
||||
export let ToolTip = React.createClass({
|
||||
propTypes: {
|
||||
open: React.PropTypes.bool.isRequired,
|
||||
onMouseOut: React.PropTypes.func
|
||||
|
|
@ -82,11 +85,11 @@ var creditAmountStyle = {
|
|||
color: '#aaa',
|
||||
};
|
||||
|
||||
var CurrencySymbol = React.createClass({
|
||||
export let CurrencySymbol = React.createClass({
|
||||
render: function() { return <span>LBC</span>; }
|
||||
});
|
||||
|
||||
var CreditAmount = React.createClass({
|
||||
export let CreditAmount = React.createClass({
|
||||
propTypes: {
|
||||
amount: React.PropTypes.number,
|
||||
precision: React.PropTypes.number
|
||||
|
|
@ -105,7 +108,7 @@ var CreditAmount = React.createClass({
|
|||
var addressStyle = {
|
||||
fontFamily: '"Consolas", "Lucida Console", "Adobe Source Code Pro", monospace',
|
||||
};
|
||||
var Address = React.createClass({
|
||||
export let Address = React.createClass({
|
||||
propTypes: {
|
||||
address: React.PropTypes.string,
|
||||
},
|
||||
|
|
@ -116,7 +119,7 @@ var Address = React.createClass({
|
|||
}
|
||||
});
|
||||
|
||||
var Thumbnail = React.createClass({
|
||||
export let Thumbnail = React.createClass({
|
||||
_defaultImageUri: '/img/default-thumb.svg',
|
||||
_maxLoadTime: 10000,
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
import lbry from '../lbry.js';
|
||||
import React from 'react';
|
||||
import {Link} from './link.js';
|
||||
|
||||
var DrawerItem = React.createClass({
|
||||
getDefaultProps: function() {
|
||||
return {
|
||||
|
|
@ -46,4 +50,7 @@ var Drawer = React.createClass({
|
|||
</nav>
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
export default Drawer;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,10 @@
|
|||
import React from 'react';
|
||||
|
||||
var requiredFieldWarningStyle = {
|
||||
color: '#cc0000',
|
||||
transition: 'opacity 400ms ease-in',
|
||||
};
|
||||
|
||||
var FormField = React.createClass({
|
||||
_fieldRequiredText: 'This field is required',
|
||||
_type: null,
|
||||
|
|
@ -96,3 +103,5 @@ var FormFieldAdvice = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default FormField;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,6 @@
|
|||
import React from 'react';
|
||||
import {Link} from './link.js';
|
||||
|
||||
var Header = React.createClass({
|
||||
getInitialState: function() {
|
||||
return {
|
||||
|
|
@ -81,4 +84,6 @@ var SubHeader = React.createClass({
|
|||
</nav>
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
export default Header;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,10 @@
|
|||
var Link = React.createClass({
|
||||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import Modal from './modal.js';
|
||||
import {Icon, ToolTip} from './common.js';
|
||||
|
||||
|
||||
export let Link = React.createClass({
|
||||
handleClick: function() {
|
||||
if (this.props.onClick) {
|
||||
this.props.onClick();
|
||||
|
|
@ -27,7 +33,7 @@ var linkContainerStyle = {
|
|||
position: 'relative',
|
||||
};
|
||||
|
||||
var ToolTipLink = React.createClass({
|
||||
export let ToolTipLink = React.createClass({
|
||||
getInitialState: function() {
|
||||
return {
|
||||
showTooltip: false,
|
||||
|
|
@ -73,7 +79,7 @@ var ToolTipLink = React.createClass({
|
|||
}
|
||||
});
|
||||
|
||||
var DownloadLink = React.createClass({
|
||||
export let DownloadLink = React.createClass({
|
||||
propTypes: {
|
||||
type: React.PropTypes.string,
|
||||
streamName: React.PropTypes.string,
|
||||
|
|
@ -153,7 +159,7 @@ var DownloadLink = React.createClass({
|
|||
}
|
||||
});
|
||||
|
||||
var WatchLink = React.createClass({
|
||||
export let WatchLink = React.createClass({
|
||||
propTypes: {
|
||||
type: React.PropTypes.string,
|
||||
streamName: React.PropTypes.string,
|
||||
|
|
@ -208,4 +214,4 @@ var WatchLink = React.createClass({
|
|||
</span>
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import {BusyMessage, Icon} from './common.js';
|
||||
|
||||
var loadScreenStyle = {
|
||||
color: 'white',
|
||||
backgroundImage: 'url(' + lbry.imagePath('lbry-bg.png') + ')',
|
||||
|
|
@ -46,4 +50,7 @@ var LoadScreen = React.createClass({
|
|||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
export default LoadScreen;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import {Icon} from './common.js';
|
||||
|
||||
// Generic menu styles
|
||||
var menuStyle = {
|
||||
whiteSpace: 'nowrap'
|
||||
|
|
@ -67,4 +71,6 @@ var MenuItem = React.createClass({
|
|||
</a>
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
export default Menu;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,8 @@
|
|||
import React from 'react';
|
||||
import ReactModal from 'react-modal';
|
||||
import {Link} from './link.js';
|
||||
|
||||
|
||||
var Modal = React.createClass({
|
||||
propTypes: {
|
||||
type: React.PropTypes.oneOf(['alert', 'confirm', 'custom']),
|
||||
|
|
@ -57,3 +62,5 @@ var Modal = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default Modal;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import LoadScreen from './load_screen.js';
|
||||
|
||||
var SplashScreen = React.createClass({
|
||||
propTypes: {
|
||||
message: React.PropTypes.string,
|
||||
|
|
@ -32,4 +36,6 @@ var SplashScreen = React.createClass({
|
|||
render: function() {
|
||||
return <LoadScreen message={this.props.message} details={this.state.details} isWarning={this.state.isLagging} />;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
export default SplashScreen;
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ var lbry = {
|
|||
isConnected: false,
|
||||
rootPath: '.',
|
||||
daemonConnectionString: 'http://localhost:5279/lbryapi',
|
||||
webUiUri: 'http://localhost:5279',
|
||||
colors: {
|
||||
primary: '#155B4A'
|
||||
},
|
||||
|
|
@ -351,7 +352,7 @@ lbry.loadJs = function(src, type, onload)
|
|||
newScriptTag.type = type;
|
||||
if (onload)
|
||||
{
|
||||
newScript.onload = onload;
|
||||
newScriptTag.onload = onload;
|
||||
}
|
||||
lbryScriptTag.parentNode.insertBefore(newScriptTag, lbryScriptTag);
|
||||
}
|
||||
|
|
@ -390,3 +391,4 @@ lbry.stop = function(callback) {
|
|||
};
|
||||
|
||||
|
||||
export default lbry;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
lbry.lighthouse = {
|
||||
import lbry from './lbry.js';
|
||||
|
||||
var lighthouse = {
|
||||
_search_timeout: 5000,
|
||||
_max_search_tries: 5,
|
||||
|
||||
|
|
@ -15,22 +17,24 @@ lbry.lighthouse = {
|
|||
|
||||
search: function(query, callback) {
|
||||
let handleSearchFailed = function(tryNum=0) {
|
||||
if (tryNum > lbry.lighthouse._max_search_tries) {
|
||||
throw new Error(`Could not connect to Lighthouse server. Last server attempted: ${lbry.lighthouse.server}`);
|
||||
if (tryNum > lighthouse._max_search_tries) {
|
||||
throw new Error(`Could not connect to Lighthouse server. Last server attempted: ${lighthouse.server}`);
|
||||
} else {
|
||||
// Randomly choose one of the other search servers to switch to
|
||||
let otherServers = lbry.lighthouse.servers.slice();
|
||||
otherServers.splice(otherServers.indexOf(lbry.lighthouse.server), 1);
|
||||
lbry.lighthouse.server = otherServers[Math.round(Math.random() * (otherServers.length - 1))];
|
||||
let otherServers = lighthouse.servers.slice();
|
||||
otherServers.splice(otherServers.indexOf(lighthouse.server), 1);
|
||||
lighthouse.server = otherServers[Math.round(Math.random() * (otherServers.length - 1))];
|
||||
|
||||
lbry.lighthouse.call('search', [query], callback, undefined, function() {
|
||||
lighthouse.call('search', [query], callback, undefined, function() {
|
||||
handleSearchFailed(tryNum + 1);
|
||||
}, lbry.lighthouse._search_timeout);
|
||||
}, lighthouse._search_timeout);
|
||||
}
|
||||
}
|
||||
|
||||
lbry.lighthouse.call('search', [query], callback, undefined, function() { handleSearchFailed() }, lbry.lighthouse._search_timeout);
|
||||
lighthouse.call('search', [query], callback, undefined, function() { handleSearchFailed() }, lighthouse._search_timeout);
|
||||
}
|
||||
};
|
||||
|
||||
lbry.lighthouse.server = lbry.lighthouse.servers[Math.round(Math.random() * (lbry.lighthouse.servers.length - 1))];
|
||||
lighthouse.server = lighthouse.servers[Math.round(Math.random() * (lighthouse.servers.length - 1))];
|
||||
|
||||
export default lighthouse;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,10 @@
|
|||
//main.js
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import lbry from './lbry.js';
|
||||
import App from './app.js';
|
||||
import SplashScreen from './component/splash.js';
|
||||
|
||||
|
||||
var init = function() {
|
||||
var canvas = document.getElementById('canvas');
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,8 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import Modal from '../component/modal.js';
|
||||
import {Link} from '../component/link.js';
|
||||
|
||||
var claimCodeContentStyle = {
|
||||
display: 'inline-block',
|
||||
textAlign: 'left',
|
||||
|
|
@ -143,3 +148,5 @@ var ClaimCodePage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default ClaimCodePage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,9 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import lighthouse from '../lighthouse.js';
|
||||
import {Link, ToolTipLink, DownloadLink, WatchLink} from '../component/link.js';
|
||||
import {Thumbnail, CreditAmount, TruncatedText} from '../component/common.js';
|
||||
|
||||
var fetchResultsStyle = {
|
||||
color: '#888',
|
||||
textAlign: 'center',
|
||||
|
|
@ -179,7 +185,7 @@ var FeaturedContentItem = React.createClass({
|
|||
componentDidMount: function() {
|
||||
this.resolveSearch = true;
|
||||
|
||||
lbry.lighthouse.search(this.props.name, function(results) {
|
||||
lighthouse.search(this.props.name, function(results) {
|
||||
var result = results[0];
|
||||
var metadata = result.value;
|
||||
if (this.resolveSearch)
|
||||
|
|
@ -257,7 +263,7 @@ var DiscoverPage = React.createClass({
|
|||
query: this.props.query,
|
||||
});
|
||||
|
||||
lbry.lighthouse.search(this.props.query, this.searchCallback);
|
||||
lighthouse.search(this.props.query, this.searchCallback);
|
||||
},
|
||||
|
||||
componentDidMount: function() {
|
||||
|
|
@ -297,3 +303,5 @@ var DiscoverPage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default DiscoverPage;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,8 @@
|
|||
//@TODO: Customize advice based on OS
|
||||
//@TODO: Customize advice based on OS
|
||||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import {Link} from '../component/link.js';
|
||||
|
||||
var HelpPage = React.createClass({
|
||||
getInitialState: function() {
|
||||
|
|
@ -98,3 +102,5 @@ var HelpPage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default HelpPage;
|
||||
|
|
@ -1,3 +1,9 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import {Link, WatchLink} from '../component/link.js';
|
||||
import Modal from '../component/modal.js';
|
||||
import {BusyMessage, Thumbnail} from '../component/common.js';
|
||||
|
||||
var moreMenuStyle = {
|
||||
position: 'absolute',
|
||||
display: 'block',
|
||||
|
|
@ -317,3 +323,6 @@ var MyFilesPage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
export default MyFilesPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,10 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import FormField from '../component/form.js';
|
||||
import {Link} from '../component/link.js';
|
||||
import Modal from '../component/modal.js';
|
||||
|
||||
|
||||
var publishNumberStyle = {
|
||||
width: '50px',
|
||||
}, publishFieldLabelStyle = {
|
||||
|
|
@ -277,7 +284,7 @@ var PublishPage = React.createClass({
|
|||
|
||||
var formData = new FormData(fileInput.form);
|
||||
formData.append('file', fileInput.files[0]);
|
||||
xhr.open('POST', '/upload', true);
|
||||
xhr.open('POST', lbry.webUiUri + '/upload', true);
|
||||
xhr.send(formData);
|
||||
}
|
||||
},
|
||||
|
|
@ -344,6 +351,7 @@ var PublishPage = React.createClass({
|
|||
}
|
||||
}
|
||||
},
|
||||
// Also getting a type warning here too
|
||||
render: function() {
|
||||
return (
|
||||
<main ref="page">
|
||||
|
|
@ -496,3 +504,5 @@ var PublishPage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default PublishPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,8 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import {Link} from '../component/link.js';
|
||||
import Modal from '../component/modal.js';
|
||||
|
||||
var referralCodeContentStyle = {
|
||||
display: 'inline-block',
|
||||
textAlign: 'left',
|
||||
|
|
@ -118,3 +123,5 @@ var ReferralPage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default ReferralPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,6 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
|
||||
var ReportPage = React.createClass({
|
||||
submitMessage: function() {
|
||||
if (this._messageArea.value) {
|
||||
|
|
@ -50,4 +53,6 @@ var ReportPage = React.createClass({
|
|||
</main>
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
export default ReportPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,6 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
|
||||
var settingsRadioOptionStyles = {
|
||||
display: 'block',
|
||||
marginLeft: '13px'
|
||||
|
|
@ -129,3 +132,6 @@ var SettingsPage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
export default SettingsPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import {Thumbnail} from '../component/common.js';
|
||||
|
||||
var formatItemImgStyle = {
|
||||
maxWidth: '100%',
|
||||
maxHeight: '100%',
|
||||
|
|
@ -161,4 +165,6 @@ var DetailPage = React.createClass({
|
|||
</section>
|
||||
</main>);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
export default DetailPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,6 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
|
||||
var StartPage = React.createClass({
|
||||
componentWillMount: function() {
|
||||
lbry.stop();
|
||||
|
|
@ -13,4 +16,6 @@ var StartPage = React.createClass({
|
|||
</main>
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
export default StartPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,10 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import {Link} from '../component/link.js';
|
||||
import Modal from '../component/modal.js';
|
||||
import {Address, BusyMessage, CreditAmount} from '../component/common.js';
|
||||
|
||||
|
||||
var addressRefreshButtonStyle = {
|
||||
fontSize: '11pt',
|
||||
};
|
||||
|
|
@ -8,7 +15,7 @@ var AddressSection = React.createClass({
|
|||
}
|
||||
|
||||
lbry.getNewAddress((address) => {
|
||||
localStorage.setItem('wallet_address', address);
|
||||
window.localStorage.setItem('wallet_address', address);
|
||||
this.setState({
|
||||
address: address,
|
||||
});
|
||||
|
|
@ -21,7 +28,7 @@ var AddressSection = React.createClass({
|
|||
}
|
||||
},
|
||||
componentWillMount: function() {
|
||||
var address = localStorage.getItem('wallet_address');
|
||||
var address = window.localStorage.getItem('wallet_address');
|
||||
if (address === null) {
|
||||
this._refreshAddress();
|
||||
} else {
|
||||
|
|
@ -272,3 +279,5 @@ var WalletPage = React.createClass({
|
|||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default WalletPage;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import MediaElementPlayer from 'mediaelement';
|
||||
|
||||
var WatchPage = React.createClass({
|
||||
propTypes: {
|
||||
name: React.PropTypes.string,
|
||||
|
|
@ -43,9 +47,11 @@ var WatchPage = React.createClass({
|
|||
? <LoadScreen message={'Loading video...'} details={this.state.loadStatusMessage} />
|
||||
: <main className="full-screen">
|
||||
<video ref="player" width="100%" height="100%">
|
||||
<source type={(this.state.mimeType == 'audio/m4a' || this.state.mimeType == 'audio/mp4a-latm') ? 'video/mp4' : this.state.mimeType} src={'/view?name=' + this.props.name} />
|
||||
<source type={(this.state.mimeType == 'audio/m4a' || this.state.mimeType == 'audio/mp4a-latm') ? 'video/mp4' : this.state.mimeType} src={lbry.webUiUri + '/view?name=' + this.props.name} />
|
||||
</video>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default WatchPage;
|
||||
|
|
|
|||
23
package.json
23
package.json
|
|
@ -22,6 +22,27 @@
|
|||
"babel-cli": "^6.11.4",
|
||||
"babel-preset-es2015": "^6.13.2",
|
||||
"babel-preset-react": "^6.11.1",
|
||||
"node-sass": "^3.8.0"
|
||||
"clamp": "^1.0.1",
|
||||
"mediaelement": "^2.23.4",
|
||||
"node-sass": "^3.8.0",
|
||||
"react": "^15.4.0",
|
||||
"react-dom": "^15.4.0",
|
||||
"react-modal": "^1.5.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel": "^6.5.2",
|
||||
"babel-core": "^6.18.2",
|
||||
"babel-loader": "^6.2.8",
|
||||
"babel-plugin-react-require": "^3.0.0",
|
||||
"babel-preset-es2015": "^6.18.0",
|
||||
"babel-preset-react": "^6.16.0",
|
||||
"eslint": "^3.10.2",
|
||||
"eslint-config-airbnb": "^13.0.0",
|
||||
"eslint-loader": "^1.6.1",
|
||||
"eslint-plugin-import": "^2.2.0",
|
||||
"eslint-plugin-jsx-a11y": "^2.2.3",
|
||||
"eslint-plugin-react": "^6.7.1",
|
||||
"node-sass": "^3.13.0",
|
||||
"webpack": "^1.13.3"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
37
webpack.config.js
Normal file
37
webpack.config.js
Normal file
|
|
@ -0,0 +1,37 @@
|
|||
const path = require('path');
|
||||
|
||||
const PATHS = {
|
||||
app: path.join(__dirname, 'app'),
|
||||
dist: path.join(__dirname, 'dist')
|
||||
};
|
||||
|
||||
module.exports = {
|
||||
entry: "./js/main.js",
|
||||
output: {
|
||||
path: path.join(PATHS.dist, 'js'),
|
||||
publicPath: '/js/',
|
||||
filename: "bundle.js"
|
||||
},
|
||||
devtool: 'source-map',
|
||||
module: {
|
||||
preLoaders: [
|
||||
{
|
||||
test: /\.jsx?$/,
|
||||
loaders: ['eslint'],
|
||||
// define an include so we check just the files we need
|
||||
include: PATHS.app
|
||||
}
|
||||
],
|
||||
loaders: [
|
||||
{ test: /\.css$/, loader: "style!css" },
|
||||
{
|
||||
test: /\.jsx?$/,
|
||||
// Enable caching for improved performance during development
|
||||
// It uses default OS directory by default. If you need
|
||||
// something more custom, pass a path to it.
|
||||
// I.e., babel?cacheDirectory=<path>
|
||||
loader: 'babel?cacheDirectory'
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
Loading…
Reference in a new issue