Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Backport 4.2.x] Restyled default address block #8577

Draft
wants to merge 1 commit into
base: 4.2.x
Choose a base branch
from
Draft

[Backport 4.2.x] Restyled default address block #8577

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
227 changes: 136 additions & 91 deletions web-ui/src/main/resources/catalog/components/search/mdview/partials/contact.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,12 @@
>
<div gn-popover-anchor class="row">
<div
class="col-md-4"
class="col-md-3 gn-nopadding-left"
data-gn-circle-letter-icon="c.organisation"
data-org-key="c.email | getMailDomain"
></div>

<div class="col-md-8">
<div class="col-md-9">
<div class="gn-contact-card-role">{{c.role | translate}}</div>
<div class="gn-contact-card-org">{{c.organisation}}</div>
</div>
Expand All @@ -29,17 +29,19 @@
<div data-gn-metadata-individual="c"></div>

<address data-ng-if="c.address != '' || c.phone != ''">
<label class="visible-print" data-translate="">mdAddress</label>
<div data-ng-if="c.address != ''">
<i class="fa fa-fw fa-map-marker"></i>
{{c.address}}
</div>
<a href="tel:{{c.phone}}" data-ng-if="c.phone != ''">
<span data-translate="">call</span> {{c.phone}}
<i class="fa fa-fw fa-phone"></i>
{{c.phone}}
</a>
</address>

<div
data-gn-search-filter-link="OrgForResource"
data-gn-search-filter-link="OrgForResourceObject.default"
data-filter="c.organisation"
data-label="focusOnFrom"
>
Expand All @@ -56,20 +58,16 @@
gn-popover
gn-popover-dismiss=".content"
>
<div gn-popover-anchor class="row">
<div class="col-md-12">
<div class="gn-contact-card-role">{{cnts[0].role | translate}}</div>
<div class="col-md-12" data-ng-repeat="c in cnts | orderBy:'organisation'">
<div class="row">
<div
class="col-md-4"
data-gn-circle-letter-icon="c.organisation"
data-org-key="c.email | getMailDomain"
></div>
<div class="col-md-8">
<div class="gn-contact-card-org-group">{{c.organisation}}</div>
</div>
</div>
<div gn-popover-anchor>
<div class="row" data-ng-repeat="c in cnts | orderBy:'organisation'">
<div
class="col-md-3 gn-nopadding-left"
data-gn-circle-letter-icon="c.organisation"
data-org-key="c.email | getMailDomain"
></div>
<div class="col-md-9">
<div class="gn-contact-card-role">{{cnts[0].role | translate}}</div>
<div class="gn-contact-card-org-group">{{c.organisation}}</div>
</div>
</div>
</div>
Expand All @@ -78,6 +76,9 @@
<!-- Removing for now, because if you close open popup
the title disappear. <h3 class="popover-title">{{cnts[0].role | translate}}</h3>-->
<div data-ng-repeat="c in cnts | orderBy:'organisation'">
<label class="visible-print" data-ng-if="::c.website" data-translate=""
>mdWebsite</label
>
<a data-ng-href="{{::c.website}}" data-ng-if="::c.website">
<i class="fa fa-fw fa-link"></i>
{{c.organisation}}
Expand All @@ -86,17 +87,19 @@
<div data-gn-metadata-individual="c"></div>

<address data-ng-if="c.address != '' || c.phone != ''">
<label class="visible-print" data-translate="">mdAddress</label>
<div data-ng-if="c.address != ''">
<i class="fa fa-fw fa-map-marker"></i>
{{c.address}}
</div>
<a href="tel:{{c.phone}}" data-ng-if="c.phone != ''">
<span data-translate="">call</span> {{c.phone}}
<i class="fa fa-fw fa-phone"></i>
{{c.phone}}
</a>
</address>

<div
data-gn-search-filter-link="OrgForResource"
data-gn-search-filter-link="OrgForResourceObject.default"
data-filter="c.organisation"
data-label="focusOnFrom"
>
Expand All @@ -118,12 +121,12 @@
>
<div gn-popover-anchor class="row">
<div
class="col-md-4"
class="col-md-3 gn-nopadding-left"
data-gn-circle-letter-icon="org"
data-org-key="contactByOrgRole[0].email | getMailDomain"
></div>

<div class="col-md-8" ng-repeat="c in contactByOrgRole">
<div class="col-md-9" ng-repeat="c in contactByOrgRole">
<div class="gn-contact-card-org-group">{{c.organisation}}</div>

