Skip to content

Commit

Permalink
Add location alert fields to homepage widget
Browse files Browse the repository at this point in the history 
** Why are these changes being introduced:

* There is an upcoming closure to the Hayden library, and we want to
  enable UXWS staff to be able to add alerts to the homepage for cases
  like this without asking for EngX to modify static templates.

* After discussing the needed feature among themselves, UX has decided
  that a separate field for homepage alerts was preferrable, because
  that space frequently needs a single line of text that does not
  replicate the uses of the existing title and body fields for the
  current alert information.

** Relevant ticket(s):

* https://mitlibraries.atlassian.net/browse/pw-93

** How does this address that need:

* First, we add a new field to the Location Attributes fieldset, named
  alert_frontpage. This field appears next to the other location alert
  fields (alert_title and alert_content), with help text advising that
  this new field should only have links added to it.

* Second, we add a function to hte homepage locations widget (part of
  the hours plugin, for Reasons) to check each location's record to see
  if this new field is populated. If content is found, it is included in
  the page below that location's entry.

* The styling for this display is taken from the former styles for the
  Hayden renovation alert, which was statically added to this partial.

** Document any side effects to this change:

* The use of a function in the template for the homepage hours widget
  is a bit of a code smell, but I'm not able to wrap my head around how
  to write this as a method on the widget class.

* This ticket is validating our choice to go with a monorepo for our
  WordPress application - as the changes being made might have spanned
  across several repositories in our previous infrastructure (one for
  the hours widget, one for the parent theme to change the styling,
  and potentially a third for the data model change - although that
  may have just been a configuration and not a code change before).

* This does not get us entirely away from mixing code and content, as
  the homepage hours widget still has hard-coded values for other
  location information (location names, which locations are shown, and
  in what order, their phone numbers, etc).
  • Loading branch information
@matt-bernhardt
matt-bernhardt committed May 14, 2024
1 parent 79a4a15 commit 080605a
Show file tree
Hide file tree
Showing 3 changed files with 80 additions and 2 deletions.
21 changes: 20 additions & 1 deletion web/app/mu-plugins/mitlib-post/data/location/group_58e22931ab9f5.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,25 @@
"tabs": "all",
"delay": 0
},
{
"key": "field_6643c15f0075d",
"label": "Alert Frontpage",
"name": "alert_frontpage",
"type": "wysiwyg",
"instructions": "This field is shown only on the front page hours widget. The content is automatically wrapped in a paragraph tag. The only allowed HTML tag is for links (a tags).",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "",
"class": "",
"id": ""
},
"default_value": "",
"tabs": "all",
"toolbar": "full",
"media_upload": 0,
"delay": 0
},
{
"key": "field_24",
"label": "Display Page",
Expand Down Expand Up @@ -990,5 +1009,5 @@
"active": true,
"description": "",
"show_in_rest": 0,
"modified": 1671581913
"modified": 1715716606
}
59 changes: 59 additions & 0 deletions web/app/plugins/mitlib-pull-hours/templates/display-widget-frontpage.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,41 @@
* @since 0.6.0
*/

/**
* This function accepts the post ID of a location record, which will be used
* to check if that location has its alert populated. If either of the two
* fields for the location alert (alert_title or alert_content) are populated,
* that content will be shown in a div.
*
* The function does not return anything.
*
* @param string $location_id The ID of a location record to look up.
*
* @return void
*/
function location_alert( $location_id ) {
$allowed_html = array(
'a' => array(
'href' => array(),
),
);

$query_args = array(
'post_type' => 'location',
'p' => $location_id,
'post_status' => 'publish',
);
$locations = new \WP_Query( $query_args );
while ( $locations->have_posts() ) {
$locations->the_post();
$alert_frontpage = get_field( 'alert_frontpage' );
if ( $alert_frontpage ) {
echo '<div class="location-alert">';
echo wp_kses( $alert_frontpage, $allowed_html );
echo '</div>';
}
}
}
?>

