starting asycn and await video (#1914)

* starting asycn and await video

* fix video path

* add images

* whoops, images

Author: shiffman

content/tracks/index.json

@@ -13,6 +13,7 @@
     "robot-controllers",
     "discord-bots",
     "p5-tips-and-tricks",
+    "p5js-2.0",
     "transformations-in-p5",
     "livestreams",
     "neural-networks",

content/tracks/side-tracks/p5js-2.0/index.json

@@ -0,0 +1,5 @@
+{
+  "title": "p5.js 2.0",
+  "description": "A collection of videos exploring the new features and capabilities introduced in p5.js 2.0, including loading with async and await, fonts and typography, custom shapes and curves, and more!",
+  "videos": ["p5js-2.0/async-await", "livestreams/p5js-2.0"]
+}

content/videos/livestreams/p5js-2.0/index.json

@@ -7,6 +7,7 @@
   "topics": ["p5.js", "variable fonts"],
   "canContribute": true,
   "relatedChallenges": [],
+  "canonicalTrack": "livestreams",
   "timestamps": [
     { "time": "0:00:00", "title": "Waiting to Start" },
     { "time": "0:05:24", "title": "Welcome to The Coding Train!" },

content/videos/p5js-2.0/async-await/images/choochoo.png

@@ -0,0 +1,92 @@
+{
+  "title": "p5.js 2.0: async and await",
+  "description": "This video tackles one of the bigger changes in p5.js 2: loading data with async and await! Fear not, I'll cover how to transition from preload and callbacks in p5.js 1.0 to using promises with async/await in 2.0.",
+  "videoId": "0Ad5Frf8NBM",
+  "date": "2025-09-29",
+  "languages": ["p5.js", "JavaScript"],
+  "topics": ["async/await", "promises", "p5.js 2", "preload", "callbacks"],
+  "canContribute": true,
+  "relatedChallenges": [],
+  "timestamps": [
+    { "time": "0:00:00", "title": "p5.js 2.0!" },
+    { "time": "0:03:00", "title": "Switching versions in the web editor" },
+    { "time": "0:05:02", "title": "Loading with p5.js 1" },
+    { "time": "0:06:11", "title": "Synchronous vs Asynchronous Code" },
+    { "time": "0:08:37", "title": "Promises!" },
+    { "time": "0:11:29", "title": "switching from preload to async setup()" },
+    { "time": "0:13:57", "title": "Loading with callbacks in p5.js 1.0" },
+    { "time": "0:17:15", "title": "Sequencing loading data in p5.js 1.0" },
+    { "time": "0:19:26", "title": "Sequencing with async and await in p5.js 2.0" },
+    { "time": "0:20:09", "title": "Creating a custom Async Function" },
+    { "time": "0:22:13", "title": "Thank you for watching!" }
+  ],
+  "codeExamples": [
+    {
+      "title": "p5.js 2 - async and await",
+      "description": "Basic example of loading an image with async and await.",
+      "image": "choochoo.png",
+      "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/Q6S38g0rS" }
+    },
+    {
+      "title": "p5.js 2 - loading animation",
+      "description": "How to use a custom async function to load data without blocking draw.",
+      "image": "loading.png",
+      "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/JLIxyHrkn" }
+    },
+    {
+      "title": "p5.js 2 - loading in a sequence",
+      "description": "How to load data with sequential calls with await.",
+      "image": "dog.png",
+      "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/lQxT7PTKC" }
+    }
+  ],
+  "groupLinks": [
+    {
+      "title": "References",
+      "links": [
+        {
+          "icon": "📖",
+          "title": "p5.js 2.0 Beta",
+          "url": "https://beta.p5js.org/",
+          "description": "The beta website for p5.js 2.0 with updated references and examples."
+        },
+        {
+          "icon": "📖",
+          "title": "p5.js 2.0",
+          "url": "https://github.com/processing/p5.js/issues/7488",
+          "description": "p5.js GitHub issue: Beta, Timeline, and Compatibility Addons"
+        },
+        {
+          "icon": "📖",
+          "title": "p5.js 2.0: You Are Here & How to Contribute!",
+          "url": "https://discourse.processing.org/t/dev-updates-p5-js-2-0-you-are-here-how-to-contribute/46130",
+          "description": "p5.js Discourse thread on the 2.0 release."
+        },
+        {
+          "icon": "🎨",
+          "title": "Dog API",
+          "url": "https://dog.ceo/dog-api/",
+          "description": "A public API for dog images used in the examples."
+        }
+      ]
+    },
+    {
+      "title": "Videos",
+      "links": [
+        {
+          "icon": "🚂",
+          "title": "Promises Part 1",
+          "url": "/tracks/topics-in-native-javascript/js/promises-part-1",
+          "description": "Learn more about JavaScript Promises in depth."
+        },
+        {
+          "icon": "🚂",
+          "title": "Promises Part 2",
+          "url": "/tracks/topics-in-native-javascript/js/promises-part-2",
+          "description": "Continue learning about JavaScript Promises."
+        }
+      ]
+    }
+  ],
+  "credits": []
+}