Skip to content

[VISQRunner] Run/edit visq configuration file. #1507

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
133 changes: 133 additions & 0 deletions media/VisqRunner/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,133 @@
<!DOCTYPE html>
<html lang="en">
<!--
Copyright (c) 2023 Samsung Electronics Co., Ltd. All Rights Reserved

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->

<head>
<meta charset="utf-8">
<meta http-equiv="Content-Security-Policy" content="img-src vscode;
style-src 'unsafe-inline' ${webview.cspSource};
script-src 'nonce-${nonce}';">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>VISQ configuration runner</title>
<link rel="stylesheet" href="${cssUri}">
<link rel="stylesheet" href="${codiconUri}">
<script nonce="${nonce}" type="module" src="${toolkitUri}"></script>
<script nonce="${nonce}" type="module" src="${scriptUri}"></script>
</head>
<body>
<div class="maintitle">
<span class="text">Run visq on the following configuration</span>
<vscode-button id="RunCfg" appearance="icon" >
<span slot="start" class="codicon codicon-play">
<span class="help">
Run configuration
</span>
</span>
</vscode-button>
</div>
<vscode-divider></vscode-divider>
<div>
<div class="title">
Input
</div>
<div class="sections">
<div>
<vscode-text-field id="FloatModelInputPath" startIcon="true" size="50" readonly="true" placeholder="float model path" class="input">
Float model
<span slot="start" class="codicon codicon-question" style="cursor: pointer">
<span class="help">
Path to the fp32 circle model.
</span>
</span>
<span id="float-file" slot="end" class="codicon codicon-search" style="cursor: pointer"></span>
</vscode-text-field>
<vscode-text-field id="QuantizedModelInputPath" startIcon="true" size="50" readonly="true" placeholder="quantized model path" class="input">
Quantized model
<span slot="start" class="codicon codicon-question" style="cursor: pointer">
<span class="help">
Path to the quantized circle model.
</span>
</span>
<span id="quantized-file" slot="end" class="codicon codicon-search" style="cursor: pointer"></span>
</vscode-text-field>
<vscode-text-field id="DataInputPath" startIcon="true" readonly="true" placeholder="h5 data path" size="50" class="input">
h5 data file
<span slot="start" class="codicon codicon-question" style="cursor: pointer">
<span class="help">
Path to the data used for inference. Random data will be used if this option is not given.
</span>
</span>
<span id="h5-file" slot="end" class="codicon codicon-search" style="cursor: pointer"></span>
</vscode-text-field>
</div>
</div>
<vscode-divider></vscode-divider>
<div>
<div class="title">
Output
</div>
<div class="output_grid" size=50>
<vscode-checkbox id="MPEIR-on">MPEIR</vscode-checkbox>
<vscode-text-field id="MPEIROutputPath" startIcon="true" placeholder="MPEIR path" size="40">
<span slot="start" class="codicon codicon-question" style="cursor: pointer">
<span class="help">
Path to the output json file (qerror metric = MPEIR).
</span>
</span>
<span id="mpeir-file" slot="end" class="codicon codicon-search" style="cursor: pointer"></span>
</vscode-text-field>
<vscode-checkbox id="MSE-on">MSE</vscode-checkbox>
<vscode-text-field id="MSEOutputPath" startIcon="true" placeholder="MSE path" size="40">
<span slot="start" class="codicon codicon-question" style="cursor: pointer">
<span class="help">
Path to the output json file (qerror metric = MSE).
</span>
</span>
<span id="mse-file" slot="end" class="codicon codicon-search" style="cursor: pointer"></span>
</vscode-text-field>
<vscode-checkbox id="TAE-on">TAE</vscode-checkbox>
<vscode-text-field id="TAEOutputPath" startIcon="true" placeholder="TAE path" size="40">
<span slot="start" class="codicon codicon-question" style="cursor: pointer">
<span class="help">
Path to the output json file (qerror metric = TAE).
</span>
</span>
<span id="tae-file" slot="end" class="codicon codicon-search" style="cursor: pointer"></span>
</vscode-text-field>
<vscode-checkbox id="SRMSE-on">SRMSE</vscode-checkbox>
<vscode-text-field id="SRMSEOutputPath" startIcon="true" placeholder="SRMSE path" size="40">
<span slot="start" class="codicon codicon-question" style="cursor: pointer">
<span class="help">
Path to the output json file (qerror metric = SRMSE).
</span>
</span>
<span id="srmse-file" slot="end" class="codicon codicon-search" style="cursor: pointer"></span>
</vscode-text-field>
</div>
</div>
<vscode-divider></vscode-divider>
<div>
<div class="title">
Options
</div>
<div class="section">
<vscode-checkbox id="DumpDot">Dump dot graph</vscode-checkbox>
</div>
</div>
</div>
</body>
</html>
191 changes: 191 additions & 0 deletions media/VisqRunner/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,191 @@
/*
* Copyright (c) 2023 Samsung Electronics Co., Ltd. All Rights Reserved
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

const vscode = acquireVsCodeApi();

// Just like a regular webpage we need to wait for the webview
// DOM to load before we can reference any of the HTML elements
// or toolkit components
window.addEventListener("load", main);

function main() {
register();

window.addEventListener("message", (event) => {
const message = event.data;
switch (message.type) {
case "displayCFG":
displayCFGToEditor(message.content);
break;
default:
break;
}
});

vscode.postMessage({ type: "requestDisplayCFG" });
}

function register() {
registerMainControls();
}

function registerMainControls() {
{
document
.getElementById("float-file")
.addEventListener("click", function () {
vscode.postMessage({
type: "loadFloatInputFile",
});
});

document
.getElementById("quantized-file")
.addEventListener("click", function () {
vscode.postMessage({
type: "loadQuantizedInputFile",
});
});

document.getElementById("h5-file").addEventListener("click", function () {
vscode.postMessage({
type: "loadH5DataFile",
});
});
}

{
document.getElementById("MPEIR-on").addEventListener("click", function () {
vscode.postMessage({
type: "toggleMPEIROutputFile",
on: document.getElementById("MPEIR-on").checked,
});
});
document
.getElementById("mpeir-file")
.addEventListener("click", function () {
vscode.postMessage({
type: "loadMPEIROutputFile",
});
});
document
.getElementById("MPEIROutputPath")
.addEventListener("input", function () {
vscode.postMessage({
type: "onMPEIRChanged",
path: document.getElementById("MPEIROutputPath").value,
});
});
}

{
document.getElementById("MSE-on").addEventListener("click", function () {
vscode.postMessage({
type: "toggleMSEOutputFile",
on: document.getElementById("MSE-on").checked,
});
});

document.getElementById("mse-file").addEventListener("click", function () {
vscode.postMessage({
type: "loadMSEInputFile",
});
});

document
.getElementById("MSEOutputPath")
.addEventListener("input", function () {
vscode.postMessage({
type: "onMSEChanged",
path: document.getElementById("MSEOutputPath").value,
});
});
}

{
document.getElementById("TAE-on").addEventListener("click", function () {
vscode.postMessage({
type: "toggleTAEOutputFile",
on: document.getElementById("TAE-on").checked,
});
});
document.getElementById("tae-file").addEventListener("click", function () {
vscode.postMessage({
type: "loadTAEOutputFile",
});
});
document
.getElementById("TAEOutputPath")
.addEventListener("input", function () {
vscode.postMessage({
type: "onTAEChanged",
path: document.getElementById("TAEOutputPath").value,
});
});
}

{
document.getElementById("SRMSE-on").addEventListener("click", function () {
vscode.postMessage({
type: "toggleSRMSEOutputFile",
on: document.getElementById("SRMSE-on").checked,
});
});
document
.getElementById("srmse-file")
.addEventListener("click", function () {
vscode.postMessage({
type: "loadSRMSEOutputFile",
});
});
document
.getElementById("SRMSEOutputPath")
.addEventListener("input", function () {
vscode.postMessage({
type: "onSRMSEChanged",
path: document.getElementById("SRMSEOutputPath").value,
});
});
}

document.getElementById("DumpDot").addEventListener("click", function () {
vscode.postMessage({
type: "dumpDot",
dump: document.getElementById("DumpDot").checked,
});
});

document.getElementById("RunCfg").addEventListener("click", function () {
vscode.postMessage({
type: "runCfg",
});
});
}

function displayCFGToEditor(cfg) {
document.getElementById("FloatModelInputPath").value = cfg?.["fp32_circle"];
document.getElementById("QuantizedModelInputPath").value = cfg?.["q_circle"];
document.getElementById("DataInputPath").value = cfg?.["data"];
document.getElementById("MPEIR-on").checked = cfg?.["mpeir_on"];
document.getElementById("MPEIROutputPath").value = cfg?.["mpeir_output"];
document.getElementById("MSE-on").checked = cfg?.["mse_on"];
document.getElementById("MSEOutputPath").value = cfg?.["mse_output"];
document.getElementById("TAE-on").checked = cfg?.["tae_on"];
document.getElementById("TAEOutputPath").value = cfg?.["tae_output"];
document.getElementById("SRMSE-on").checked = cfg?.["srmse_on"];
document.getElementById("SRMSEOutputPath").value = cfg?.["srmse_output"];
document.getElementById("DumpDot").checked = cfg?.["dump_dot_graph"];
}
Loading