diff --git a/.env.defaults b/.env.defaults index 4d3218a30..f66e2bffb 100644 --- a/.env.defaults +++ b/.env.defaults @@ -1,14 +1,38 @@ # Copy this file to .env to make modifications + +# Base config +MATOMO_URL=https://analytics.lbry.com/ +MATOMO_ID=666 WEBPACK_WEB_PORT=9090 WEBPACK_ELECTRON_PORT=9091 WEB_SERVER_PORT=1337 -DOMAIN=lbry.tv -URL=https://lbry.tv -SITE_TITLE=lbry.tv -LOGO_TITLE=LBRY LBRY_WEB_API=https://api.lbry.tv LBRY_WEB_STREAMING_API=https://cdn.lbryplayer.xyz WELCOME_VERSION=1.0 + +# Custom Site info +DOMAIN=lbry.tv +URL=https://lbry.tv +# UI +SITE_TITLE=lbry.tv +SITE_NAME=LBRY +SITE_DESCRIPTION=Meet LBRY, an open, free, and community-controlled content wonderland. +LOGO_TITLE=lbry.tv +# OG + +OG_TITLE_SUFFIX=| lbry.tv +OG_HOMEPAGE_TITLE=lbry.tv +OG_IMAGE_URL= +SITE_CANONICAL_URL=https://lbry.tv +# LOCALE DEFAULT_LANGUAGE=en -MATOMO_URL=https://analytics.lbry.com/ -MATOMO_ID=6 + +# Custom Content +# If the following is true, copy custom/homepage.example.js to custom/homepage.js and modify +CUSTOM_HOMEPAGE=false +# Add up to 2 sidebar links: +# PINNED_URI_1=@Lbrylatam#2/Integracionesporseguridad#4 +# PINNED_LABEL_1=LBRY LATAM +# PINNED_URI_2=$/discover?t=lbrytvpaidbeta&fee_amount=>0&claim_type=stream&channel_ids=5af39f818f668d8c00943c9326c5201c4fe3c423,cda9c4e92f19d6fe0764524a2012056e06ca2055,760da3ba3dd85830a843beaaed543a89b7a367e7,40c36948f0da072dcba3e4833e90f71e16de78be,e8f68563d242f6ac9784dcbc41dd86c28a9391d6,7236fc5d2783ea7314d9076ae6c8a250e3992d1a,cf7792c2a37d0d76aaaff84aff0b99a8c791429d,8316ac90764fedf3147799b7b81a6575a9cc398e,8627af93c1a1219150f06b698f4b33e6ed2f1c1e,8972a1bd06de5186e5e89292b05aac8aaa817791,c5b0b17838df2f6c31162f64d55f60f34ae8bfc6,f576d5dba905fc179de880c3fe3eb3281ea74f59,97dd77c93c9603cbb2583f3589f7f5a6c92baa43,f399d873e0c37cf24de9569b5f22bbb30a5c6709,dba870d0620d41b2b9a152c961e0c06cf875ccfc,ca1fd651c9d14bf2e5088bb2aa0146ee7aeb2ae0,50ad846a4b1543b847bf3fdafb7b45f6b2f5844c,e09ff5abe9fb44dd0dd0576894a6db60a6211603,7b6f7517f6b816827d076fa0eaad550aa315a4e7,2068452c41d8da3bd68961335da0072a99258a1a,5da63df97c8255ae94a88940695b8471657dd5a1,3645cf2f5d0bdac0523f945be1c3ff60758f7845,4da85b12244839d6368b9290f1619ff9514ab2a8,4ad942982e43326c7700b1b6443049b3cfd82161,55304f219244abf82f684f759cc0c7769242f3b4,8f42e5b592bb7f7a03f4a94a86a41b1236bb099f,e2a014d885a48f5be2dc6409610996337312facb,c18996ca488753f714d36d4654715927c1d7f9c2,ebc4214424cfa683a7046e1f794fea1e44788d84,06b6d6d6a893fb589ec2ded948f5122856921ed5,07e4546674268fc0222b2ca22d31d0549dc217ee,060940e41973d4f7f16d72a2733138e931c35f41,f8d6eccd887c9cebd36b1d42aa349279b7f5c3ed,68098b8426f967b8d04cc566348b5c128823219e,2bfe6cdb24a21bdc1b76fb7c416edd50e9e85945,1f9bb08bfa2259629f4aaa9ed40f97e9a41b6fa1,2f20148495612946675fe1c8ea99171e4d950b81,bc6938fa1e09e840056c2e831abf9664f397c472,2a6194792beac5130641e932b5ac6e5a99b5ca4f,185ba2bd547a5e4a77d29fe6c1484f47db5e058f,29cc7f6081268eaa5b3f2946e0cd0b952a94812c,49389450b1241f5d8f4c8c4271a3eb56bba33965,ffdc62ac2f7549398d3aca9d2119e83d80d588d5,d7a4d2808074b0c55d6b239f69d90e7a4930f943,d58aa4a0b2f6c2504c3abce8de3f1afb71800acc,77ae23dc7eb8a75609881d4548a79e4935a89d37,f79bce8a60fbece671f6265adc39f6469f3b9b8c,051995fdf0af634e4911704057a551e9392e62b1 +# PINNED_LABEL_2=Paid Beta + diff --git a/.gitignore b/.gitignore index a0db1bbec..be7bbfa8c 100644 --- a/.gitignore +++ b/.gitignore @@ -16,6 +16,7 @@ package-lock.json /web/dist/* /web/node_modules/* /web/.env +/web/.env.defaults /custom/* !/custom/homepage.example.js .env diff --git a/README.md b/README.md index 1ed64493d..b69193883 100644 --- a/README.md +++ b/README.md @@ -104,17 +104,18 @@ You can run the web version (lbry.tv), the electron app, or both at the same tim #### Customize the web app -- Enter web directory, copy .env.defaults to .env and make changes +- In root directory, copy .env.defaults to .env and make changes ``` -cd web cp .env.defaults .env nano .env ``` +- To specify your own OG-IMAGE +You can either place a png named v2-og.png in the /custom folder or specify the OG_IMAGE_URL in .env - If you want to customize the homepage content -1. add `CUSTOM_HOMEPAGE=true` to the 'web/.env' file +1. add `CUSTOM_HOMEPAGE=true` to the '.env' file 2. copy `/custom/homepage.example.js` to `/custom/homepage.js` and make desired changes to `homepage.js` - If you want up to two custom sidebar links @@ -128,6 +129,7 @@ PINNED_LABEL_2=OtherLinkText ``` - Finally `NODE_ENV=production yarn compile:web` to rebuild +_Note: You don't need to edit the .env file in the /web folder - that is copied during compile._ #### Deploy the web app (_experimental_) diff --git a/config.js b/config.js index 4aee543b3..302966827 100644 --- a/config.js +++ b/config.js @@ -2,19 +2,26 @@ // On Desktop App, this will find .env.defaults and optional .env in root dir require('dotenv-defaults').config({silent: false}); const config = { + MATOMO_URL: process.env.MATOMO_URL, + MATOMO_ID: process.env.MATOMO_ID, WEBPACK_WEB_PORT: process.env.WEBPACK_WEB_PORT, WEBPACK_ELECTRON_PORT: process.env.WEBPACK_ELECTRON_PORT, WEB_SERVER_PORT: process.env.WEB_SERVER_PORT, - DOMAIN: process.env.DOMAIN, - URL: process.env.URL, //lbry.tv', - SITE_TITLE: process.env.SITE_TITLE, LBRY_WEB_API: process.env.LBRY_WEB_API, //api.lbry.tv', LBRY_WEB_STREAMING_API: process.env.LBRY_WEB_STREAMING_API, //cdn.lbryplayer.xyz', WELCOME_VERSION: process.env.WELCOME_VERSION, - DEFAULT_LANGUAGE: process.env.DEFAULT_LANGUAGE, - MATOMO_URL: process.env.MATOMO_URL, - MATOMO_ID: process.env.MATOMO_ID, + DOMAIN: process.env.DOMAIN, + URL: process.env.URL, + SITE_TITLE: process.env.SITE_TITLE, + SITE_NAME: process.env.SITE_NAME, + SITE_DESCRIPTION: process.env.SITE_DESCRIPTION, LOGO_TITLE: process.env.LOGO_TITLE, + OG_TITLE_SUFFIX: process.env.OG_TITLE_SUFFIX, + OG_HOMEPAGE_TITLE: process.env.OG_HOMEPAGE_TITLE, + OG_IMAGE_URL: process.env.OG_IMAGE_URL, + SITE_CANONICAL_URL: process.env.SITE_CANONICAL_URL, + DEFAULT_LANGUAGE: process.env.DEFAULT_LANGUAGE, + PINNED_URI_1: process.env.PINNED_URI_1, PINNED_LABEL_1: process.env.PINNED_LABEL_1, PINNED_URI_2: process.env.PINNED_URI_2, diff --git a/package.json b/package.json index ddfd234cd..5649159f1 100644 --- a/package.json +++ b/package.json @@ -21,8 +21,9 @@ "main": "./dist/electron/main.js", "scripts": { "compile:electron": "node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --config webpack.electron.config.js", - "compile:web": "cd web && node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --config webpack.config.js", + "compile:web": "yarn copyenv && cd web && node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --config webpack.config.js", "compile": "cross-env NODE_ENV=production yarn compile:electron && cross-env NODE_ENV=production yarn compile:web", + "copyenv": "cp ./.env* web/", "dev": "yarn dev:electron", "dev:electron": "cross-env NODE_ENV=development node ./electron/devServer.js", "dev:web": "cd web && yarn dev", diff --git a/static/app-strings.json b/static/app-strings.json index 6ad701464..dfbfa039d 100644 --- a/static/app-strings.json +++ b/static/app-strings.json @@ -1258,6 +1258,7 @@ "Email Preferences": "Email Preferences", "Opt out of any topics you don't want to receive email about.": "Opt out of any topics you don't want to receive email about.", "Uncheck your email below if you want to stop receiving messages.": "Uncheck your email below if you want to stop receiving messages.", + "Delete Your Channel": "Delete Your Channel", "Remove from Blocked List": "Remove from Blocked List", "Are you sure you want to remove this from the list?": "Are you sure you want to remove this from the list?", "Cover": "Cover", diff --git a/static/index-web.html b/static/index-web.html index 7ee11792e..5a6e5dcfb 100644 --- a/static/index-web.html +++ b/static/index-web.html @@ -64,13 +64,6 @@ - lbry.tv - - - - - - diff --git a/web/.env.defaults b/web/.env.defaults deleted file mode 100644 index f486f5dd3..000000000 --- a/web/.env.defaults +++ /dev/null @@ -1,22 +0,0 @@ -# Copy this file to .env to make modifications -WEBPACK_WEB_PORT=9090 -WEBPACK_ELECTRON_PORT=9091 -WEB_SERVER_PORT=1337 -DOMAIN=lbry.tv -URL=https://lbry.tv -SITE_TITLE=lbry.tv -LOGO_TITLE=lbry.tv -LBRY_WEB_API=https://api.lbry.tv -LBRY_WEB_STREAMING_API=https://cdn.lbryplayer.xyz -WELCOME_VERSION=1.0 -DEFAULT_LANGUAGE=en -MATOMO_URL=https://analytics.lbry.com/ -MATOMO_ID=3 -# If true, supply copy example to homepage.js in -CUSTOM_HOMEPAGE=false -# Add up to 2 sidebar links: -# PINNED_URI_1=@Lbrylatam#2/Integracionesporseguridad#4 -# PINNED_LABEL_1=LBRY LATAM -# PINNED_URI_2=$/discover?t=lbrytvpaidbeta&fee_amount=>0&claim_type=stream&channel_ids=5af39f818f668d8c00943c9326c5201c4fe3c423,cda9c4e92f19d6fe0764524a2012056e06ca2055,760da3ba3dd85830a843beaaed543a89b7a367e7,40c36948f0da072dcba3e4833e90f71e16de78be,e8f68563d242f6ac9784dcbc41dd86c28a9391d6,7236fc5d2783ea7314d9076ae6c8a250e3992d1a,cf7792c2a37d0d76aaaff84aff0b99a8c791429d,8316ac90764fedf3147799b7b81a6575a9cc398e,8627af93c1a1219150f06b698f4b33e6ed2f1c1e,8972a1bd06de5186e5e89292b05aac8aaa817791,c5b0b17838df2f6c31162f64d55f60f34ae8bfc6,f576d5dba905fc179de880c3fe3eb3281ea74f59,97dd77c93c9603cbb2583f3589f7f5a6c92baa43,f399d873e0c37cf24de9569b5f22bbb30a5c6709,dba870d0620d41b2b9a152c961e0c06cf875ccfc,ca1fd651c9d14bf2e5088bb2aa0146ee7aeb2ae0,50ad846a4b1543b847bf3fdafb7b45f6b2f5844c,e09ff5abe9fb44dd0dd0576894a6db60a6211603,7b6f7517f6b816827d076fa0eaad550aa315a4e7,2068452c41d8da3bd68961335da0072a99258a1a,5da63df97c8255ae94a88940695b8471657dd5a1,3645cf2f5d0bdac0523f945be1c3ff60758f7845,4da85b12244839d6368b9290f1619ff9514ab2a8,4ad942982e43326c7700b1b6443049b3cfd82161,55304f219244abf82f684f759cc0c7769242f3b4,8f42e5b592bb7f7a03f4a94a86a41b1236bb099f,e2a014d885a48f5be2dc6409610996337312facb,c18996ca488753f714d36d4654715927c1d7f9c2,ebc4214424cfa683a7046e1f794fea1e44788d84,06b6d6d6a893fb589ec2ded948f5122856921ed5,07e4546674268fc0222b2ca22d31d0549dc217ee,060940e41973d4f7f16d72a2733138e931c35f41,f8d6eccd887c9cebd36b1d42aa349279b7f5c3ed,68098b8426f967b8d04cc566348b5c128823219e,2bfe6cdb24a21bdc1b76fb7c416edd50e9e85945,1f9bb08bfa2259629f4aaa9ed40f97e9a41b6fa1,2f20148495612946675fe1c8ea99171e4d950b81,bc6938fa1e09e840056c2e831abf9664f397c472,2a6194792beac5130641e932b5ac6e5a99b5ca4f,185ba2bd547a5e4a77d29fe6c1484f47db5e058f,29cc7f6081268eaa5b3f2946e0cd0b952a94812c,49389450b1241f5d8f4c8c4271a3eb56bba33965,ffdc62ac2f7549398d3aca9d2119e83d80d588d5,d7a4d2808074b0c55d6b239f69d90e7a4930f943,d58aa4a0b2f6c2504c3abce8de3f1afb71800acc,77ae23dc7eb8a75609881d4548a79e4935a89d37,f79bce8a60fbece671f6265adc39f6469f3b9b8c,051995fdf0af634e4911704057a551e9392e62b1 -# PINNED_LABEL_2=Paid Beta - diff --git a/web/src/html.js b/web/src/html.js index 234fc2369..de6384012 100644 --- a/web/src/html.js +++ b/web/src/html.js @@ -1,4 +1,13 @@ -const { URL } = require('../../config.js'); +const { + URL, + SITE_TITLE, + SITE_CANONICAL_URL, + OG_HOMEPAGE_TITLE, + OG_TITLE_SUFFIX, + OG_IMAGE_URL, + SITE_DESCRIPTION, + SITE_NAME, +} = require('../../config.js'); const { generateEmbedUrl, generateStreamUrl } = require('../../ui/util/web'); const PAGES = require('../../ui/constants/pages'); const { getClaim } = require('./chainquery'); @@ -36,17 +45,28 @@ function escapeHtmlProperty(property) { function buildOgMetadata(overrideOptions = {}) { const { title, description } = overrideOptions; const head = - 'lbry.tv\n' + + `${SITE_TITLE}\n` + `\n` + - `\n` + - '\n' + - `\n` + - `\n` + + `\n` + + `\n` + + `\n` + + `\n` + '\n' + - `\n` + - ''; + `\n` + + `\n` + + `\n` + + `\n` + + '\n' + + ``; + return head; +} +function buildBasicOgMetadata() { + const head = '' + buildOgMetadata() + ''; return head; } @@ -61,7 +81,7 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { const claimDescription = claim.description && claim.description.length > 0 ? escapeHtmlProperty(truncateDescription(claim.description)) - : `View ${claimTitle} on lbry.tv`; + : `View ${claimTitle} on ${SITE_NAME}`; const claimLanguage = escapeHtmlProperty(claim.language) || 'en_US'; let imageThumbnail; @@ -69,7 +89,7 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { if (Number(claim.fee) <= 0 && claim.source_media_type && claim.source_media_type.startsWith('image/')) { imageThumbnail = generateStreamUrl(claim.name, claim.claim_id); } - const claimThumbnail = escapeHtmlProperty(claim.thumbnail_url) || imageThumbnail || `${URL}/v2-og.png`; + const claimThumbnail = escapeHtmlProperty(claim.thumbnail_url) || imageThumbnail || `${URL}/public/v2-og.png`; // Allow for ovverriding default claim based og metadata const title = overrideOptions.title || claimTitle; @@ -88,11 +108,14 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { head += ``; head += ``; head += ``; - head += ``; + head += ``; head += ``; head += ``; + head += ``; // below should be canonical_url, but not provided by chainquery yet head += ``; + head += ``; + head += ``; if ( claim.source_media_type && @@ -131,11 +154,11 @@ async function getClaimFromChainquery(url) { return undefined; } -module.exports.getHtml = async function getHtml(ctx) { +async function getHtml(ctx) { const path = decodeURIComponent(ctx.path); - if (path.length === 0) { - return insertToHead(html); + const ogMetadata = buildBasicOgMetadata(); + return insertToHead(html, ogMetadata); } const invitePath = `/$/${PAGES.INVITE}/`; @@ -187,5 +210,8 @@ module.exports.getHtml = async function getHtml(ctx) { } } - return insertToHead(html); -}; + const ogMetadata = buildBasicOgMetadata(); + return insertToHead(html, ogMetadata); +} + +module.exports = { insertToHead, buildBasicOgMetadata, getHtml }; diff --git a/web/webpack.config.js b/web/webpack.config.js index 828c7e6a2..d83d5c552 100644 --- a/web/webpack.config.js +++ b/web/webpack.config.js @@ -5,7 +5,9 @@ const baseConfig = require('../webpack.base.config.js'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const { DefinePlugin, ProvidePlugin } = require('webpack'); const SentryWebpackPlugin = require('@sentry/webpack-plugin'); +const { insertToHead, buildBasicOgMetadata } = require('./src/html'); +const CUSTOM_ROOT = path.resolve(__dirname, '../custom'); const STATIC_ROOT = path.resolve(__dirname, '../static/'); const UI_ROOT = path.resolve(__dirname, '../ui/'); const DIST_ROOT = path.resolve(__dirname, 'dist/'); @@ -18,6 +20,9 @@ let plugins = [ { from: `${STATIC_ROOT}/index-web.html`, to: `${DIST_ROOT}/index.html`, + transform(content, path) { + return insertToHead(content.toString(), buildBasicOgMetadata()); + }, }, { from: `${STATIC_ROOT}/img/favicon.png`, @@ -27,6 +32,12 @@ let plugins = [ from: `${STATIC_ROOT}/img/v2-og.png`, to: `${DIST_ROOT}/public/v2-og.png`, }, + { + from: `${CUSTOM_ROOT}/v2-og.png`, + to: `${DIST_ROOT}/public/v2-og.png`, + force: true, + noErrorOnMissing: true, + }, { from: `${STATIC_ROOT}/font/`, to: `${DIST_ROOT}/public/font/`,