Release/3.0.0 - Docusaurus Update

.github/CODEOWNERS

@@ -2,4 +2,4 @@
 # Each line is a file pattern followed by one or more owners.
 
 # These owners will be the default owners for everything in the repo.
-* @902seanryan @aberkie @deycorinne
+* @902seanryan @deycorinne

.gitignore

@@ -1,4 +1,21 @@
-node_modules
-dist
-public/springroll-io-demo-game
-springroll-io-demo-game
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+static/springroll-io-demo-game
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

.nvmrc

@@ -0,0 +1 @@
+v20.9.0

CHANGELOG.md

@@ -4,6 +4,45 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [3.0.0] - 2024-10-11
+## Changed
+- This is a complete rewrite of SpringRoll.io using the [Docusaurus](https://docusaurus.io/) framework.
+- The site now uses React instead of Vue, and is responsive.
+- All example content has been ported over. It's included as part of the `Examples` section. `Game Demo` and `Scale Manager` have also been moved to this section. 
+- All example UI elements have been updated to follow the styles and standards of the new site. Notable updates will be outlined below.
+
+#### Game Demo Changes
+- The game demo has had all of its packages updated. 
+- Implemented `SafeScaleManager`. 
+- The title screen has been updated.
+- Captions styling has been updated.
+- The demo is now displayed using SpringRoll Container instead of just using Bellhop.
+
+#### Color Filter Changes
+- The example image is no longer stretched. 
+
+#### Resize Changes
+- This example now uses the `SafeScaleManager` instead of `ScaleManager`. 
+
+#### Bellhop
+- This example has been simplified to only demonstrate how to use Bellhop without using SpringRoll specific events.
+
+#### Indexed DB
+- The data display table was rewritten and simplified. It was using a built-in Vue component. 
+- The help section below the example now has a horizontal row of tabs instead of vertical.
+- There are new error checks for things that used to silently fail.
+- A few bugs were identified in the SpringRoll IDB implementation. Opening and deleting stores with incorrect version numbers can cause errors. This shouldn't affect most users under normal circumstances, but we've made a ticket to address this.
+
+## Added
+- PBS KIDS branding and a brief write-up about the team’s work on the project have been added to the homepage. 
+
+## Removed
+- API documentation has been removed. 
+- Captions Studio has been removed. It is now part of SpringRoll Studio.
+- The SpringRoll 1 section has been removed. 
+- The GitHub wiki link to SpringRoll 1 documentation has also been removed.
+
+
 ## [2.1.0] - 2021-03-04
 ## Added
 - This changelog

README.MD

@@ -1,18 +1,83 @@
-# [Springroll.io](https://springroll.io/)
+The [docs site](http://springroll.io/) has been completely rewritten from the ground up using the [Docusaurus](https://docusaurus.io/) framework. It's a React-based static doc site generator. The layout is responsive and has a dark mode. The new documentation is designed to be more user-friendly, with improved navigation and a better reading experience. 
 
-This is the repository for the [springroll.io](https://springroll.io/) site. Due to an issue with Github's hosting practices, the source code and the built version of [springroll.io](https://springroll.io/) can't be in the same repository. To update [springroll.io](https://springroll.io/), you must push the built version of [springroll.io](https://springroll.io/) to the [deployment repository](https://github.com/SpringRoll/SpringRoll.github.io)
+All of the documentation for SpringRoll and SpringRoll Container has been added to the new site. This will be where documentation for those repositories will belong. 
 
-## Commands
+At the moment, the documentation is just a direct copy of those repositories. We are planning to re-organize and update the documentation to make it easier to navigate and read.
 
-### serve - Runs the dev server
+PBS KIDS branding and a brief write-up about the team’s work on the project have been added to the homepage. 
 
-### build - Builds site for deployment
 
+### Ported Content
+All example content has been moved over to the new docs site. It's all included as part of the `Examples` section.  `Game Demo` and `Scale Manager` have also been moved to this section. 
 
-## Notes
-### SafeScaleManagerDemo
-To get this to work properly you'll have to update the path names.
-e.g.
-`src="main.js"` => `src="/SafeScaleManagerDemo/main.js"`
+#### Example changes
+###### Game Demo
+- The node packages in the project have all been updated, including SpringRoll.
+- The demo now implements the SpringRoll `SafeScaleManager`, allowing it to scale down to fit smaller screens.
+- The title screen has been updated with the correct capitalization.
+- Captions styling has been updated to match the style used in most PBS KIDS games.
+- The sidebar buttons and game event indicators have been updated to match the new docs site styling and work in dark mode.
+- The demo is now displayed using SpringRoll Container instead of just using Bellhop.
 
-You'll also have to edit main.js directly to update the path for the Springroll logo
+
+###### Speech Synth
+- The example is the same, just with styling from the docs site.
+
+###### Color Filter
+- The example image is no longer stretched. 
+- The rest is the same, just with the new styling.
+
+###### Resize
+- This example now uses the `SafeScaleManager` as the original `ScaleManager` is deprecated. Code examples represent this too.
+- The rest is the same, just with the new styling.
+
+###### Bellhop
+- This example has been simplified to only demonstrate how to use Bellhop without using SpringRoll specific events.
+
+###### Controls
+- The example is the same, just with styling from the docs site.
+
+###### Indexed DB
+- The data display table is simplified from the original version, because it was using a built in Vue component. This new table still shows everything in the data store, but is not sortable or paginated.
+- The help section below the example now has a horizontal row of tabs instead of vertical. This was done to keep the page responsive.
+- The example's colors and styling were updated to make it fit in with the new site, and to not be jarring when viewed in dark mode. The layout is also now responsive.
+- There are some new error checks for things like empty fields. These were throwing error logs to the console on the original. 
+- A few bugs were identified in the SpringRoll IDB implementation. Opening and deleting stores with incorrect version numbers can cause errors. This shouldn't affect most users under normal circumstances, but we've made a ticket to address this.
+
+
+### Removed Content
+- API documentation has been removed. It was automatically generated from code comments, but hasn't been actively maintained or organized. 
+- Captions Studio has been removed. It is now part of SpringRoll Studio.
+- The SpringRoll 1 section has been removed. It's no longer relevant as all developers should be using SpringRoll 2.
+- The GitHub wiki link to SpringRoll 1 documentation has also been removed.
+
+---------------------
+## Setup and Development
+### Installation
+
+```
+$ npm install
+```
+
+### Local Development
+
+```
+$ npm start
+```
+
+This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
+
+### Build
+
+```
+$ npm run build
+```
+
+This command generates static content into the `build` directory and can be served using any static contents hosting service.
+
+
+### Examples
+
+#### IndexedDB
+
+The IndexedDB example iframe content is stored in `static/idbExample/`. It currently uses the `2.6.0` version of `SpringRoll-umd.js`. 

babel.config.js

@@ -1,21 +1,3 @@
 module.exports = {
-  'presets': [
-    [
-      '@vue/app',
-      {
-        'useBuiltIns': 'entry'
-      }
-    ]
-  ],
-  'plugins': [
-    [
-      'transform-imports',
-      {
-        'vuetify': {
-          'transform': 'vuetify/es5/components/${member}',
-          'preventFullImport': true
-        }
-      }
-    ]
-  ]
-};
+  presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
+};

docs/Examples/_category_.json

@@ -0,0 +1,8 @@
+{
+  "label": "Examples",
+  "position": 3,
+  "link": {
+    "type": "generated-index",
+    "description": "Demos and Implementation Examples for SpringRoll"
+  }
+}

docs/Examples/bellhop.mdx

@@ -0,0 +1,5 @@
+import BellhopExample from '../../src/components/BellhopExample'
+
+# Bellhop
+
+<BellhopExample   />

docs/Examples/controls.mdx

@@ -0,0 +1,8 @@
+
+
+import ControlsExample from '../../src/components/Controls'
+
+
+# Controls
+
+<ControlsExample   />

docs/Examples/filter.mdx

@@ -0,0 +1,8 @@
+
+
+import ColorFilterExample from '../../src/components/ColorFilter'
+
+
+# Color Filter
+
+<ColorFilterExample   />

docs/Examples/game.mdx

@@ -0,0 +1,9 @@
+import GameDemo from '../../src/components/GameDemo'
+
+# Game Demo
+
+<GameDemo   />
+
+<span style={{textAlign: 'center', marginTop: -5}}>
+    [Source code for the game](https://github.com/SpringRoll/springroll-io-demo-game)
+</span>

docs/Examples/indexeddb.mdx

@@ -0,0 +1,5 @@
+import IndexedDBExample from '../../src/components/IndexedDB'
+
+# IndexedDB
+
+<IndexedDBExample/>

docs/Examples/introduction.md

@@ -0,0 +1,9 @@
+---
+sidebar_position: 1
+sidebar_label: Introduction
+sidebar_class_name: green
+---
+
+# Introduction
+
+This is a collection of examples for the SpringRoll toolset. Each example is a standalone project that demonstrates specific features.

docs/Examples/resize.mdx

@@ -0,0 +1,8 @@
+
+
+import ResizeExample from '../../src/components/Resize'
+
+
+# Resize
+
+<ResizeExample   />

docs/Examples/speechsynth.mdx

@@ -0,0 +1,5 @@
+import SpeechSynthExample from '../../src/components/SpeechSynth'
+
+# Speech Synth
+
+<SpeechSynthExample   />

docs/intro.md

@@ -0,0 +1,47 @@
+---
+sidebar_position: 1
+---
+
+# Tutorial Intro
+
+Let's discover **Docusaurus in less than 5 minutes**.
+
+## Getting Started
+
+Get started by **creating a new site**.
+
+Or **try Docusaurus immediately** with **[docusaurus.new](https://docusaurus.new)**.
+
+### What you'll need
+
+- [Node.js](https://nodejs.org/en/download/) version 18.0 or above:
+  - When installing Node.js, you are recommended to check all checkboxes related to dependencies.
+
+## Generate a new site
+
+Generate a new Docusaurus site using the **classic template**.
+
+The classic template will automatically be added to your project after you run the command:
+
+```bash
+npm init docusaurus@latest my-website classic
+```
+
+You can type this command into Command Prompt, Powershell, Terminal, or any other integrated terminal of your code editor.
+
+The command also installs all necessary dependencies you need to run Docusaurus.
+
+## Start your site
+
+Run the development server:
+
+```bash
+cd my-website
+npm run start
+```
+
+The `cd` command changes the directory you're working with. In order to work with your newly created Docusaurus site, you'll need to navigate the terminal there.
+
+The `npm run start` command builds your website locally and serves it through a development server, ready for you to view at http://localhost:3000/.
+
+Open `docs/intro.md` (this page) and edit some lines: the site **reloads automatically** and displays your changes.

docs/springroll-container/_category_.json

@@ -0,0 +1,8 @@
+{
+  "label": "SpringRoll - Container",
+  "position": 2,
+  "link": {
+    "type": "generated-index",
+    "description": "SpringRoll Container"
+  }
+}