mirror of
https://github.com/hensm/fx_cast.git
synced 2026-06-08 08:39:59 +00:00
Switch from babel to typescript for initial ext conversion
This commit is contained in:
hensm
6
app/package-lock.json
generated
6
app/package-lock.json
generated
@@ -2213,12 +2213,6 @@
|
||||
"prelude-ls": "~1.1.2"
|
||||
}
|
||||
},
|
||||
"typescript": {
|
||||
"version": "3.3.3333",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.3.3333.tgz",
|
||||
"integrity": "sha512-JjSKsAfuHBE/fB2oZ8NxtRTk5iGcg6hkYXMnZ3Wc+b2RSqejEqTaem11mHASMnFilHrax3sLK0GDzcJrekZYLw==",
|
||||
"dev": true
|
||||
},
|
||||
"uid2": {
|
||||
"version": "0.0.3",
|
||||
"resolved": "https://registry.npmjs.org/uid2/-/uid2-0.0.3.tgz",
|
||||
|
||||
@@ -25,8 +25,7 @@
|
||||
"@types/mime-types": "^2.1.0",
|
||||
"@types/node": "^11.9.5",
|
||||
"mustache": "^3.0.1",
|
||||
"pkg": "^4.3.5",
|
||||
"typescript": "^3.3.3333"
|
||||
"pkg": "^4.3.5"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"rage-edit": "^1.2.0"
|
||||
|
||||
1208
ext/package-lock.json
generated
1208
ext/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -11,16 +11,12 @@
|
||||
"start": "web-ext run -s ../dist/ext/"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.3.3",
|
||||
"@babel/plugin-proposal-class-properties": "^7.3.3",
|
||||
"@babel/plugin-proposal-do-expressions": "^7.2.0",
|
||||
"@babel/plugin-proposal-object-rest-spread": "^7.3.2",
|
||||
"@babel/preset-env": "^7.3.1",
|
||||
"@babel/preset-react": "^7.0.0",
|
||||
"babel-loader": "^8.0.4",
|
||||
"@types/react": "^16.8.4",
|
||||
"@types/react-dom": "^16.8.2",
|
||||
"copy-webpack-plugin": "^4.6.0",
|
||||
"preact": "^8.4.2",
|
||||
"preact-compat": "^3.18.4",
|
||||
"ts-loader": "^5.3.3",
|
||||
"uuid": "^3.3.2",
|
||||
"web-ext": "^2.9.1",
|
||||
"webpack": "^4.27.0",
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
"use strict";
|
||||
|
||||
export function getNextEllipsis (ellipsis) {
|
||||
return do {
|
||||
if (ellipsis === "") ".";
|
||||
else if (ellipsis === ".") "..";
|
||||
else if (ellipsis === "..") "...";
|
||||
else if (ellipsis === "...") "";
|
||||
};
|
||||
return {
|
||||
"": "."
|
||||
, ".": ".."
|
||||
, "..": "..."
|
||||
, "...": ""
|
||||
}[ellipsis];
|
||||
}
|
||||
|
||||
export function getWindowCenteredProps (refWin, width, height) {
|
||||
|
||||
@@ -60,31 +60,25 @@ const BridgeStats = (props) => (
|
||||
<tr>
|
||||
<th>{ _("optionsBridgeStatsCompatibility") }</th>
|
||||
<td>
|
||||
{ do {
|
||||
if (props.info.isVersionCompatible) {
|
||||
if (props.info.isVersionExact) {
|
||||
_("optionsBridgeCompatible")
|
||||
} else {
|
||||
_("optionsBridgeLikelyCompatible")
|
||||
}
|
||||
} else {
|
||||
_("optionsBridgeIncompatible")
|
||||
}
|
||||
}}
|
||||
{ props.info.isVersionCompatible
|
||||
? props.info.isVersionExact
|
||||
? _("optionsBridgeCompatible")
|
||||
: _("optionsBridgeLikelyCompatible")
|
||||
: _("optionsBridgeIncompatible") }
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>{ _("optionsBridgeStatsRecommendedAction") }</th>
|
||||
<td>
|
||||
{ do {
|
||||
if (props.info.isVersionOlder) {
|
||||
_("optionsBridgeOlderAction")
|
||||
} else if (props.info.isVersionNewer) {
|
||||
_("optionsBridgeNewerAction")
|
||||
} else {
|
||||
_("optionsBridgeNoAction")
|
||||
}
|
||||
}}
|
||||
{ // If older
|
||||
props.info.isVersionOlder
|
||||
? _("optionsBridgeOlderAction")
|
||||
// else if newer
|
||||
: props.info.isVersionNewer
|
||||
? _("optionsBridgeNewerAction")
|
||||
// else
|
||||
: _("optionsBridgeNoAction")
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
@@ -227,127 +221,110 @@ export default class Bridge extends Component {
|
||||
}
|
||||
|
||||
|
||||
renderStatus () {
|
||||
const infoClasses = `bridge__info ${this.props.info
|
||||
? "bridge__info--found"
|
||||
: "bridge__info--not-found"}`;
|
||||
|
||||
let statusIcon;
|
||||
let statusTitle;
|
||||
let statusText;
|
||||
|
||||
if (!this.props.info) {
|
||||
statusIcon = "assets/icons8-cancel-120.png";
|
||||
statusTitle = _("optionsBridgeNotFoundStatusTitle");
|
||||
statusText = _("optionsBridgeNotFoundStatusText");
|
||||
} else {
|
||||
if (this.props.info.isVersionCompatible) {
|
||||
statusIcon = "assets/icons8-ok-120.png";
|
||||
statusTitle = _("optionsBridgeFoundStatusTitle";
|
||||
} else {
|
||||
statusIcon = "assets/icons8-warn-120.png";
|
||||
statusTitle = _("optionsBridgeIssueStatusTitle");
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={infoClasses}>
|
||||
<div className="bridge__status">
|
||||
<img className="bridge__status-icon"
|
||||
width="60" height="60"
|
||||
src={ statusIcon } />
|
||||
|
||||
<h2 className="bridge__status-title">
|
||||
{ statusTitle }
|
||||
</h2>
|
||||
|
||||
{ statusText &&
|
||||
<p className="bridge__status-text">
|
||||
{ statusText }
|
||||
</p> }
|
||||
</div>
|
||||
|
||||
{ this.props.info &&
|
||||
<BridgeStats info={ this.props.info }/> }
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="bridge">
|
||||
{ do {
|
||||
if (this.props.loading) {
|
||||
<div className="bridge__loading">
|
||||
{ this.props.loading
|
||||
? ( <div className="bridge__loading">
|
||||
{ _("optionsBridgeLoading") }
|
||||
<progress></progress>
|
||||
</div>
|
||||
} else {
|
||||
const infoClasses = `bridge__info ${this.props.info
|
||||
? "bridge__info--found"
|
||||
: "bridge__info--not-found"}`;
|
||||
: this.renderStatus() }
|
||||
|
||||
const [ statusIcon, statusTitle, statusText ] = do {
|
||||
if (!this.props.info) {
|
||||
[ "assets/icons8-cancel-120.png"
|
||||
, _("optionsBridgeNotFoundStatusTitle")
|
||||
, _("optionsBridgeNotFoundStatusText") ]
|
||||
} else {
|
||||
if (this.props.info.isVersionCompatible) {
|
||||
[ "assets/icons8-ok-120.png"
|
||||
, _("optionsBridgeFoundStatusTitle") ]
|
||||
} else {
|
||||
[ "assets/icons8-warn-120.png"
|
||||
, _("optionsBridgeIssueStatusTitle") ]
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
<div className={infoClasses}>
|
||||
<div className="bridge__status">
|
||||
<img className="bridge__status-icon"
|
||||
width="60" height="60"
|
||||
src={ statusIcon } />
|
||||
|
||||
<h2 className="bridge__status-title">
|
||||
{ statusTitle }
|
||||
</h2>
|
||||
|
||||
{ do {
|
||||
if (statusText) {
|
||||
<p className="bridge__status-text">
|
||||
{ statusText }
|
||||
</p>
|
||||
}
|
||||
}}
|
||||
</div>
|
||||
|
||||
{ do {
|
||||
if (this.props.info) {
|
||||
<BridgeStats info={ this.props.info }/>
|
||||
}
|
||||
}}
|
||||
</div>
|
||||
}
|
||||
}}
|
||||
|
||||
{ do {
|
||||
if (!this.props.loading) {
|
||||
<div className="bridge__update-info">
|
||||
{ do {
|
||||
if (this.state.isUpdateAvailable) {
|
||||
<div className="bridge__update">
|
||||
<p className="bridge__update-label">
|
||||
{ _("optionsBridgeUpdateAvailable") }
|
||||
</p>
|
||||
<div className="bridge__update-options">
|
||||
{ do {
|
||||
if (this.props.platform === "linux") {
|
||||
<select className="bridge__update-package-type"
|
||||
onChange={ this.onPackageTypeChange }
|
||||
value={ this.state.packageType }>
|
||||
<option value="" disabled selected>
|
||||
{ _("optionsBridgeUpdatePackageTypeSelect") }
|
||||
</option>
|
||||
<option value="deb">
|
||||
{ _("optionsBridgeUpdatePackageTypeDeb") }
|
||||
</option>
|
||||
<option value="rpm">
|
||||
{ _("optionsBridgeUpdatePackageTypeRpm") }
|
||||
</option>
|
||||
</select>
|
||||
}
|
||||
}}
|
||||
<button className="bridge__update-start"
|
||||
onClick={ this.onUpdate }
|
||||
disabled={ this.props.platform === "linux"
|
||||
&& !this.state.packageType }>
|
||||
{ _("optionsBridgeUpdate") }
|
||||
</button>
|
||||
</div>
|
||||
{ !this.props.loading &&
|
||||
<div className="bridge__update-info">
|
||||
{ this.state.isUpdateAvailable
|
||||
? (
|
||||
<div className="bridge__update">
|
||||
<p className="bridge__update-label">
|
||||
{ _("optionsBridgeUpdateAvailable") }
|
||||
</p>
|
||||
<div className="bridge__update-options">
|
||||
{ this.props.platform === "linux" &&
|
||||
<select className="bridge__update-package-type"
|
||||
onChange={ this.onPackageTypeChange }
|
||||
value={ this.state.packageType }>
|
||||
<option value="" disabled selected>
|
||||
{ _("optionsBridgeUpdatePackageTypeSelect") }
|
||||
</option>
|
||||
<option value="deb">
|
||||
{ _("optionsBridgeUpdatePackageTypeDeb") }
|
||||
</option>
|
||||
<option value="rpm">
|
||||
{ _("optionsBridgeUpdatePackageTypeRpm") }
|
||||
</option>
|
||||
</select> }
|
||||
<button className="bridge__update-start"
|
||||
onClick={ this.onUpdate }
|
||||
disabled={ this.props.platform === "linux"
|
||||
&& !this.state.packageType }>
|
||||
{ _("optionsBridgeUpdate") }
|
||||
</button>
|
||||
</div>
|
||||
} else {
|
||||
<button className="bridge__update-check"
|
||||
disabled={ this.state.isCheckingUpdates }
|
||||
onClick={ this.onCheckUpdates }>
|
||||
</div>
|
||||
) : (
|
||||
<button className="bridge__update-check"
|
||||
disabled={ this.state.isCheckingUpdates }
|
||||
onClick={ this.onCheckUpdates }>
|
||||
|
||||
{ do {
|
||||
if (this.state.isCheckingUpdates) {
|
||||
_("optionsBridgeUpdateChecking"
|
||||
, getNextEllipsis(this.state.checkUpdatesEllipsis));
|
||||
} else {
|
||||
_("optionsBridgeUpdateCheck");
|
||||
}
|
||||
}}
|
||||
</button>
|
||||
}
|
||||
}}
|
||||
{ this.state.isCheckingUpdates
|
||||
? _("optionsBridgeUpdateChecking"
|
||||
, getNextEllipsis(this.state.checkUpdatesEllipsis))
|
||||
: _("optionsBridgeUpdateCheck") }
|
||||
</button>
|
||||
)}
|
||||
|
||||
<div className="bridge--update-status">
|
||||
{ do {
|
||||
if (this.state.updateStatus
|
||||
&& !this.state.isUpdateAvailable) {
|
||||
this.state.updateStatus;
|
||||
}
|
||||
}}
|
||||
</div>
|
||||
<div className="bridge--update-status">
|
||||
{ this.state.updateStatus && !this.state.isUpdateAvailable
|
||||
&& this.state.updateStatus }
|
||||
</div>
|
||||
}
|
||||
}}
|
||||
</div> }
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -56,14 +56,13 @@ export default class EditableList extends Component {
|
||||
|
||||
return {
|
||||
rawView: true
|
||||
, rawViewValue: [...currentState.items.values()].join("\n")
|
||||
, rawViewValue: Array.from(currentState.items.values()).join("\n")
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
handleSaveRaw () {
|
||||
this.setState(currentState => {
|
||||
console.log(currentState.rawViewValue);
|
||||
const newItems = currentState.rawViewValue.split("\n")
|
||||
.filter(item => item !== "");
|
||||
|
||||
@@ -137,15 +136,15 @@ export default class EditableList extends Component {
|
||||
</button>
|
||||
</div>
|
||||
<hr />
|
||||
{ do {
|
||||
if (this.state.rawView) {
|
||||
{ this.state.rawView
|
||||
? (
|
||||
<textarea className="editable-list__raw-view"
|
||||
rows={ items.length}
|
||||
value={ this.state.rawViewValue}
|
||||
onChange={ this.handleRawViewTextAreaChange }
|
||||
ref={ el => { this.rawViewTextArea = el }}>
|
||||
</textarea>
|
||||
} else {
|
||||
) : (
|
||||
<ul className="editable-list__items">
|
||||
{ items.map((item, i) =>
|
||||
<EditableListItem text={ item }
|
||||
@@ -169,8 +168,7 @@ export default class EditableList extends Component {
|
||||
</button>
|
||||
</div>
|
||||
</ul>
|
||||
}
|
||||
}}
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -323,11 +323,7 @@ class App extends Component {
|
||||
|
||||
<div id="buttons">
|
||||
<div id="status-line">
|
||||
{ do {
|
||||
if (this.state.hasSaved) {
|
||||
_("optionsSaved")
|
||||
}
|
||||
}}
|
||||
{ this.state.hasSaved && _("optionsSaved") }
|
||||
</div>
|
||||
<button onClick={ this.handleReset }>
|
||||
{ _("optionsReset") }
|
||||
|
||||
@@ -187,25 +187,18 @@ class Receiver extends Component {
|
||||
{ `${this.props.receiver.address}:${this.props.receiver.port}` }
|
||||
</div>
|
||||
<div className="receiver-status">
|
||||
{ do {
|
||||
if (this.props.receiver.currentApp) {
|
||||
`- ${this.props.receiver.currentApp}`
|
||||
}
|
||||
}}
|
||||
{ this.props.receiver.currentApp &&
|
||||
`- ${this.props.receiver.currentApp}` }
|
||||
</div>
|
||||
<button className="receiver-connect"
|
||||
onClick={this.onClick.bind(this)}
|
||||
disabled={this.props.isLoading}>
|
||||
{ do {
|
||||
if (this.state.isLoading) {
|
||||
_("popupCastingButtonLabel") +
|
||||
(this.state.isLoading
|
||||
? this.state.ellipsis
|
||||
: "" )
|
||||
} else {
|
||||
_("popupCastButtonLabel")
|
||||
}
|
||||
}}
|
||||
{ this.state.isLoading
|
||||
? _("popupCastingButtonLabel") +
|
||||
(this.state.isLoading
|
||||
? this.state.ellipsis
|
||||
: "")
|
||||
: _("popupCastButtonLabel") }
|
||||
</button>
|
||||
</li>
|
||||
);
|
||||
|
||||
14
ext/tsconfig.json
Normal file
14
ext/tsconfig.json
Normal file
@@ -0,0 +1,14 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"allowJs": true
|
||||
, "sourceMap": true
|
||||
, "target": "es6"
|
||||
, "noImplicitAny": true
|
||||
, "esModuleInterop": true
|
||||
, "moduleResolution": "node"
|
||||
, "resolveJsonModule": true
|
||||
, "removeComments": true
|
||||
, "jsx": "react"
|
||||
, "lib": [ "esnext", "dom" ]
|
||||
}
|
||||
}
|
||||
@@ -21,7 +21,7 @@ module.exports = (env) => ({
|
||||
}
|
||||
, output: {
|
||||
filename: "[name].js"
|
||||
, path: `${env.outputPath}`
|
||||
, path: env.outputPath
|
||||
}
|
||||
, plugins: [
|
||||
new webpack.DefinePlugin({
|
||||
@@ -65,23 +65,14 @@ module.exports = (env) => ({
|
||||
, module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.jsx?$/
|
||||
test: /\.(js|ts)x?$/
|
||||
, resolve: {
|
||||
extensions: [ ".js", ".jsx" ]
|
||||
extensions: [ ".js", ".jsx"
|
||||
, ".ts", ".tsx" ]
|
||||
}
|
||||
, include: `${env.includePath}`
|
||||
, include: env.includePath
|
||||
, use: {
|
||||
loader: "babel-loader"
|
||||
, options: {
|
||||
presets: [
|
||||
"@babel/preset-react"
|
||||
]
|
||||
, plugins: [
|
||||
"@babel/proposal-class-properties"
|
||||
, "@babel/proposal-do-expressions"
|
||||
, "@babel/proposal-object-rest-spread"
|
||||
]
|
||||
}
|
||||
loader: "ts-loader"
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
6
package-lock.json
generated
6
package-lock.json
generated
@@ -450,6 +450,12 @@
|
||||
"os-tmpdir": "~1.0.1"
|
||||
}
|
||||
},
|
||||
"typescript": {
|
||||
"version": "3.3.3333",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.3.3333.tgz",
|
||||
"integrity": "sha512-JjSKsAfuHBE/fB2oZ8NxtRTk5iGcg6hkYXMnZ3Wc+b2RSqejEqTaem11mHASMnFilHrax3sLK0GDzcJrekZYLw==",
|
||||
"dev": true
|
||||
},
|
||||
"universalify": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
|
||||
|
||||
@@ -20,6 +20,7 @@
|
||||
"minimist": "^1.2.0",
|
||||
"selenium-webdriver": "^4.0.0-alpha.1",
|
||||
"semver": "^5.6.0",
|
||||
"typescript": "^3.3.3333",
|
||||
"ws": "^6.1.2"
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user