-
Notifications
You must be signed in to change notification settings - Fork 42
Add ons
The website currently provides two sections of add-ons (the current version of Kodi and one version back). During beta for the next version of Kodi, that one is also added. The add-on section of the website for each Kodi version is created based on the addons.xml
file for that version and is downloaded from the mirrors each time the site is built. A separate node app runs as a Github action to download and parse the addons.xml
file and saves it as three JSON files (addons.json, categories.json, and authors.json) and downloads any needed images. A custom Gatsby plugin loads those json files to build the addon pages for each version.
There are many pieces that work together to create the add-on section of the web site. This section provides an overview of that pieces. A section further down describes in detail how to setup a new section for a new version of Kodi.
This script lives in scripts/addon-parser
. It is run daily at 2am UTC via a Github action on the kodi-tv
repo (controlled from .github/workflows/update-addon-history.yml
. You can also run it manually from the Github web site. If you want to run it locally for some reason, you need to run npm install
from within the addon-parser directory. To run it the command is node app.js --kv=<kodiversionname>. This app downloads the
addons.xmlfile from the repo named when the app is run, parses it, and saves out three JSON files (addons.json, authors.json, and categories.json) in
src/data/addons/`. Here's the portion of the workflow file that runs script against a given repo:
- name: Run addon-parser for Matrix branch
run: node app.js --kv=matrix
This plugin lives in the plugins
directory. It reads the three files generated by the addon-parser
app as well as the file in src/data/addons/<version>/featured.yaml
to generate the add-on pages for each version of Kodi we are monitoring.
There is entry in plugins section of the gatsby-config.js
file that specifies which repos to use. Here's what that looks like:
{
resolve: "gatsby-source-kodiaddon",
options: {
kodiversion: ["leia, "matrix"]
},
},
There is a section of the CMS configuration file that defines the area that is used to manage featured add-ons from the web. It looks like this:
- name: 'featuredaddons'
label: 'Featured Add-ons'
files:
- name: 'matrixfeaturedlist'
label: "Matrix Featured Add-ons List"
file: 'src/data/addons/matrix/featured.yaml'
fields:
- name: 'addons'
label: 'Add-ons'
label_singular: 'Add-on'
widget: 'list'
summary: '{{addonid}}'
fields:
- { name: 'addonid', label: 'Add-on ID', widget: 'string' }
- name: 'leiafeaturedlist'
label: "Leia Featured Add-ons List"
file: 'src/data/addons/leia/featured.yaml'
fields:
- name: 'addons'
label: 'Add-ons'
label_singular: 'Add-on'
widget: 'list'
summary: '{{addonid}}'
fields:
The file src/content/pages/addons/index.md
is the main page for all add-ons and can be edited via the web CMS. There is a link in that file to the add-on section for each version of Kodi.
Each version of Kodi we are providing on the web site has it's own set of pages as well.
-
src/pages/addons/<version>/index.tsx
is the main page for each section and has dynamically generate content for featured add-ons, new add-ons, updated addons, as well as the categories of add-ons available. -
src/pages/addons/<version>/search.tsx
is the add-on search interface for that Kodi version's add-ons. -
src/pages/addons/<version>/top-authors.tsx
is the dynamically generated list of top add-on authors for that Kodi version.
Each Kodi version has a set of entries in gatsby-node.js
that initiates the generation of the pages for the add-ons section. It looks like this:
// *** Begin Matrix Addon Page Builds
const matrixaddonresults = await graphql(`
query MyQuery {
allMatrixAddon {
edges {
node {
slug
}
}
}
}
`)
matrixaddonresults.data.allMatrixAddon.edges.forEach(({ node }) => {
createPage({
path: "addons/matrix/" + node.slug,
component: path.resolve(`src/templates/matrix/addon.tsx`),
context: {
// Data passed to context is available
// in page queries as GraphQL variables.
slug: node.slug,
},
})
})
const matrixcategoryresults = await graphql(`
query MyQuery {
allMatrixCategory {
edges {
node {
slug
}
}
}
}
`)
matrixcategoryresults.data.allMatrixCategory.edges.forEach(({ node }) => {
createPage({
path: "addons/matrix/category/" + node.slug,
component: path.resolve(`src/templates/matrix/category.tsx`),
context: {
// Data passed to context is available
// in page queries as GraphQL variables.
slug: node.slug,
},
})
})
const matrixauthorresults = await graphql(`
query MyQuery {
allMatrixAuthor {
edges {
node {
slug
}
}
}
}
`)
matrixauthorresults.data.allMatrixAuthor.edges.forEach(({ node }) => {
createPage({
path: "addons/matrix/author/" + node.slug,
component: path.resolve(`src/templates/matrix/author.tsx`),
context: {
// Data passed to context is available
// in page queries as GraphQL variables.
slug: node.slug,
},
})
})
// *** End Matrix Addon Page Builds
Each Kodi version has a folder of templates in /src/templates/<version>/
that generate various pages:
-
addon.tsx
generates the add-on details page for every add-on. -
author.tsx
generates the author page for everyone author. This is primarily a list of the add-ons that author created. -
categories.tsx
generates the page that contains a list of add-ons for a given category.
For each add-ons section you want, you need to do a set of things:
- Add the new Kodi version to the Github actions workflow file (in the
main
branch) and delete the one you are retiring. - Copy the current version folder from
src/data/addons/
and rename it to the current version. - Run the addon-parser app once on the new repo to generate the needed files and download the new images. To do that go to the kodi-tv folder you downloaded and cd to
scripts/addon-parser
and then runnode app.js --kv=<version_name>
. - In
gatsby-config.js
look for thegatsby-source-kodiaddon
section in the plugins area and update thekodiversion
entry to include the versions of Kodi you want to monitor. - In
gatsby-node.js
copy the area that initiates the page generation (see above for example) and then change the version name as needed. Please note that capitalization will matter here, so match your change to the original. - In
src/templates/
copy the folder from the current version of Kodi and rename it to the new version. In each file in that folder, update the graphQL at the bottom to use the correct name for the new add-on branch. - In
/src/pages/addons/
copy the folder from the current version of Kodi and rename it to the new version. In each file in that folder, update the with the correct version name as needed. - In
/src/content/pages/addons/index.md
add a link to the add-ons for the new version of Kodi (this can be done via the web CMS). - In
/static/admin/config.yml
copy thefiles
section (see example above) for the current version of Kodi and the update the version name where needed. - In
components/Header.tsx
find the Add-ons section of the main menu dict and update it as needed to add/delete the appropriate versions of Kodi.