[WHLSL] Implement texture types
[WebKit-https.git] / Tools / WebGPUShadingLanguageRI / SPIRV.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <style>
5 td {
6     border: solid black 1px;
7 }
8 </style>
9     <!-- FIXME: Migrate to ES6 modules -->
10     <script src="Node.js"></script>
11     <script src="Type.js"></script>
12     <script src="ReferenceType.js"></script>
13     <script src="Value.js"></script>
14     <script src="Expression.js"></script>
15     <script src="Rewriter.js"></script>
16     <script src="Visitor.js"></script>
17     <script src="CreateLiteral.js"></script>
18     <script src="CreateLiteralType.js"></script>
19     <script src="PropertyAccessExpression.js"></script>
20     <script src="NativeType.js"></script>
21
22     <script src="AddressSpace.js"></script>
23     <script src="AnonymousVariable.js"></script>
24     <script src="ArrayRefType.js"></script>
25     <script src="ArrayType.js"></script>
26     <script src="Assignment.js"></script>
27     <script src="AutoWrapper.js"></script>
28     <script src="Block.js"></script>
29     <script src="BoolLiteral.js"></script>
30     <script src="Break.js"></script>
31     <script src="BuiltinMatrixGetter.js"></script>
32     <script src="BuiltinMatrixSetter.js"></script>
33     <script src="BuiltinVectorGetter.js"></script>
34     <script src="BuiltinVectorSetter.js"></script>
35     <script src="CallExpression.js"></script>
36     <script src="CallFunction.js"></script>
37     <script src="Casts.js"></script>
38     <script src="Check.js"></script>
39     <script src="CheckLiteralTypes.js"></script>
40     <script src="CheckLoops.js"></script>
41     <script src="CheckRecursion.js"></script>
42     <script src="CheckRecursiveTypes.js"></script>
43     <script src="CheckReturns.js"></script>
44     <script src="CheckTypesWithArguments.js"></script>
45     <script src="CheckUnreachableCode.js"></script>
46     <script src="CheckWrapped.js"></script>
47     <script src="Checker.js"></script>
48     <script src="CloneProgram.js"></script>
49     <script src="CommaExpression.js"></script>
50     <script src="ConstexprFolder.js"></script>
51     <script src="Continue.js"></script>
52     <script src="ConvertPtrToArrayRefExpression.js"></script>
53     <script src="DoWhileLoop.js"></script>
54     <script src="DotExpression.js"></script>
55     <script src="DereferenceExpression.js"></script>
56     <script src="EArrayRef.js"></script>
57     <script src="EBuffer.js"></script>
58     <script src="EBufferBuilder.js"></script>
59     <script src="EPtr.js"></script>
60     <script src="EnumLiteral.js"></script>
61     <script src="EnumMember.js"></script>
62     <script src="EnumType.js"></script>
63     <script src="EvaluationCommon.js"></script>
64     <script src="Evaluator.js"></script>
65     <script src="ExpressionFinder.js"></script>
66     <script src="ExternalOrigin.js"></script>
67     <script src="Field.js"></script>
68     <script src="FindHighZombies.js"></script>
69     <script src="FlattenedStructOffsetGatherer.js"></script>
70     <script src="FloatLiteral.js"></script>
71     <script src="FloatLiteralType.js"></script>
72     <script src="FoldConstexprs.js"></script>
73     <script src="ForLoop.js"></script>
74     <script src="Func.js"></script>
75     <script src="FuncDef.js"></script>
76     <script src="FuncParameter.js"></script>
77     <script src="FunctionLikeBlock.js"></script>
78     <script src="HighZombieFinder.js"></script>
79     <script src="IdentityExpression.js"></script>
80     <script src="IfStatement.js"></script>
81     <script src="IndexExpression.js"></script>
82     <script src="InferTypesForCall.js"></script>
83     <script src="Inline.js"></script>
84     <script src="Inliner.js"></script>
85     <script src="IntLiteral.js"></script>
86     <script src="IntLiteralType.js"></script>
87     <script src="Intrinsics.js"></script>
88     <script src="LateChecker.js"></script>
89     <script src="Lexer.js"></script>
90     <script src="LexerToken.js"></script>
91     <script src="LiteralTypeChecker.js"></script>
92     <script src="LogicalExpression.js"></script>
93     <script src="LogicalNot.js"></script>
94     <script src="LoopChecker.js"></script>
95     <script src="MakeArrayRefExpression.js"></script>
96     <script src="MakePtrExpression.js"></script>
97     <script src="MatrixType.js"></script>
98     <script src="NameContext.js"></script>
99     <script src="NameFinder.js"></script>
100     <script src="NameResolver.js"></script>
101     <script src="NativeFunc.js"></script>
102     <script src="NormalUsePropertyResolver.js"></script>
103     <script src="NullLiteral.js"></script>
104     <script src="NullType.js"></script>
105     <script src="OperatorAnderIndexer.js"></script>
106     <script src="OperatorArrayRefLength.js"></script>
107     <script src="OriginKind.js"></script>
108     <script src="OverloadResolutionFailure.js"></script>
109     <script src="Parse.js"></script>
110     <script src="Prepare.js"></script>
111     <script src="PropertyResolver.js"></script>
112     <script src="Program.js"></script>
113     <script src="ProgramWithUnnecessaryThingsRemoved.js"></script>
114     <script src="PtrType.js"></script>
115     <script src="ReadModifyWriteExpression.js"></script>
116     <script src="RecursionChecker.js"></script>
117     <script src="RecursiveTypeChecker.js"></script>
118     <script src="ResolveNames.js"></script>
119     <script src="ResolveOverloadImpl.js"></script>
120     <script src="ResolveProperties.js"></script>
121     <script src="ResolveTypeDefs.js"></script>
122     <script src="Return.js"></script>
123     <script src="ReturnChecker.js"></script>
124     <script src="ReturnException.js"></script>
125     <script src="Sampler.js"></script>
126     <script src="StandardLibrary.js"></script>
127     <script src="StatementCloner.js"></script>
128     <script src="StructLayoutBuilder.js"></script>
129     <script src="StructType.js"></script>
130     <script src="SwitchCase.js"></script>
131     <script src="SwitchStatement.js"></script>
132     <script src="SynthesizeArrayOperatorLength.js"></script>
133     <script src="SynthesizeEnumFunctions.js"></script>
134     <script src="SynthesizeStructAccessors.js"></script>
135     <script src="SynthesizeCopyConstructorOperator.js"></script>
136     <script src="SynthesizeDefaultConstructorOperator.js"></script>
137     <script src="TernaryExpression.js"></script>
138     <script src="Texture.js"></script>
139     <script src="TextureOperations.js"></script>
140     <script src="TrapStatement.js"></script>
141     <script src="TypeDef.js"></script>
142     <script src="TypeDefResolver.js"></script>
143     <script src="TypeRef.js"></script>
144     <script src="TypeOverloadResolutionFailure.js"></script>
145     <script src="TypedValue.js"></script>
146     <script src="UintLiteral.js"></script>
147     <script src="UintLiteralType.js"></script>
148     <script src="UnificationContext.js"></script>
149     <script src="UnreachableCodeChecker.js"></script>
150     <script src="VariableDecl.js"></script>
151     <script src="VariableRef.js"></script>
152     <script src="VectorType.js"></script>
153     <script src="VisitingSet.js"></script>
154     <script src="WSyntaxError.js"></script>
155     <script src="WTrapError.js"></script>
156     <script src="WTypeError.js"></script>
157     <script src="WhileLoop.js"></script>
158     <script src="WrapChecker.js"></script>
159 <script>
160     let code = `
161 struct VertexInput {
162     float2 position;
163     float3 color;
164 }
165
166 struct VertexOutput {
167     float4 wsl_Position;
168     float4 color;
169 }
170
171 struct FragmentOutput {
172     float4 wsl_Color;
173 }
174
175 vertex VertexOutput vertexShader(VertexInput vertexInput) {
176     VertexOutput result;
177     result.wsl_Position = float4(vertexInput.position, 0., 1.);
178     result.color = float4(vertexInput.color, 1);
179     
180     int[10] a;
181     int[10u] b;
182     return result;
183 }
184
185 fragment FragmentOutput fragmentShader(VertexOutput stageIn) {
186     FragmentOutput result;
187     result.wsl_Color = stageIn.color;
188     return result;
189 }`;
190
191     window.addEventListener("load", function () {
192         fetch("spirv.core.grammar.json").then(response => response.json()).then(function (json) {
193             let spirv = SPIRV(json);
194             let program = prepare("/internal/test", 0, code);
195             let result = generateSPIRV(spirv, program);
196             return result;
197         }).then(function(result) {
198             let resultElement = document.getElementById("Result");
199             while (resultElement.childNodes.length != 0)
200                 resultElement.removeChild(resultElement.childNodes[0]);
201             let anchor = document.createElement("a");
202             let blob = new Blob([result.file], { type: "application/octet-binary" });
203             anchor.href = URL.createObjectURL(blob);
204             anchor.download = "result.spv";
205             anchor.textContent = "Download generated SPIR-V";
206             resultElement.appendChild(anchor);
207
208             let table = document.createElement("table");
209             let tableHeader = document.createElement("thead");
210             let headerRow = document.createElement("tr");
211             let nameHeader = document.createElement("th");
212             nameHeader.textContent = "Attribute name";
213             let locationHeader = document.createElement("th");
214             locationHeader.textContent = "Location";
215             headerRow.appendChild(nameHeader);
216             headerRow.appendChild(locationHeader);
217             tableHeader.appendChild(headerRow);
218             table.appendChild(tableHeader);
219             for (let location of result.locations) {
220                 let tableRow = document.createElement("tr");
221                 let nameElement = document.createElement("td");
222                 nameElement.textContent = location.name;
223                 let locationElement = document.createElement("td");
224                 locationElement.textContent = location.location;
225                 tableRow.appendChild(nameElement);
226                 tableRow.appendChild(locationElement);
227                 table.appendChild(tableRow);
228             }
229             resultElement.appendChild(table);
230         }).then(undefined, function () {
231             let resultElement = document.getElementById("Result");
232             while (resultElement.childNodes.length != 0)
233                 resultElement.removeChild(resultElement.childNodes[0]);
234             resultElement.textContent = "Load failed.";
235         });
236     });
237 </script>
238 </head>
239 <body>
240     <div id="Result">Loading...</div>
241 </body>
242 </html>