Skip to content

Commit

Permalink
Merge pull request #332 from HebaruSan/fix/chart
Browse files Browse the repository at this point in the history 
Mod stats chart fixes
  • Loading branch information
@HebaruSan
HebaruSan authored Nov 12, 2020
2 parents ae9beee + ac1afa2 commit 05ccf8d
Show file tree
Hide file tree
Showing 6 changed files with 167 additions and 3,410 deletions.
110 changes: 72 additions & 38 deletions frontend/coffee/stats.coffee
View file
Original file line number Diff line number Diff line change
@@ -1,50 +1,84 @@
Chart = require('chart.js')

window.activateStats = () ->
worker = new Worker("/static/statworker.js")
worker.addEventListener('message', (e) ->
switch e.data.action

when "downloads_ready"
new Chart(document.getElementById('downloads-over-time').getContext("2d")).Line({
labels : e.data.data.labels,
datasets : e.data.data.entries
},
{
animation: false
})
keyUI = document.getElementById('downloads-over-time-key')
for k in e.data.data.key
li = document.createElement('li')
keyColor = document.createElement('span')
keyText = document.createElement('span')
keyColor.className = 'key-color'
keyText.className = 'key-text'
keyColor.style.backgroundColor = k.color
keyText.textContent = k.name
li.appendChild(keyColor)
li.appendChild(keyText)
keyUI.appendChild(li)
new Chart(document.getElementById('downloads-over-time'),
type: 'line'
data:
labels: e.data.data.labels
datasets: e.data.data.entries
options:
legend:
fullWidth: true
position: 'bottom'
labels:
padding: 5
fontSize: 9
boxWidth: 12
scales:
yAxes: [
ticks:
min: 0
precision: 0
]
)

when "downloads_per_version_ready"
new Chart(document.getElementById('downloads-per-version').getContext('2d')).Bar({
labels: e.data.data.labels,
datasets: e.data.data.entries
},
{
animation: false
})
new Chart(document.getElementById('downloads-per-version'),
type: 'bar'
data:
labels: e.data.data.labels
datasets: e.data.data.entries
options:
legend:
display: false
scales:
yAxes: [
ticks:
min: 0
precision: 0
]
)

when "followers_ready"
new Chart(document.getElementById('followers-over-time').getContext("2d")).Line({
labels : e.data.data.labels,
datasets : e.data.data.entries
},
{
animation: false
})
new Chart(document.getElementById('followers-over-time'),
type: 'line'
data:
labels: e.data.data.labels
datasets: e.data.data.entries
options:
legend:
display: false
scales:
yAxes: [
ticks:
suggestedMin: 0
precision: 0
]
)

, false)
worker.postMessage({ action: "set_versions", data: window.versions })
worker.postMessage({ action: "set_timespan", data: window.thirty_days_ago })
worker.postMessage({ action: "process_downloads", data: window.download_stats })
worker.postMessage({ action: "process_downloads_per_version", data: window.downloads_per_version })
worker.postMessage({ action: "process_followers", data: window.follower_stats })
worker.postMessage(
action: "set_versions"
data: window.versions
)
worker.postMessage(
action: "set_timespan"
data: window.thirty_days_ago
)
worker.postMessage(
action: "process_downloads"
data: window.download_stats
)
worker.postMessage(
action: "process_downloads_per_version"
data: window.downloads_per_version
)
worker.postMessage(
action: "process_followers"
data: window.follower_stats
)
117 changes: 58 additions & 59 deletions frontend/coffee/statworker.coffee
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,27 @@
importScripts("/static/underscore.min.js")
months = ['Janurary', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
colors = [
['rgba(222,93,93,0.7)', 'rgba(179,74,74,1)'],
['rgba(93,222,93,0.7)', 'rgba(74,177,74,1)'],
['rgba(93,93,222,0.7)', 'rgba(74,74,177,1)'],
['rgba(222,158,93,0.7)', 'rgba(177,126,74,1)'],
['rgba(222,93,222,0.7)', 'rgba(177,74,177,1)'],
['rgba(222,222,93,0.7)', 'rgba(177,177,74,1)'],
['rgba(93,222,222,0.7)', 'rgba(74,177,177,1)']
]
months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
versions = null
thirty_days_ago = null

backgroundColor = [
'rgba(222,93,93,0.7)'
'rgba(93,222,93,0.7)'
'rgba(93,93,222,0.7)'
'rgba(222,158,93,0.7)'
'rgba(222,93,222,0.7)'
'rgba(222,222,93,0.7)'
'rgba(93,222,222,0.7)'
]
borderColor = [
'rgba(179,74,74,1)'
'rgba(74,177,74,1)'
'rgba(74,74,177,1)'
'rgba(177,126,74,1)'
'rgba(177,74,177,1)'
'rgba(177,177,74,1)'
'rgba(74,177,177,1)'
]

self.addEventListener('message', (e) ->
switch e.data.action
when "set_versions" then versions = e.data.data
Expand All @@ -24,13 +34,13 @@ self.addEventListener('message', (e) ->
processDownloads = (download_stats) ->
labels = []
entries = []
color = 0
key = []
for i in [0..30]
a = new Date(thirty_days_ago.getTime())
a.setDate(a.getDate() + i)
labels.push("#{months[a.getMonth()]} #{a.getDate()}")
for v in versions
color = 0
for v in versions.reverse()
data = []
for i in [0..30]
a = new Date(thirty_days_ago.getTime())
Expand All @@ -46,46 +56,41 @@ processDownloads = (download_stats) ->
, 0)
data.push(downloads)
if _.some(data, (d) -> d != 0)
entries.push({
fillColor: colors[color][0],
pointColor: colors[color][1],
pointStrokeColor: '#fff',
pointHighlightFill: colors[color][0],
pointHighlightStroke: '#fff',
entries.push(
label: v.name
data: data
})
key.push({ name: v.name, color: colors[color][0] })
color++
if color >= colors.length
color = 0
entries.reverse()
key.reverse()
postMessage({
action: "downloads_ready",
data: {
key: key,
entries: entries,
backgroundColor: backgroundColor[color % backgroundColor.length]
borderColor: borderColor[color % borderColor.length]
)
key.push(
name: v.names
)
++color
postMessage(
action: "downloads_ready"
data:
key: key
entries: entries
labels: labels
}
})
)

processDownloadsPerVersion = (downloads_per_version) ->
postMessage({
action: "downloads_per_version_ready",
data: {
labels: downloads_per_version.map((v) -> v[1]),
entries: [ {
fillColor: colors[4][0],
strokeColor: colors[4][1],
data: downloads_per_version.map((v) -> v[2])
} ]
}
})
postMessage(
action: "downloads_per_version_ready"
data:
labels: downloads_per_version.map((v) -> v[1])
entries: [
data: downloads_per_version.map((v) -> v[2]),
backgroundColor: downloads_per_version.map((v, i) ->
backgroundColor[i % backgroundColor.length])
borderColor: downloads_per_version.map((v, i) ->
borderColor[i % borderColor.length])
]
)

processFollowers = (follower_stats) ->
labels = []
entries = []
color = 0
for i in [0..30]
a = new Date(thirty_days_ago.getTime())
a.setDate(a.getDate() + i)
Expand All @@ -105,21 +110,15 @@ processFollowers = (follower_stats) ->
, 0)
data.push(delta)
if _.some(data, (d) -> d != 0)
entries.push({
fillColor: colors[color][0],
strokeColor: colors[color][1],
pointColor: colors[color][1],
pointStrokeColor: '#fff',
entries.push(
data: data
})
color++
if color >= colors.length
color = 0
backgroundColor: backgroundColor
borderColor: borderColor
)
entries.reverse()
postMessage({
action: "followers_ready",
data: {
entries: entries,
postMessage(
action: "followers_ready"
data:
entries: entries
labels: labels
}
})
)
35 changes: 32 additions & 3 deletions frontend/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion frontend/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,8 @@
"sass": "^1.22.9"
},
"dependencies": {
"dropzone": "^5.7.1"
"dropzone": "^5.7.1",
"chart.js": "^2.9.3"
},
"coffeelintConfig": {
"indentation": {
Expand Down
Loading

0 comments on commit 05ccf8d

Please sign in to comment.