From fd3b17b0cba628e4daab4cbfa2100a361f5c7995 Mon Sep 17 00:00:00 2001
From: Robert Lange <robert.lange@uni-leipzig.de>
Date: Tue, 12 Jul 2022 13:59:23 +0200
Subject: [PATCH] refs #21993 [finc] staff view: load content in modal instead
of tab via button in toolbar
* add script for ajax post
* showStaffViewInLightbox can be activated in config.ini, Site-section
* button appears in toolbar, no record tab is rendered
* fit responsive table within modal
* use word break for long open url too in resp-table styles
---
local/config/vufind/config.ini | 2 ++
themes/finc/js/staff_view_button.js | 34 +++++++++++++++++++
themes/finc/scss/compiled.scss | 5 +++
.../RecordDriver/DefaultRecord/toolbar.phtml | 12 +++++++
themes/finc/templates/collection/view.phtml | 14 ++++++--
themes/finc/templates/record/view.phtml | 11 ++++--
6 files changed, 73 insertions(+), 5 deletions(-)
create mode 100644 themes/finc/js/staff_view_button.js
diff --git a/local/config/vufind/config.ini b/local/config/vufind/config.ini
index 882f6a16dbb..693da8d8ea2 100644
--- a/local/config/vufind/config.ini
+++ b/local/config/vufind/config.ini
@@ -92,6 +92,8 @@ defaultAccountPage = Profile
admin_enabled = false
; Show sidebar on the left side instead of right
sidebarOnLeft = false
+; Show Details / Staff View in lightbox after click on button in toolbar
+showStaffViewInLightbox = true
; Invert the sidebarOnLeft setting for right-to-left languages?
mirrorSidebarInRTL = true
; Handle menu as an offcanvas slider at mobile sizes (in bootstrap3-based themes)
diff --git a/themes/finc/js/staff_view_button.js b/themes/finc/js/staff_view_button.js
new file mode 100644
index 00000000000..744e2a8fc19
--- /dev/null
+++ b/themes/finc/js/staff_view_button.js
@@ -0,0 +1,34 @@
+/*global VuFind */
+$(document).ready(function() {
+ $('.staff-view-btn').on('click', function(event){
+ event.preventDefault();
+
+ let link = $(this);
+ if (link.data('status') !== 'loading') {
+ link.data('status', 'loading');
+ link.append('<span id="staffview_spinner"><i class="fa fa-spinner fa-spin" aria-hidden="true"></i><span>');
+ $.ajax({
+ url: VuFind.path + '/Record/'+link.data('id')+'/AjaxTab',
+ dataType:'html',
+ method: "POST",
+ data: {tab: "details"},
+ success: function(data, textStatus, jqXHR) {
+ if (data && data.length > 0) {
+ VuFind.lightbox.render(
+ '<h2>' + link.text() + '</h2>' + data
+ );
+ } else {
+ VuFind.lightbox.alert(VuFind.translate('error_occurred'), 'danger');
+ }
+ link.data('status', '');
+ $('#staffview_spinner').remove();
+ },
+ error: function(XMLHttpRequest, textStatus, errorThrown) {
+ VuFind.lightbox.alert("Status: " + textStatus + "<br >Error: " + errorThrown, 'danger');
+ link.data('status', '');
+ $('#staffview_spinner').remove();
+ }
+ });
+ }
+ });
+});
diff --git a/themes/finc/scss/compiled.scss b/themes/finc/scss/compiled.scss
index 62190274ddd..45d397b30f4 100644
--- a/themes/finc/scss/compiled.scss
+++ b/themes/finc/scss/compiled.scss
@@ -3068,6 +3068,11 @@ footer ul {
float: none !important;
}
+.modal td[data-title="openURL:"],
+.modal .table-resp-data td {
+ word-break: break-word;
+}
+
//// Set modal width to make better use of the screen
@media (max-width: $screen-xs-max) {
.modal-dialog {
diff --git a/themes/finc/templates/RecordDriver/DefaultRecord/toolbar.phtml b/themes/finc/templates/RecordDriver/DefaultRecord/toolbar.phtml
index 4241584c793..4c5e138851d 100644
--- a/themes/finc/templates/RecordDriver/DefaultRecord/toolbar.phtml
+++ b/themes/finc/templates/RecordDriver/DefaultRecord/toolbar.phtml
@@ -23,6 +23,18 @@
<a class="cite-record" data-lightbox href="<?= $this->recordLink()->getActionUrl($this->driver, 'Cite') ?>" rel="nofollow"><i class="fa fa-asterisk" aria-hidden="true"></i> <?= $this->transEsc('Cite this') ?></a>
</li>
<?php endif; ?>
+ <?php if ($this->tabs['Details']
+ && $this->config()->get('config')->Site->showStaffViewInLightbox ?? false): ?>
+ <li>
+ <a href="<?=$this->recordLink()->getTabUrl($this->driver, 'Details')?>"
+ data-title="<?=$this->translate('Staff View')?>"
+ data-id="<?=$this->escapeHtmlAttr($this->driver->getUniqueId())?>"
+ class="staff-view-btn">
+ <i class="fa fa-info-circle" aria-hidden="true"></i> <?=$this->translate('Staff View')?>
+ </a>
+ <?=$this->inlineScript(\Zend\View\Helper\HeadScript::FILE, 'staff_view_button.js', 'SET');?>
+ </li>
+ <?php endif; ?>
<?php /* finc: we don't use sms, CK */
/*
<?php if ($this->accountCapabilities()->getSmsSetting() !== 'disabled'): ?>
diff --git a/themes/finc/templates/collection/view.phtml b/themes/finc/templates/collection/view.phtml
index 057474afed6..2179d5cb00c 100644
--- a/themes/finc/templates/collection/view.phtml
+++ b/themes/finc/templates/collection/view.phtml
@@ -7,15 +7,15 @@
if ($this->syndeticsPlus()->isActive()) {
$this->headScript()->appendFile($this->syndeticsPlus()->getScript());
}
-
+
// Add RDF header link if applicable:
if ($this->export()->recordSupportsFormat($this->driver, 'RDF')) {
$this->headLink()->appendAlternate($this->recordLink()->getActionUrl($this->driver, 'RDF'), 'application/rdf+xml', 'RDF Representation');
}
-
+
// Set flag for special cases relating to full-width hierarchy tree tab:
$tree = (strtolower($this->activeTab) == 'hierarchytree');
-
+
// Set up breadcrumbs:
$lastSearch = $this->searchMemory()->getLastSearchLink($this->transEsc('Search'));
if (!empty($lastSearch)) {
@@ -44,6 +44,14 @@
<ul class="nav nav-tabs">
<?php foreach ($this->tabs as $tab => $obj): ?>
<?php // add current tab to breadcrumbs if applicable:
+
+ if (strtolower($tab) === 'details'
+ && $this->config()->get('config')->Site->showStaffViewInLightbox
+ && strtolower($this->activeTab) !== 'details' /* load in new browser tab after right click */) {
+ // #21993 show button for staff view in toolbar instead
+ continue;
+ }
+
$desc = $obj->getDescription();
$tab_classes = [];
if (0 === strcasecmp($this->activeTab, $tab)) {
diff --git a/themes/finc/templates/record/view.phtml b/themes/finc/templates/record/view.phtml
index 076ef6fb512..eb4c40ee8c3 100644
--- a/themes/finc/templates/record/view.phtml
+++ b/themes/finc/templates/record/view.phtml
@@ -7,12 +7,12 @@
if ($this->syndeticsPlus()->isActive()) {
$this->headScript()->appendFile($this->syndeticsPlus()->getScript());
}
-
+
// Add RDF header link if applicable:
if ($this->export()->recordSupportsFormat($this->driver, 'RDF')) {
$this->headLink()->appendAlternate($this->recordLink()->getActionUrl($this->driver, 'RDF'), 'application/rdf+xml', 'RDF Representation');
}
-
+
// Set up breadcrumbs:
$this->layout()->breadcrumbs = '<li>' . $this->searchMemory()->getLastSearchLink($this->transEsc('Search'), '', '</li> ') .
'<li class="active" aria-current="page">' . $this->recordLink()->getBreadcrumb($this->driver) . '</li> ';
@@ -47,6 +47,13 @@
<ul class="nav nav-tabs">
<?php foreach ($this->tabs as $tab => $obj): ?>
<?php // add current tab to breadcrumbs if applicable:
+
+ if (strtolower($tab) === 'details'
+ && $this->config()->get('config')->Site->showStaffViewInLightbox
+ && strtolower($this->activeTab) !== 'details' /* load in new browser tab after right click */) {
+ // #21993 show button for staff view in toolbar instead
+ continue;
+ }
$desc = $obj->getDescription();
$tabName = preg_replace("/\W/", "-", strtolower($tab));
$tabClasses = ['record-tab', $tabName];
--
GitLab