<div class="location">
Expand All @@ -14,18 +49,30 @@
<h3><a class="name-location" href="/barker">Barker Library</a></h3><div class="hours"><span data-location-hours="Barker Library"></span> today</div><div class="location-info"><a href="/locations/#!barker-library" class="map-location">10-500</a><a href="tel:617-253-0968" class="phone"><span class="number">617-253-0968</span></a></div>
</div>
</div>
<?php
// Load location alerts for Barker (post 322).
location_alert( 322 );
?>
<div class="location">
<a href="/dewey" aria-labelledby="dewey" class="img-loc dewey"><span class="sr" id="dewey">Dewey Library</span></a>
<div class="wrap-loc-info">
<h3><a class="name-location" href="/dewey">Dewey Library</a></h3><div class="hours"><span data-location-hours="Dewey Library"></span> today</div><div class="location-info"><a href="/locations/#!dewey-library" class="map-location">E53-100</a><a href="tel:617-253-5676" class="phone"><span class="number">617-253-5676</span></a></div>
</div>
</div>
<?php
// Load location alerts for Dewey (post 313).
location_alert( 313 );
?>
<div class="location">
<a href="/hayden" aria-labelledby="hayden" class="img-loc hayden"><span class="sr" id="hayden">Hayden Library</span></a>
<div class="wrap-loc-info">
<h3><a class="name-location" href="/hayden">Hayden Library</a></h3><div class="hours"><span data-location-hours="Hayden Library"></span> today</div> <div class="location-info"><a href="/locations/#!hayden-library" class="map-location">14S-100</a><a href="tel:617-253-5671" class="phone"><span class="number">617-253-5671</span></a></div>
</div>
</div>
<?php
// Load location alerts for Hayden (post 452).
location_alert( 452 );
?>
<a href="#0" class="show-more hidden-non-mobile">
<svg class="icon-arrow-down" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" width="16.3" height="9.4" viewBox="2.7 8.3 16.3 9.4" enable-background="new 2.7 8.3 16.3 9.4" xml:space="preserve"><path d="M18.982 9.538l-8.159 8.159L2.665 9.538l1.284-1.283 6.875 6.875 6.875-6.875L18.982 9.538z"/></svg>Show 3 More
</a>
Expand All @@ -35,16 +82,28 @@
<h3><a class="name-location" href="/rotch">Rotch Library</a></h3><div class="hours"><span data-location-hours="Rotch Library"></span> today</div><div class="location-info"><a href="/locations/#!rotch-library" class="map-location">7-238</a><a href="tel:617-258-5592" class="phone"><span class="number">617-258-5592</span></a></div>
</div>
</div>
<?php
// Load location alerts for Rotch (post 359).
location_alert( 359 );
?>
<div class="location hidden-mobile inactive-mobile">
<a href="/distinctive-collections" aria-labelledby="dc" class="img-loc archives"><span class="sr" id="dc">Distinctive Collections Reading Room</span></a>
<div class="wrap-loc-info">
<h3><a class="name-location" href="/distinctive-collections">Distinctive Collections Reading Room</a></h3><div class="hours"><span data-location-hours="Distinctive Collections"></span> today</div><div class="location-info"><a href="/locations/#!distinctive-collections" class="map-location">14N-118</a><a href="tel:617-253-5690" class="phone"><span class="number">617-253-5690</span></a></div>
</div>
</div>
<?php
// Load location alerts for Distinctive Collections (post 504).
location_alert( 504 );
?>
<div class="location hidden-mobile inactive-mobile">
<a href="/music" aria-labelledby="lewis" class="img-loc lewis"><span class="sr" id="lewis">Lewis Music Library</span></a>
<div class="wrap-loc-info">
<h3><a class="name-location" href="/music">Lewis Music Library</a></h3><div class="hours"><span data-location-hours="Lewis Music Library"></span> today</div><div class="location-info"><a href="/locations/#!lewis-music-library" class="map-location">14E-109</a><a href="tel:617-253-5689" class="phone"><span class="number">617-253-5689</span></a></div>
</div>
</div>
<?php
// Load location alerts for Lewis (post 473).
location_alert( 473 );
?>
<a href="/hours" class="button-primary--green full add-margin link-hours">All hours &amp; locations</a>
2 changes: 1 addition & 1 deletion web/app/themes/mitlib-parent/css/scss/partials/_home.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -199,7 +199,7 @@ body.page-home {
}
}

.location-hayden-reno {
.location-alert {
padding: .5rem 1em;
color: #008700;
margin: 0;
Expand Down

0 comments on commit 080605a

Please sign in to comment.