diff --git a/app/javascript/submission_form/areas.vue b/app/javascript/submission_form/areas.vue index 3d7fa340..d0cdb527 100644 --- a/app/javascript/submission_form/areas.vue +++ b/app/javascript/submission_form/areas.vue @@ -73,7 +73,11 @@ export default { scrollIntoField (field) { this.areaRefs.find((area) => { if (area.field === field) { - area.$refs.scrollToElem.scrollIntoView({ behavior: 'smooth', block: 'start' }) + if (document.body.style.overflow === 'hidden') { + this.scrollInContainer(area.$el) + } else { + area.$refs.scrollToElem.scrollIntoView({ behavior: 'smooth', block: 'start' }) + } return true } else { @@ -81,6 +85,15 @@ export default { } }) }, + scrollInContainer (target) { + const padding = 64 + const boxRect = window.scrollbox.children[0].getBoundingClientRect() + const targetRect = target.getBoundingClientRect() + + const targetTopRelativeToBox = targetRect.top - boxRect.top + + window.scrollbox.scrollTop = targetTopRelativeToBox - document.body.offsetHeight + window.form_container.offsetHeight + target.offsetHeight + padding + }, setAreaRef (el) { if (el) { this.areaRefs.push(el) diff --git a/app/javascript/submission_form/form.vue b/app/javascript/submission_form/form.vue index 5674a739..93f6f8c3 100644 --- a/app/javascript/submission_form/form.vue +++ b/app/javascript/submission_form/form.vue @@ -369,6 +369,13 @@ export default { this.stepFields.indexOf([...this.stepFields].reverse().find((fields) => fields.some((f) => !!this.values[f.uuid]))) + 1, this.stepFields.length - 1 ) + + if (/iPhone|iPad|iPod/i.test(navigator.userAgent)) { + document.body.style.overflow = 'hidden' + + window.scrollbox.classList.add('h-full', 'overflow-y-auto') + window.scrollbox.parentNode.classList.add('h-screen', 'overflow-y-auto') + } }, methods: { goToStep (step, scrollToArea = false, clickUpload = false) { diff --git a/app/views/submissions/show.html.erb b/app/views/submissions/show.html.erb index 61abcc5e..6e40a5d6 100644 --- a/app/views/submissions/show.html.erb +++ b/app/views/submissions/show.html.erb @@ -5,7 +5,7 @@ <%= @submission.template.name %>