diff --git a/index.html b/index.html index 40e4040..9df8843 100644 --- a/index.html +++ b/index.html @@ -42,14 +42,17 @@

Validation is performed locally in your browser. Submitted assets are not uploaded.

- +
Fork me on GitHub diff --git a/scripts/prism.js b/scripts/prism.js index d627a5c..60b384f 100644 --- a/scripts/prism.js +++ b/scripts/prism.js @@ -1,4 +1,4 @@ -/* PrismJS 1.23.0 +/* PrismJS 1.29.0 https://prismjs.com/download.html#themes=prism-coy&languages=json */ -var _self="undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{},Prism=function(u){var c=/\blang(?:uage)?-([\w-]+)\b/i,n=0,e={},M={manual:u.Prism&&u.Prism.manual,disableWorkerMessageHandler:u.Prism&&u.Prism.disableWorkerMessageHandler,util:{encode:function e(n){return n instanceof W?new W(n.type,e(n.content),n.alias):Array.isArray(n)?n.map(e):n.replace(/&/g,"&").replace(/=l.reach);y+=m.value.length,m=m.next){var b=m.value;if(t.length>n.length)return;if(!(b instanceof W)){var k,x=1;if(h){if(!(k=z(v,y,n,f)))break;var w=k.index,A=k.index+k[0].length,P=y;for(P+=m.value.length;P<=w;)m=m.next,P+=m.value.length;if(P-=m.value.length,y=P,m.value instanceof W)continue;for(var E=m;E!==t.tail&&(Pl.reach&&(l.reach=N);var j=m.prev;O&&(j=I(t,j,O),y+=O.length),q(t,j,x);var C=new W(o,g?M.tokenize(S,g):S,d,S);if(m=I(t,j,C),L&&I(t,m,L),1l.reach&&(l.reach=_.reach)}}}}}}(e,a,n,a.head,0),function(e){var n=[],t=e.head.next;for(;t!==e.tail;)n.push(t.value),t=t.next;return n}(a)},hooks:{all:{},add:function(e,n){var t=M.hooks.all;t[e]=t[e]||[],t[e].push(n)},run:function(e,n){var t=M.hooks.all[e];if(t&&t.length)for(var r,a=0;r=t[a++];)r(n)}},Token:W};function W(e,n,t,r){this.type=e,this.content=n,this.alias=t,this.length=0|(r||"").length}function z(e,n,t,r){e.lastIndex=n;var a=e.exec(t);if(a&&r&&a[1]){var i=a[1].length;a.index+=i,a[0]=a[0].slice(i)}return a}function i(){var e={value:null,prev:null,next:null},n={value:null,prev:e,next:null};e.next=n,this.head=e,this.tail=n,this.length=0}function I(e,n,t){var r=n.next,a={value:t,prev:n,next:r};return n.next=a,r.prev=a,e.length++,a}function q(e,n,t){for(var r=n.next,a=0;a"+a.content+""},!u.document)return u.addEventListener&&(M.disableWorkerMessageHandler||u.addEventListener("message",function(e){var n=JSON.parse(e.data),t=n.language,r=n.code,a=n.immediateClose;u.postMessage(M.highlight(r,M.languages[t],t)),a&&u.close()},!1)),M;var t=M.util.currentScript();function r(){M.manual||M.highlightAll()}if(t&&(M.filename=t.src,t.hasAttribute("data-manual")&&(M.manual=!0)),!M.manual){var a=document.readyState;"loading"===a||"interactive"===a&&t&&t.defer?document.addEventListener("DOMContentLoaded",r):window.requestAnimationFrame?window.requestAnimationFrame(r):window.setTimeout(r,16)}return M}(_self);"undefined"!=typeof module&&module.exports&&(module.exports=Prism),"undefined"!=typeof global&&(global.Prism=Prism); -Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:true|false)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json; +var _self="undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{},Prism=function(e){var n=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,t=0,r={},a={manual:e.Prism&&e.Prism.manual,disableWorkerMessageHandler:e.Prism&&e.Prism.disableWorkerMessageHandler,util:{encode:function e(n){return n instanceof i?new i(n.type,e(n.content),n.alias):Array.isArray(n)?n.map(e):n.replace(/&/g,"&").replace(/=g.reach);A+=w.value.length,w=w.next){var E=w.value;if(n.length>e.length)return;if(!(E instanceof i)){var P,L=1;if(y){if(!(P=l(b,A,e,m))||P.index>=e.length)break;var S=P.index,O=P.index+P[0].length,j=A;for(j+=w.value.length;S>=j;)j+=(w=w.next).value.length;if(A=j-=w.value.length,w.value instanceof i)continue;for(var C=w;C!==n.tail&&(jg.reach&&(g.reach=W);var z=w.prev;if(_&&(z=u(n,z,_),A+=_.length),c(n,z,L),w=u(n,z,new i(f,p?a.tokenize(N,p):N,k,N)),M&&u(n,w,M),L>1){var I={cause:f+","+d,reach:W};o(e,n,t,w.prev,A,I),g&&I.reach>g.reach&&(g.reach=I.reach)}}}}}}function s(){var e={value:null,prev:null,next:null},n={value:null,prev:e,next:null};e.next=n,this.head=e,this.tail=n,this.length=0}function u(e,n,t){var r=n.next,a={value:t,prev:n,next:r};return n.next=a,r.prev=a,e.length++,a}function c(e,n,t){for(var r=n.next,a=0;a"+i.content+""},!e.document)return e.addEventListener?(a.disableWorkerMessageHandler||e.addEventListener("message",(function(n){var t=JSON.parse(n.data),r=t.language,i=t.code,l=t.immediateClose;e.postMessage(a.highlight(i,a.languages[r],r)),l&&e.close()}),!1),a):a;var g=a.util.currentScript();function f(){a.manual||a.highlightAll()}if(g&&(a.filename=g.src,g.hasAttribute("data-manual")&&(a.manual=!0)),!a.manual){var h=document.readyState;"loading"===h||"interactive"===h&&g&&g.defer?document.addEventListener("DOMContentLoaded",f):window.requestAnimationFrame?window.requestAnimationFrame(f):window.setTimeout(f,16)}return a}(_self);"undefined"!=typeof module&&module.exports&&(module.exports=Prism),"undefined"!=typeof global&&(global.Prism=Prism); +Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json; diff --git a/scripts/validator.dart b/scripts/validator.dart new file mode 100644 index 0000000..185f014 --- /dev/null +++ b/scripts/validator.dart @@ -0,0 +1,291 @@ +// Copyright 2016-2024 The Khronos Group Inc. +// +// SPDX-License-Identifier: Apache-2.0 + +// ignore_for_file: avoid_print +// ignore_for_file: avoid_dynamic_calls + +// @dart=2.9 + +import 'dart:async'; +import 'dart:convert'; +import 'dart:html' + show + querySelector, + DataTransferItemList, + DirectoryEntry, + Entry, + InputElement, + File, + FileEntry, + FileReader, + window; +import 'dart:js'; +import 'dart:math'; + +import 'dart:typed_data'; +import 'package:gltf/gltf.dart'; +import 'package:gltf/src/utils.dart'; + +const _kChunkSize = 1024 * 1024; +const _kMaxReportLength = 512 * 1024; +const _kMaxIssuesCount = 16 * 1024; +const _kJsonEncoder = JsonEncoder.withIndent(' '); + +final _dropZone = querySelector('#dropZone'); +final _output = querySelector('#output'); +final _input = querySelector('#input') as InputElement; +final _inputLink = querySelector('#inputLink'); +final _fileWarning = querySelector('#fileWarning'); +final _truncatedWarning = querySelector('#truncatedWarning'); +final _validityLabel = querySelector('#validityLabel'); + +final _isFileUri = window.location.protocol == 'file:'; +final _assetPattern = + RegExp(r'^[^\/]*\.(?:gl(?:tf|b)|vrm)$', caseSensitive: false); + +final _sw = Stopwatch(); + +void main() { + // Needed to prevent flickering while dragging over text. + var cnt = 0; + + _dropZone.onDragEnter.listen((e) { + _dropZone.classes.add('hover'); + ++cnt; + }); + + _dropZone.onDragOver.listen((e) { + e.preventDefault(); + }); + + _dropZone.onDragLeave.listen((e) { + if (--cnt == 0) { + _dropZone.classes.remove('hover'); + } + }); + + _dropZone.onDrop.listen((e) { + e.preventDefault(); + // File and Directory Entries API may not work + // when the page is opened from a local path. + if (_isFileUri) { + _validateFiles(e.dataTransfer.files); + } else { + _validateItems(e.dataTransfer.items); + } + }); + + _inputLink.onClick.listen((e) { + e.preventDefault(); + _input.value = ''; + _input.click(); + }); + + _input.onChange.listen((e) { + e.preventDefault(); + if (_input.files.isNotEmpty) { + _validateFiles(_input.files); + } + }); + + print('glTF Validator ver. $kGltfValidatorVersion.'); + print('Supported extensions: ${Context.defaultExtensionNames.join(', ')}'); +} + +void _preValidate() { + _output.text = ''; + _fileWarning.style.display = 'none'; + _truncatedWarning.style.display = 'none'; + _validityLabel.text = 'Validating...'; + _dropZone.classes + ..clear() + ..add('drop'); +} + +void _postValidate(ValidationResult result) { + _dropZone.classes.remove('drop'); + if (result != null) { + if (_isFileUri) { + _fileWarning.style.display = 'block'; + } + + if (result.context.isTruncated) { + _truncatedWarning.style.display = 'block'; + } + + if (result.context.errors.isEmpty) { + _dropZone.classes.add('valid'); + _validityLabel.text = 'The asset is valid.'; + } else { + _dropZone.classes.add('invalid'); + _validityLabel.text = 'The asset contains errors.'; + } + } else { + _validityLabel.text = + 'No glTF asset was found or a file access error has occurred.'; + } +} + +void _validateFiles(List files) { + _preValidate(); + final filesMap = {for (final file in files) file.name: file}; + _doValidate(filesMap).then(_postValidate); +} + +void _validateItems(DataTransferItemList items) { + _preValidate(); + _getFilesMapFromItems(items) + .then(_doValidate, onError: (Object _) => null) + .then(_postValidate); +} + +Future> _getFilesMapFromItems(DataTransferItemList items) { + final entries = List.generate(items.length, (i) => items[i].getAsEntry(), + growable: false); + return _traverseDirectory(entries, {}); +} + +Future> _traverseDirectory( + List entries, Map result) async { + for (final entry in entries) { + if (entry.isFile) { + final fileEntry = entry as FileEntry; + result[fileEntry.fullPath.substring(1)] = await fileEntry.file(); + } else if (entry.isDirectory) { + final directoryEntry = entry as DirectoryEntry; + await _traverseDirectory( + await directoryEntry.createReader().readEntries(), result); + } + } + return result; +} + +Future _doValidate(Map files) async { + _sw + ..reset() + ..start(); + GltfReader reader; + + final context = + Context(options: ValidationOptions(maxIssues: _kMaxIssuesCount)); + + final assetFilename = + files.keys.firstWhere(_assetPattern.hasMatch, orElse: () => null); + if (assetFilename == null) { + return null; + } + + if (assetFilename.toLowerCase().endsWith('.gltf')) { + reader = GltfJsonReader(_getFileStream(files[assetFilename]), context); + } else { + reader = GlbReader(_getFileStream(files[assetFilename]), context); + } + + final readerResult = await reader.read(); + + if (readerResult?.gltf != null) { + final resourcesLoader = ResourcesLoader(context, readerResult.gltf, + externalBytesFetch: ([uri]) { + if (uri != null) { + if (uri.isNonRelative) { + return null; + } + final file = _getFileByUri(files, uri); + if (file != null) { + return _getFileBytes(file); + } else { + throw GltfExternalResourceNotFoundException(uri.toString()); + } + } else { + return readerResult.buffer; + } + }, externalStreamFetch: (uri) { + if (uri != null) { + if (uri.isNonRelative) { + return null; + } + final file = _getFileByUri(files, uri); + if (file != null) { + return _getFileStream(file); + } else { + throw GltfExternalResourceNotFoundException(uri.toString()); + } + } + return null; + }); + + await resourcesLoader.load(); + } + final validationResult = + ValidationResult(Uri.parse(assetFilename), context, readerResult); + + _sw.stop(); + print('Validation: ${_sw.elapsedMilliseconds}ms.'); + _sw + ..reset() + ..start(); + _writeMap(validationResult.toMap()); + _sw.stop(); + print('Writing report: ${_sw.elapsedMilliseconds}ms.'); + + return validationResult; +} + +File _getFileByUri(Map files, Uri uri) => + files[Uri.decodeComponent(uri.path)]; + +Stream _getFileStream(File file) { + var isCanceled = false; + final controller = StreamController(onCancel: () { + isCanceled = true; + }); + + controller.onListen = () { + var index = 0; + final fileReader = FileReader(); + fileReader.onLoadEnd.listen((_) { + if (isCanceled) { + return; + } + + final result = fileReader.result; + if (result is Uint8List) { + controller.add(result); + } + + if (index < file.size) { + final length = min(_kChunkSize, file.size - index); + fileReader.readAsArrayBuffer(file.slice(index, index += length)); + } else { + controller.close(); + } + }); + + final length = min(_kChunkSize, file.size); + fileReader.readAsArrayBuffer(file.slice(0, index += length)); + }; + + return controller.stream; +} + +Future _getFileBytes(File file) async { + final fileReader = FileReader()..readAsArrayBuffer(file); + await fileReader.onLoadEnd.first; + final result = fileReader.result; + if (result is Uint8List) { + return result; + } + return null; +} + +void _writeMap(Map jsonMap) { + final report = _kJsonEncoder.convert(jsonMap); + _output.text = report; + if (report.length < _kMaxReportLength) { + context['Prism'].callMethod('highlightAll', [!_isFileUri]); + } else { + print('Report is too big: ${report.length} bytes. ' + 'Syntax highlighting disabled.'); + } +} diff --git a/styles/prism.css b/styles/prism.css index 31631ea..b86676a 100644 --- a/styles/prism.css +++ b/styles/prism.css @@ -1,220 +1,3 @@ -/* PrismJS 1.23.0 +/* PrismJS 1.29.0 https://prismjs.com/download.html#themes=prism-coy&languages=json */ -/** - * prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML - * Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics); - * @author Tim Shedor - */ - -code[class*="language-"], -pre[class*="language-"] { - color: black; - background: none; - font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; - font-size: 1em; - text-align: left; - white-space: pre; - word-spacing: normal; - word-break: normal; - word-wrap: normal; - line-height: 1.5; - - -moz-tab-size: 4; - -o-tab-size: 4; - tab-size: 4; - - -webkit-hyphens: none; - -moz-hyphens: none; - -ms-hyphens: none; - hyphens: none; -} - -/* Code blocks */ -pre[class*="language-"] { - position: relative; - margin: .5em 0; - overflow: visible; - padding: 0; -} -pre[class*="language-"]>code { - position: relative; - border-left: 10px solid #358ccb; - box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf; - background-color: #fdfdfd; - background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%); - background-size: 3em 3em; - background-origin: content-box; - background-attachment: local; -} - -code[class*="language-"] { - max-height: inherit; - height: inherit; - padding: 0 1em; - display: block; - overflow: auto; -} - -/* Margin bottom to accommodate shadow */ -:not(pre) > code[class*="language-"], -pre[class*="language-"] { - background-color: #fdfdfd; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 1em; -} - -/* Inline code */ -:not(pre) > code[class*="language-"] { - position: relative; - padding: .2em; - border-radius: 0.3em; - color: #c92c2c; - border: 1px solid rgba(0, 0, 0, 0.1); - display: inline; - white-space: normal; -} - -pre[class*="language-"]:before, -pre[class*="language-"]:after { - content: ''; - z-index: -2; - display: block; - position: absolute; - bottom: 0.75em; - left: 0.18em; - width: 40%; - height: 20%; - max-height: 13em; - box-shadow: 0px 13px 8px #979797; - -webkit-transform: rotate(-2deg); - -moz-transform: rotate(-2deg); - -ms-transform: rotate(-2deg); - -o-transform: rotate(-2deg); - transform: rotate(-2deg); -} - -pre[class*="language-"]:after { - right: 0.75em; - left: auto; - -webkit-transform: rotate(2deg); - -moz-transform: rotate(2deg); - -ms-transform: rotate(2deg); - -o-transform: rotate(2deg); - transform: rotate(2deg); -} - -.token.comment, -.token.block-comment, -.token.prolog, -.token.doctype, -.token.cdata { - color: #7D8B99; -} - -.token.punctuation { - color: #5F6364; -} - -.token.property, -.token.tag, -.token.boolean, -.token.number, -.token.function-name, -.token.constant, -.token.symbol, -.token.deleted { - color: #c92c2c; -} - -.token.selector, -.token.attr-name, -.token.string, -.token.char, -.token.function, -.token.builtin, -.token.inserted { - color: #2f9c0a; -} - -.token.operator, -.token.entity, -.token.url, -.token.variable { - color: #a67f59; - background: rgba(255, 255, 255, 0.5); -} - -.token.atrule, -.token.attr-value, -.token.keyword, -.token.class-name { - color: #1990b8; -} - -.token.regex, -.token.important { - color: #e90; -} - -.language-css .token.string, -.style .token.string { - color: #a67f59; - background: rgba(255, 255, 255, 0.5); -} - -.token.important { - font-weight: normal; -} - -.token.bold { - font-weight: bold; -} -.token.italic { - font-style: italic; -} - -.token.entity { - cursor: help; -} - -.token.namespace { - opacity: .7; -} - -@media screen and (max-width: 767px) { - pre[class*="language-"]:before, - pre[class*="language-"]:after { - bottom: 14px; - box-shadow: none; - } - -} - -/* Plugin styles: Line Numbers */ -pre[class*="language-"].line-numbers.line-numbers { - padding-left: 0; -} - -pre[class*="language-"].line-numbers.line-numbers code { - padding-left: 3.8em; -} - -pre[class*="language-"].line-numbers.line-numbers .line-numbers-rows { - left: 0; -} - -/* Plugin styles: Line Highlight */ -pre[class*="language-"][data-line] { - padding-top: 0; - padding-bottom: 0; - padding-left: 0; -} -pre[data-line] code { - position: relative; - padding-left: 4em; -} -pre .line-highlight { - margin-top: 0; -} +code[class*=language-],pre[class*=language-]{color:#000;background:0 0;font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{position:relative;margin:.5em 0;overflow:visible;padding:1px}pre[class*=language-]>code{position:relative;z-index:1;border-left:10px solid #358ccb;box-shadow:-1px 0 0 0 #358ccb,0 0 0 1px #dfdfdf;background-color:#fdfdfd;background-image:linear-gradient(transparent 50%,rgba(69,142,209,.04) 50%);background-size:3em 3em;background-origin:content-box;background-attachment:local}code[class*=language-]{max-height:inherit;height:inherit;padding:0 1em;display:block;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background-color:#fdfdfd;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-bottom:1em}:not(pre)>code[class*=language-]{position:relative;padding:.2em;border-radius:.3em;color:#c92c2c;border:1px solid rgba(0,0,0,.1);display:inline;white-space:normal}pre[class*=language-]:after,pre[class*=language-]:before{content:'';display:block;position:absolute;bottom:.75em;left:.18em;width:40%;height:20%;max-height:13em;box-shadow:0 13px 8px #979797;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-ms-transform:rotate(-2deg);-o-transform:rotate(-2deg);transform:rotate(-2deg)}pre[class*=language-]:after{right:.75em;left:auto;-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-ms-transform:rotate(2deg);-o-transform:rotate(2deg);transform:rotate(2deg)}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#7d8b99}.token.punctuation{color:#5f6364}.token.boolean,.token.constant,.token.deleted,.token.function-name,.token.number,.token.property,.token.symbol,.token.tag{color:#c92c2c}.token.attr-name,.token.builtin,.token.char,.token.function,.token.inserted,.token.selector,.token.string{color:#2f9c0a}.token.entity,.token.operator,.token.url,.token.variable{color:#a67f59;background:rgba(255,255,255,.5)}.token.atrule,.token.attr-value,.token.class-name,.token.keyword{color:#1990b8}.token.important,.token.regex{color:#e90}.language-css .token.string,.style .token.string{color:#a67f59;background:rgba(255,255,255,.5)}.token.important{font-weight:400}.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.namespace{opacity:.7}@media screen and (max-width:767px){pre[class*=language-]:after,pre[class*=language-]:before{bottom:14px;box-shadow:none}}pre[class*=language-].line-numbers.line-numbers{padding-left:0}pre[class*=language-].line-numbers.line-numbers code{padding-left:3.8em}pre[class*=language-].line-numbers.line-numbers .line-numbers-rows{left:0}pre[class*=language-][data-line]{padding-top:0;padding-bottom:0;padding-left:0}pre[data-line] code{position:relative;padding-left:4em}pre .line-highlight{margin-top:0} diff --git a/styles/styles.css b/styles/styles.css index b254d31..4023b2a 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -97,6 +97,6 @@ html, body { cursor: pointer; } -#truncatedWarning { +.warning { color: #c92c2c; }