diff --git a/.gitignore b/.gitignore index 18834e2a..f7fb75e2 100644 --- a/.gitignore +++ b/.gitignore @@ -121,6 +121,7 @@ dist # Stores VSCode versions used for testing VSCode extensions .vscode-test +settings.json # yarn v2 .yarn/cache diff --git a/examples/melanoma.js b/examples/melanoma.js index 6c39cb45..cb0ecc2f 100644 --- a/examples/melanoma.js +++ b/examples/melanoma.js @@ -9,9 +9,10 @@ function tryRun() { script = document.createElement("script"); script.type = "text/javascript"; -// script.src = "https://boostlet.org/dist/boostlet.min.js"; + +script.src = "https://boostlet.org/dist/boostlet.min.js"; // script.src = "http://localhost:5500/dist/boostlet.min.js"; -script.src = "https://gaiborjosue.github.io/boostlet/dist/boostlet.min.js" +// script.src = "https://gaiborjosue.github.io/boostlet/dist/boostlet.min.js" script.onload = function() { boostletLoaded = true; tryRun(); @@ -35,6 +36,8 @@ async function run() { Boostlet.init(); getImage(); + + } @@ -56,13 +59,16 @@ async function predict(file) { // Log if it is a melanoma or not, index 0 is not melanoma, index 1 is melanoma, the veredict is the highest value, the log should say the probability of the prediction if (prediction[0] > prediction[1]) { - Boostlet.hint("The image is not a melanoma with a probability of: " + prediction[0], 3000); + Boostlet.hint("The image is not a melanoma with a probability of: " + prediction[0]); } else { - Boostlet.hint("The image is a melanoma with a probability of: " + prediction[1], 3000); + Boostlet.hint("The image is a melanoma with a probability of: " + prediction[1]); } - } - + BoostletHint.onclick = function () { + // destroy on click + window.document.body.removeChild(BoostletHint); + } + } } // Get an image from the current page @@ -80,6 +86,8 @@ function getImage() { div.innerHTML = "Drop an image here!"; div.style.zIndex = "99999"; div.style.backgroundColor = "#fff"; + div.style.textAlign = "center"; + div.style.fontSize = "20px"; document.body.appendChild(div); @@ -95,6 +103,7 @@ function getImage() { dropzone.ondrop = (event) => { event.preventDefault(); dropzone.style.backgroundColor = "#fff"; + const file = event.dataTransfer.files[0]; if (file && file.type.startsWith("image/")) { predict(file); diff --git a/index.html b/index.html index 7fcd9097..8c51c450 100644 --- a/index.html +++ b/index.html @@ -232,8 +232,8 @@ var examples = ['sobel.js', 'segmentanything.js', 'imageCaptioning.js', 'plotly.js', 'trako.js', 'melanoma.js']; - // var baseurl = 'https://raw.githubusercontent.com/mpsych/boostlet/main/examples/'; - var baseurl = 'https://raw.githubusercontent.com/gaiborjosue/boostlet/melanoma/examples/'; + var baseurl = 'https://raw.githubusercontent.com/mpsych/boostlet/main/examples/'; + // var baseurl = 'https://raw.githubusercontent.com/gaiborjosue/boostlet/melanoma/examples/'; // var baseurl = 'http://localhost:5500/examples/';