diff --git a/fiat-html/fiat-crypto.html b/fiat-html/fiat-crypto.html index cd9ef61395..f17ead4c89 100644 --- a/fiat-html/fiat-crypto.html +++ b/fiat-html/fiat-crypto.html @@ -33,6 +33,15 @@ z-index: 1; } + /*.output-filename { + position: absolute; + top: 5px; + left: 5px; + padding: 5px; + border: 1px solid #ddd; + z-index: 1; + }*/ + .hidden { display: none; } @@ -132,7 +141,7 @@ .file-name { margin-bottom: 5px; - width: calc(100% - 30px); + width: calc(100% - 60px); padding: 5px; } @@ -203,10 +212,10 @@

Standard Input

- +
-

Input Files

+

Input Files

@@ -214,8 +223,7 @@

Input Files

- - +
diff --git a/fiat-html/file-input.js b/fiat-html/file-input.js index 35315e09b7..f670a265d3 100644 --- a/fiat-html/file-input.js +++ b/fiat-html/file-input.js @@ -1,61 +1,4 @@ -function getStdinFromFormBoxRaw() { - const stdinBox = document.getElementById('stdin'); - return stdinBox.value; -} - -function getFilesFromFormBoxRaw() { - const filesBox = document.getElementById('files'); - return filesBox.value; -} - - -function getStdinFromFormBox() { - return JSON.parse(getStdinFromFormBoxRaw() || '[]'); -} - -function getFilesFromFormBox() { - return JSON.parse(getFilesFromFormBoxRaw() || '{}'); -} - -function populateStdinEntries(stdin) { - const stdinEntries = document.getElementById('stdinEntries'); - - if (stdin === undefined) { - stdin = getStdinFromFormBox(); - } - const entries = stdinEntries.querySelectorAll('.stdin-entry'); - entries.forEach(entry => { - entry.remove(); - }); - stdin.forEach(line => { - const entry = createStdinEntry(line); - stdinEntries.appendChild(entry); - }); -} - -function populateFileEntries(files) { - const fileEntries = document.getElementById('fileEntries'); - - if (files === undefined) { - files = getFilesFromFormBox(); - } - const entries = fileEntries.querySelectorAll('.file-entry'); - entries.forEach(entry => { - entry.remove(); - }); - Object.entries(files).forEach(([filename, content]) => { - const entry = createFileEntry(filename, content); - fileEntries.appendChild(entry); - }); -} - -document.addEventListener('DOMContentLoaded', function () { - const stdinEntries = document.getElementById('stdinEntries'); - const fileEntries = document.getElementById('fileEntries'); - const addStdinButton = document.getElementById('addStdinButton'); - const addFileButton = document.getElementById('addFileButton'); - const stdinBox = document.getElementById('stdin'); - const filesBox = document.getElementById('files'); +(function () { // Function to create a new file entry function createFileEntry(filename, content) { @@ -126,8 +69,62 @@ document.addEventListener('DOMContentLoaded', function () { return entry; } + + function getStdinFromFormBoxRaw() { + const stdinBox = document.getElementById('stdinTextArea'); + return stdinBox.value; + } + + function getFilesFromFormBoxRaw() { + const filesBox = document.getElementById('filesTextArea'); + return filesBox.value; + } + + + function getStdinFromFormBox() { + return JSON.parse(getStdinFromFormBoxRaw() || '[]'); + } + + function getFilesFromFormBox() { + return JSON.parse(getFilesFromFormBoxRaw() || '{}'); + } + + function populateStdinEntries(stdin) { + const stdinEntries = document.getElementById('stdinEntries'); + + if (stdin === undefined) { + stdin = getStdinFromFormBox(); + } + const entries = stdinEntries.querySelectorAll('.stdin-entry'); + entries.forEach(entry => { + entry.remove(); + }); + stdin.forEach(line => { + const entry = createStdinEntry(line); + stdinEntries.appendChild(entry); + }); + } + + function populateFileEntries(files) { + const fileEntries = document.getElementById('fileEntries'); + + if (files === undefined) { + files = getFilesFromFormBox(); + } + const entries = fileEntries.querySelectorAll('.file-entry'); + entries.forEach(entry => { + entry.remove(); + }); + Object.entries(files).forEach(([filename, content]) => { + const entry = createFileEntry(filename, content); + fileEntries.appendChild(entry); + }); + } + // Function to update the hidden stdin input value function updateStdinValue() { + const stdinEntries = document.getElementById('stdinEntries'); + const stdinBox = document.getElementById('stdinTextArea'); const entries = stdinEntries.querySelectorAll('.stdin-entry'); const stdinArray = Array.from(entries).map(entry => { const textarea = entry.querySelector('.stdin-textarea'); @@ -138,6 +135,8 @@ document.addEventListener('DOMContentLoaded', function () { // Function to update the hidden files input value function updateFilesValue() { + const fileEntries = document.getElementById('fileEntries'); + const filesBox = document.getElementById('filesTextArea'); const entries = fileEntries.querySelectorAll('.file-entry'); const filesObj = {}; @@ -153,15 +152,27 @@ document.addEventListener('DOMContentLoaded', function () { filesBox.value = JSON.stringify(filesObj); } - // Add event listeners for adding new entries - addStdinButton.addEventListener('click', function () { - stdinEntries.appendChild(createStdinEntry()); - }); + window.getStdinFromFormBox = getStdinFromFormBox; + window.getFilesFromFormBox = getFilesFromFormBox; + window.getStdinFromFormBoxRaw = getStdinFromFormBoxRaw; + window.getFilesFromFormBoxRaw = getFilesFromFormBoxRaw; + window.populateStdinEntries = populateStdinEntries; + window.populateFileEntries = populateFileEntries; - addFileButton.addEventListener('click', function () { - fileEntries.appendChild(createFileEntry()); - }); + document.addEventListener('DOMContentLoaded', function () { + const addStdinButton = document.getElementById('addStdinButton'); + const addFileButton = document.getElementById('addFileButton'); - populateStdinEntries(); - populateFileEntries(); -}); \ No newline at end of file + // Add event listeners for adding new entries + addStdinButton.addEventListener('click', function () { + stdinEntries.appendChild(createStdinEntry()); + }); + + addFileButton.addEventListener('click', function () { + fileEntries.appendChild(createFileEntry()); + }); + + populateStdinEntries(); + populateFileEntries(); + }); +})(); diff --git a/fiat-html/main.js b/fiat-html/main.js index 5c9497d8a3..85378f3710 100644 --- a/fiat-html/main.js +++ b/fiat-html/main.js @@ -107,7 +107,7 @@ document.addEventListener('DOMContentLoaded', function () { // Create a container for each output file const fileEntries = Object.entries(files); - + // Add or remove 'hidden' class based on whether there are files if (fileEntries.length > 0) { // Create HTML for each file @@ -115,9 +115,9 @@ document.addEventListener('DOMContentLoaded', function () { // Create file container with HTML template literal const fileHtml = `
+
${escapeHtml(filename)}:
- ${escapeHtml(filename)}
`; @@ -222,7 +222,11 @@ document.addEventListener('DOMContentLoaded', function () { if (!success) { displayError(exceptionText.join('\n')); } - displayOutput(stdout.join(''), stderr.join(''), files); + const filesMap = {}; + for (const [key, value] of files) { + filesMap[key] = value.join(''); + } + displayOutput(stdout.join(''), stderr.join(''), filesMap); } function handleException(err) { @@ -247,6 +251,7 @@ document.addEventListener('DOMContentLoaded', function () { } function handleSynthesisResult(result, cached) { + console.log({ 'handleSynthesisResult result': result }); const extraCachedString = [ result.fiat_crypto_version == fiat_crypto_version ? '' : ` in ${result.fiat_crypto_version}`, result.method === undefined ? '' : ` via ${result.method}`, @@ -398,8 +403,8 @@ document.addEventListener('DOMContentLoaded', function () { if (argv) { if (nonFalseQueryParam(interactive)) { inputArgs.value = decodeURIComponent(argv); - populateStdinEntries(decodeURIComponent(stdin)); - populateFileEntries(decodeURIComponent(files)); + populateStdinEntries(JSON.parse(decodeURIComponent(stdin))); + populateFileEntries(JSON.parse(decodeURIComponent(files))); document.querySelector(`input[value="${inputType}"]`).checked = true; updateInputType(inputType); inputForm.classList.remove('hidden');