Widget:AllusionsCharts: Difference between revisions
From International Robin Hood Bibliography
mNo edit summary |
m (Text replacement - "/wiki/" to "/w/") |
||
(11 intermediate revisions by the same user not shown) | |||
Line 22: | 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]. | var decade = vals[i].Decade; | ||
if (!pages.hasOwnProperty(decade)) { | if (!pages.hasOwnProperty(decade)) { | ||
pages[decade] = []; | pages[decade] = []; | ||
} | } | ||
pages[decade].push({"year": vals[i]. | 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; | var curCentury = 0, cText = "", cTotal; | ||
for (var prop in pages) { | for (var prop in pages) { | ||
Line 49: | Line 36: | ||
if (curCentury !== 0) { | if (curCentury !== 0) { | ||
var cntStr = curCentury + (curCentury !== "21" ? "th" : "st") + " Cent."; | var cntStr = curCentury + (curCentury !== "21" ? "th" : "st") + " Cent."; | ||
var cHead = "<div class=' | var cHead = "<div class='tlnCnt' id='c" + curCentury + "'><div>" + cntStr + " (" + cTotal + ")</div>"; | ||
pText += cHead + "<div>" + cText + "</div></div>"; | pText += cHead + "<div>" + cText + "</div></div>"; | ||
} | } | ||
Line 59: | Line 46: | ||
cTotal += nPages; | cTotal += nPages; | ||
var decStr = prop + "–" + String((parseInt(prop) + 9)).substring(2) + " (" + nPages + ")"; | var decStr = prop + "–" + String((parseInt(prop) + 9)).substring(2) + " (" + nPages + ")"; | ||
cText += "<div class=' | 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++) { | ||
cText += "<li class=' | cText += "<li class='tlnItem'><span>" + pages[prop][i].page + "</span><div></div></li>"; | ||
} | } | ||
cText += "</ul></div>" | cText += "</ul></div>" | ||
Line 67: | Line 54: | ||
} | } | ||
var cntStr = curCentury + (curCentury !== "21" ? "th" : "st") + " Cent."; | var cntStr = curCentury + (curCentury !== "21" ? "th" : "st") + " Cent."; | ||
var cHead = "<div class=' | var cHead = "<div class='tlnCnt' id='c" + curCentury + "'><div>" + cntStr + " (" + cTotal + ")</div>"; | ||
pText += cHead + "<div>" + cText + "</div></div>"; | pText += cHead + "<div>" + cText + "</div></div>"; | ||
elem.innerHTML = pText; | elem.innerHTML = pText; | ||
var centuries = get("tline").getElementsByClassName(" | var centuries = get("tline").getElementsByClassName("tlnCnt"); | ||
var nCnts = centuries.length; | var nCnts = centuries.length; | ||
for (var i = 0; i < nCnts; i++) { | for (var i = 0; i < nCnts; i++) { | ||
initDiv(centuries[i]); | initDiv(centuries[i]); | ||
} | } | ||
var decades = get("tline").getElementsByClassName(" | 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(" | 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 211: | Line 197: | ||
"display": true, | "display": true, | ||
"fontSize": 28, | "fontSize": 28, | ||
"fontFamily": "' | "fontFamily": "'OpenSansCondensed-Light', Helvetica, Arial, sans-serif", | ||
"fontColor": '# | "fontColor": '#800000', | ||
"fontStyle": "bold", | "fontStyle": "bold", | ||
"padding": 20 | "padding": 20 | ||
Line 255: | Line 241: | ||
} | } | ||
for (var i = 0; i < nVals; i++) { | for (var i = 0; i < nVals; i++) { | ||
var cnt = valuesAr[i]. | var cnt = valuesAr[i].Century; | ||
var suffix = cnt != 21 ? "th" : "st"; | var suffix = cnt != 21 ? "th" : "st"; | ||
cnt += suffix; | cnt += suffix; | ||
Line 273: | Line 259: | ||
bars[String(i)] = 0; | bars[String(i)] = 0; | ||
} | } | ||
for (var i = 0; i < nVals; i++) { | for (var i = 0; i < nVals; i++) { | ||
var cnt = valuesAr[i]. | var cnt = valuesAr[i].Decade; | ||
bars[String(cnt)] += 1; | bars[String(cnt)] += 1; | ||
if (bars[cnt] > maxBar) { | if (bars[cnt] > maxBar) { | ||
Line 301: | Line 286: | ||
} | } | ||
if (lbl === "Status") { | if (lbl === "Status") { | ||
cColrs[1] = "# | cColrs[1] = "#800000"; | ||
} | } | ||
var chrt = new Chart( get(cvsId), { | var chrt = new Chart( get(cvsId), { | ||
Line 345: | Line 330: | ||
function prepareItemCard(event) { | function prepareItemCard(event) { | ||
var t = event.target; | var t = event.target; | ||
if (t.tagName != "A") { | if (t.tagName != "A") { | ||
var tc = event.currentTarget; | var tc = event.currentTarget; | ||
var item = tc.firstChild.innerHTML; | var item = tc.firstChild.innerHTML; | ||
var card = tc.firstChild.nextSibling; | var card = tc.firstChild.nextSibling; | ||
if (card.innerHTML == "") { | if (card.innerHTML == "") { | ||
item = encodeURIComponent(item); | item = encodeURIComponent(item); | ||
var qry = " | 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 370: | Line 352: | ||
res = res.query.results; | res = res.query.results; | ||
res = res[Object.keys(res)[0]]; | res = res[Object.keys(res)[0]]; | ||
var page = res.fulltext; | var page = res.fulltext; | ||
var author = res.printouts. | var author = res.printouts.Author[0]; | ||
var title = res.printouts. | var title = res.printouts.Title[0]; | ||
var decade = res.printouts. | 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 382: | 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>< | txt += "<tr><th>Link</th><td><a href='/w/index.php/" + page + "'>" + page + "</a></td></tr>"; | ||
txt += "<tr>< | txt += "<tr><th>Year</th><td>" + res.printouts.Year[0] + "</td></tr>"; | ||
if (typeof author !== "undefined") { | if (typeof author !== "undefined") { | ||
txt += "<tr>< | txt += "<tr><th>Author</th><td>" + author + "</td></tr>"; | ||
txt += "<tr>< | txt += "<tr><th>Title</th><td>" + res.printouts.Title[0] + "</td></tr>"; | ||
} | } | ||
txt += "<tr>< | txt += "<tr><th>Topic</th><td>" + res.printouts.About[0] + "</td></tr>"; | ||
txt += "<tr>< | txt += "<tr><th>Decade</th><td>" + decade + "</td></tr>"; | ||
txt += "<tr>< | txt += "<tr><th>Century</th><td>" + res.printouts.Century[0] + "</td></tr></table>"; | ||
card.innerHTML = txt; | card.innerHTML = txt; | ||
break; | break; | ||
Line 421: | Line 402: | ||
var script = document.createElement('script'); | var script = document.createElement('script'); | ||
script.type = 'text/javascript'; | script.type = 'text/javascript'; | ||
script.src = " | 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.