Go all TypeScript

This commit is contained in:
Ealhad 2018-08-13 20:02:00 +02:00
parent 66f9b3a391
commit a806ba0d4b
8 changed files with 107 additions and 51 deletions

33
package-lock.json generated
View File

@ -1,9 +1,15 @@
{ {
"name": "peertubeify", "name": "peertubeify",
"version": "0.2.1", "version": "0.2.2",
"lockfileVersion": 1, "lockfileVersion": 1,
"requires": true, "requires": true,
"dependencies": { "dependencies": {
"@types/lodash": {
"version": "4.14.116",
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.116.tgz",
"integrity": "sha512-lRnAtKnxMXcYYXqOiotTmJd74uawNWuPnsnPrrO7HiFuE3npE2iQhfABatbYDyxTNqZNuXzcKGhw37R7RjBFLg==",
"dev": true
},
"@webassemblyjs/ast": { "@webassemblyjs/ast": {
"version": "1.5.13", "version": "1.5.13",
"resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.5.13.tgz", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.5.13.tgz",
@ -3847,6 +3853,19 @@
"repeat-string": "^1.6.1" "repeat-string": "^1.6.1"
} }
}, },
"ts-loader": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-4.4.2.tgz",
"integrity": "sha512-Z3Y1a7A0KZZ1s/mAZkt74l1NAF7Y5xUhD1V9VB8/1eUlUOk8Qa/oo46tO2Uu5kQ3wXypOlbv77lLQySjXEDcdw==",
"dev": true,
"requires": {
"chalk": "^2.3.0",
"enhanced-resolve": "^4.0.0",
"loader-utils": "^1.0.2",
"micromatch": "^3.1.4",
"semver": "^5.0.1"
}
},
"tslib": { "tslib": {
"version": "1.9.3", "version": "1.9.3",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.3.tgz", "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.3.tgz",
@ -3865,6 +3884,12 @@
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=", "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
"dev": true "dev": true
}, },
"typescript": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.0.1.tgz",
"integrity": "sha512-zQIMOmC+372pC/CCVLqnQ0zSBiY7HHodU7mpQdjiZddek4GMj31I3dUJ7gAs9o65X7mnRma6OokOkc6f9jjfBg==",
"dev": true
},
"uglify-es": { "uglify-es": {
"version": "3.3.9", "version": "3.3.9",
"resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.9.tgz", "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.9.tgz",
@ -4092,6 +4117,12 @@
"neo-async": "^2.5.0" "neo-async": "^2.5.0"
} }
}, },
"web-ext-types": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/web-ext-types/-/web-ext-types-2.1.0.tgz",
"integrity": "sha1-MdDb9RdimM2AYnSsxDgzhbgai7Y=",
"dev": true
},
"webpack": { "webpack": {
"version": "4.16.5", "version": "4.16.5",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-4.16.5.tgz", "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.16.5.tgz",

View File

@ -5,10 +5,14 @@
"main": "webpack.config.js", "main": "webpack.config.js",
"dependencies": {}, "dependencies": {},
"devDependencies": { "devDependencies": {
"@types/lodash": "^4.14.116",
"extract-loader": "^2.0.1", "extract-loader": "^2.0.1",
"file-loader": "^1.1.11", "file-loader": "^1.1.11",
"html-loader": "^0.5.5", "html-loader": "^0.5.5",
"lodash": "^4.17.10", "lodash": "^4.17.10",
"ts-loader": "^4.4.2",
"typescript": "^3.0.1",
"web-ext-types": "^2.1.0",
"webpack": "^4.16.5", "webpack": "^4.16.5",
"webpack-cli": "^3.1.0" "webpack-cli": "^3.1.0"
}, },

View File

@ -14,12 +14,12 @@
* PeerTubeify. If not, see <https://www.gnu.org/licenses/>. * PeerTubeify. If not, see <https://www.gnu.org/licenses/>.
*/ */
import _ from 'lodash/fp'; import * as _ from 'lodash/fp';
const buildSearchURL = (instance, query) => `https://${instance}/api/v1/search/videos?search=${encodeURIComponent(query)}`; const buildSearchURL = (instance: string, query: string): string => `https://${instance}/api/v1/search/videos?search=${encodeURIComponent(query)}`;
const search = query => new Promise(async (resolve, reject) => { const search = query => new Promise(async (resolve, reject) => {
const instance = _.getOr('framatube.org', 'searchInstance', await browser.storage.local.get()); const instance = _.getOr('framatube.org', 'searchInstance', await browser.storage.local.get()).toString();
fetch(buildSearchURL(instance, query)) fetch(buildSearchURL(instance, query))
.then(res => res.json()) .then(res => res.json())

View File

@ -1,25 +0,0 @@
import _ from 'lodash/fp';
function id(id) { return document.getElementById(id); }
function saveOptions(e) {
e.preventDefault();
browser.storage.local.set({
searchInstance: _.defaultTo('framatube.org', stripProtocol(id('search-instance').value)),
openInOriginalInstance: _.defaultTo(true, id('open-in-original-instance').checked),
});
}
function stripProtocol(url) {
return url.replace(/^https?:\/\//, '');
}
function restoreOptions() {
browser.storage.local.get().then(result => {
id('search-instance').value = _.defaultTo('framatube.org', result.searchInstance);
id('open-in-original-instance').checked = _.defaultTo(true, result.openInOriginalInstance);
})
}
document.addEventListener('DOMContentLoaded', restoreOptions);
document.querySelector('form').addEventListener('submit', saveOptions);

26
src/options.ts Normal file
View File

@ -0,0 +1,26 @@
import * as _ from 'lodash/fp';
function id(id: string): Element { return document.getElementById(id); }
const searchInstanceInput = () => id('search-instance') as HTMLInputElement;
const openInOriginalInstanceInput = () => id('open-in-original-instance') as HTMLInputElement;
function saveOptions(e) {
e.preventDefault();
browser.storage.local.set({
searchInstance: _.defaultTo('framatube.org', stripProtocol(searchInstanceInput().value)),
openInOriginalInstance: _.defaultTo(true, openInOriginalInstanceInput().checked),
});
}
const stripProtocol = _.replace(/^https?:\/\//, '');
function restoreOptions() {
browser.storage.local.get().then(result => {
searchInstanceInput().value = _.defaultTo('framatube.org', result.searchInstance as string);
openInOriginalInstanceInput().checked = _.defaultTo(true, result.openInOriginalInstance as boolean);
})
}
document.addEventListener('DOMContentLoaded', restoreOptions);
document.querySelector('form').addEventListener('submit', saveOptions);

View File

@ -14,14 +14,14 @@
* PeerTubeify. If not, see <https://www.gnu.org/licenses/>. * PeerTubeify. If not, see <https://www.gnu.org/licenses/>.
*/ */
import _ from 'lodash/fp'; import * as _ from 'lodash/fp';
const watchURL = (host, uuid) => `https://${host}/videos/watch/${uuid}`; const watchURL = (host, uuid) => `https://${host}/videos/watch/${uuid}`;
const thumbnailURL = (host, path) => `https://${host}${path}`; const thumbnailURL = (host, path) => `https://${host}${path}`;
const LINK_ID = 'peertube-link'; const LINK_ID = 'peertube-link';
function peertubeify(query) { function peertubeify(query: string) {
browser.runtime.sendMessage({ browser.runtime.sendMessage({
query query
}).then(async video => { }).then(async video => {
@ -40,7 +40,7 @@ function peertubeify(query) {
const throttledPeertubify = _.throttle(1000, peertubeify); const throttledPeertubify = _.throttle(1000, peertubeify);
const observer = new MutationObserver(function(mutationsList) { const observer = new MutationObserver(function(mutationsList) {
for (const mutation of mutationsList) { for (const mutation of mutationsList) {
if (mutation.target.classList.contains('ytp-title-link')) { if ((mutation.target as Element).classList.contains('ytp-title-link')) {
for (const node of mutation.addedNodes) { for (const node of mutation.addedNodes) {
if (node.nodeType == Node.TEXT_NODE) { if (node.nodeType == Node.TEXT_NODE) {
throttledPeertubify(node.textContent); throttledPeertubify(node.textContent);
@ -55,10 +55,10 @@ observer.observe(document.body, {
subtree: true, subtree: true,
}) })
function htmlToElement(html) { function htmlToElement(html: string) : Element {
const template = document.createElement('template'); const template = document.createElement('template');
template.innerHTML = html.trim(); template.innerHTML = html.trim();
return template.content.firstChild; return template.content.firstElementChild;
} }
const videoLink = (url, video) => htmlToElement(` const videoLink = (url, video) => htmlToElement(`

14
tsconfig.json Normal file
View File

@ -0,0 +1,14 @@
{
"compilerOptions": {
"outDir": "./built",
"allowJs": true,
"target": "es6",
"typeRoots": [
"node_modules/@types",
"node_modules/web-ext-types"
]
},
"include": [
"./src/**/*"
]
}

View File

@ -3,9 +3,9 @@ const webpack = require('webpack');
module.exports = { module.exports = {
entry: { entry: {
background: 'background.js', background: 'background.ts',
youtube: 'youtube.js', youtube: 'youtube.ts',
options: [ 'options.js', 'options.html' ], options: ['options.ts', 'options.html'],
}, },
output: { output: {
path: path.join(__dirname, 'extension', 'dist'), path: path.join(__dirname, 'extension', 'dist'),
@ -13,8 +13,7 @@ module.exports = {
publicPath: '/', publicPath: '/',
}, },
resolve: { resolve: {
// This allows you to import modules just like you would in a NodeJS app. extensions: ['.js', '.ts', '.tsx'],
extensions: ['.js'],
modules: [ modules: [
path.join(__dirname, 'src'), path.join(__dirname, 'src'),
'node_modules', 'node_modules',
@ -22,19 +21,26 @@ module.exports = {
}, },
module: { module: {
rules: [{ rules: [{
test: /\.html$/, test: /\.html$/,
use: [{ use: [{
loader: 'file-loader', loader: 'file-loader',
options: { options: {
context: 'src', context: 'src',
name: '[path][name].[ext]', name: '[path][name].[ext]',
},
},
'extract-loader',
'html-loader',
],
},
{
test: /\.tsx?$/,
exclude: /node_modules/,
use: {
loader: 'ts-loader',
}, },
}, { },
loader: 'extract-loader' ],
}, {
loader: 'html-loader',
},],
}]
}, },
plugins: [ plugins: [
// Since some NodeJS modules expect to be running in Node, it is helpful // Since some NodeJS modules expect to be running in Node, it is helpful