Skip to content

Commit dacaafe

Browse files
yarlyarl
authored
Merge pull request #5 from yarl/dev
version 0.5
2 parents 486aa5d + 39e591c commit dacaafe

7 files changed

Lines changed: 120 additions & 49 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.4.0",
3+
"version": "0.5.0",
44
"private": true,
55
"description": "Monumental app",
66
"main": "src/index.js",

‎src/components/main/dashboard/dashboard.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<md-content layout="column" layout-align="start center" flex>
22
<div class="dashboard">
33
<a ui-sref="main.object({id: '765569'})">Zamek Gryf<a/><br />
4-
<a ui-sref="main.list({id: '16970-in-54181'})">churches in silesian voivodeship<a/>
4+
<a ui-sref="main.list({id: '54181'})">monuments in silesian voivodeship<a/>
55
</div>
66
</md-content>

‎src/components/main/list/list.html‎

Lines changed: 30 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,36 @@
1-
<md-content layout="column" layout-align="start center" flex>
2-
<div class="list" layout="row" layout-align="start stretch">
1+
<md-content layout="row" layout-align="start stretch" flex>
2+
<div class="list" layout="column" layout-align="start stretch" flex="none">
3+
<md-autocomplete
4+
md-input-name="autocompleteField"
5+
md-selected-item="$ctrl.search.selectedItem"
6+
md-search-text="$ctrl.search.text"
7+
md-items="item in $ctrl.querySearch($ctrl.search.text)"
8+
md-selected-item-change="$ctrl.goToItem(item)"
9+
md-item-text="item.label"
10+
md-min-length="1"
11+
placeholder="Search"
12+
md-menu-class="autocomplete-custom-template">
13+
<md-item-template>
14+
<strong>{{item.label}}</strong>
15+
<span>{{item.description}}</span>
16+
</md-item-template>
17+
</md-autocomplete>
318
<div class="list__container" flex>
4-
<md-subheader class="md-no-sticky">List</md-subheader>
5-
<md-list-item ng-repeat="item in $ctrl.list | orderBy: 'value'"
19+
<md-list-item>
20+
<span>{{$ctrl.list.length}} results</span>
21+
</md-list-item>
22+
<md-list-item class="md-2-line"
23+
ng-repeat="item in $ctrl.list | orderBy: 'name.value'"
624
ui-sref="main.object({id: item.name.value_id.substring(1)})">
7-
<p>{{item.name.value}} <span class="muted">{{item.admin.value}}</span></p>
25+
<div class="list__image" layout="row" layout-align="center center">
26+
<img ng-src="{{item.image}}" alt="{{item.name.value}}" ng-if="item.image">
27+
</div>
28+
<div class="md-list-item-text" layout="column">
29+
<p>{{item.name.value}}</p>
30+
<p class="muted">{{item.admin.value}}</p>
31+
</div>
832
</md-list-item>
933
</div>
10-
<leaflet ng-if="$ctrl.showMap" markers="$ctrl.map.markers" center="$ctrl.map.center" flex></leaflet>
1134
</div>
35+
<leaflet ng-if="$ctrl.showMap" markers="$ctrl.map.markers" center="$ctrl.map.center" flex></leaflet>
1236
</md-content>

‎src/components/main/list/list.js‎

Lines changed: 51 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,17 @@ const ListComponent = {
99
template: template
1010
};
1111

