Conversation
ChrispinP
added
enhancement
ChrispinP
requested review from
ChristinaTremel,
KaroEngstrom,
chiaberry,
dianamartin,
hlupico and
susannegov
dianamartin
left a comment
dianamartin
left a comment
There was a problem hiding this comment.
Does the footer stay at the bottom of the page?
The Footer will load or persist under existing body/content and in most cases will appear at the bottom of the page. It wont appear at the absolute bottom of a browser window. There is a potential scenario that any content that is purposely loaded after it, would appear below it, which is not likely since we dont surface ads or the like to our users. Hope this clarifies 😊 |
|
Due to Knack page hierarchy, the footer was appearing on child pages not indicated by the array so now the logic is checking for an exact match and we exclude on scenes not indicated in the array. Tested on PTE and the footer is now appearing correctly on all indicated scenes whether a standard page or modal. The city website change did not change the url so the existing url is still applicable. This is now ready for re-review and potential prod implementation. |
There was a problem hiding this comment.
This looks fine to me looking at the ROW PTE. I see the variable to update on public-facing web apps would be stored in the footerHashes array that lists the specific page slugs to inject it.
I would prefer to have it exclude modal pop-ups from injecting footers, but their could bespecific situations where you do inject a footer.
I've been looking at the MutableObserver() and this could be useful for addressing accessibility for dynamic content in some of Knack's forms.
chiaberry
left a comment
chiaberry
left a comment
There was a problem hiding this comment.
injectFooter and injectModalFooter are really similar, I was wondering if there is a way to combine the functions and just use one. However, the modal one doesnt use an interval or multiple attempts, why does the generic one need multiple attempts? Is there a race condition when the page loads that prevents it from attaching at first?
| const footerHashes = [ | ||
| '#customer/', // scene_482 customer login | ||
| '#portal-home/', // scene_291 | ||
| '#all-services/', // scene_306 (modal) | ||
| '#portal-home/all-services/', // scene_306 (modal) | ||
| '#tcp-traffic-control-plan/', // scene_302 | ||
| '#tcp-conflict-shared/', // scene_305 | ||
| '#contact-us/', // scene_179 (modal) | ||
| ]; |
There was a problem hiding this comment.
so this footer is for any Knack App, but are these scenes specific to just one knack app? is this from ROW?
There was a problem hiding this comment.
correct, this is an example for the ROW Portal. The only pages in the array would be public facing pages where we want to add the footer with the Privacy Policy.
Theres been no need or requirement to add Footers to staff pages yet which would likely be constructed a bit differently. So in conciseness, this is really for Public Facing Knack Apps since Internal Knack Apps dont currently need it.
| $('#coa-footer').remove(); | ||
| $('#knack-body').append(footerHTML); |
There was a problem hiding this comment.
I am kind of confused by this, you remove the footer to then add the footer? At this point, the footer doesnt exist yet though, right? Because on line 43 you check if it exists and exit the function if it does
There was a problem hiding this comment.
This is a redundancy that could be removed but is another check in case the footer is floating in the DOM from a previous page. This is an edge case though so it could potentially be removed. If we remove, I would just want to double check that the issue does not occur.
| // Always remove if we're on a non-footer page | ||
| if (!shouldShow) { | ||
| $('#coa-footer').remove(); | ||
| return; | ||
| } |
There was a problem hiding this comment.
I am not sure that there would be a footer to remove here, in the injectModal one you just return, could you do that here?
There was a problem hiding this comment.
There were instances where the Footer would linger on the DOM when switching to a new page. This is particularly true when navigating from a standard page to a modal or a page with a footer to a page that shouldnt show the footer. This acts as that basic check to prevent the ghosting.
Specifically crafted so that it is page agnostic. Since modals are treated differently in Knack we need to target them specifically so that any scenes, whether they are standard or modal pages, when included in the array, will show the footer. |
You are on the money. Yes there is a race condition happening in addition to the page hierarchy complication where Knack treats modals differently. So because of these 2 reasons they require some specificity. |
4 participants
This work is to elevate the requirement to post the City of Austin Privacy Policy on public facing Knack pages. Instead of manual maintenance, this code provides us an easy way to maintain an array of scenes we would like to target in an app, use standard CSS styling, and have the footer display appropriately on either standard or modal pages. The footer has been centered with the COA branding and a link to the Privacy Policy. The code has been wrapped and uses the image stored on our Knack Media Gitbook. The Footer should appear at the bottom of a page either on load or when the url hash changes.
This is currently live on the ROW PTE and is a WIP and now available for testing