Skip to content

Commit fbbe9cd

Browse files
yarlyarl
authored
Merge pull request #1 from yarl/dev
version 0.1
2 parents 1080586 + 8d52de1 commit fbbe9cd

7 files changed

Lines changed: 214 additions & 33 deletions

File tree

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "monumental",
3-
"version": "0.0.0",
3+
"version": "0.1.0",
44
"private": true,
55
"description": "Monumental app",
66
"main": "src/index.js",

‎src/components/main/monument/monument.html‎

Lines changed: 46 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,49 @@
1-
<md-content layout="column" layout-align="start stretch" flex>
2-
<h2 class="monument__title md-display-2">{{$ctrl.monument.labels.pl || 'brak polskiej nazwy'}}</h2>
3-
<h4 class="monument__subtitle md-headline muted">{{$ctrl.monument.labels.en || 'brak angielskiej nazwy'}}</h4>
4-
<div>
5-
<div ng-repeat="claim in $ctrl.monument.claims">
6-
<span>{{claim.property.pl}}:</span>
7-
<span ng-repeat="value in claim.values">
8-
<span ng-if="value.value_type === 'wikibase-item'">{{value.value.pl || value.value.en}}</span>
9-
<span ng-if="value.value_type === 'string'">{{value.value}}</span>
10-
<span ng-if="value.value_type === 'commonsMedia'">{{value.value}}</span>
11-
<span ng-if="value.value_type === 'external-id'">{{value.value}}</span>
12-
<span ng-if="value.value_type === 'globe-coordinate'">{{value.value.latitude}} / {{value.value.longitude}}</span>
13-
</span>
1+
<md-content layout="column" layout-align="start center" flex>
2+
<div class="monument"
3+
layout="row" layout-align="space-between stretch">
4+
<div class="monument__left">
5+
<h2 class="monument__title md-display-1">{{$ctrl.monument.labels[$ctrl.lang] || 'no name'}}</h2>
6+
<h4 class="monument__subtitle md-headline muted">{{$ctrl.monument.labels.en || 'no english name'}}</h4>
7+
<ul>
8+
<li ng-repeat="claim in $ctrl.monument.claims">
9+
<span>{{claim.property[$ctrl.lang]}}:</span>
10+
<span ng-repeat="value in claim.values">
11+
<span ng-if="value.value_type === 'wikibase-item'">{{value.value[$ctrl.lang] || value.value.en}}</span>
12+
<span ng-if="value.value_type === 'string'">{{value.value}}</span>
13+
<span ng-if="value.value_type === 'commonsMedia'">{{value.value}}</span>
14+
<span ng-if="value.value_type === 'external-id'">{{value.value}}</span>
15+
<span ng-if="value.value_type === 'globe-coordinate'">{{value.value.latitude}} / {{value.value.longitude}}</span>
16+
<span ng-if="value.value_type === 'quantity'">{{value.value.amount}}</span>
17+
<span ng-show="!$last">/</span>
18+
</span>
19+
</li>
20+
</ul>
21+
22+
<md-button class="md-primary"
23+
aria-label="Show raw data"
24+
ng-click="$ctrl.showRawData = !$ctrl.showRawData">Show raw data</md-button>
25+
<pre ng-show="$ctrl.showRawData">{{$ctrl.monument | json}}</pre>
26+
</div>
27+
<div class="monument__right"
28+
layout="column" layout-align="start stretch">
29+
<div class="monument__image"
30+
layout="column" layout-align="center center"
31+
ng-if="!$ctrl.image">
32+
<md-icon>crop_original</md-icon>
33+
</div>
34+
<a ng-if="$ctrl.image" ng-href="{{$ctrl.image.descriptionurl}}">
35+
<img ng-src="{{$ctrl.image.thumburl}}">
36+
</a>
37+
<div class="monument__images" ng-if="$ctrl.images">
38+
<a ng-repeat="image in $ctrl.images" ng-href="{{image.descriptionurl}}">
39+
<img ng-src="{{image.thumburl}}">
40+
</a>
41+
</div>
42+
<md-button class="md-primary"
43+
ng-if="$ctrl.monument.claims.P373"
44+
ng-href="{{$ctrl.getCommonsLink()}}">
45+
<md-icon>collections</md-icon> more in wikimedia commons
46+
</md-button>
1447
</div>
1548
</div>
16-
<h4 class="md-display-1">Surowe dane</h4>
17-
<pre>
18-
{{$ctrl.monument | json}}
19-
</pre>
2049
</md-content>

