diff --git a/4-Classification/4-Applied/CouisineMatcher.js b/4-Classification/4-Applied/CouisineMatcher.js new file mode 100644 index 00000000..f7c837c6 --- /dev/null +++ b/4-Classification/4-Applied/CouisineMatcher.js @@ -0,0 +1,47 @@ +// Test alert message to verify JavaScript is working +alert('JavaScript is working! CuisineMatcher.js loaded successfully.'); + +const ingredients = Array(380).fill(0); + +const checks = [...document.querySelectorAll('.checkbox')]; + +checks.forEach(check => { + check.addEventListener('change', function() { + // toggle the state of the ingredient + // based on the checkbox's value (1 or 0) + ingredients[check.value] = check.checked ? 1 : 0; + }); +}); + +function testCheckboxes() { + // validate if at least one checkbox is checked + return checks.some(check => check.checked); +} + +async function startInference() { + + let atLeastOneChecked = testCheckboxes() + + if (!atLeastOneChecked) { + alert('Please select at least one ingredient.'); + return; + } + try { + // create a new session and load the model. + + const session = await ort.InferenceSession.create('./model.onnx'); + + const input = new ort.Tensor(new Float32Array(ingredients), [1, 380]); + const feeds = { float_input: input }; + + // feed inputs and run + const results = await session.run(feeds); + + // read from results + alert('You can enjoy ' + results.label.data[0] + ' cuisine today!') + + } catch (e) { + console.log(`failed to inference ONNX model`); + console.error(e); + } +} \ No newline at end of file diff --git a/4-Classification/4-Applied/index.html b/4-Classification/4-Applied/index.html index 6640e27d..3e508122 100644 --- a/4-Classification/4-Applied/index.html +++ b/4-Classification/4-Applied/index.html @@ -1,17 +1,26 @@ - - Cuisine Matcher + -

Check your refrigerator. What can you create?

+ + + +

Check your refrigerator. What can you create?

+
@@ -48,55 +57,9 @@ online netron to onnx file: https://netron.app/
-
+
+ - \ No newline at end of file diff --git a/4-Classification/4-Applied/styles.css b/4-Classification/4-Applied/styles.css new file mode 100644 index 00000000..3dacfd4f --- /dev/null +++ b/4-Classification/4-Applied/styles.css @@ -0,0 +1,40 @@ +/* Basic styling for navigation */ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; +} + +nav { + background-color: #4CAF50; + padding: 10px 20px; + color: white; + display: flex; + justify-content: space-between; + align-items: center; +} + +nav a { + color: white; + text-decoration: none; + margin: 0 10px; + font-weight: bold; +} + +nav a:hover { + text-decoration: underline; +} + +#wrapper { + padding: 20px; +} + +.boxCont { + margin-bottom: 10px; +} + +button { + padding: 10px 20px; + font-size: 16px; + cursor: pointer; +}