Skip to content

Commit

Permalink
Merge pull request guardian#4252 from guardian/an/include-exclude-met…
Browse files Browse the repository at this point in the history
…adata

[feature] Hold Alt to exclude, Shift to include when clicking search links
  • Loading branch information
paperboyo authored Apr 15, 2024
2 parents b3319ab + 0dd3917 commit 95cdbd9
Show file tree
Hide file tree
Showing 9 changed files with 104 additions and 38 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@
<dd class="image-info__title"
ng-if="!ctrl.hasMultipleValues(ctrl.rawMetadata.title)">
<a ui-sref="search.results({query: (ctrl.metadata.title | queryFilter:'title'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'title', ctrl.metadata.title)"
aria-label="Search images by {{ctrl.metadata.title}} title">{{ctrl.metadata.title}}</a>
</dd>
</div>
Expand All @@ -112,6 +113,7 @@
<dd class="image-info__title"
ng-if="!ctrl.hasMultipleValues(ctrl.rawMetadata.title)">
<a ui-sref="search.results({query: (ctrl.metadata.title | queryFilter:'title'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'title', ctrl.metadata.title)"
aria-label="Search images by {{ctrl.metadata.title}} title">{{ctrl.metadata.title}}</a>
</dd>
</div>
Expand Down Expand Up @@ -322,6 +324,7 @@
<span class="metadata-line__info" ng-if="!ctrl.hasMultipleValues(ctrl.rawMetadata.byline)">
<span ng-if="ctrl.metadata.byline">
<a ui-sref="search.results({query: (ctrl.metadata.byline | queryFilter:'by'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'by', ctrl.metadata.byline)"
aria-label="Search images by {{ctrl.metadata.byline}} byline">{{ctrl.metadata.byline}}</a>
</span>

Expand Down Expand Up @@ -370,6 +373,7 @@
<span class="metadata-line__info" ng-if="!ctrl.hasMultipleValues(ctrl.rawMetadata.credit)">
<span ng-if="ctrl.metadata.credit">
<a ui-sref="search.results({query: (ctrl.metadata.credit | queryFilter:'credit'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'credit', ctrl.metadata.credit)"
aria-label="Search images by {{ctrl.metadata.credit}} credit">{{ctrl.metadata.credit}}</a>
</span>

Expand Down Expand Up @@ -400,6 +404,7 @@
<a
ng-if="!ctrl.hasMultipleValues(ctrl.rawMetadata[prop])"
ui-sref="search.results({query: (ctrl.metadata[prop] | queryFilter:ctrl.locationFieldMap[prop]), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, ctrl.locationFieldMap[prop], ctrl.metadata[prop])"
aria-label="Search images by {{ctrl.metadata[prop]}} {{prop}}"
>{{ctrl.metadata[prop]}}</a><span
ng-if="ctrl.hasMultipleValues(ctrl.rawMetadata[prop])"
Expand Down Expand Up @@ -538,6 +543,7 @@
<span class="metadata-line__info" ng-if="!ctrl.hasMultipleValues(ctrl.rawMetadata.copyright)">
<span ng-if="ctrl.metadata.copyright">
<a ui-sref="search.results({query: (ctrl.metadata.copyright | queryFilter:'copyright'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'copyright', ctrl.metadata.copyright)"
aria-label="Search images by {{ctrl.metadata.copyright}} copyright">{{ctrl.metadata.copyright}}</a>
</span>

