{{ if .Params.Cantorpreisträger }}
diff --git a/static/plugins/wordcloud/wordcloud2.js b/static/plugins/wordcloud/wordcloud2.js
new file mode 100644
index 00000000..c4a607bd
--- /dev/null
+++ b/static/plugins/wordcloud/wordcloud2.js
@@ -0,0 +1,1241 @@
+/*!
+ * wordcloud2.js
+ * http://timdream.org/wordcloud2.js/
+ *
+ * Copyright 2011 - 2019 Tim Guan-tin Chien and contributors.
+ * Released under the MIT license
+ */
+
+'use strict'
+
+// setImmediate
+if (!window.setImmediate) {
+ window.setImmediate = (function setupSetImmediate () {
+ return window.msSetImmediate ||
+ window.webkitSetImmediate ||
+ window.mozSetImmediate ||
+ window.oSetImmediate ||
+ (function setupSetZeroTimeout () {
+ if (!window.postMessage || !window.addEventListener) {
+ return null
+ }
+
+ var callbacks = [undefined]
+ var message = 'zero-timeout-message'
+
+ // Like setTimeout, but only takes a function argument. There's
+ // no time argument (always zero) and no arguments (you have to
+ // use a closure).
+ var setZeroTimeout = function setZeroTimeout (callback) {
+ var id = callbacks.length
+ callbacks.push(callback)
+ window.postMessage(message + id.toString(36), '*')
+
+ return id
+ }
+
+ window.addEventListener('message', function setZeroTimeoutMessage (evt) {
+ // Skipping checking event source, retarded IE confused this window
+ // object with another in the presence of iframe
+ if (typeof evt.data !== 'string' ||
+ evt.data.substr(0, message.length) !== message/* ||
+ evt.source !== window */) {
+ return
+ }
+
+ evt.stopImmediatePropagation()
+
+ var id = parseInt(evt.data.substr(message.length), 36)
+ if (!callbacks[id]) {
+ return
+ }
+
+ callbacks[id]()
+ callbacks[id] = undefined
+ }, true)
+
+ /* specify clearImmediate() here since we need the scope */
+ window.clearImmediate = function clearZeroTimeout (id) {
+ if (!callbacks[id]) {
+ return
+ }
+
+ callbacks[id] = undefined
+ }
+
+ return setZeroTimeout
+ })() ||
+ // fallback
+ function setImmediateFallback (fn) {
+ window.setTimeout(fn, 0)
+ }
+ })()
+}
+
+if (!window.clearImmediate) {
+ window.clearImmediate = (function setupClearImmediate () {
+ return window.msClearImmediate ||
+ window.webkitClearImmediate ||
+ window.mozClearImmediate ||
+ window.oClearImmediate ||
+ // "clearZeroTimeout" is implement on the previous block ||
+ // fallback
+ function clearImmediateFallback (timer) {
+ window.clearTimeout(timer)
+ }
+ })()
+}
+
+(function (global) {
+ // Check if WordCloud can run on this browser
+ var isSupported = (function isSupported () {
+ var canvas = document.createElement('canvas')
+ if (!canvas || !canvas.getContext) {
+ return false
+ }
+
+ var ctx = canvas.getContext('2d')
+ if (!ctx) {
+ return false
+ }
+ if (!ctx.getImageData) {
+ return false
+ }
+ if (!ctx.fillText) {
+ return false
+ }
+
+ if (!Array.prototype.some) {
+ return false
+ }
+ if (!Array.prototype.push) {
+ return false
+ }
+
+ return true
+ }())
+
+ // Find out if the browser impose minium font size by
+ // drawing small texts on a canvas and measure it's width.
+ var minFontSize = (function getMinFontSize () {
+ if (!isSupported) {
+ return
+ }
+
+ var ctx = document.createElement('canvas').getContext('2d')
+
+ // start from 20
+ var size = 20
+
+ // two sizes to measure
+ var hanWidth, mWidth
+
+ while (size) {
+ ctx.font = size.toString(10) + 'px sans-serif'
+ if ((ctx.measureText('\uFF37').width === hanWidth) &&
+ (ctx.measureText('m').width) === mWidth) {
+ return (size + 1)
+ }
+
+ hanWidth = ctx.measureText('\uFF37').width
+ mWidth = ctx.measureText('m').width
+
+ size--
+ }
+
+ return 0
+ })()
+
+ var getItemExtraData = function (item) {
+ if (Array.isArray(item)) {
+ var itemCopy = item.slice()
+ // remove data we already have (word and weight)
+ itemCopy.splice(0, 2)
+ return itemCopy
+ } else {
+ return []
+ }
+ }
+
+ // Based on http://jsfromhell.com/array/shuffle
+ var shuffleArray = function shuffleArray (arr) {
+ for (var j, x, i = arr.length; i;) {
+ j = Math.floor(Math.random() * i)
+ x = arr[--i]
+ arr[i] = arr[j]
+ arr[j] = x
+ }
+ return arr
+ }
+
+ var timer = {};
+ var WordCloud = function WordCloud (elements, options) {
+ if (!isSupported) {
+ return
+ }
+
+ var timerId = Math.floor(Math.random() * Date.now())
+
+ if (!Array.isArray(elements)) {
+ elements = [elements]
+ }
+
+ elements.forEach(function (el, i) {
+ if (typeof el === 'string') {
+ elements[i] = document.getElementById(el)
+ if (!elements[i]) {
+ throw new Error('The element id specified is not found.')
+ }
+ } else if (!el.tagName && !el.appendChild) {
+ throw new Error('You must pass valid HTML elements, or ID of the element.')
+ }
+ })
+
+ /* Default values to be overwritten by options object */
+ var settings = {
+ list: [],
+ fontFamily: '"Trebuchet MS", "Heiti TC", "微軟正黑體", ' +
+ '"Arial Unicode MS", "Droid Fallback Sans", sans-serif',
+ fontWeight: 'normal',
+ color: 'random-dark',
+ minSize: 0, // 0 to disable
+ weightFactor: 1,
+ clearCanvas: true,
+ backgroundColor: '#fff', // opaque white = rgba(255, 255, 255, 1)
+
+ gridSize: 8,
+ drawOutOfBound: false,
+ shrinkToFit: false,
+ origin: null,
+
+ drawMask: false,
+ maskColor: 'rgba(255,0,0,0.3)',
+ maskGapWidth: 0.3,
+
+ wait: 0,
+ abortThreshold: 0, // disabled
+ abort: function noop () {},
+
+ minRotation: -Math.PI / 2,
+ maxRotation: Math.PI / 2,
+ rotationSteps: 0,
+
+ shuffle: true,
+ rotateRatio: 0.1,
+
+ shape: 'circle',
+ ellipticity: 0.65,
+
+ classes: null,
+
+ hover: null,
+ click: null
+ }
+
+ if (options) {
+ for (var key in options) {
+ if (key in settings) {
+ settings[key] = options[key]
+ }
+ }
+ }
+
+ /* Convert weightFactor into a function */
+ if (typeof settings.weightFactor !== 'function') {
+ var factor = settings.weightFactor
+ settings.weightFactor = function weightFactor (pt) {
+ return pt * factor // in px
+ }
+ }
+
+ /* Convert shape into a function */
+ if (typeof settings.shape !== 'function') {
+ switch (settings.shape) {
+ case 'circle':
+ /* falls through */
+ default:
+ // 'circle' is the default and a shortcut in the code loop.
+ settings.shape = 'circle'
+ break
+
+ case 'cardioid':
+ settings.shape = function shapeCardioid (theta) {
+ return 1 - Math.sin(theta)
+ }
+ break
+
+ /*
+ To work out an X-gon, one has to calculate "m",
+ where 1/(cos(2*PI/X)+m*sin(2*PI/X)) = 1/(cos(0)+m*sin(0))
+ http://www.wolframalpha.com/input/?i=1%2F%28cos%282*PI%2FX%29%2Bm*sin%28
+ 2*PI%2FX%29%29+%3D+1%2F%28cos%280%29%2Bm*sin%280%29%29
+ Copy the solution into polar equation r = 1/(cos(t') + m*sin(t'))
+ where t' equals to mod(t, 2PI/X)
+ */
+
+ case 'diamond':
+ // http://www.wolframalpha.com/input/?i=plot+r+%3D+1%2F%28cos%28mod+
+ // %28t%2C+PI%2F2%29%29%2Bsin%28mod+%28t%2C+PI%2F2%29%29%29%2C+t+%3D
+ // +0+..+2*PI
+ settings.shape = function shapeSquare (theta) {
+ var thetaPrime = theta % (2 * Math.PI / 4)
+ return 1 / (Math.cos(thetaPrime) + Math.sin(thetaPrime))
+ }
+ break
+
+ case 'square':
+ // http://www.wolframalpha.com/input/?i=plot+r+%3D+min(1%2Fabs(cos(t
+ // )),1%2Fabs(sin(t)))),+t+%3D+0+..+2*PI
+ settings.shape = function shapeSquare (theta) {
+ return Math.min(
+ 1 / Math.abs(Math.cos(theta)),
+ 1 / Math.abs(Math.sin(theta))
+ )
+ }
+ break
+
+ case 'triangle-forward':
+ // http://www.wolframalpha.com/input/?i=plot+r+%3D+1%2F%28cos%28mod+
+ // %28t%2C+2*PI%2F3%29%29%2Bsqrt%283%29sin%28mod+%28t%2C+2*PI%2F3%29
+ // %29%29%2C+t+%3D+0+..+2*PI
+ settings.shape = function shapeTriangle (theta) {
+ var thetaPrime = theta % (2 * Math.PI / 3)
+ return 1 / (Math.cos(thetaPrime) +
+ Math.sqrt(3) * Math.sin(thetaPrime))
+ }
+ break
+
+ case 'triangle':
+ case 'triangle-upright':
+ settings.shape = function shapeTriangle (theta) {
+ var thetaPrime = (theta + Math.PI * 3 / 2) % (2 * Math.PI / 3)
+ return 1 / (Math.cos(thetaPrime) +
+ Math.sqrt(3) * Math.sin(thetaPrime))
+ }
+ break
+
+ case 'pentagon':
+ settings.shape = function shapePentagon (theta) {
+ var thetaPrime = (theta + 0.955) % (2 * Math.PI / 5)
+ return 1 / (Math.cos(thetaPrime) +
+ 0.726543 * Math.sin(thetaPrime))
+ }
+ break
+
+ case 'star':
+ settings.shape = function shapeStar (theta) {
+ var thetaPrime = (theta + 0.955) % (2 * Math.PI / 10)
+ if ((theta + 0.955) % (2 * Math.PI / 5) - (2 * Math.PI / 10) >= 0) {
+ return 1 / (Math.cos((2 * Math.PI / 10) - thetaPrime) +
+ 3.07768 * Math.sin((2 * Math.PI / 10) - thetaPrime))
+ } else {
+ return 1 / (Math.cos(thetaPrime) +
+ 3.07768 * Math.sin(thetaPrime))
+ }
+ }
+ break
+ }
+ }
+
+ /* Make sure gridSize is a whole number and is not smaller than 4px */
+ settings.gridSize = Math.max(Math.floor(settings.gridSize), 4)
+
+ /* shorthand */
+ var g = settings.gridSize
+ var maskRectWidth = g - settings.maskGapWidth
+
+ /* normalize rotation settings */
+ var rotationRange = Math.abs(settings.maxRotation - settings.minRotation)
+ var rotationSteps = Math.abs(Math.floor(settings.rotationSteps))
+ var minRotation = Math.min(settings.maxRotation, settings.minRotation)
+
+ /* information/object available to all functions, set when start() */
+ var grid, // 2d array containing filling information
+ ngx, ngy, // width and height of the grid
+ center, // position of the center of the cloud
+ maxRadius
+
+ /* timestamp for measuring each putWord() action */
+ var escapeTime
+
+ /* function for getting the color of the text */
+ var getTextColor
+ function randomHslColor (min, max) {
+ return 'hsl(' +
+ (Math.random() * 360).toFixed() + ',' +
+ (Math.random() * 30 + 70).toFixed() + '%,' +
+ (Math.random() * (max - min) + min).toFixed() + '%)'
+ }
+ switch (settings.color) {
+ case 'random-dark':
+ getTextColor = function getRandomDarkColor () {
+ return randomHslColor(10, 50)
+ }
+ break
+
+ case 'random-light':
+ getTextColor = function getRandomLightColor () {
+ return randomHslColor(50, 90)
+ }
+ break
+
+ default:
+ if (typeof settings.color === 'function') {
+ getTextColor = settings.color
+ }
+ break
+ }
+
+ /* function for getting the font-weight of the text */
+ var getTextFontWeight
+ if (typeof settings.fontWeight === 'function') {
+ getTextFontWeight = settings.fontWeight
+ }
+
+ /* function for getting the classes of the text */
+ var getTextClasses = null
+ if (typeof settings.classes === 'function') {
+ getTextClasses = settings.classes
+ }
+
+ /* Interactive */
+ var interactive = false
+ var infoGrid = []
+ var hovered
+
+ var getInfoGridFromMouseTouchEvent =
+ function getInfoGridFromMouseTouchEvent (evt) {
+ var canvas = evt.currentTarget
+ var rect = canvas.getBoundingClientRect()
+ var clientX
+ var clientY
+ /** Detect if touches are available */
+ if (evt.touches) {
+ clientX = evt.touches[0].clientX
+ clientY = evt.touches[0].clientY
+ } else {
+ clientX = evt.clientX
+ clientY = evt.clientY
+ }
+ var eventX = clientX - rect.left
+ var eventY = clientY - rect.top
+
+ var x = Math.floor(eventX * ((canvas.width / rect.width) || 1) / g)
+ var y = Math.floor(eventY * ((canvas.height / rect.height) || 1) / g)
+
+ if (!infoGrid[x]) {
+ return null
+ }
+
+ return infoGrid[x][y]
+ }
+
+ var wordcloudhover = function wordcloudhover (evt) {
+ var info = getInfoGridFromMouseTouchEvent(evt)
+
+ if (hovered === info) {
+ return
+ }
+
+ hovered = info
+ if (!info) {
+ settings.hover(undefined, undefined, evt)
+
+ return
+ }
+
+ settings.hover(info.item, info.dimension, evt)
+ }
+
+ var wordcloudclick = function wordcloudclick (evt) {
+ var info = getInfoGridFromMouseTouchEvent(evt)
+ if (!info) {
+ return
+ }
+
+ settings.click(info.item, info.dimension, evt)
+ evt.preventDefault()
+ }
+
+ /* Get points on the grid for a given radius away from the center */
+ var pointsAtRadius = []
+ var getPointsAtRadius = function getPointsAtRadius (radius) {
+ if (pointsAtRadius[radius]) {
+ return pointsAtRadius[radius]
+ }
+
+ // Look for these number of points on each radius
+ var T = radius * 8
+
+ // Getting all the points at this radius
+ var t = T
+ var points = []
+
+ if (radius === 0) {
+ points.push([center[0], center[1], 0])
+ }
+
+ while (t--) {
+ // distort the radius to put the cloud in shape
+ var rx = 1
+ if (settings.shape !== 'circle') {
+ rx = settings.shape(t / T * 2 * Math.PI) // 0 to 1
+ }
+
+ // Push [x, y, t] t is used solely for getTextColor()
+ points.push([
+ center[0] + radius * rx * Math.cos(-t / T * 2 * Math.PI),
+ center[1] + radius * rx * Math.sin(-t / T * 2 * Math.PI) *
+ settings.ellipticity,
+ t / T * 2 * Math.PI])
+ }
+
+ pointsAtRadius[radius] = points
+ return points
+ }
+
+ /* Return true if we had spent too much time */
+ var exceedTime = function exceedTime () {
+ return ((settings.abortThreshold > 0) &&
+ ((new Date()).getTime() - escapeTime > settings.abortThreshold))
+ }
+
+ /* Get the deg of rotation according to settings, and luck. */
+ var getRotateDeg = function getRotateDeg () {
+ if (settings.rotateRatio === 0) {
+ return 0
+ }
+
+ if (Math.random() > settings.rotateRatio) {
+ return 0
+ }
+
+ if (rotationRange === 0) {
+ return minRotation
+ }
+
+ if (rotationSteps > 0) {
+ // Min rotation + zero or more steps * span of one step
+ return minRotation +
+ Math.floor(Math.random() * rotationSteps) *
+ rotationRange / (rotationSteps - 1)
+ } else {
+ return minRotation + Math.random() * rotationRange
+ }
+ }
+
+ var getTextInfo = function getTextInfo (word, weight, rotateDeg, extraDataArray) {
+ // calculate the acutal font size
+ // fontSize === 0 means weightFactor function wants the text skipped,
+ // and size < minSize means we cannot draw the text.
+ var debug = false
+ var fontSize = settings.weightFactor(weight)
+ if (fontSize <= settings.minSize) {
+ return false
+ }
+
+ // Scale factor here is to make sure fillText is not limited by
+ // the minium font size set by browser.
+ // It will always be 1 or 2n.
+ var mu = 1
+ if (fontSize < minFontSize) {
+ mu = (function calculateScaleFactor () {
+ var mu = 2
+ while (mu * fontSize < minFontSize) {
+ mu += 2
+ }
+ return mu
+ })()
+ }
+
+ // Get fontWeight that will be used to set fctx.font
+ var fontWeight
+ if (getTextFontWeight) {
+ fontWeight = getTextFontWeight(word, weight, fontSize, extraDataArray)
+ } else {
+ fontWeight = settings.fontWeight
+ }
+
+ var fcanvas = document.createElement('canvas')
+ var fctx = fcanvas.getContext('2d', { willReadFrequently: true })
+
+ fctx.font = fontWeight + ' ' +
+ (fontSize * mu).toString(10) + 'px ' + settings.fontFamily
+
+ // Estimate the dimension of the text with measureText().
+ var fw = fctx.measureText(word).width / mu
+ var fh = Math.max(fontSize * mu,
+ fctx.measureText('m').width,
+ fctx.measureText('\uFF37').width
+ ) / mu
+
+ // Create a boundary box that is larger than our estimates,
+ // so text don't get cut of (it sill might)
+ var boxWidth = fw + fh * 2
+ var boxHeight = fh * 3
+ var fgw = Math.ceil(boxWidth / g)
+ var fgh = Math.ceil(boxHeight / g)
+ boxWidth = fgw * g
+ boxHeight = fgh * g
+
+ // Calculate the proper offsets to make the text centered at
+ // the preferred position.
+
+ // This is simply half of the width.
+ var fillTextOffsetX = -fw / 2
+ // Instead of moving the box to the exact middle of the preferred
+ // position, for Y-offset we move 0.4 instead, so Latin alphabets look
+ // vertical centered.
+ var fillTextOffsetY = -fh * 0.4
+
+ // Calculate the actual dimension of the canvas, considering the rotation.
+ var cgh = Math.ceil((boxWidth * Math.abs(Math.sin(rotateDeg)) +
+ boxHeight * Math.abs(Math.cos(rotateDeg))) / g)
+ var cgw = Math.ceil((boxWidth * Math.abs(Math.cos(rotateDeg)) +
+ boxHeight * Math.abs(Math.sin(rotateDeg))) / g)
+ var width = cgw * g
+ var height = cgh * g
+
+ fcanvas.setAttribute('width', width)
+ fcanvas.setAttribute('height', height)
+
+ if (debug) {
+ // Attach fcanvas to the DOM
+ document.body.appendChild(fcanvas)
+ // Save it's state so that we could restore and draw the grid correctly.
+ fctx.save()
+ }
+
+ // Scale the canvas with |mu|.
+ fctx.scale(1 / mu, 1 / mu)
+ fctx.translate(width * mu / 2, height * mu / 2)
+ fctx.rotate(-rotateDeg)
+
+ // Once the width/height is set, ctx info will be reset.
+ // Set it again here.
+ fctx.font = fontWeight + ' ' +
+ (fontSize * mu).toString(10) + 'px ' + settings.fontFamily
+
+ // Fill the text into the fcanvas.
+ // XXX: We cannot because textBaseline = 'top' here because
+ // Firefox and Chrome uses different default line-height for canvas.
+ // Please read https://bugzil.la/737852#c6.
+ // Here, we use textBaseline = 'middle' and draw the text at exactly
+ // 0.5 * fontSize lower.
+ fctx.fillStyle = '#000'
+ fctx.textBaseline = 'middle'
+ fctx.fillText(
+ word, fillTextOffsetX * mu,
+ (fillTextOffsetY + fontSize * 0.5) * mu
+ )
+
+ // Get the pixels of the text
+ var imageData = fctx.getImageData(0, 0, width, height).data
+
+ if (exceedTime()) {
+ return false
+ }
+
+ if (debug) {
+ // Draw the box of the original estimation
+ fctx.strokeRect(
+ fillTextOffsetX * mu,
+ fillTextOffsetY, fw * mu, fh * mu
+ )
+ fctx.restore()
+ }
+
+ // Read the pixels and save the information to the occupied array
+ var occupied = []
+ var gx = cgw
+ var gy, x, y
+ var bounds = [cgh / 2, cgw / 2, cgh / 2, cgw / 2]
+ while (gx--) {
+ gy = cgh
+ while (gy--) {
+ y = g
+ /* eslint no-labels: ["error", { "allowLoop": true }] */
+ singleGridLoop: while (y--) {
+ x = g
+ while (x--) {
+ if (imageData[((gy * g + y) * width +
+ (gx * g + x)) * 4 + 3]) {
+ occupied.push([gx, gy])
+
+ if (gx < bounds[3]) {
+ bounds[3] = gx
+ }
+ if (gx > bounds[1]) {
+ bounds[1] = gx
+ }
+ if (gy < bounds[0]) {
+ bounds[0] = gy
+ }
+ if (gy > bounds[2]) {
+ bounds[2] = gy
+ }
+
+ if (debug) {
+ fctx.fillStyle = 'rgba(255, 0, 0, 0.5)'
+ fctx.fillRect(gx * g, gy * g, g - 0.5, g - 0.5)
+ }
+ break singleGridLoop
+ }
+ }
+ }
+ if (debug) {
+ fctx.fillStyle = 'rgba(0, 0, 255, 0.5)'
+ fctx.fillRect(gx * g, gy * g, g - 0.5, g - 0.5)
+ }
+ }
+ }
+
+ if (debug) {
+ fctx.fillStyle = 'rgba(0, 255, 0, 0.5)'
+ fctx.fillRect(
+ bounds[3] * g,
+ bounds[0] * g,
+ (bounds[1] - bounds[3] + 1) * g,
+ (bounds[2] - bounds[0] + 1) * g
+ )
+ }
+
+ // Return information needed to create the text on the real canvas
+ return {
+ mu: mu,
+ occupied: occupied,
+ bounds: bounds,
+ gw: cgw,
+ gh: cgh,
+ fillTextOffsetX: fillTextOffsetX,
+ fillTextOffsetY: fillTextOffsetY,
+ fillTextWidth: fw,
+ fillTextHeight: fh,
+ fontSize: fontSize
+ }
+ }
+
+ /* Determine if there is room available in the given dimension */
+ var canFitText = function canFitText (gx, gy, gw, gh, occupied) {
+ // Go through the occupied points,
+ // return false if the space is not available.
+ var i = occupied.length
+ while (i--) {
+ var px = gx + occupied[i][0]
+ var py = gy + occupied[i][1]
+
+ if (px >= ngx || py >= ngy || px < 0 || py < 0) {
+ if (!settings.drawOutOfBound) {
+ return false
+ }
+ continue
+ }
+
+ if (!grid[px][py]) {
+ return false
+ }
+ }
+ return true
+ }
+
+ /* Actually draw the text on the grid */
+ var drawText = function drawText (gx, gy, info, word, weight, distance, theta, rotateDeg, attributes, extraDataArray) {
+ var fontSize = info.fontSize
+ var color
+ if (getTextColor) {
+ color = getTextColor(word, weight, fontSize, distance, theta, extraDataArray)
+ } else {
+ color = settings.color
+ }
+
+ // get fontWeight that will be used to set ctx.font and font style rule
+ var fontWeight
+ if (getTextFontWeight) {
+ fontWeight = getTextFontWeight(word, weight, fontSize, extraDataArray)
+ } else {
+ fontWeight = settings.fontWeight
+ }
+
+ var classes
+ if (getTextClasses) {
+ classes = getTextClasses(word, weight, fontSize, extraDataArray)
+ } else {
+ classes = settings.classes
+ }
+
+ elements.forEach(function (el) {
+ if (el.getContext) {
+ var ctx = el.getContext('2d')
+ var mu = info.mu
+
+ // Save the current state before messing it
+ ctx.save()
+ ctx.scale(1 / mu, 1 / mu)
+
+ ctx.font = fontWeight + ' ' +
+ (fontSize * mu).toString(10) + 'px ' + settings.fontFamily
+ ctx.fillStyle = color
+
+ // Translate the canvas position to the origin coordinate of where
+ // the text should be put.
+ ctx.translate(
+ (gx + info.gw / 2) * g * mu,
+ (gy + info.gh / 2) * g * mu
+ )
+
+ if (rotateDeg !== 0) {
+ ctx.rotate(-rotateDeg)
+ }
+
+ // Finally, fill the text.
+
+ // XXX: We cannot because textBaseline = 'top' here because
+ // Firefox and Chrome uses different default line-height for canvas.
+ // Please read https://bugzil.la/737852#c6.
+ // Here, we use textBaseline = 'middle' and draw the text at exactly
+ // 0.5 * fontSize lower.
+ ctx.textBaseline = 'middle'
+ ctx.fillText(
+ word, info.fillTextOffsetX * mu,
+ (info.fillTextOffsetY + fontSize * 0.5) * mu
+ )
+
+ // The below box is always matches how
s are positioned
+ /* ctx.strokeRect(info.fillTextOffsetX, info.fillTextOffsetY,
+ info.fillTextWidth, info.fillTextHeight) */
+
+ // Restore the state.
+ ctx.restore()
+ } else {
+ // drawText on DIV element
+ var span = document.createElement('span')
+ var transformRule = ''
+ transformRule = 'rotate(' + (-rotateDeg / Math.PI * 180) + 'deg) '
+ if (info.mu !== 1) {
+ transformRule +=
+ 'translateX(-' + (info.fillTextWidth / 4) + 'px) ' +
+ 'scale(' + (1 / info.mu) + ')'
+ }
+ var styleRules = {
+ position: 'absolute',
+ display: 'block',
+ font: fontWeight + ' ' +
+ (fontSize * info.mu) + 'px ' + settings.fontFamily,
+ left: ((gx + info.gw / 2) * g + info.fillTextOffsetX) + 'px',
+ top: ((gy + info.gh / 2) * g + info.fillTextOffsetY) + 'px',
+ width: info.fillTextWidth + 'px',
+ height: info.fillTextHeight + 'px',
+ lineHeight: fontSize + 'px',
+ whiteSpace: 'nowrap',
+ transform: transformRule,
+ webkitTransform: transformRule,
+ msTransform: transformRule,
+ transformOrigin: '50% 40%',
+ webkitTransformOrigin: '50% 40%',
+ msTransformOrigin: '50% 40%'
+ }
+ if (color) {
+ styleRules.color = color
+ }
+ span.textContent = word
+ for (var cssProp in styleRules) {
+ span.style[cssProp] = styleRules[cssProp]
+ }
+ if (attributes) {
+ for (var attribute in attributes) {
+ span.setAttribute(attribute, attributes[attribute])
+ }
+ }
+ if (classes) {
+ span.className += classes
+ }
+ el.appendChild(span)
+ }
+ })
+ }
+
+ /* Help function to updateGrid */
+ var fillGridAt = function fillGridAt (x, y, drawMask, dimension, item) {
+ if (x >= ngx || y >= ngy || x < 0 || y < 0) {
+ return
+ }
+
+ grid[x][y] = false
+
+ if (drawMask) {
+ var ctx = elements[0].getContext('2d')
+ ctx.fillRect(x * g, y * g, maskRectWidth, maskRectWidth)
+ }
+
+ if (interactive) {
+ infoGrid[x][y] = { item: item, dimension: dimension }
+ }
+ }
+
+ /* Update the filling information of the given space with occupied points.
+ Draw the mask on the canvas if necessary. */
+ var updateGrid = function updateGrid (gx, gy, gw, gh, info, item) {
+ var occupied = info.occupied
+ var drawMask = settings.drawMask
+ var ctx
+ if (drawMask) {
+ ctx = elements[0].getContext('2d')
+ ctx.save()
+ ctx.fillStyle = settings.maskColor
+ }
+
+ var dimension
+ if (interactive) {
+ var bounds = info.bounds
+ dimension = {
+ x: (gx + bounds[3]) * g,
+ y: (gy + bounds[0]) * g,
+ w: (bounds[1] - bounds[3] + 1) * g,
+ h: (bounds[2] - bounds[0] + 1) * g
+ }
+ }
+
+ var i = occupied.length
+ while (i--) {
+ var px = gx + occupied[i][0]
+ var py = gy + occupied[i][1]
+
+ if (px >= ngx || py >= ngy || px < 0 || py < 0) {
+ continue
+ }
+
+ fillGridAt(px, py, drawMask, dimension, item)
+ }
+
+ if (drawMask) {
+ ctx.restore()
+ }
+ }
+
+ /* putWord() processes each item on the list,
+ calculate it's size and determine it's position, and actually
+ put it on the canvas. */
+ var putWord = function putWord (item) {
+ var word, weight, attributes
+ if (Array.isArray(item)) {
+ word = item[0]
+ weight = item[1]
+ } else {
+ word = item.word
+ weight = item.weight
+ attributes = item.attributes
+ }
+ var rotateDeg = getRotateDeg()
+
+ var extraDataArray = getItemExtraData(item)
+
+ // get info needed to put the text onto the canvas
+ var info = getTextInfo(word, weight, rotateDeg, extraDataArray)
+
+ // not getting the info means we shouldn't be drawing this one.
+ if (!info) {
+ return false
+ }
+
+ if (exceedTime()) {
+ return false
+ }
+
+ // If drawOutOfBound is set to false,
+ // skip the loop if we have already know the bounding box of
+ // word is larger than the canvas.
+ if (!settings.drawOutOfBound && !settings.shrinkToFit) {
+ var bounds = info.bounds;
+ if ((bounds[1] - bounds[3] + 1) > ngx ||
+ (bounds[2] - bounds[0] + 1) > ngy) {
+ return false
+ }
+ }
+
+ // Determine the position to put the text by
+ // start looking for the nearest points
+ var r = maxRadius + 1
+
+ var tryToPutWordAtPoint = function (gxy) {
+ var gx = Math.floor(gxy[0] - info.gw / 2)
+ var gy = Math.floor(gxy[1] - info.gh / 2)
+ var gw = info.gw
+ var gh = info.gh
+
+ // If we cannot fit the text at this position, return false
+ // and go to the next position.
+ if (!canFitText(gx, gy, gw, gh, info.occupied)) {
+ return false
+ }
+
+ // Actually put the text on the canvas
+ drawText(gx, gy, info, word, weight,
+ (maxRadius - r), gxy[2], rotateDeg, attributes, extraDataArray)
+
+ // Mark the spaces on the grid as filled
+ updateGrid(gx, gy, gw, gh, info, item)
+
+ // Return true so some() will stop and also return true.
+ return true
+ }
+
+ while (r--) {
+ var points = getPointsAtRadius(maxRadius - r)
+
+ if (settings.shuffle) {
+ points = [].concat(points)
+ shuffleArray(points)
+ }
+
+ // Try to fit the words by looking at each point.
+ // array.some() will stop and return true
+ // when putWordAtPoint() returns true.
+ // If all the points returns false, array.some() returns false.
+ var drawn = points.some(tryToPutWordAtPoint)
+
+ if (drawn) {
+ // leave putWord() and return true
+ return true
+ }
+ }
+ if (settings.shrinkToFit) {
+ if (Array.isArray(item)) {
+ item[1] = item[1] * 3 / 4
+ } else {
+ item.weight = item.weight * 3 / 4
+ }
+ return putWord(item)
+ }
+ // we tried all distances but text won't fit, return false
+ return false
+ }
+
+ /* Send DOM event to all elements. Will stop sending event and return
+ if the previous one is canceled (for cancelable events). */
+ var sendEvent = function sendEvent (type, cancelable, details) {
+ if (cancelable) {
+ return !elements.some(function (el) {
+ var event = new CustomEvent(type, {
+ detail: details || {}
+ })
+ return !el.dispatchEvent(event)
+ }, this)
+ } else {
+ elements.forEach(function (el) {
+ var event = new CustomEvent(type, {
+ detail: details || {}
+ })
+ el.dispatchEvent(event)
+ }, this)
+ }
+ }
+
+ /* Start drawing on a canvas */
+ var start = function start () {
+ // For dimensions, clearCanvas etc.,
+ // we only care about the first element.
+ var canvas = elements[0]
+
+ if (canvas.getContext) {
+ ngx = Math.ceil(canvas.width / g)
+ ngy = Math.ceil(canvas.height / g)
+ } else {
+ var rect = canvas.getBoundingClientRect()
+ ngx = Math.ceil(rect.width / g)
+ ngy = Math.ceil(rect.height / g)
+ }
+
+ // Sending a wordcloudstart event which cause the previous loop to stop.
+ // Do nothing if the event is canceled.
+ if (!sendEvent('wordcloudstart', true)) {
+ return
+ }
+
+ // Determine the center of the word cloud
+ center = (settings.origin)
+ ? [settings.origin[0] / g, settings.origin[1] / g]
+ : [ngx / 2, ngy / 2]
+
+ // Maxium radius to look for space
+ maxRadius = Math.floor(Math.sqrt(ngx * ngx + ngy * ngy))
+
+ /* Clear the canvas only if the clearCanvas is set,
+ if not, update the grid to the current canvas state */
+ grid = []
+
+ var gx, gy, i
+ if (!canvas.getContext || settings.clearCanvas) {
+ elements.forEach(function (el) {
+ if (el.getContext) {
+ var ctx = el.getContext('2d')
+ ctx.fillStyle = settings.backgroundColor
+ ctx.clearRect(0, 0, ngx * (g + 1), ngy * (g + 1))
+ ctx.fillRect(0, 0, ngx * (g + 1), ngy * (g + 1))
+ } else {
+ el.textContent = ''
+ el.style.backgroundColor = settings.backgroundColor
+ el.style.position = 'relative'
+ }
+ })
+
+ /* fill the grid with empty state */
+ gx = ngx
+ while (gx--) {
+ grid[gx] = []
+ gy = ngy
+ while (gy--) {
+ grid[gx][gy] = true
+ }
+ }
+ } else {
+ /* Determine bgPixel by creating
+ another canvas and fill the specified background color. */
+ var bctx = document.createElement('canvas').getContext('2d')
+
+ bctx.fillStyle = settings.backgroundColor
+ bctx.fillRect(0, 0, 1, 1)
+ var bgPixel = bctx.getImageData(0, 0, 1, 1).data
+
+ /* Read back the pixels of the canvas we got to tell which part of the
+ canvas is empty.
+ (no clearCanvas only works with a canvas, not divs) */
+ var imageData =
+ canvas.getContext('2d').getImageData(0, 0, ngx * g, ngy * g).data
+
+ gx = ngx
+ var x, y
+ while (gx--) {
+ grid[gx] = []
+ gy = ngy
+ while (gy--) {
+ y = g
+ /* eslint no-labels: ["error", { "allowLoop": true }] */
+ singleGridLoop: while (y--) {
+ x = g
+ while (x--) {
+ i = 4
+ while (i--) {
+ if (imageData[((gy * g + y) * ngx * g +
+ (gx * g + x)) * 4 + i] !== bgPixel[i]) {
+ grid[gx][gy] = false
+ break singleGridLoop
+ }
+ }
+ }
+ }
+ if (grid[gx][gy] !== false) {
+ grid[gx][gy] = true
+ }
+ }
+ }
+
+ imageData = bctx = bgPixel = undefined
+ }
+
+ // fill the infoGrid with empty state if we need it
+ if (settings.hover || settings.click) {
+ interactive = true
+
+ /* fill the grid with empty state */
+ gx = ngx + 1
+ while (gx--) {
+ infoGrid[gx] = []
+ }
+
+ if (settings.hover) {
+ canvas.addEventListener('mousemove', wordcloudhover)
+ }
+
+ if (settings.click) {
+ canvas.addEventListener('click', wordcloudclick)
+ canvas.style.webkitTapHighlightColor = 'rgba(0, 0, 0, 0)'
+ }
+
+ canvas.addEventListener('wordcloudstart', function stopInteraction () {
+ canvas.removeEventListener('wordcloudstart', stopInteraction)
+ canvas.removeEventListener('mousemove', wordcloudhover)
+ canvas.removeEventListener('click', wordcloudclick)
+ hovered = undefined
+ })
+ }
+
+ i = 0
+ var loopingFunction, stoppingFunction
+ if (settings.wait !== 0) {
+ loopingFunction = window.setTimeout
+ stoppingFunction = window.clearTimeout
+ } else {
+ loopingFunction = window.setImmediate
+ stoppingFunction = window.clearImmediate
+ }
+
+ var addEventListener = function addEventListener (type, listener) {
+ elements.forEach(function (el) {
+ el.addEventListener(type, listener)
+ }, this)
+ }
+
+ var removeEventListener = function removeEventListener (type, listener) {
+ elements.forEach(function (el) {
+ el.removeEventListener(type, listener)
+ }, this)
+ }
+
+ var anotherWordCloudStart = function anotherWordCloudStart () {
+ removeEventListener('wordcloudstart', anotherWordCloudStart)
+ stoppingFunction(timer[timerId])
+ }
+
+ addEventListener('wordcloudstart', anotherWordCloudStart)
+ timer[timerId] = loopingFunction(function loop () {
+ if (i >= settings.list.length) {
+ stoppingFunction(timer[timerId])
+ sendEvent('wordcloudstop', false)
+ removeEventListener('wordcloudstart', anotherWordCloudStart)
+ delete timer[timerId];
+ return
+ }
+ escapeTime = (new Date()).getTime()
+ var drawn = putWord(settings.list[i])
+ var canceled = !sendEvent('wordclouddrawn', true, {
+ item: settings.list[i],
+ drawn: drawn
+ })
+ if (exceedTime() || canceled) {
+ stoppingFunction(timer[timerId])
+ settings.abort()
+ sendEvent('wordcloudabort', false)
+ sendEvent('wordcloudstop', false)
+ removeEventListener('wordcloudstart', anotherWordCloudStart)
+ delete timer[timerId]
+ return
+ }
+ i++
+ timer[timerId] = loopingFunction(loop, settings.wait)
+ }, settings.wait)
+ }
+
+ // All set, start the drawing
+ start()
+ }
+
+ WordCloud.isSupported = isSupported
+ WordCloud.minFontSize = minFontSize
+ WordCloud.stop = function stop () {
+ if (timer) {
+ for (var timerId in timer) {
+ window.clearImmediate(timer[timerId])
+ }
+ }
+ }
+
+ // Expose the library as an AMD module
+ if (typeof define === 'function' && define.amd) { // eslint-disable-line no-undef
+ global.WordCloud = WordCloud
+ define('wordcloud', [], function () { return WordCloud }) // eslint-disable-line no-undef
+ } else if (typeof module !== 'undefined' && module.exports) { // eslint-disable-line no-undef
+ module.exports = WordCloud // eslint-disable-line no-undef
+ } else {
+ global.WordCloud = WordCloud
+ }
+})(this) // jshint ignore:line