<div class="gn-contact-card-group-role" data-ng-repeat="r in ::c.roles">
Expand All @@ -142,17 +145,19 @@
<div data-gn-metadata-individual="c"></div>

<address data-ng-if="c.address != '' || c.phone != ''">
<label class="visible-print" data-translate="">mdAddress</label>
<div data-ng-if="c.address != ''">
<i class="fa fa-fw fa-map-marker"></i>
{{c.address}}
</div>
<a href="tel:{{c.phone}}" data-ng-if="c.phone != ''">
<span data-translate="">call</span> {{c.phone}}
<i class="fa fa-fw fa-phone"></i>
{{c.phone}}
</a>
</address>

<div
data-gn-search-filter-link="OrgForResource"
data-gn-search-filter-link="OrgForResourceObject.default"
data-filter="c.organisation"
data-label="focusOnFrom"
>
Expand All @@ -171,29 +176,41 @@
data-ng-if="mode == 'default'"
data-ng-repeat="c in mdContacts track by $index"
>
<h3>
<i class="fa fa-envelope"></i>
{{c.role | translate}}
</h3>
<div class="row">
<div class="col-md-8">
<div class="panel panel-address">
<div class="panel-heading">
<h3>
<i class="fa fa-fw fa-address-card-o"></i>
{{c.role | translate}}
</h3>
</div>
<div class="panel-body">
<img data-ng-if="c.logo" class="gn-source-logo" data-ng-src="{{::c.logo}}" />
<address>
<strong data-ng-if="::c.website">
<a data-ng-href="{{::c.website}}">{{c.organisation}}</a><br />
</strong>
<strong data-ng-if="::!c.website"> {{c.organisation}}<br /> </strong>
<div data-ng-if="::c.website">
<label data-translate="">mdWebsite</label>
<a data-ng-href="{{::c.website}}">
<i class="fa fa-fw fa-link"></i>
{{c.organisation}}
</a>
</div>
<div data-ng-if="::!c.website">
<label data-translate="">mdOrganization</label>
{{c.organisation}}
</div>

<div data-gn-metadata-individual="c"></div>

<div data-ng-if="c.address != ''">{{c.address}}</div>
<div data-ng-if="c.address != ''">
<label data-translate="">mdAddress</label>
{{c.address}}
</div>
<a href="tel:{{c.phone}}" data-ng-if="c.phone != ''">
<span data-translate="">call</span> {{c.phone}}
<label data-translate="">mdPhone</label>
<i class="fa fa-fw fa-phone"></i>
{{c.phone}}
</a>
</address>
</div>
<div class="col-md-4">
<img data-ng-if="c.logo" class="gn-source-logo" data-ng-src="{{::c.logo}}" />
</div>
</div>
</div>

Expand All @@ -203,37 +220,55 @@ <h3>
data-ng-if="mode == 'role'"
data-ng-repeat="(roles, contactByRole) in mdContactsByRole"
>
<h3>
<i class="fa fa-envelope"></i>
<span> {{translateRoles(roles)}} </span>
</h3>
<div
class="row"
data-ng-repeat="(organisation, contact) in contactByRole | groupBy:'organisation'"
>
<div class="col-md-8">
<address>
<strong data-ng-if="::c.website">
<a data-ng-href="{{::c.website}}">{{c.organisation}}</a><br />
</strong>
<strong data-ng-if="::!c.website"> {{c.organisation}}<br /> </strong>
<div class="panel panel-address">
<div class="panel-heading">
<h3>
<i class="fa fa-fw fa-address-card-o"></i>
<span> {{translateRoles(roles)}} </span>
</h3>
</div>
<div class="panel-body">
<div
data-ng-repeat="(organisation, contact) in contactByRole | groupBy:'organisation'"
>
<!-- Logo for organisation: display for 1st contact in organisation -->
<div data-ng-repeat="c in contact | limitTo:1">
<img data-ng-if="c.logo" class="gn-source-logo" data-ng-src="{{::c.logo}}" />
</div>
<address>
<div data-ng-if="::c.website">
<label data-translate="">mdWebsite</label>
<a data-ng-href="{{::c.website}}">
<i class="fa fa-fw fa-link"></i>
{{c.organisation}}
</a>
</div>
<div data-ng-if="::!c.website">
<label data-translate="">mdOrganization</label>
{{c.organisation}}
</div>

