Open GeorgeS2019 opened 2 years ago
These need to be provided by the BlazorML5 blazor component is now missing
| <script src="_content/BlazorML5/WebCam.js"></script> | <script src="_content/BlazorML5/ml5ImageClassifier.js"></script> | <script src="_content/BlazorML5/ml5NeuralNetwork.js"></script> | <script src="_content/BlazorML5/ml5SoundClassifier.js"></script> | <script src="_content/BlazorML5/ml5ObjectDetector.js"></script> | <script src="_content/BlazorML5/ml5PoseNet.js"></script>
<html> <body> <!--StartFragment--> | <!DOCTYPE html> -- | -- | <html> | | <head> | <meta charset="utf-8" /> | <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> | <title>Blazor ML5 Demo</title> | <base href="/" /> | <link href="css/app.css" rel="stylesheet" /> | <link href="DemoApplication.styles.css" rel="stylesheet" /> | <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.11.2/css/all.css" /> | <!-- Google Fonts Roboto --> | <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" /> | <!-- MDB --> | <script src="js/mdb.min.js"></script> | <link rel="stylesheet" href="css/mdb.min.css" /> | <script src="_content/Blazor.Extensions.Canvas/blazor.extensions.canvas.js"></script> | | <script src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script> | <script src="_content/BlazorML5/WebCam.js"></script> | <script src="_content/BlazorML5/ml5ImageClassifier.js"></script> | <script src="_content/BlazorML5/ml5NeuralNetwork.js"></script> | <script src="_content/BlazorML5/ml5SoundClassifier.js"></script> | <script src="_content/BlazorML5/ml5ObjectDetector.js"></script> | <script src="_content/BlazorML5/ml5PoseNet.js"></script> | </head> | | <body> | <div id="app"> | <div class="showbox"> | <div class="loader"> | <svg class="circular" viewBox="25 25 50 50"> | <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10" /> | </svg> | </div> | </div> | </div> | | <div id="blazor-error-ui"> | An unhandled error has occurred. | <a href="" class="reload">Reload</a> | <a class="dismiss">🗙</a> | </div> | <style> | .loader { | position: relative; | margin: 0 auto; | width: 100px; | } | | .loader:before { | content: ''; | display: block; | padding-top: 100%; | } | | .circular { | animation: rotate 2s linear infinite; | height: 100%; | transform-origin: center center; | width: 100%; | position: absolute; | top: 0; | bottom: 0; | left: 0; | right: 0; | margin: auto; | } | | .path { | stroke-dasharray: 1, 200; | stroke-dashoffset: 0; | animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite; | stroke-linecap: round; | } | | @keyframes rotate { | 100% { | transform: rotate(360deg); | } | } | | @keyframes dash { | 0% { | stroke-dasharray: 1, 200; | stroke-dashoffset: 0; | } | | 50% { | stroke-dasharray: 89, 200; | stroke-dashoffset: -35px; | } | | 100% { | stroke-dasharray: 89, 200; | stroke-dashoffset: -124px; | } | } | | @keyframes color { | 100%, 0% { | stroke: #d62d20; | } | | 40% { | stroke: #0057e7; | } | | 66% { | stroke: #008744; | } | | 80%, 90% { | stroke: #ffa700; | } | } | | .showbox { | position: absolute; | top: 0; | bottom: 0; | left: 0; | right: 0; | padding: 5%; | } | </style> | <script src="_framework/blazor.webassembly.js"></script> | | </body> | | </html> | <!--EndFragment--> </body> </html><!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>Blazor ML5 Demo</title> <base href="[/](https://blazor-ml5-sample.netlify.app/)" /> <link href="[css/app.css](https://blazor-ml5-sample.netlify.app/css/app.css)" rel="stylesheet" /> <link href="[DemoApplication.styles.css](https://blazor-ml5-sample.netlify.app/DemoApplication.styles.css)" rel="stylesheet" /> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.11.2/css/all.css" /> <!-- Google Fonts Roboto --> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" /> <!-- MDB --> <script src="[js/mdb.min.js](https://blazor-ml5-sample.netlify.app/js/mdb.min.js)"></script> <link rel="stylesheet" href="[css/mdb.min.css](https://blazor-ml5-sample.netlify.app/css/mdb.min.css)" /> <script src="[_content/Blazor.Extensions.Canvas/blazor.extensions.canvas.js](https://blazor-ml5-sample.netlify.app/_content/Blazor.Extensions.Canvas/blazor.extensions.canvas.js)"></script> <script src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script> <script src="[_content/BlazorML5/WebCam.js](https://blazor-ml5-sample.netlify.app/_content/BlazorML5/WebCam.js)"></script> <script src="[_content/BlazorML5/ml5ImageClassifier.js](https://blazor-ml5-sample.netlify.app/_content/BlazorML5/ml5ImageClassifier.js)"></script> <script src="[_content/BlazorML5/ml5NeuralNetwork.js](https://blazor-ml5-sample.netlify.app/_content/BlazorML5/ml5NeuralNetwork.js)"></script> <script src="[_content/BlazorML5/ml5SoundClassifier.js](https://blazor-ml5-sample.netlify.app/_content/BlazorML5/ml5SoundClassifier.js)"></script> <script src="[_content/BlazorML5/ml5ObjectDetector.js](https://blazor-ml5-sample.netlify.app/_content/BlazorML5/ml5ObjectDetector.js)"></script> <script src="[_content/BlazorML5/ml5PoseNet.js](https://blazor-ml5-sample.netlify.app/_content/BlazorML5/ml5PoseNet.js)"></script> </head> <body> <div id="app"> <div class="showbox"> <div class="loader"> <svg class="circular" viewBox="25 25 50 50"> <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10" /> </svg> </div> </div> </div> <div id="blazor-error-ui"> An unhandled error has occurred. <a href="" class="reload">Reload</a> <a class="dismiss">🗙</a> </div> <style> .loader { position: relative; margin: 0 auto; width: 100px; } .loader:before { content: ''; display: block; padding-top: 100%; } .circular { animation: rotate 2s linear infinite; height: 100%; transform-origin: center center; width: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .path { stroke-dasharray: 1, 200; stroke-dashoffset: 0; animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite; stroke-linecap: round; } @keyframes rotate { 100% { transform: rotate(360deg); } } @keyframes dash { 0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; } 50% { stroke-dasharray: 89, 200; stroke-dashoffset: -35px; } 100% { stroke-dasharray: 89, 200; stroke-dashoffset: -124px; } } @keyframes color { 100%, 0% { stroke: #d62d20; } 40% { stroke: #0057e7; } 66% { stroke: #008744; } 80%, 90% { stroke: #ffa700; } } .showbox { position: absolute; top: 0; bottom: 0; left: 0; right: 0; padding: 5%; } </style> <script src="[_framework/blazor.webassembly.js](https://blazor-ml5-sample.netlify.app/_framework/blazor.webassembly.js)"></script> </body> </html>
Follow up work is done in this branch, currently added Neural Network sample https://github.com/sps014/BlazorML5/tree/ui-rewrite/SampleApp/Pages
These need to be provided by the BlazorML5 blazor component is now missing