Skip to content

Commit

Permalink
Merge pull request #270 from AtlasOfLivingAustralia/feature/issue269
Browse files Browse the repository at this point in the history 
stops sending request for image of species by default
  • Loading branch information
@chrisala
chrisala authored Jan 21, 2025
2 parents 13b7792 + 21e52d4 commit 7e1f63c
Show file tree
Hide file tree
Showing 8 changed files with 98 additions and 56 deletions.
1 change: 0 additions & 1 deletion build.gradle
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ plugins {
id 'jacoco'
}


version "7.2-SNAPSHOT"
group "org.grails.plugins"

Expand Down
79 changes: 58 additions & 21 deletions grails-app/assets/javascripts/knockout-utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,53 +13,90 @@
*/
ko.bindingHandlers.popover = {

init: function (element, valueAccessor) {
init: function(element, valueAccessor) {
ko.bindingHandlers.popover.initPopover(element, valueAccessor);
},
update: function (element, valueAccessor) {
update: function(element, valueAccessor) {
var $element = $(element),
instance = $element.data('bs.popover'),
popOptions = ko.bindingHandlers.popover.getOptions(valueAccessor),
combinedOptions = popOptions.combinedOptions,
options = popOptions.options;

if (!instance) {
ko.bindingHandlers.popover.initPopover(element, valueAccessor);
instance = $element.data('bs.popover');
}

if (!instance)
return;

// if view model has changed, update the popover
instance.config.title = combinedOptions.title || "";
instance.config.content = combinedOptions.content || "";

var $element = $(element);
$element.popover('dispose');
var options = ko.bindingHandlers.popover.initPopover(element, valueAccessor);
if (options.autoShow) {
if ($element.data('firstPopover') === false) {
$element.popover('show');
$('body').on('click', function (e) {

instance.show();
$('body').on('click', function(e) {
if (e.target != element && $element.find(e.target).length == 0) {
$element.popover('dispose');
instance.hide();
}
});
}

$element.data('firstPopover', false);
}

// refresh popover content
if(ko.bindingHandlers.popover.isPopoverShown(element)) {
instance.show();
}
},

defaultOptions: {
placement: "right",
animation: true,
html: true,
trigger: "hover",
delay: {
show: 250
}
trigger: "hover"
},

initPopover: function (element, valueAccessor) {
initPopover: function(element, valueAccessor) {
var popOptions = ko.bindingHandlers.popover.getOptions(valueAccessor),
options = popOptions.options,
combinedOptions = popOptions.combinedOptions;
$(element).popover(combinedOptions);
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
$(element).popover("dispose");
});

return options;
},
/**
* constructs the options object from valueAccessor
* @param valueAccessor
* @returns {{combinedOptions: any, options: any}}
*/
getOptions: function(valueAccessor) {
var options = ko.utils.unwrapObservable(valueAccessor());
if (typeof(options.content) === "undefined") {
options.content = ""
}

var combinedOptions = ko.utils.extend({}, ko.bindingHandlers.popover.defaultOptions);
var content = ko.utils.unwrapObservable(options.content);
ko.utils.extend(combinedOptions, options);
combinedOptions.description = content;

$(element).popover(combinedOptions);

ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
$(element).popover("dispose");
});
return options;
return {combinedOptions: combinedOptions, options: options};
},
/**
* id of the popover is stored in the element's aria-describedby attribute
* @param element
* @returns {boolean}
*/
isPopoverShown: function isPopoverShown(element) {
const popoverId = $(element).attr("aria-describedby");
return $("#" + popoverId).length > 0;
}
};

Expand Down
60 changes: 33 additions & 27 deletions grails-app/assets/javascripts/speciesModel.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -222,7 +222,7 @@ var speciesSearchEngines = function() {
* Allows species information to be searched for and displayed.
*/
var SpeciesViewModel = function(data, options, context) {

var SPECIAL_GUIDS = ['A_GUID'];
var self = this;
ecodata.forms.DataModelItem.apply(self, [options.metadata || {}, context, options]);

Expand All @@ -232,6 +232,7 @@ var SpeciesViewModel = function(data, options, context) {
var output = options.output || "";
var dataFieldName = options.dataFieldName || "";
var surveyName = options.surveyName || "";
var kvpInfo = "";

self.guid = ko.observable();
self.name = ko.observable();
Expand All @@ -252,7 +253,7 @@ var SpeciesViewModel = function(data, options, context) {
self.transients.source = ko.observable(options.speciesSearchUrl +
'&output=' + output+ '&dataFieldName=' + dataFieldName + '&surveyName=' + surveyName);
self.transients.bieUrl = ko.observable();
self.transients.speciesInformation = ko.observable();
self.transients.speciesInformation = ko.observable('<i class="fa fa-spin fa-spinner"></i>');
self.transients.speciesTitle = ko.observable();
self.transients.matched = ko.computed(function() {
return self.guid() && self.guid() != "A_GUID" && self.listId != "unmatched";
Expand Down Expand Up @@ -328,7 +329,6 @@ var SpeciesViewModel = function(data, options, context) {
self.transients.textFieldValue(self.name());

// Species Translation
var kvpInfo = "";
var languages = ["Waramungu", "Warlpiri name"];
var listsId = 'dr8016';
if(self.listId() == listsId || output == 'CLC 2Ha Track Plot') {
Expand All @@ -350,38 +350,44 @@ var SpeciesViewModel = function(data, options, context) {
}
});
}
};

self.fetchSpeciesImage = function() {
if (self.guid() && !options.printable) {
if (SPECIAL_GUIDS.indexOf(self.guid()) >= 0) {
var profileInfo = "No profile available";
self.transients.speciesInformation(profileInfo);
}
else {
var profileUrl = options.bieUrl + '/species/' + encodeURIComponent(self.guid());
$.ajax({
url: options.speciesProfileUrl + '?id=' + encodeURIComponent(self.guid()),
cache: true,
dataType: 'json',
success: function (data) {
var profileInfo = '<a href="' + profileUrl + '" target="_blank">';
var imageUrl = data.thumbnail || (data.taxonConcept && data.taxonConcept.smallImageUrl);

var profileUrl = options.bieUrl + '/species/' + encodeURIComponent(self.guid());
$.ajax({
url: options.speciesProfileUrl+'?id=' + encodeURIComponent(self.guid()),
dataType: 'json',
success: function (data) {
var profileInfo = '<a href="'+profileUrl+'" target="_blank">';
var imageUrl = data.thumbnail || (data.taxonConcept && data.taxonConcept.smallImageUrl);

if (imageUrl) {
profileInfo += "<img title='Click to show profile' class='taxon-image ui-corner-all' src='"+imageUrl+"'>";
}
else {
profileInfo += "No profile image available";
if (imageUrl) {
profileInfo += "<img title='Click to show profile' class='taxon-image ui-corner-all' src='" + imageUrl + "'>";
} else {
profileInfo += "No profile image available";
}
profileInfo += "</a>";
profileInfo += kvpInfo;
self.transients.speciesInformation(profileInfo);
},
error: function (request, status, error) {
self.transients.speciesInformation("");
console.log(error);
}
profileInfo += "</a>";
profileInfo += kvpInfo;
self.transients.speciesInformation(profileInfo);
},
error: function(request, status, error) {
console.log(error);
}
});

});
}
}
else {
self.transients.speciesInformation("No profile information is available.");
}

};
}

self.focusLost = function(event) {
self.transients.editing(false);
Expand Down
2 changes: 1 addition & 1 deletion grails-app/views/output/_imageDataTypeViewModelWithMetadataTemplate.gsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<li>
<div class="row">
<div class="col-sm-4">
<div class="projectLogo" data-toggle="popover" data-trigger="hover" data-title="Photo metadata" data-bind="popover: {placement:'top', content: function(){ return $(this).find('.metadata').html()} }">
<div class="projectLogo" data-toggle="popover" data-trigger="hover" data-title="Photo metadata" data-bind="popover: {placement:'top', content: function(){ return $(this).parent().parent().find('.metadata').html()} }">
<a href=""
data-bind="attr:{href:getImageViewerUrl()}, fancybox: {nextEffect:'fade', preload:0, 'prevEffect':'fade', type: 'iframe', width: '80%', title: function(){ return $(this).next().find('.metadata').html()}}"
target="fancybox">
Expand Down
2 changes: 1 addition & 1 deletion grails-app/views/output/_speciesTemplate.gsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<input type="text" class="form-control form-control-sm speciesInputTemplates" data-bind="${databindAttrs}" ${validationAttrs}/>
<div class="input-group-append">
<span class="input-group-text" data-bind="visible: !transients.editing() && name()">
<a data-bind="popover: {title: name, content: transients.speciesInformation}"><i class="fa fa-info-circle"></i></a>
<a data-bind="popover: {title: name, content: transients.speciesInformation}, event: { 'shown.bs.popover': fetchSpeciesImage}"><i class="fa fa-info-circle"></i></a>
</span>
</div>

Expand Down
4 changes: 2 additions & 2 deletions src/integration-test/groovy/au/org/ala/ecodata/forms/ImageTypeSpec.groovy
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ class ImageTypeSpec extends GebReportingSpec {

then: "A popover is displayed containing the photo metadata"
waitFor 10, {
(!$('.popover').displayed)
$('.popover').displayed
}
and: "the photo metadata is displayed correctly"
$(".popover span[data-bind*=name]").text() == null
Expand All @@ -31,7 +31,7 @@ class ImageTypeSpec extends GebReportingSpec {

}

def "If the metadataAlwaysDisplayed displayOption is set, the metadata will be displayed next to the image in view mode"() {
def "If the metadataAlwaysVisible displayOption is set, the metadata will be displayed next to the image in view mode"() {
when:
to ([name:'images', mode:'view'], PreviewPage)

Expand Down
2 changes: 1 addition & 1 deletion src/main/groovy/au/org/ala/ecodata/forms/EditModelWidgetRenderer.groovy
View file
Original file line number Diff line number Diff line change
Expand Up @@ -372,7 +372,7 @@ public class EditModelWidgetRenderer implements ModelWidgetRenderer {
<div data-bind="with:${context.source}" class="input-group"">
<select class="form-control form-control-sm" data-bind="speciesSelect2:\$data" ${context.validationAttr}></select>
<div class="input-group-append"">
<span class="input-group-text" data-bind="visible:name(), popover: {title: transients.speciesTitle, content: transients.speciesInformation}, css:{'bg-warning':!transients.matched()}"><i class="fa" data-bind="css:{'fa-info-circle':transients.matched(), 'fa-question-circle':!transients.matched()}"></i></span>
<span class="input-group-text" data-bind="visible:name(), popover: {title: transients.speciesTitle, content: transients.speciesInformation}, event: { 'shown.bs.popover': fetchSpeciesImage}, css:{'bg-warning':!transients.matched()}"><i class="fa" data-bind="css:{'fa-info-circle':transients.matched(), 'fa-question-circle':!transients.matched()}"></i></span>
</div>
</div></div>"""
}
Expand Down
4 changes: 2 additions & 2 deletions src/main/groovy/au/org/ala/ecodata/forms/ViewModelWidgetRenderer.groovy
View file
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,7 @@ class ViewModelWidgetRenderer implements ModelWidgetRenderer {
void renderFusedAutocomplete(WidgetRenderContext context) {
context.databindAttrs.add 'text', 'name'
context.writer << """<span data-bind="with: ${context.source}"><span${context.attributes.toString()} data-bind='${context.databindAttrs.toString()}'></span>
<a target="_blank" data-bind="visible: guid, attr: {href: transients.bioProfileUrl}"><i class="icon-info-sign"></i></a>
<a target="_blank" data-bind="visible: guid, attr: {href: transients.bioProfileUrl}"><i class="fas fa-info-circle"></i></i></a>
</span>"""
}

Expand Down Expand Up @@ -199,7 +199,7 @@ class ViewModelWidgetRenderer implements ModelWidgetRenderer {
private void renderReadOnlySpecies(WidgetRenderContext context) {
context.databindAttrs.add 'with', context.source
context.writer << """<span data-bind='${context.databindAttrs.toString()}'><span${context.attributes.toString()} data-bind='text:name'></span>
<a href="#" data-bind="popover: {title: name, content: transients.speciesInformation}"><i class="icon-info-sign"></i></a>
<a href="#" data-bind="popover: {title: name, content: transients.speciesInformation}, event: { 'shown.bs.popover': fetchSpeciesImage}"><i class="fas fa-info-circle"></i></i></a>
</span>"""
}

Expand Down

0 comments on commit 7e1f63c

Please sign in to comment.