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 method to the widget class (which is provided by the
  hours plugin) to check for content in this new field. If content is
  found, it is included in the widget output 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:

* 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).

* While the use of a class method and not a function in a tempalte is
  good, we are still mixing content and code because we have hard-
  coded location names, phone numbers, etc - as well as the post IDs
  for our actual locations. I'm choosing not to continue pulling on
  this thread, however.
  • Loading branch information
@matt-bernhardt
matt-bernhardt committed May 14, 2024
1 parent 79a4a15 commit 275de48
Show file tree
Hide file tree
Showing 4 changed files with 82 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
}
37 changes: 37 additions & 0 deletions web/app/plugins/mitlib-pull-hours/src/class-display-widget-frontpage.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,43 @@ public static function init() {
register_widget( 'Mitlib\PullHours\Display_Widget_Frontpage' );
}

/**
* 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
*/
public 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>';
}
}
}

/**
* Sanitize widget form values as they are saved.
*
Expand Down
24 changes: 24 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 @@ -14,18 +14,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).
$this->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).
$this->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).
$this->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 +47,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).
$this->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).
$this->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).
$this->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 275de48

Please sign in to comment.