Spaces:
Sleeping
Sleeping
alrichardbollans
commited on
Commit
·
5b8db50
1
Parent(s):
4f1d19a
Improve html attributes for accessibility
Browse files
app.py
CHANGED
|
@@ -92,6 +92,20 @@ main_app = ui.page_fluid(
|
|
| 92 |
""" # Style need adding here for slider for some reason
|
| 93 |
),
|
| 94 |
ui.input_action_button("analyse", "Analyse", class_="btn-success"),
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 95 |
ui.row(class_="analysis-separator"),
|
| 96 |
# ui.input_switch("mask", "Mask", False),
|
| 97 |
ui.output_ui("download_results_ui"),
|
|
@@ -106,6 +120,13 @@ main_app = ui.page_fluid(
|
|
| 106 |
)
|
| 107 |
|
| 108 |
app_ui = ui.page_fluid(
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 109 |
ui.include_css("styles.css"),
|
| 110 |
|
| 111 |
ui.div(
|
|
@@ -130,7 +151,7 @@ app_ui = ui.page_fluid(
|
|
| 130 |
ui.p(
|
| 131 |
"The app is built for use with ", ui.HTML("<b>specific types of images</b>"),
|
| 132 |
" -- the protocol for taking images compatible with this model is available on ",
|
| 133 |
-
ui.a("GitHub", href=protocol_url, target="_blank"),
|
| 134 |
". The protocol is available in English, Indonesian, Thai, French, Spanish, Portuguese, Arabic, Mandarin, Malagasy and Japanese."),
|
| 135 |
ui.p(
|
| 136 |
"To use this app, upload images and click 'Analyse'."
|
|
@@ -149,7 +170,7 @@ app_ui = ui.page_fluid(
|
|
| 149 |
ui.p('Note that the upper limit for the number of detected seeds in a single image is 800.'),
|
| 150 |
|
| 151 |
ui.p(" If you have any feedback on the app, please start a discussion on the project ",
|
| 152 |
-
ui.a("HuggingFace Space", href=discussion_url, target="_blank"), '.'
|
| 153 |
),
|
| 154 |
ui.p(disclaimer_text),
|
| 155 |
|
|
@@ -161,10 +182,10 @@ app_ui = ui.page_fluid(
|
|
| 161 |
ui.p(
|
| 162 |
|
| 163 |
" Full details of the model, training process and evaluation can be found on the project ",
|
| 164 |
-
ui.a("GitHub repository", href=github_repo_url, target="_blank"),
|
| 165 |
". You can find a project overview ", ui.a("here",
|
| 166 |
href='https://www.kew.org/science/our-science/projects/machine-learning-to-improve-orchid-viability-testing',
|
| 167 |
-
target="_blank"), '.'),
|
| 168 |
class_="body-bar"))
|
| 169 |
, id='tab'
|
| 170 |
),
|
|
|
|
| 92 |
""" # Style need adding here for slider for some reason
|
| 93 |
),
|
| 94 |
ui.input_action_button("analyse", "Analyse", class_="btn-success"),
|
| 95 |
+
# Add script to set 'aria-label' on input, since direct attribute isn't supported
|
| 96 |
+
ui.tags.script("""
|
| 97 |
+
setTimeout(function() {
|
| 98 |
+
var fileInput = document.querySelector('input[type=file][id^=upload]');
|
| 99 |
+
if (fileInput) fileInput.setAttribute('aria-label', 'Upload images');
|
| 100 |
+
}, 100);
|
| 101 |
+
"""),
|
| 102 |
+
ui.tags.script("""
|
| 103 |
+
setTimeout(function() {
|
| 104 |
+
var analyseBtn = document.querySelector('button[id^="analyse"]');
|
| 105 |
+
if (analyseBtn) analyseBtn.setAttribute('aria-label', 'Analyse uploaded images');
|
| 106 |
+
}, 100);
|
| 107 |
+
"""),
|
| 108 |
+
|
| 109 |
ui.row(class_="analysis-separator"),
|
| 110 |
# ui.input_switch("mask", "Mask", False),
|
| 111 |
ui.output_ui("download_results_ui"),
|
|
|
|
| 120 |
)
|
| 121 |
|
| 122 |
app_ui = ui.page_fluid(
|
| 123 |
+
# Set charset in head
|
| 124 |
+
ui.tags.meta(charset="utf-8"),
|
| 125 |
+
# Set lang attribute on <html>
|
| 126 |
+
ui.tags.script("""
|
| 127 |
+
document.documentElement.setAttribute('lang', 'en');
|
| 128 |
+
"""),
|
| 129 |
+
|
| 130 |
ui.include_css("styles.css"),
|
| 131 |
|
| 132 |
ui.div(
|
|
|
|
| 151 |
ui.p(
|
| 152 |
"The app is built for use with ", ui.HTML("<b>specific types of images</b>"),
|
| 153 |
" -- the protocol for taking images compatible with this model is available on ",
|
| 154 |
+
ui.a("GitHub", href=protocol_url, target="_blank", **{'aria-label': 'Image taking protocols'}),
|
| 155 |
". The protocol is available in English, Indonesian, Thai, French, Spanish, Portuguese, Arabic, Mandarin, Malagasy and Japanese."),
|
| 156 |
ui.p(
|
| 157 |
"To use this app, upload images and click 'Analyse'."
|
|
|
|
| 170 |
ui.p('Note that the upper limit for the number of detected seeds in a single image is 800.'),
|
| 171 |
|
| 172 |
ui.p(" If you have any feedback on the app, please start a discussion on the project ",
|
| 173 |
+
ui.a("HuggingFace Space", href=discussion_url, target="_blank", **{'aria-label': 'Project discussion space'}), '.'
|
| 174 |
),
|
| 175 |
ui.p(disclaimer_text),
|
| 176 |
|
|
|
|
| 182 |
ui.p(
|
| 183 |
|
| 184 |
" Full details of the model, training process and evaluation can be found on the project ",
|
| 185 |
+
ui.a("GitHub repository", href=github_repo_url, target="_blank", **{'aria-label': 'GitHub repository'}),
|
| 186 |
". You can find a project overview ", ui.a("here",
|
| 187 |
href='https://www.kew.org/science/our-science/projects/machine-learning-to-improve-orchid-viability-testing',
|
| 188 |
+
target="_blank", **{'aria-label': 'Project overview'}), '.'),
|
| 189 |
class_="body-bar"))
|
| 190 |
, id='tab'
|
| 191 |
),
|