Create similar year selection widged that is used in Fortepan.
- https://fortepan.hu/en/photos/?year=1924
**Required features**
- ability to select specific year using slider
- ability to show images between start and end years as alternative for specific year
- show filtered images as imagegrid
- In the UI, there should be the ability to define a PetScan ID as a photo source. Use 33506148 as the default PetScan ID.
**Source photos**
- Use photos from Petscan query https://petscan.wmcloud.org/?psid=33506148 (same as [[ https://petscan.wmcloud.org/?psid=33506148&format=json | json ]]) as source photos
**Implementation**
- Create separate user scripts for the task
- Keep code as simple. Idea would be test the idea, but if it works then use it as widget (in Cat-a-lot for example)
- Use [[https://commons.wikimedia.org/wiki/Special:BlankPage/Cat-a-lot_yearfilter]] as a page where code will open its UI
-- You can use following code to test the page name
```
if (mw.config.get("wgPageName") !== "Special:BlankPage/Cat-a-lot") { return; }
```
- thumbnail size can be defined using width-parameter:
-- https://commons.wikimedia.org/w/index.php?title=Special:Redirect/file/Helsingin_olympialaiset_1952_-_XLVIII-254_-_hkm.HKMS000005-km0000mrci.jpg&width=120
- do Petscan query only once and use same data until user manually requests update (for different Petscan id for example)
- from petscan Query you will get page_ids which you can convert to mediaitems for SPARQL query.
-- page id: 123 -> sdc:M123 ([[ https://qlever.cs.uni-freiburg.de/wikimedia-commons/Xt4YYw | example sparql query with mediaitems ]])
**Example SPARQL queries for year filtering**
**SPARQL Query using specific year**
- https://qlever.cs.uni-freiburg.de/wikimedia-commons/fKP0Ts
```
PREFIX wd: <http://www.wikidata.org/entity/>
PREFIX wdt: <http://www.wikidata.org/prop/direct/>
SELECT * WHERE {
?media wdt:P9478 ?finna_id .
?media wdt:P571 ?inception .
?media schema:url ?image.
FILTER(YEAR(?inception) = 1965)
}
LIMIT 100
```
**SPARQL Query using between start and end year**
https://qlever.cs.uni-freiburg.de/wikimedia-commons/Xt4YYw
```
PREFIX wd: <http://www.wikidata.org/entity/>
PREFIX wdt: <http://www.wikidata.org/prop/direct/>
SELECT * WHERE {
?media wdt:P9478 ?finna_id .
?media wdt:P571 ?inception .
?media schema:url ?image.
FILTER(YEAR(?inception) >= 1923 && YEAR(?inception) <= 1968)
}
LIMIT 100
```
**SPARQL query where target photos are defined using mediates**
mediaitem = "sdc:M" + page_id
- use POST instead of GET
- basically number of items in VALUES keyword is unlimited. It is OK to list 50000 mediaitems.
- https://qlever.cs.uni-freiburg.de/wikimedia-commons/UjLngR
```
PREFIX wd: <http://www.wikidata.org/entity/>
PREFIX wdt: <http://www.wikidata.org/prop/direct/>
SELECT * WHERE {
VALUES ?media { sdc:M100129757 sdc:M100212050 sdc:M100254412 }
?media wdt:P571 ?inception .
?media schema:url ?image.
FILTER(YEAR(?inception) >= 1923 && YEAR(?inception) <= 1968)
}
LIMIT 100
```
**SPARQL query using Javascript example**
```
// The SPARQL endpoint URL
const endpoint = 'https://qlever.cs.uni-freiburg.de/api/wikimedia-commons';
// A simple SPARQL query to find images with inception dates in a specific range
const query = `
PREFIX wd: <http://www.wikidata.org/entity/>
PREFIX wdt: <http://www.wikidata.org/prop/direct/>
PREFIX schema: <http://schema.org/>
SELECT ?media ?inception ?image WHERE {
?media wdt:P9478 ?finna_id .
?media wdt:P571 ?inception .
?media schema:url ?image .
FILTER(YEAR(?inception) >= 1923 && YEAR(?inception) <= 1968)
}
LIMIT 20
`;
// Function to execute the query
function executeSPARQLQuery(queryString) {
// Encode the query for URL
const encodedQuery = encodeURIComponent(queryString);
const queryUrl = `${endpoint}?query=${encodedQuery}&format=json`;
console.log('Executing SPARQL query...');
// Send the request
fetch(queryUrl)
.then(response => {
if (!response.ok) {
throw new Error(`Query failed with status: ${response.status}`);
}
return response.json();
})
.then(data => {
console.log('Query results:', data);
// Process the results (example)
if (data.results && data.results.bindings) {
const results = data.results.bindings;
console.log(`Found ${results.length} results`);
// Display the first result as an example
if (results.length > 0) {
const firstResult = results[0];
const mediaUri = firstResult.media.value;
const thumbnailUrl = firstResult.image.value + "?width=120";
const inception = firstResult.inception ? new Date(firstResult.inception.value).getFullYear() : 'unknown';
console.log(`First result: ${mediaUri} (${inception}) ${thumbnailUrl}`);
}
}
})
.catch(error => {
console.error('Error executing SPARQL query:', error);
});
}
// Execute the query
executeSPARQLQuery(query);
```