12-
function controller($stateParams, $timeout, wikidata) {
12+
function controller($state, $stateParams, $timeout, leafletData, wikidata) {
1313
let vm = this;
14+
const id = $stateParams.id[0] === 'Q' ? $stateParams.id : 'Q' + $stateParams.id;
15+
1416
vm.map = {};
17+
vm.listParams = {};
18+
19+
vm.goToItem = (item) => item ? $state.go('main.list', { id: item.id.substring(1) }) : false;
20+
vm.querySearch = (text) => wikidata.getSearch(text);
21+
vm.search = {};
1522

16-
const ids = $stateParams.id.split('-in-').map(id => id[0] === 'Q' ? id : 'Q' + id);
1723
const icon = {
1824
iconUrl: 'assets/images/marker.png',
1925
shadowUrl: undefined,
@@ -32,40 +38,54 @@ function controller($stateParams, $timeout, wikidata) {
3238
markers: {}
3339
};
3440

35-
wikidata.getSPARQL(`SELECT ?item ?itemLabel ?admin ?adminLabel ?coord WHERE {
36-
?item wdt:P31 wd:`+ ids[0] + ` .
37-
?item wdt:P131* wd:`+ ids[1] + ` .
41+
wikidata.getSearch(id).then(results => {
42+
vm.search.selectedItem = results.length ? results[0] : undefined;
43+
});
44+
45+
wikidata.getSPARQL(`SELECT DISTINCT ?item ?itemLabel ?admin ?adminLabel ?coord ?image WHERE {
46+
?item p:P1435 ?monument .
47+
?item wdt:P131* wd:`+ id + ` .
3848
?item wdt:P131 ?admin .
3949
?item wdt:P625 ?coord .
50+
OPTIONAL { ?item wdt:P18 ?image }
4051
SERVICE wikibase:label { bd:serviceParam wikibase:language "pl,en" }
4152
}`).then(data => {
42-
console.log(data)
43-
vm.list = data.map(element => ({
44-
name: {
45-
value_id: element.item.value.substring(element.item.value.indexOf('/Q') + 1),
46-
value: element.itemLabel.value
47-
},
48-
admin: {
49-
value_id: element.admin.value.substring(element.admin.value.indexOf('/Q') + 1),
50-
value: element.adminLabel.value
51-
},
52-
coord: element.coord.value ? element.coord.value.replace('Point(', '').replace(')', '').split(' ') : false
53-
}));
54-
return vm.list;
55-
}).then(list => {
56-
list.forEach(element => {
57-
if(element.coord) {
58-
vm.map.markers[element.name.value_id] = {
59-
lat: +element.coord[1],
60-
lng: +element.coord[0],
61-
icon: icon
62-
};
63-
}
64-
});
65-
$timeout(() => {
66-
vm.showMap = true;
53+
// console.log(data)
54+
vm.list = data.map(element => ({
55+
name: {
56+
value_id: element.item.value.substring(element.item.value.indexOf('/Q') + 1),
57+
value: element.itemLabel.value
58+
},
59+
admin: {
60+
value_id: element.admin.value.substring(element.admin.value.indexOf('/Q') + 1),
61+
value: element.adminLabel.value
62+
},
63+
coord: element.coord.value ? element.coord.value.replace('Point(', '').replace(')', '').split(' ') : false,
64+
image: element.image ? element.image.value.replace('wiki/Special:FilePath', 'w/index.php?title=Special:Redirect/file') + '&width=75' : false
65+
}));
66+
return vm.list;
67+
}).then(list => {
68+
let bounds = [];
69+
list.forEach(element => {
70+
if (element.coord) {
71+
vm.map.markers[element.name.value_id] = {
72+
lat: +element.coord[1],
73+
lng: +element.coord[0],
74+
message: element.name.value,
75+
icon: icon
76+
};
77+
bounds.push([+element.coord[1], +element.coord[0]]);
78+
}
79+
});
80+
$timeout(() => {
81+
vm.showMap = true;
82+
leafletData.getMap().then(function (map) {
83+
if (bounds.length) {
84+
map.fitBounds(bounds, { padding: [25, 25] });
85+
}
86+
});
87+
});
6788
});
68-
});
6989
}
7090

7191
export default () => {

‎src/components/main/list/list.scss‎

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,32 @@
11
mo-list {
22
.list {
3-
width: 980px;
4-
max-width: 100%;
3+
width: 450px;
4+
height: calc(100vh - 105px);
55
}
66

77
.list__container {
8-
max-height: calc(100vh - 110px);
98
overflow-y: scroll;
109
overflow-x: hidden;
10+
11+
md-list-item.md-2-line {
12+
border-bottom: 1px solid #e5e5e5;
13+
}
14+
}
15+
16+
.list__image {
17+
width: 75px;
18+
min-width: 75px;
19+
height: 75px;
20+
background: #e5e5e5;
21+
margin: 15px 15px 15px 0;
22+
23+
img {
24+
max-width: 100%;
25+
max-height: 100%;
26+
}
27+
}
28+
29+
md-autocomplete {
30+
margin: 20px;
1131
}
1232
}

‎src/components/main/main.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,12 @@ const MainComponent = {
77
template: template
88
};
99

10-
function controller(wikidata, $state) {
10+
function controller(wikidata, $state, $stateParams) {
1111
let vm = this;
1212

13+
vm.lang = $stateParams.lang || 'pl';
14+
wikidata.setLanguages([vm.lang, 'en']);
15+
1316
vm.goToItem = (item) => $state.go('main.object', {id: item.title.substring(1)});
1417
vm.querySearch = (text) => wikidata.getSearch(text);
1518
vm.search = {};

‎src/services/wikidata.service.js‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ const wdService = function ($http, $q) {
22

33
const service = {
44
getById: getById,
5+
getLabels: getLabels,
56
getRecursive: getRecursive,
67
getSearch: getSearch,
78
getSPARQL: getSPARQL,
@@ -40,13 +41,20 @@ const wdService = function ($http, $q) {
4041
* @returns {Promise}
4142
*/
4243
function get(data) {
43-
let params = angular.extend(angular.copy(defaultParams), data);
44+
let params = angular.extend({}, defaultParams, data);
4445
return $http.jsonp('https://www.wikidata.org/w/api.php', {
4546
params: mapValues(params, p => angular.isArray(p) ? p.join('|') : p),
4647
cache: false
4748
});
4849
}
4950

51+
function getLabels(ids) {
52+
return get({
53+
ids: ids,
54+
props: ['labels']
55+
}).then(response => mapValues(response.data.entities, entity => simplifyLabels(entity.labels)));
56+
}
57+
5058
function getRecursive(element, recursiveProperty) {
5159
let query = `SELECT ?parent ?parentLabel WHERE {
5260
wd:`+ element + ` wdt:` + recursiveProperty + `* ?parent .
@@ -154,11 +162,7 @@ const wdService = function ($http, $q) {
154162
ids = ids.filter((item, pos, self) => item && self.indexOf(item) === pos);
155163
return ids;
156164
})
157-
.then(labelsIDs => get({
158-
ids: labelsIDs,
159-
props: ['labels']
160-
}))
161-
.then(response => mapValues(response.data.entities, entity => simplifyLabels(entity.labels)))
165+
.then(labelsIDs => getLabels(labelsIDs))
162166
.then(labels => {
163167
forOwn(entities, entity => {
164168
entity.claims = mapValues(entity.claims, (values, key) => ({

0 commit comments

Comments
 (0)