feat: MediaStream Recording API (closes #6)

This adds components for "user mediastreams" (microphone/camera) and "display mediastreams" (screen/internal audio), and a "mediastream recording" component with which you can record from those other components.
jkruse · Sep 8, 2024 · e496c59 · e496c59
1 parent ff27574
commit e496c59
Show file tree

Hide file tree

Showing 10 changed files with 2,036 additions and 16 deletions.
diff --git a/AppSrc/Dashboard.wo b/AppSrc/Dashboard.wo
@@ -97,11 +97,24 @@ Object oDashboard is a cWebView
                     Send NavigatePath
                 End_Procedure
             End_Object
+
+            Object oTileMediaStreamRecording is a cWebHtmlBox
+                Set pbServerOnClick to True
+                Set psCSSClass to "Tile"
+                Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div Class="Tile_Title">MediaStream Recording API</div><div class="Tile_Subtitle">record from user device or screen</div><span class="material-icons-outlined">https</span></div>'
+
+                WebRegisterPath ntNavigateForward oMediaStreamRecordingDemo
+
+                Procedure OnClick
+                    Send NavigatePath
+                End_Procedure
+            End_Object
 
             Object oTileNetworkInformation is a cWebHtmlBox
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div Class="Tile_Title">Network Information API</div><div class="Tile_Subtitle">get information on the current network connection</div><span class="material-icons-outlined">warning_amber</span></div>'
+                Set piColumnIndex to 1
 
                 WebRegisterPath ntNavigateForward oNetworkInformationDemo
 
@@ -114,7 +127,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div Class="Tile_Title">Notifications API</div><div class="Tile_Subtitle">display system notifications</div><span class="material-icons-outlined">https</span></div>'
-                Set piColumnIndex to 1
+                Set piColumnIndex to 2
 
                 WebRegisterPath ntNavigateForward oNotificationsDemo
 
@@ -127,7 +140,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div Class="Tile_Title">Page Visibility API</div><div class="Tile_Subtitle">know when a document becomes visible or hidden</div></div>'
-                Set piColumnIndex to 2
+                Set piColumnIndex to 0
 
                 WebRegisterPath ntNavigateForward oPageVisibilityDemo
 
@@ -140,6 +153,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div Class="Tile_Title">Screen Orientation API</div><div Class="Tile_Subtitle">information about the current orientation of the document</div></div>'
+                Set piColumnIndex to 1
 
                 WebRegisterPath ntNavigateForward oScreenOrientationDemo
 
@@ -152,7 +166,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div Class="Tile_Title">Screen Wake Lock API</div><div Class="Tile_Subtitle">prevent devices from dimming or locking the screen</div><span class="material-icons-outlined">https</span></div>'
-                Set piColumnIndex to 1
+                Set piColumnIndex to 2
 
                 WebRegisterPath ntNavigateForward oScreenWakeLockDemo
 
@@ -165,7 +179,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div Class="Tile_Title">Sensor APIs</div><div Class="Tile_Subtitle">access to device sensors</div><span class="material-icons-outlined" style="right: 40px">https</span><span class="material-icons-outlined">warning_amber</span></div>'
-                Set piColumnIndex to 2
+                Set piColumnIndex to 0
 
                 WebRegisterPath ntNavigateForward oSensorDemo
 
@@ -178,6 +192,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div class="Tile_Title">Vibration API</div><div Class="Tile_Subtitle">access to vibration hardware</div></div>'
+                Set piColumnIndex to 1
 
                 WebRegisterPath ntNavigateForward oVibrationDemo
 
@@ -190,7 +205,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div class="Tile_Title">Web Share API</div><div Class="Tile_Subtitle">share content from your application</div><span class="material-icons-outlined">https</span></div>'
-                Set piColumnIndex to 1
+                Set piColumnIndex to 2
 
                 WebRegisterPath ntNavigateForward oWebShareDemo
 
@@ -203,7 +218,7 @@ Object oDashboard is a cWebView
                 Set pbServerOnClick to True
                 Set psCSSClass to "Tile"
                 Set psHtml to '<div class="WebCon_Sizer" data-ServerOnClick="openview"><div class="Tile_Title">Web Storage API</div><div Class="Tile_Subtitle">store data in the browser</div></div>'
-                Set piColumnIndex to 2
+                Set piColumnIndex to 0
 
                 WebRegisterPath ntNavigateForward oWebStorageDemo