Widget:AllusionsCharts: Difference between revisions

From International Robin Hood Bibliography
mNo edit summary
m (Text replacement - "/wiki/" to "/w/")
 
(19 intermediate revisions by the same user not shown)
Line 7: Line 7:
window.IRHB.timeline = {};
window.IRHB.timeline = {};
var t = window.IRHB.timeline;
var t = window.IRHB.timeline;
window.IRHB.get = window.IRHB.get || function get (elem) {
if (typeof elem === "string") {
elem = document.getElementById(elem);
}
return elem;
};
var get = window.IRHB.get;


Line 13: Line 22:
if (nVals != 0) {
if (nVals != 0) {
for (var i = 0; i < nVals; i++) {
for (var i = 0; i < nVals; i++) {
var decade = vals[i].aldecade;
var decade = vals[i].Decade;
if (!pages.hasOwnProperty(decade)) {
if (!pages.hasOwnProperty(decade)) {
pages[decade] = [];
pages[decade] = [];
}
}
pages[decade].push({"year": vals[i].alyear,"page": vals[i].pagename});
pages[decade].push({"year": vals[i].Year,"page": vals[i].pagename});
}
}
var pText = "<div class='chrtHead'>Timeline</div>";
var pText = "<div class='chrtHead'>Timeline</div>";
var curCentury = 0, cText = "", cTotal;
for (var prop in pages) {
for (var prop in pages) {
if (pages.hasOwnProperty(prop)) {
if (pages.hasOwnProperty(prop)) {
var decStr = prop + "&ndash;" + String((parseInt(prop) + 9)).substring(2)  
var century = getCentury(prop);
+ ": " + pages[prop].length;
if (century !== curCentury) {
pText += "<div class='tLnDec' id='i" + prop + "'><div>" + decStr + "</div><ul>";
if (curCentury !== 0) {
var cntStr = curCentury + (curCentury !== "21" ? "th" : "st") + " Cent.";
var cHead = "<div class='tlnCnt' id='c" + curCentury + "'><div>" + cntStr + " (" + cTotal + ")</div>";
pText += cHead + "<div>" + cText + "</div></div>";
}
cTotal = 0;
curCentury = century;
cText = "";
}
var nPages = pages[prop].length;
var nPages = pages[prop].length;
cTotal += nPages;
var decStr = prop + "&ndash;" + String((parseInt(prop) + 9)).substring(2) + " (" + nPages + ")";
cText += "<div class='tlnDec' id='i" + prop + "'><div>" + decStr + "</div><ul>";
for (var i = 0; i < nPages; i++) {
for (var i = 0; i < nPages; i++) {
pText += "<li class='tLnItem'><span>" + pages[prop][i].page + "</span><div></div></li>";
cText += "<li class='tlnItem'><span>" + pages[prop][i].page + "</span><div></div></li>";
}
}
pText += "</ul></div>"
cText += "</ul></div>"
}
}
}
}
var cntStr = curCentury + (curCentury !== "21" ? "th" : "st") + " Cent.";
var cHead = "<div class='tlnCnt' id='c" + curCentury + "'><div>" + cntStr + " (" + cTotal + ")</div>";
pText += cHead + "<div>" + cText + "</div></div>";
elem.innerHTML = pText;
elem.innerHTML = pText;
var decades = get("tline").getElementsByClassName("tLnDec");
var centuries = get("tline").getElementsByClassName("tlnCnt");
var nCnts = centuries.length;
for (var i = 0; i < nCnts; i++) {
initDiv(centuries[i]);
}
var decades = get("tline").getElementsByClassName("tlnDec");
var nDecs = decades.length;
var nDecs = decades.length;
for (var i = 0; i < nDecs; i++) {
for (var i = 0; i < nDecs; i++) {
initDiv(decades[i]);
initDiv(decades[i]);
}
}
var items = get("tline").getElementsByClassName("tLnItem");
var items = get("tline").getElementsByClassName("tlnItem");
var nItems = items.length;
var nItems = items.length;
for (var i = 0; i < nItems; i++) {
for (var i = 0; i < nItems; i++) {
Line 54: Line 85:
};
};
var getDecade = t.getDecade;
var getDecade = t.getDecade;
t.getCentury = function(decade) {
var century = parseInt(decade / 100) + 1;
return century;
};
var getCentury = t.getCentury;
Line 125: Line 163:
var queryProps = window.IRHB.getQueryProps();
var queryProps = window.IRHB.getQueryProps();
var valuesAr, nVals;
var valuesAr, nVals;
var get = window.IRHB.get;
var chartOptions =  {
var chartOptions =  {
"scales": {
"scales": {
Line 157: Line 197:
"display": true,
"display": true,
"fontSize": 28,
"fontSize": 28,
"fontFamily": "'Open Sans Condensed', Helvetica, Arial, sans-serif",
"fontFamily": "'OpenSansCondensed-Light', Helvetica, Arial, sans-serif",
"fontColor": '#964d4d',
"fontColor": '#800000',
"fontStyle": "bold",
"fontStyle": "bold",
"padding": 20
"padding": 20
Line 174: Line 214:
};
};


var get = window.IRHB.get || function get (elem) {
 
if (typeof elem === "string") {
function replaceAll (str, find, replacement) {
elem = document.getElementById(elem);
}
return elem;
};
replaceAll = function (str, find, replacement) {
return str.replace(new RegExp(escapeRegEx(find), 'g'), replacement);
return str.replace(new RegExp(escapeRegEx(find), 'g'), replacement);
};
};
function escapeRegEx (str) {
function escapeRegEx (str) {
Line 206: Line 241:
}
}
for (var i = 0; i < nVals; i++) {
for (var i = 0; i < nVals; i++) {
var cnt = valuesAr[i].alcent;
var cnt = valuesAr[i].Century;
var suffix = cnt != 21 ? "th" : "st";
var suffix = cnt != 21 ? "th" : "st";
cnt += suffix;
cnt += suffix;
Line 224: Line 259:
bars[String(i)] = 0;
bars[String(i)] = 0;
}
}
console.log(bars);
for (var i = 0; i < nVals; i++) {
for (var i = 0; i < nVals; i++) {
var cnt = valuesAr[i].aldecade;
var cnt = valuesAr[i].Decade;
bars[String(cnt)] += 1;
bars[String(cnt)] += 1;
if (bars[cnt] > maxBar) {
if (bars[cnt] > maxBar) {
Line 252: Line 286:
}
}
if (lbl === "Status") {
if (lbl === "Status") {
cColrs[1] = "#82a89e";
cColrs[1] = "#800000";
}
}
var chrt = new Chart( get(cvsId), {
var chrt = new Chart( get(cvsId), {
Line 302: Line 336:
if (card.innerHTML == "") {
if (card.innerHTML == "") {
item = encodeURIComponent(item);
item = encodeURIComponent(item);
var qry = "https://www.irhb.org/wiki/api.php?action=ask&query=[[" + item + "]]|?Alyear|?Alauthor|?Altitle|?Alabout|?Alcent|?Aldecade&format=json";
var qry = "/w/api.php?action=ask&query=[[" + item + "]]|?Year|?Author|?Title|?About|?Century|?Decade&format=json";
query(qry, "POST", makeItemCard);
query(qry, "POST", makeItemCard);
} else {
} else {
Line 318: Line 352:
res = res.query.results;
res = res.query.results;
res = res[Object.keys(res)[0]];
res = res[Object.keys(res)[0]];
console.log(res);
var page = res.fulltext;
var page = res.fulltext;
var author = res.printouts.Alauthor[0];
var author = res.printouts.Author[0];
var title = res.printouts.Altitle[0];
var title = res.printouts.Title[0];
var decade = res.printouts.Aldecade[0];
var decade = res.printouts.Decade[0];
var decadeDiv = get("i" + decade);
var decadeDiv = get("i" + decade);
var lst = decadeDiv.firstChild.nextSibling;
var lst = decadeDiv.firstChild.nextSibling;
Line 330: Line 363:
if (lstItems[i].firstChild.innerHTML == page) {
if (lstItems[i].firstChild.innerHTML == page) {
var card = lstItems[i].firstChild.nextSibling;
var card = lstItems[i].firstChild.nextSibling;
var txt = "<div class='cardText'><table>";
var txt = "<div class='cardText'><table class='itemCard'>";
txt += "<tr><td>Page</td><td><a href='https://www.irhb.org/wiki/index.php/" + page + "'>" + page + "</a></td></tr>";
txt += "<tr><th>Link</th><td><a href='/w/index.php/" + page + "'>" + page + "</a></td></tr>";
txt += "<tr><td>Year</td><td>" + res.printouts.Alyear[0] + "</td></tr>";
txt += "<tr><th>Year</th><td>" + res.printouts.Year[0] + "</td></tr>";
if (typeof author !== "undefined") {
if (typeof author !== "undefined") {
txt += "<tr><td>Author</td><td>" + author + "</td></tr>";
txt += "<tr><th>Author</th><td>" + author + "</td></tr>";
txt += "<tr><td>Title</td><td>" + res.printouts.Altitle[0] + "</td></tr>";
txt += "<tr><th>Title</th><td>" + res.printouts.Title[0] + "</td></tr>";
}
}
txt += "<tr><td>Topic</td><td>" + res.printouts.Alabout[0] + "</td></tr>";
txt += "<tr><th>Topic</th><td>" + res.printouts.About[0] + "</td></tr>";
txt += "<tr><td>Decade</td><td>" + decade + "</td></tr>";
txt += "<tr><th>Decade</th><td>" + decade + "</td></tr>";
txt += "<tr><td>Century</td><td>" + res.printouts.Alcent[0] + "</td></tr></table>";
txt += "<tr><th>Century</th><td>" + res.printouts.Century[0] + "</td></tr></table>";
card.innerHTML = txt;
card.innerHTML = txt;
break;
break;
Line 369: Line 402:
     var script = document.createElement('script');
     var script = document.createElement('script');
     script.type = 'text/javascript';
     script.type = 'text/javascript';
     script.src = "https://www.irhb.org/wiki/js/Chart.js";
     script.src = "/w/js/Chart.js";
     script.onreadystatechange = prepareCharts;
     script.onreadystatechange = prepareCharts;
     script.onload = prepareCharts;
     script.onload = prepareCharts;

Latest revision as of 03:56, 6 June 2022

This widget renders the charts on the section and century landing pages in the Allusions section and Records sub-section of IRHB. It takes no parameters.