Compare commits

..

2 commits

Author SHA1 Message Date
Dave Lane
e3e685f0f8 working on splitting up app into bitesized chunks 2024-08-30 15:23:00 +12:00
Dave Lane
b0d9bd2c5d thanking the OER Foundation for supporting this work! 2024-08-29 12:59:09 +12:00
5 changed files with 160 additions and 143 deletions

View file

@ -2,6 +2,9 @@
This is an app I'm creating to visualise data I've created (in JSON form) describing my self-hosted (professional, volunteer, & personal) webservices.
## Credits
Developed by Dave Lane, [Open Source Technologist](https://oerfoundation.org/about/staff/#Dave_Lane) at the [OER Foundation](https://oerfoundation.org). Many thanks to support from the Foundation for this exploratory work!
## Installing the Webservices App

35
src/colours.js Normal file
View file

@ -0,0 +1,35 @@
// source: https://mokole.com/palette.html 20 colors with default settings otherwise
const colours = [
'#808080',
'#7f0000',
'#006400',
'#808000',
'#483d8b',
'#008b8b',
'#cd853f',
'#00008b',
'#7f007f',
'#8fbc8f',
'#b03060',
'#ff0000',
'#ff8c00',
'#00ff00',
'#9400d3',
'#00ff7f',
'#dc143c',
'#00ffff',
'#00bfff',
'#0000ff',
'#f08080',
'#adff2f',
'#1e90ff',
'#ffff54',
'#90ee90',
'#add8e6',
'#ff1493',
'#7b68ee',
'#ee82ee',
'#ffe4b5'
];
export { colours };

112
src/lib/processData.svelte Normal file
View file

@ -0,0 +1,112 @@
<script>
// digest and return useful info from the Webservices JSON feed
export function processData(webservices) {
let instances = 0;
let current = [];
let future = [];
// properties of technologies
let category_list = [];
let analogue_list = [];
let license_list = [];
// properties of instances
let status_list = [];
let affiliate_list = [];
let host_list = [];
// actual objects
let hosts = [];
let affiliates = [];
//
// just a trivial reassignment
//let hosts = webservices.hosts;
//
// pull out relevant info in useful chunks.
for (let key in webservices.technologies) {
let tech = webservices.technologies[key];
if (tech.hasOwnProperty('categories') && tech.categories.constructor === Array) {
tech.categories.forEach(function (category, index) {
if (category_list.hasOwnProperty(category)) category_list[category]++;
else category_list[category] = 1;
});
}
if (tech.hasOwnProperty('analogues') && tech.analogues.constructor === Array) {
tech.analogues.forEach(function (analogue, index) {
if (analogue_list.hasOwnProperty(analogue)) analogue_list[analogue]++;
s else analogue_list[analogue] = 1;
});
}
if (tech.hasOwnProperty('license')) {
let license = tech.license;
if (license_list.hasOwnProperty(license)) license_list[license]++;
else license_list[license] = 1;
}
if (hasInstances(tech)) {
tech['name'] = key;
current.push(tech);
//console.log(tech.name + ': ' + tech.instances.length + ' instances...');
tech.instances.forEach(function (instance, i) {
instances++;
if (instance.hasOwnProperty('status')) {
let tag = instance.status;
if (status_list.hasOwnProperty(tag)) status_list[tag]++;
else status_list[tag] = 1;
}
if (instance.hasOwnProperty('affiliation')) {
let tag = instance.affiliation;
if (affiliate_list.hasOwnProperty(tag)) affiliate_list[tag]++;
else affiliate_list[tag] = 1;
}
if (instance.hasOwnProperty('host')) {
let tag = instance.host;
if (host_list.hasOwnProperty(tag)) host_list[tag]++;
else host_list[tag] = 1;
}
});
} else {
future[key] = tech;
}
}
for (let key in webservices.hosts) {
//console.log('key: ', key);
let host = webservices.hosts[key];
host['name'] = key;
//console.log('host: ', host);
if (
host.hasOwnProperty('domain') &&
!(host.hasOwnProperty('status') && host.status == 'retired')
) {
hosts[key] = host;
}
}
//console.log('webservices.affiliates: ', webservices.affiliates);
for (let key in webservices.affiliates) {
//console.log('key: ', key);
let affiliate = webservices.affiliates[key];
//console.log('affiliate assignment: ', affiliate);
affiliates[key] = affiliate;
// if (affiliate.hasOwnProperty('name')) {
// affiliate_data[key] = affiliate;
// }
}
return {
total_instances: instances,
active_services: current,
candidate_services: future,
tech_lists: {
category_list: category_list,
analogue_list: analogue_list,
license_list: license_list
},
instance_lists: {
status_list: status_list,
affiliate_list: affiliate_list,
host_list: host_list
},
hosts: hosts,
affiliates: affiliates
};
}
</script>

3
src/references.js Normal file
View file

@ -0,0 +1,3 @@
const References = {};
export { References };

View file

@ -3,149 +3,13 @@
export let data;
const { webservices } = data;
// source: https://mokole.com/palette.html 20 colors with default settings otherwise
const colours30 = [
'#808080',
'#7f0000',
'#006400',
'#808000',
'#483d8b',
'#008b8b',
'#cd853f',
'#00008b',
'#7f007f',
'#8fbc8f',
'#b03060',
'#ff0000',
'#ff8c00',
'#00ff00',
'#9400d3',
'#00ff7f',
'#dc143c',
'#00ffff',
'#00bfff',
'#0000ff',
'#f08080',
'#adff2f',
'#1e90ff',
'#ffff54',
'#90ee90',
'#add8e6',
'#ff1493',
'#7b68ee',
'#ee82ee',
'#ffe4b5'
];
//import References from '../references.js';
import { colours } from '../colours.js';
import { processData } from '../lib/processData.svelte';
// digest and return useful info from the Webservices JSON feed
function processData(webservices) {
let instances = 0;
let current = [];
let future = [];
// properties of technologies
let category_list = [];
let analogue_list = [];
let license_list = [];
// properties of instances
let status_list = [];
let affiliate_list = [];
let host_list = [];
console.log('colours: ', colours);
// actual objects
let hosts = [];
let affiliates = [];
//
// just a trivial reassignment
//let hosts = webservices.hosts;
//
// pull out relevant info in useful chunks.
for (let key in webservices.technologies) {
let tech = webservices.technologies[key];
if (tech.hasOwnProperty('categories') && tech.categories.constructor === Array) {
tech.categories.forEach(function (category, index) {
if (category_list.hasOwnProperty(category)) category_list[category]++;
else category_list[category] = 1;
});
}
if (tech.hasOwnProperty('analogues') && tech.analogues.constructor === Array) {
tech.analogues.forEach(function (analogue, index) {
if (analogue_list.hasOwnProperty(analogue)) analogue_list[analogue]++;
else analogue_list[analogue] = 1;
});
}
if (tech.hasOwnProperty('license')) {
let license = tech.license;
if (license_list.hasOwnProperty(license)) license_list[license]++;
else license_list[license] = 1;
}
if (hasInstances(tech)) {
tech['name'] = key;
current.push(tech);
//console.log(tech.name + ': ' + tech.instances.length + ' instances...');
tech.instances.forEach(function (instance, i) {
instances++;
if (instance.hasOwnProperty('status')) {
let tag = instance.status;
if (status_list.hasOwnProperty(tag)) status_list[tag]++;
else status_list[tag] = 1;
}
if (instance.hasOwnProperty('affiliation')) {
let tag = instance.affiliation;
if (affiliate_list.hasOwnProperty(tag)) affiliate_list[tag]++;
else affiliate_list[tag] = 1;
}
if (instance.hasOwnProperty('host')) {
let tag = instance.host;
if (host_list.hasOwnProperty(tag)) host_list[tag]++;
else host_list[tag] = 1;
}
});
} else {
future[key] = tech;
}
}
for (let key in webservices.hosts) {
//console.log('key: ', key);
let host = webservices.hosts[key];
host['name'] = key;
//console.log('host: ', host);
if (
host.hasOwnProperty('domain') &&
!(host.hasOwnProperty('status') && host.status == 'retired')
) {
hosts[key] = host;
}
}
//console.log('webservices.affiliates: ', webservices.affiliates);
for (let key in webservices.affiliates) {
//console.log('key: ', key);
let affiliate = webservices.affiliates[key];
//console.log('affiliate assignment: ', affiliate);
affiliates[key] = affiliate;
// if (affiliate.hasOwnProperty('name')) {
// affiliate_data[key] = affiliate;
// }
}
return {
total_instances: instances,
active_services: current,
candidate_services: future,
tech_lists: {
category_list: category_list,
analogue_list: analogue_list,
license_list: license_list
},
instance_lists: {
status_list: status_list,
affiliate_list: affiliate_list,
host_list: host_list
},
hosts: hosts,
affiliates: affiliates
};
}
// console.log(technologies);
// return true if a tech object includes valid instances
@ -301,10 +165,10 @@
//console.log('host_data: ', results.hosts);
const affiliates = results.affiliates;
//console.log('affiliate_data: ', results.affiliates);
const host_colours = hostColours(host_list, colours30, hosts);
const host_colours = hostColours(host_list, colours, hosts);
//console.log('host_colours:', host_colours);
colours30.sort();
const affiliate_colours = affiliateColours(affiliate_list, colours30, affiliates);
colours.sort();
const affiliate_colours = affiliateColours(affiliate_list, colours, affiliates);
//console.log('affiliate_colours:',affiliate_colours);
//console.log('categories array: ', results.tech_tags.categories);