‎src/components/main/monument/monument.js‎

Lines changed: 44 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,52 @@ const MonumentComponent = {
88
template: template
99
};
1010

11-
function controller($http, $stateParams, wikidata) {
11+
function controller($http, $q, $stateParams, CommonsService, wikidata) {
1212
let vm = this;
13-
1413
const id = $stateParams.id;
15-
wikidata.getById(id).then(data => {
16-
const first = Object.keys(data)[0];
17-
vm.monument = data[first];
18-
});
14+
15+
vm.getCommonsLink = getCommonsLink;
16+
vm.lang = 'pl';
17+
18+
wikidata.setLanguages(['pl', 'en']);
19+
getWikidata();
20+
21+
// functions
22+
23+
function getCategoryMembers(category) {
24+
CommonsService.getCategoryMembers(category).then(data => {
25+
const promises = data.map(image => CommonsService.getImage(image, { iiurlheight: 75 }));
26+
$q.all(promises).then(data => {
27+
vm.images = data.map(image => image.imageinfo);
28+
});
29+
});
30+
}
31+
32+
function getCommonsLink() {
33+
const name = vm.monument.claims.P373.values[0].value;
34+
return 'https://commons.wikimedia.org/wiki/Category:' + encodeURIComponent(name);
35+
}
36+
37+
function getImage(image) {
38+
CommonsService.getImage(image).then(data => {
39+
vm.image = data.imageinfo;
40+
});
41+
}
42+
43+
function getWikidata() {
44+
wikidata.getById(id).then(data => {
45+
const first = Object.keys(data)[0];
46+
vm.monument = data[first];
47+
const claims = vm.monument.claims;
48+
49+
if (vm.monument.claims.P18) {
50+
getImage(claims.P18.values[0].value);
51+
}
52+
if (vm.monument.claims.P373) {
53+
getCategoryMembers(claims.P373.values[0].value);
54+
}
55+
});
56+
}
1957
}
2058

2159
export default () => {

‎src/components/main/monument/monument.scss‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,48 @@
22
@import '../../../styles/responsive';
33

44
mo-monument {
5+
.monument {
6+
width: 1200px;
7+
max-width: 100%;
8+
}
9+
10+
.monument__right {
11+
width: 300px;
12+
min-width: 300px;
13+
overflow: hidden;
14+
15+
.md-button {
16+
margin-left: 0;
17+
margin-right: 0;
18+
}
19+
}
20+
21+
.monument__image {
22+
background: #bdbdbd;
23+
width: 300px;
24+
height: 300px;
25+
margin-top: 10px;
26+
27+
md-icon.material-icons {
28+
width: 60px;
29+
height: 60px;
30+
font-size: 60px;
31+
opacity: .75;
32+
}
33+
}
34+
35+
.monument__images {
36+
margin-top: 10px;
37+
width: 400px;
38+
39+
img {
40+
margin-right: 5px;
41+
display: inline-block;
42+
}
43+
}
44+
545
.monument__title {
46+
margin-top: 0;
647
margin-bottom: 0;
748
}
849
.monument__subtitle {

‎src/services/commons.service.js‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import _ from 'lodash';
2+
3+
const commonsService = function ($http, $q) {
4+
5+
const service = {
6+
getCategoryMembers: getCategoryMembers,
7+
getImage: getImage
8+
};
9+
10+
const defaultParams = {
11+
action: 'query',
12+
format: 'json',
13+
callback: 'JSON_CALLBACK'
14+
};
15+
16+
const categoryFilesParams = angular.extend({}, defaultParams, {
17+
list: 'categorymembers',
18+
cmprop: 'title',
19+
cmtype: 'file',
20+
cmlimit: 10,
21+
});
22+
23+
const imageParams = angular.extend({}, defaultParams, {
24+
prop: 'imageinfo',
25+
iiurlwidth: 300,
26+
iiurlheight: 300,
27+
iiprop: ['timestamp', 'user', 'url', 'size'].join('|'),
28+
});
29+
30+
return service;
31+
32+
// functions
33+
34+
function getCategoryMembers(category) {
35+
let params = angular.extend({}, categoryFilesParams, { cmtitle: 'Category:' + category});
36+
return $http.jsonp('https://commons.wikimedia.org/w/api.php', {
37+
params: params,
38+
cache: true
39+
}).then(data => {
40+
let images = data.data.query.categorymembers.map(image => image.title.substring(5));
41+
return images;
42+
});
43+
}
44+
45+
function getImage(image, extraParams) {
46+
let params = angular.extend({}, imageParams, { titles: 'File:' + image}, extraParams);
47+
return $http.jsonp('https://commons.wikimedia.org/w/api.php', {
48+
params: params,
49+
cache: true
50+
}).then(data => {
51+
const image = _.head(_.values(data.data.query.pages));
52+
return angular.extend(image, {imageinfo: image.imageinfo[0]});
53+
});
54+
}
55+
};
56+
57+
export default () => {
58+
angular
59+
.module('monumental')
60+
.factory('CommonsService', commonsService);
61+
};

‎src/services/index.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
1+
import commons from './commons.service';
12
import theme from './theme.service';
23
import wikidata from './wikidata.service';
34

45
export default () => {
6+
commons();
57
theme();
68
wikidata();
79
};

‎src/services/wikidata.service.js‎

Lines changed: 19 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
const wdService = function ($http, $q) {
22

33
const service = {
4-
getById: getById
4+
getById: getById,
5+
setLanguages: setLanguages
56
};
67

78
const defaultParams = {
89
action: 'wbgetentities',
910
format: 'json',
10-
props: ['info', 'labels', 'descriptions', 'claims', 'datatype'],
11-
languages: ['pl', 'en'],
12-
sitefilter: 'plwiki',
11+
props: ['info', 'labels', 'aliases', 'descriptions', 'claims', 'datatype', 'sitelinks'],
12+
languages: ['en'],
1313
callback: 'JSON_CALLBACK'
1414
};
1515

@@ -62,11 +62,22 @@ const wdService = function ($http, $q) {
6262
return result;
6363
}
6464

65-
function simplify(entity) {
65+
function setLanguages (languages) {
66+
defaultParams.languages = languages;
67+
}
68+
69+
function simplifyAliases(aliases) {
70+
return mapValues(aliases, lang => lang.map(alias => alias.value));
71+
}
72+
73+
function simplifyEntity(entity) {
6674
return {
6775
id: entity.id,
6876
labels: simplifyLabels(entity.labels),
69-
claims: simplifyClaims(entity.claims)
77+
aliases: simplifyAliases(entity.aliases),
78+
descriptions: simplifyLabels(entity.descriptions),
79+
claims: simplifyClaims(entity.claims),
80+
interwiki: entity.sitelinks
7081
};
7182
}
7283

@@ -94,10 +105,9 @@ const wdService = function ($http, $q) {
94105

95106
return get({
96107
ids: id,
97-
languages: ['pl', 'en'],
98-
sitefilter: 'plwiki',
108+
languages: defaultParams.languages
99109
})
100-
.then(data => mapValues(data.data.entities, entity => simplify(entity)))
110+
.then(data => mapValues(data.data.entities, entity => simplifyEntity(entity)))
101111
.then(data => {
102112
entities = data;
103113
const simplified = mapValues(data,

0 commit comments

Comments
 (0)