diff --git a/packages/space-opera/src/components/model_viewer_snippet/components/validation.ts b/packages/space-opera/src/components/model_viewer_snippet/components/validation.ts
index d68fddbfac..c30138c880 100644
--- a/packages/space-opera/src/components/model_viewer_snippet/components/validation.ts
+++ b/packages/space-opera/src/components/model_viewer_snippet/components/validation.ts
@@ -22,12 +22,13 @@ import {State} from '../../../types.js';
import {ConnectedLitElement} from '../../connected_lit_element/connected_lit_element';
import {getGltfUrl} from '../../model_viewer_preview/reducer.js';
import {validateGltf} from './validation_utils.js';
+import type {Report, Message} from './validation_utils';
@customElement('me-validation-modal')
export class ValidationModal extends LitElement {
static styles = [validationStyles];
- @property() report: any = {};
+ @property() report: Report = {};
@internalProperty() isOpen: boolean = false;
open() {
@@ -38,7 +39,7 @@ export class ValidationModal extends LitElement {
this.isOpen = false;
}
- renderTable(color: string, title: string, messages: any[]) {
+ renderTable(color: string, title: string, messages: Message) {
return html`
@@ -66,16 +67,16 @@ export class ValidationModal extends LitElement {
Validation report
- - Format: glTF ${this.report.info.version}
- - Generator: ${this.report.info.generator}
+ - Format: glTF ${this.report.info!.version}
+ - Generator: ${this.report.info!.generator}
-
Stats:
- - ${this.report.info.drawCallCount} draw calls
- - ${this.report.info.animationCount} animations
- - ${this.report.info.materialCount} materials
- - ${this.report.info.totalVertexCount} vertices
- - ${this.report.info.totalTriangleCount} triangles
+ - ${this.report.info!.drawCallCount} draw calls
+ - ${this.report.info!.animationCount} animations
+ - ${this.report.info!.materialCount} materials
+ - ${this.report.info!.totalVertexCount} vertices
+ - ${this.report.info!.totalTriangleCount} triangles
@@ -100,20 +101,20 @@ export class ValidationModal extends LitElement {
${this.renderMetaData()}
${
- this.report.issues.numErrors ?
- this.renderTable('#f44336', 'Error', this.report.errors) :
+ this.report.issues!.numErrors ?
+ this.renderTable('#f44336', 'Error', this.report!.errors!) :
html``}
${
- this.report.issues.numWarnings ?
- this.renderTable('#f9a825', 'Warning', this.report.warnings) :
+ this.report.issues!.numWarnings ?
+ this.renderTable('#f9a825', 'Warning', this.report!.warnings!) :
html``}
${
- this.report.issues.numHints ?
- this.renderTable('#8bc34a', 'Hint', this.report.hints) :
+ this.report.issues!.numHints ?
+ this.renderTable('#8bc34a', 'Hint', this.report!.hints!) :
html``}
${
- this.report.issues.numInfos ?
- this.renderTable('#2196f3', 'Info', this.report.infos) :
+ this.report.issues!.numInfos ?
+ this.renderTable('#2196f3', 'Info', this.report!.infos!) :
html``}
`;
@@ -128,7 +129,7 @@ export class Validation extends ConnectedLitElement {
@query('me-validation-modal#validation-modal')
validationModal!: ValidationModal;
@internalProperty() gltfUrl?: string;
- @internalProperty() report?: any;
+ @internalProperty() report?: Report;
@internalProperty() severityTitle: string = '';
@internalProperty() severityColor: string = '';
@@ -145,19 +146,19 @@ export class Validation extends ConnectedLitElement {
this.report = await validateGltf(url);
this.severityTitle = 'Model Details';
this.severityColor = '#3c4043';
- if (this.report.issues.numInfos) {
+ if (this.report.issues!.numInfos) {
this.severityColor = '#2196f3';
this.severityTitle = 'Info';
}
- if (this.report.issues.numHints) {
+ if (this.report.issues!.numHints) {
this.severityColor = '#8bc34a';
this.severityTitle = 'Hint';
}
- if (this.report.issues.numWarnings) {
+ if (this.report.issues!.numWarnings) {
this.severityColor = '#f9a825';
this.severityTitle = 'Warning';
}
- if (this.report.issues.numErrors) {
+ if (this.report.issues!.numErrors) {
this.severityColor = '#f44336';
this.severityTitle = 'Error';
}
diff --git a/packages/space-opera/src/components/model_viewer_snippet/components/validation_utils.ts b/packages/space-opera/src/components/model_viewer_snippet/components/validation_utils.ts
index 37d0b1eab8..a2983a7984 100644
--- a/packages/space-opera/src/components/model_viewer_snippet/components/validation_utils.ts
+++ b/packages/space-opera/src/components/model_viewer_snippet/components/validation_utils.ts
@@ -23,10 +23,41 @@ import {LoaderUtils} from 'three';
const SEVERITY_MAP = ['Errors', 'Warnings', 'Infos', 'Hints'];
+export type Report = {
+ info?: {
+ version?: string;
+ generator?: string;
+ drawCallCount?: number;
+ animationCount?: number;
+ materialCount?: number;
+ totalVertexCount?: number;
+ totalTriangleCount?: number;
+ };
+ validatorVersion?: string;
+ issues?: {
+ numErrors?: number;
+ numWarnings?: number;
+ numHints?: number;
+ numInfos?: number;
+ };
+ errors?: Message;
+ warnings?: Message;
+ hints?: Message;
+ infos?: Message;
+ [k: string]: any;
+};
+
+export type Message = {
+ code: string;
+ message: string;
+ pointer: string;
+ [k: string]: any;
+}[];
+
/**
* Passes the gltf url to be validated.
*/
-export async function validateGltf(url: string) {
+export async function validateGltf(url: string): Promise {
return await fetch(url)
.then((response) => response.arrayBuffer())
.then(