Merge pull request #248 from Badgerati/develop

v0.7.0

Author: Badgerati

.build.ps1

@@ -198,14 +198,20 @@ task MoveLibs {
 
     # monaco
     New-Item -Path "$($libs_path)/monaco" -ItemType Directory -Force | Out-Null
+    New-Item -Path "$($libs_path)/vs" -ItemType Directory -Force | Out-Null
+
     New-Item -Path "$($libs_path)/monaco/editor" -ItemType Directory -Force | Out-Null
     New-Item -Path "$($libs_path)/monaco/basic-languages" -ItemType Directory -Force | Out-Null
-    New-Item -Path "$($libs_path)/monaco/base/worker" -ItemType Directory -Force | Out-Null
 
     Copy-Item -Path "$($src_path)/monaco-editor/min/vs/loader.js" -Destination "$($libs_path)/monaco/" -Force
     Copy-Item -Path "$($src_path)/monaco-editor/min/vs/editor/*.*" -Destination "$($libs_path)/monaco/editor/" -Force
+
+    New-Item -Path "$($libs_path)/monaco/base/worker" -ItemType Directory -Force | Out-Null
     Copy-Item -Path "$($src_path)/monaco-editor/min/vs/base/worker/*.*" -Destination "$($libs_path)/monaco/base/worker/" -Force
 
+    New-Item -Path "$($libs_path)/monaco/base/browser/ui/codicons/codicon" -ItemType Directory -Force | Out-Null
+    Copy-Item -Path "$($src_path)/monaco-editor/min/vs/base/browser/ui/codicons/codicon/*.*" -Destination "$($libs_path)/monaco/base/browser/ui/codicons/codicon/" -Force
+
     $langs = @(
         'bat',
         'cpp',
@@ -236,6 +242,17 @@ task MoveLibs {
         }
     }
 
+    New-Item -Path "$($libs_path)/monaco/language" -ItemType Directory -Force | Out-Null
+    New-Item -Path "$($libs_path)/vs/language" -ItemType Directory -Force | Out-Null
+
+    (Get-ChildItem -Path "$($src_path)/monaco-editor/min/vs/language" -Directory).Name | ForEach-Object {
+        New-Item -Path "$($libs_path)/monaco/language/$($_)/" -ItemType Directory -Force | Out-Null
+        Copy-Item -Path "$($src_path)/monaco-editor/min/vs/language/$($_)/*.*" -Destination "$($libs_path)/monaco/language/$($_)/" -Force
+
+        New-Item -Path "$($libs_path)/vs/language/$($_)/" -ItemType Directory -Force | Out-Null
+        Copy-Item -Path "$($src_path)/monaco-editor/min/vs/language/$($_)/*.*" -Destination "$($libs_path)/vs/language/$($_)/" -Force
+    }
+
     $vs_maps_path = "$($dest_path)/min-maps/vs"
     if (Test-Path $vs_maps_path) {
         Remove-Item -Path $vs_maps_path -Recurse -Force | Out-Null

README.md

@@ -11,7 +11,7 @@
 
 > 💝 A lot of my free time, evenings, and weekends goes into making Pode happen; please do consider sponsoring as it will really help! 😊
 
-This is a web template framework for use with the [Pode](https://github.com/Badgerati/Pode) PowerShell web server (v2.2.0+).
+This is a web template framework for use with the [Pode](https://github.com/Badgerati/Pode) PowerShell web server (v2.5.0+).
 
 It allows you to build web pages purely with PowerShell - no HTML, CSS, or JavaScript knowledge required!
 

docs/Getting-Started/Installation.md

@@ -6,7 +6,7 @@ Pode.Web is a PowerShell module that works along side [Pode](https://github.com/
 
 Before installing Pode.Web, the minimum requirements must be met:
 
-* Pode v2.2.0+
+* Pode v2.5.0+
 
 Which also includes Pode's minimum requirements:
 * OS:

docs/Tutorials/Elements/Audio.md

@@ -0,0 +1,62 @@
+# Audio
+
+| Support | |
+| ------- |-|
+| Events | Yes |
+
+To play audio clips on your site you can use [`New-PodeWebAudio`](../../../Functions/Elements/New-PodeWebAudio). The audio can be set to auto-play and loop, and can also accept multiple sources and tracks.
+
+The sources specified can be done so via `-Source` and [`New-PodeWebAudioSource`](../../../Functions/Elements/New-PodeWebAudioSource). Sources can only be of type `MP3`, `OGG` and `WAV`, and at least one source must be specified:
+
+```powershell
+New-PodeWebCard -Content @(
+    New-PodeWebAudio -Name 'example' -Source @(
+        New-PodeWebAudioSource -Url 'https://samplelib.com/lib/preview/mp3/sample-6s.mp3'
+    )
+)
+```
+
+Which looks like below:
+
+![audio](../../../images/audio.png)
+
+Any optional tracks you wish to specify can be done via `-Track` and [`New-PodeWebMediaTrack`](../../../Functions/Elements/New-PodeWebMediaTrack). Tracks can only be of type `VTT`, and can be used for subtitles, captions, metadata, etc.
+
+The `-Language` is mandatory if the track's `-Type` is subtitles, and should be a [2-letter language code](https://www.w3schools.com/tags/ref_language_codes.asp).
+
+```powershell
+New-PodeWebCard -Content @(
+    New-PodeWebAudio -Name 'example' -Source @(
+        New-PodeWebAudioSource -Url 'https://samplelib.com/lib/preview/mp3/sample-6s.mp3'
+    ) `
+    -Tracks @(
+        New-PodeWebMediaSource -Url '/some/url/path/english.vtt' -Language 'en' -Title 'English' -Type 'subtitles' -Default
+    )
+)
+```
+
+## Size
+
+The `-Width` of an audio element has the default unit of `%`. If `0` is specified then `20%` is used instead. Any custom value such as `100px` can be used, but if a plain number is used then `%` is appended.
+
+## Events
+
+The following specific events are supported by the Audio element, and can be registered via [`Register-PodeWebMediaEvent`](../../../Functions/Events/Register-PodeWebMediaEvent):
+
+| Name | Description |
+| ---- | ----------- |
+| CanPlay | Fires when the browser is ready to play the audio |
+| Ended | Fires when the audio has finished playing, unless looping |
+| Pause | Fires when the audio is paused |
+| Play | Fires when the audio is played, or un-paused |
+
+Example:
+
+```powershell
+New-PodeWebAudio -Name 'example' -Source @(
+    New-PodeWebAudioSource -Id 'sample' -Url 'https://samplelib.com/lib/preview/mp3/sample-6s.mp3'
+) |
+Register-PodeWebMediaEvent -Type Play -ScriptBlock {
+    Show-PodeWebToast -Title 'Action' -Message $EventType
+}
+```

docs/Tutorials/Elements/Charts.md

@@ -141,3 +141,7 @@ New-PodeWebCounterChart -Counter '\Processor(_Total)\% Processor Time' -AsCard
 which renders a chart that looks like below:
 
 ![chart_line_counter](../../../images/chart_line_counter.png)
+
+## Size
+
+The `-Height` of a chart has the default unit of `px`. If `0` is specified then `auto` is used instead. Any custom value such as `10%` can be used, but if a plain number is used then `px` is appended.

docs/Tutorials/Elements/Checkbox.md

@@ -43,3 +43,11 @@ Which looks like below:
 ## Inline
 
 You can render this element inline with other non-form elements by using the `-NoForm` switch. This will remove the form layout, and render the element more cleanly when used outside of a form.
+
+## Display Name
+
+By default the label displays the `-Name` of the element. You can change the value displayed by also supplying an optional `-DisplayName` value; this value is purely visual, when the user submits the form the value of the element is still retrieved using the `-Name` from `$WebEvent.Data`.
+
+## Display Options
+
+By default the options displayed are from the `-Options` parameter. Like the Name, you can change the values displayed by supplying the optional `-DisplayOptions` - values in the array should be in the same order as the values in `-Options`. These values are, like the Display Name, purely visual, and when the form is submitted the server receives the original values from `-Options`.

docs/Tutorials/Elements/Credentials.md

@@ -20,3 +20,22 @@ New-PodeWebCard -Content @(
 Which looks like below:
 
 ![credentials](../../../images/credentials.png)
+
+## Type
+
+By default both the Username and Password fields are displayed, but you can control which ones are displayed by using the `-Type` parameter:
+
+```powershell
+# both (this is the default)
+New-PodeWebCredential -Name 'Example' -Type Username, Password
+
+# just username
+New-PodeWebCredential -Name 'Example' -Type Username
+
+# just password
+New-PodeWebCredential -Name 'Example' -Type Password
+```
+
+## Display Name
+
+By default the label displays the `-Name` of the element. You can change the value displayed by also supplying an optional `-DisplayName` value; this value is purely visual, when the user submits the form the value of the element is still retrieved using the `-Name` from `$WebEvent.Data`.

docs/Tutorials/Elements/DateTime.md

@@ -20,3 +20,22 @@ New-PodeWebCard -Content @(
 Which looks like below:
 
 ![datetime](../../../images/datetime.png)
+
+## Type
+
+By default both the Date and Time fields are displayed, but you can control which ones are displayed by using the `-Type` parameter:
+
+```powershell
+# both (this is the default)
+New-PodeWebDateTime -Name 'Example' -Type Date, Time
+
+# just date
+New-PodeWebDateTime -Name 'Example' -Type Date
+
+# just time
+New-PodeWebDateTime -Name 'Example' -Type Time
+```
+
+## Display Name
+
+By default the label displays the `-Name` of the element. You can change the value displayed by also supplying an optional `-DisplayName` value; this value is purely visual, when the user submits the form the value of the element is still retrieved using the `-Name` from `$WebEvent.Data`.

docs/Tutorials/Elements/FileUpload.md

@@ -20,6 +20,20 @@ Which looks like below:
 
 ![file_upload](../../../images/file_upload.png)
 
+## Accept
+
+By default the file upload dialog will accept every file type, but you can filter which files are accepted via the `-Accept` parameter. This accepts an array of file types/extensions such as:
+
+```powershell
+New-PodeWebFileUpload -Name 'File' -Accept '.png', 'audio/*'
+```
+
+which will accept any `.png` file, and all sound files.
+
 ## Inline
 
 You can render this element inline with other non-form elements by using the `-NoForm` switch. This will remove the form layout, and render the element more cleanly when used outside of a form.
+
+## Display Name
+
+By default the label displays the `-Name` of the element. You can change the value displayed by also supplying an optional `-DisplayName` value; this value is purely visual, when the user submits the form the value of the element is still retrieved using the `-Name` from `$WebEvent.Data`.

docs/Tutorials/Elements/Form.md

@@ -31,6 +31,9 @@ Which looks like below:
 
 ![form](../../../images/form.png)
 
+!!! note
+    If you have multiple forms on one page, make sure the Name/IDs are unique, including the Name/IDs of all form input elements as well.
+
 You can pass values to the scriptblock by using the `-ArgumentList` parameter. This accepts an array of values/objects, and they are supplied as parameters to the scriptblock:
 
 ```powershell
@@ -52,7 +55,19 @@ The available form elements in Pode.Web are:
 * [DateTime](../DateTime)
 * [FileUpload](../FileUpload)
 * [Hidden](../Hidden)
+* [MinMax](../DateTime)
+* [Range](../Range)
 * [Radio](../Radio)
 * [Range](../Range)
 * [Select](../Select)
 * [Textbox](../Textbox)
+
+## Method/Action
+
+The default method for forms is `Post`, and the action is the internal route created for the form.
+
+You can change these values by using the `-Method` and `-Action` parameters. The method can only be `Get` or `Post`, and the action must be a valid URL.
+
+## Reset
+
+You can reset all form inputs by either using the [`Reset-PodeWebForm`](../../../Functions/Outputs/Reset-PodeWebForm) output action, or by using `-ShowReset` switch on [`New-PodeWebForm`](../../../Functions/Elements/New-PodeWebForm) to display an optional reset button.