diff --git a/themes/green.js b/themes/green.js new file mode 100644 index 00000000..65948c03 --- /dev/null +++ b/themes/green.js @@ -0,0 +1,41 @@ + +var academic_chat = null; + +var sliders = null; +var rangeInputs = null; +var numberInputs = null; + +function set_elements() { + academic_chat = document.querySelector('gradio-app'); + async function get_sliders() { + sliders = document.querySelectorAll('input[type="range"]'); + while (sliders.length == 0) { + await new Promise(r => setTimeout(r, 100)); + sliders = document.querySelectorAll('input[type="range"]'); + } + setSlider(); + } + get_sliders(); +} + +function setSlider() { + rangeInputs = document.querySelectorAll('input[type="range"]'); + numberInputs = document.querySelectorAll('input[type="number"]') + function setSliderRange() { + var range = document.querySelectorAll('input[type="range"]'); + range.forEach(range => { + range.style.backgroundSize = (range.value - range.min) / (range.max - range.min) * 100 + '% 100%'; + }); + } + setSliderRange(); + rangeInputs.forEach(rangeInput => { + rangeInput.addEventListener('input', setSliderRange); + }); + numberInputs.forEach(numberInput => { + numberInput.addEventListener('input', setSliderRange); + }) +} + +window.addEventListener("DOMContentLoaded", () => { + set_elements(); +}); \ No newline at end of file diff --git a/themes/green.py b/themes/green.py index bed06519..e14f4b67 100644 --- a/themes/green.py +++ b/themes/green.py @@ -87,6 +87,10 @@ def adjust_theme(): """ + + with open('themes/green.js', 'r', encoding='utf8') as f: + js += f"" + gradio_original_template_fn = gr.routes.templates.TemplateResponse def gradio_new_template_fn(*args, **kwargs): res = gradio_original_template_fn(*args, **kwargs)