Expand All @@ -559,6 +565,7 @@
<dd ng-if="!ctrl.hasMultipleValues(ctrl.extraInfo.uploadedBy)" class="image-info__wrap metadata-line metadata-line__info image-info__group--dl__value--panel">
<span class="metadata-line__info">
<a ui-sref="search.results({query: (ctrl.extraInfo.uploadedBy | queryFilter:'uploader'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'uploader', ctrl.extraInfo.uploadedBy)"
aria-label="Search images uploaded by {{ctrl.extraInfo.uploadedBy}}">{{ctrl.extraInfo.uploadedBy | stripEmailDomain}}</a>
</span>
</dd>
Expand Down Expand Up @@ -639,6 +646,7 @@
<dt class="metadata-line__key image-info__group--dl__key--full-metadata">{{key | spaceWords}}</dt>
<dd class="metadata-line__info image-info__group--dl__value--full-metadata">
<a ui-sref="search.results({query: (value | queryFilter:'{{key}}'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, key, value)"
aria-label="Search images with {{key}} '{{value}}'">{{value}}</a>
</dd>
</dl>
Expand All @@ -647,6 +655,7 @@
<dt class="metadata-line__key image-info__group--dl__key--full-metadata">{{key}}</dt>
<dd class="metadata-line__info image-info__group--dl__value--full-metadata">
<a ui-sref="search.results({query: (metadata.value | queryFilter:'{{metadata.alias}}'), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, metadata.alias, metadata.value)"
aria-label="Search images with {{key}} '{{metadata.value}}'">{{metadata.value}}</a>
</dd>
</dl>
Expand Down Expand Up @@ -832,6 +841,7 @@
ng-repeat="collection in ctrl.singleImage.data.collections"
ng-switch-default>
<a ui-sref="search.results({query: (collection.data.pathId | queryCollectionFilter), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'collection', collection.data.pathId)"
aria-label="Search images by {{collection.data.description}} collection">
{{collection.data.path.join(' ▸ ')}}
</a>
Expand Down
78 changes: 46 additions & 32 deletions kahuna/public/js/components/gr-image-metadata/gr-image-metadata.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ import { editOptions, overwrite } from '../../util/constants/editOptions';
import '../../services/image-accessor';
import '../../services/image-list';
import '../../services/label';
import '../../search/query-filter';

import { List } from 'immutable';