<span data-ng-repeat="c in contact track by $index">
<div data-gn-metadata-individual="c"></div>
</span>
<div data-ng-repeat="c in contact track by $index">
<div data-gn-metadata-individual="c"></div>
</div>

<!-- Address for organisation: display for 1st contact in organisation -->
<span data-ng-repeat="c in contact | limitTo:1">
<div data-ng-if="c.address != ''">{{c.address}}</div>
<a href="tel:{{c.phone}}" data-ng-if="c.phone != ''">
<span data-translate="">call</span> {{c.phone}}
</a>
</span>
</address>
</div>
<!-- Logo for organisation: display for 1st contact in organisation -->
<div class="col-md-4" data-ng-repeat="c in contact | limitTo:1">
<img data-ng-if="c.logo" class="gn-source-logo" data-ng-src="{{::c.logo}}" />
<!-- Address for organisation: display for 1st contact in organisation -->
<div data-ng-repeat="c in contact | limitTo:1">
<div data-ng-if="c.address != ''">
<label data-translate="">mdAddress</label>
{{c.address}}
</div>

<div data-ng-if="c.phone != ''">
<label data-translate="">mdPhone</label>
<a href="tel:{{c.phone}}">
<i class="fa fa-fw fa-phone"></i>
{{c.phone}}
</a>
</div>
</div>
</address>
</div>
</div>
</div>
</div>
Expand All @@ -244,32 +279,42 @@ <h3>
data-ng-if="mode == 'org-role'"
data-ng-repeat="(org, contactByOrgRole) in mdContactsByOrgRole"
>
<address>
<strong data-ng-if="::orgWebsite[org]">
<i class="fa fa-fw fa-link"></i>
<a data-ng-href="{{::orgWebsite[org]}}">{{org}}</a><br />
</strong>
<strong data-ng-if="::!orgWebsite[org]"> {{org}} </strong>
<div class="panel panel-address">
<div class="panel-body">
<address>
<div data-ng-if="::orgWebsite[org]">
<label data-translate="">mdWebsite</label>
<a data-ng-href="{{::orgWebsite[org]}}">
<i class="fa fa-fw fa-link"></i>
{{org}}
</a>
</div>
<div data-ng-if="::!orgWebsite[org]">
<label data-translate="">mdOrganization</label>
{{org}}
</div>

<div
ng-repeat="(key, contactGroupByAddress) in contactByOrgRole | groupBy:'address'"
>
<span data-ng-if="key != ''">
<i class="fa fa-fw fa-map-marker"></i>
{{key}}<br />
</span>
<ul>
<li
ng-repeat="(roles, contactGroupByRole) in contactGroupByAddress | groupBy:'roles'"
<div
ng-repeat="(key, contactGroupByAddress) in contactByOrgRole | groupBy:'address'"
>
{{translateRoles(roles)}}:<br />
<span data-ng-repeat="c in contactGroupByRole track by $index">
<div data-gn-metadata-individual="c"></div>
<span data-ng-if="!$last"><hr /></span>
<span data-ng-if="key != ''">
<i class="fa fa-fw fa-map-marker"></i>
{{key}}<br />
</span>
</li>
</ul>
<ul>
<li
ng-repeat="(roles, contactGroupByRole) in contactGroupByAddress | groupBy:'roles'"
>
{{translateRoles(roles)}}:<br />
<div data-ng-repeat="c in contactGroupByRole track by $index">
<div data-gn-metadata-individual="c"></div>
<span data-ng-if="!$last"><hr /></span>
</div>
</li>
</ul>
</div>
</address>
</div>
</address>
</div>
</div>
</div>
1 change: 1 addition & 0 deletions web-ui/src/main/resources/catalog/components/search/mdview/partials/individual.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
<div data-ng-if="c.email != ''">
<label data-translate="">mdEmail</label>
<a href="mailto:{{c.email}}">
<i class="fa fa-fw fa-envelope"></i>
<span data-ng-hide="c.individual">{{c.email}}</span>
Expand Down
7 changes: 6 additions & 1 deletion web-ui/src/main/resources/catalog/locales/en-v4.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -409,5 +409,10 @@
"lastCreatedRecords": "Last created records",
"associationType": "Association type",
"initiativeType": "Initiative type",
"associatedTo": "Associated "
"associatedTo": "Associated ",
"mdEmail": "Email",
"mdWebsite": "Website",
"mdOrganization": "Organization",
"mdAddress": "Address",
"mdPhone": "Phone"
}
Loading
Loading