export const module = angular.module('gr.imageMetadata', [
Expand All @@ -34,8 +36,7 @@ module.controller('grImageMetadataCtrl', [
'inject$',
'labelService',
'storage',


'searchWithModifiers',
function ($rootScope,
$scope,
$window,
Expand All @@ -47,7 +48,8 @@ module.controller('grImageMetadataCtrl', [
imageAccessor,
inject$,
labelService,
storage) {
storage,
searchWithModifiers) {

let ctrl = this;

Expand All @@ -58,14 +60,14 @@ module.controller('grImageMetadataCtrl', [
ctrl.metadataUpdatedByTemplate = [];

ctrl.$onInit = () => {
$scope.$watchCollection('ctrl.selectedImages', function() {
$scope.$watchCollection('ctrl.selectedImages', function () {
ctrl.singleImage = singleImage();
ctrl.selectedLabels = selectedLabels();
ctrl.usageRights = selectedUsageRights();
inject$($scope, Rx.Observable.fromPromise(selectedUsageCategory(ctrl.usageRights)), ctrl, 'usageCategory');
ctrl.rawMetadata = rawMetadata();
ctrl.metadata = displayMetadata();
ctrl.metadata.dateTaken = ctrl.displayDateTakenMetadata();
ctrl.metadata.dateTaken = ctrl.displayDateTakenMetadata();
ctrl.newPeopleInImage = "";
ctrl.newKeywords = "";
ctrl.extraInfo = extraInfo();
Expand All @@ -76,26 +78,28 @@ module.controller('grImageMetadataCtrl', [
});

const freeUpdateListener = $rootScope.$on('images-updated',
(e, updatedImages) => updateHandler(updatedImages));
(e, updatedImages) => updateHandler(updatedImages));

const updateHandler = (updatedImages) => {
ctrl.selectedImages = new List(updatedImages);
};

ctrl.hasMultipleValues = (val) => Array.isArray(val) && val.length > 1;

ctrl.displayDateTakenMetadata = function() {
ctrl.displayDateTakenMetadata = function () {
let dateTaken = ctrl.metadata.dateTaken ? new Date(ctrl.metadata.dateTaken) : undefined;
if (dateTaken) { dateTaken.setSeconds(0, 0); }
if (dateTaken) {
dateTaken.setSeconds(0, 0);
}
return dateTaken;
};

ctrl.credits = function(searchText) {
ctrl.credits = function (searchText) {
return ctrl.metadataSearch('credit', searchText);
};

ctrl.metadataSearch = (field, q) => {
return mediaApi.metadataSearch(field, { q }).then(resource => {
return mediaApi.metadataSearch(field, {q}).then(resource => {
return resource.data.map(d => d.key);
});
};
Expand All @@ -104,11 +108,11 @@ module.controller('grImageMetadataCtrl', [

ctrl.descriptionOptions = editOptions;

ctrl.updateDescriptionField = function() {
ctrl.updateDescriptionField = function () {
ctrl.updateMetadataField('description', ctrl.metadata.description);
};

ctrl.updateLocationField = function(data, value) {
ctrl.updateLocationField = function (data, value) {
Object.keys(value).forEach(key => {
if (value[key] === undefined) {
delete value[key];
Expand All @@ -120,7 +124,7 @@ module.controller('grImageMetadataCtrl', [
ctrl.updateMetadataField = function (field, value) {
var imageArray = Array.from(ctrl.selectedImages);
if (field === 'dateTaken') {
value = value.toISOString();
value = value.toISOString();
}
if (field === 'peopleInImage') {
ctrl.addPersonToImages(imageArray, value);
Expand All @@ -138,7 +142,7 @@ module.controller('grImageMetadataCtrl', [
);
};

ctrl.updateDomainMetadataField = function(name, field, value) {
ctrl.updateDomainMetadataField = function (name, field, value) {
return editsService.updateDomainMetadataField(ctrl.singleImage, name, field, value)
.then((updatedImage) => {
if (updatedImage) {
Expand Down Expand Up @@ -240,7 +244,7 @@ module.controller('grImageMetadataCtrl', [
.map(([key, value]) => {
let fieldAlias = ctrl.fieldAliases.find(_ => _.alias === key);
if (fieldAlias && fieldAlias.displayInAdditionalMetadata === true) {
return [fieldAlias.label, { value, alias: fieldAlias.alias}];
return [fieldAlias.label, {value, alias: fieldAlias.alias}];
}
})
.filter(_ => _ !== undefined));
Expand All @@ -250,7 +254,7 @@ module.controller('grImageMetadataCtrl', [
ctrl.domainMetadata = ctrl.domainMetadataSpecs
.filter(domainMetadataSpec => domainMetadataSpec.fields.length > 0)
.reduce((acc, domainMetadataSpec) => {
let domainMetadata = { ...domainMetadataSpec };
let domainMetadata = {...domainMetadataSpec};

if (ctrl.singleImage.data.metadata) {
const imageDomainMetadata = ctrl.singleImage.data.metadata.domainMetadata ? ctrl.singleImage.data.metadata.domainMetadata : {};
Expand Down Expand Up @@ -284,7 +288,7 @@ module.controller('grImageMetadataCtrl', [
field.selectOptions = field.options
.filter(option => option)
.map(option => {
return { value: option, text: option };
return {value: option, text: option};
});
}

Expand Down Expand Up @@ -332,7 +336,7 @@ module.controller('grImageMetadataCtrl', [
ctrl.hasLocationInformation = hasLocationInformation;

function singleImage() {
if (ctrl.selectedImages.size === 1){
if (ctrl.selectedImages.size === 1) {
return ctrl.selectedImages.first();
}
}
Expand Down Expand Up @@ -371,18 +375,23 @@ module.controller('grImageMetadataCtrl', [
function rawMetadata() {
return selectedMetadata().map((values) => {
switch (values.size) {
case 0: return undefined;
case 1: return values.first();
default: return Array.from(values);
case 0:
return undefined;
case 1:
return values.first();
default:
return Array.from(values);
}
}).toObject();
}

function displayMetadata() {
return selectedMetadata().map((values) => {
switch (values.size) {
case 1: return values.first();
default: return undefined;
case 1:
return values.first();
default:
return undefined;
}
}).toObject();
}
Expand All @@ -392,9 +401,12 @@ module.controller('grImageMetadataCtrl', [
const properties = imageList.getSetOfProperties(info);
return properties.map((values) => {
switch (values.size) {
case 0: return undefined;
case 1: return values.first();
default: return Array.from(values);
case 0:
return undefined;
case 1:
return values.first();
default:
return Array.from(values);
}
}).toObject();
}
Expand All @@ -421,11 +433,11 @@ module.controller('grImageMetadataCtrl', [
ctrl.removeImageFromCollection = (collection) => {
ctrl.removingCollection = collection;
collections.removeImageFromCollection(collection, ctrl.singleImage)
.then(() => ctrl.removingCollection = false);
.then(() => ctrl.removingCollection = false);
};

$scope.$on('$destroy', function() {
freeUpdateListener();
$scope.$on('$destroy', function () {
freeUpdateListener();
});

ctrl.onMetadataTemplateSelected = (metadata, usageRights, collection, leasesWithConfig) => {
Expand Down Expand Up @@ -498,16 +510,18 @@ module.controller('grImageMetadataCtrl', [
};

ctrl.isDomainMetadataEmpty = (key) => {
return ctrl.domainMetadata.find(obj => obj.name === key ).fields.every(field => field.value === undefined );
return ctrl.domainMetadata.find(obj => obj.name === key).fields.every(field => field.value === undefined);
};

ctrl.isAdditionalMetadataEmpty = () => {
const totalAdditionalMetadataCount = Object.keys(ctrl.metadata).filter(key => ctrl.isUsefulMetadata(key)).length +
Object.keys(ctrl.additionalMetadata).length +
Object.keys(ctrl.identifiers).length;
Object.keys(ctrl.additionalMetadata).length +
Object.keys(ctrl.identifiers).length;

return totalAdditionalMetadataCount == 0;
};

ctrl.searchWithModifiers = searchWithModifiers;
};
}
]);
Expand Down
1 change: 1 addition & 0 deletions kahuna/public/js/edits/list-editor-compact.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
<a class="element__value element__value--compact element__link"
ng-if="!ctrl.disabled"
ui-sref="search.results({query: (element | {{ctrl.queryFilter}}), nonFree: ctrl.srefNonfree()})"
ng-click="ctrl.searchWithModifiers($event, 'label', element)"
aria-label="Search images by {{element}} {{ctrl.elementName}}">
{{element}}
</a>
Expand Down
1 change: 1 addition & 0 deletions kahuna/public/js/edits/list-editor-info-panel.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
<gr-icon>library_add</gr-icon>
</button>
<a ui-sref="search.results({query: (element.data | {{ctrl.queryFilter}}), nonFree: ctrl.srefNonfree()})" class="element__value"
ng-click="ctrl.searchWithModifiers($event, ctrl.elementName, element.data)"
aria-label="Search images by {{element.data}} {{ctrl.elementName}}"
ng-class="{'element__right-bit': !ctrl.isEditable}"
>
Expand Down
6 changes: 5 additions & 1 deletion kahuna/public/js/edits/list-editor.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,13 +22,15 @@ listEditor.controller('ListEditorCtrl', [
'imageLogic',
'imageList',
'storage',
'searchWithModifiers',
function($rootScope,
$scope,
$window,
$timeout,
imageLogic,
imageList,
storage) {
storage,
searchWithModifiers) {
var ctrl = this;

ctrl.$onInit = () => {
Expand Down Expand Up @@ -147,6 +149,8 @@ listEditor.controller('ListEditorCtrl', [
$scope.$on('$destroy', function() {
updateListener();
});

ctrl.searchWithModifiers = searchWithModifiers;
};
}]);

Expand Down
1 change: 1 addition & 0 deletions kahuna/public/js/preview/image.html
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@
gr-tooltip-position="top">
<a ui-sref="search.results({query: (collection.data.pathId | queryCollectionFilter), nonFree: ctrl.srefNonfree()})"
ng-attr-style="{{::ctrl.getCollectionStyle(collection)}}"
ng-click="ctrl.searchWithModifiers($event, 'collection', collection.data.pathId)"
class="preview__collections__collection__value">
{{::collection.data.description}}
</a>
Expand Down
7 changes: 6 additions & 1 deletion kahuna/public/js/preview/image.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import '../components/gr-add-label/gr-add-label';
import '../components/gr-archiver-status/gr-archiver-status';
import '../components/gr-syndication-icon/gr-syndication-icon';
import {graphicImageBlurService} from "../services/graphic-image-blur";
import '../search/query-filter';

export var image = angular.module('kahuna.preview.image', [
'gr.image.service',
Expand All @@ -43,6 +44,7 @@ image.controller('uiPreviewImageCtrl', [
'imageAccessor',
'storage',
'graphicImageBlurService',
'searchWithModifiers',
function (
$scope,
inject$,
Expand All @@ -53,7 +55,8 @@ image.controller('uiPreviewImageCtrl', [
labelService,
imageAccessor,
storage,
graphicImageBlurService) {
graphicImageBlurService,
searchWithModifiers) {
var ctrl = this;

ctrl.$onInit = () => {
Expand Down Expand Up @@ -131,6 +134,8 @@ image.controller('uiPreviewImageCtrl', [
return $window._clientConfig.imagePreviewFlagAlertCopy;
}
};

ctrl.searchWithModifiers = searchWithModifiers;
};
}]);

Expand Down
Loading

0 comments on commit 95cdbd9

Please sign in to comment.