Mercurial Hosting > linkmystyle
view src/analytics.html.luan @ 0:8f4df159f06b
start public repo
author | Franklin Schmidt <fschmidt@gmail.com> |
---|---|
date | Fri, 11 Jul 2025 20:57:49 -0600 |
parents | |
children |
line wrap: on
line source
local Luan = require "luan:Luan.luan" local error = Luan.error local Parsers = require "luan:Parsers.luan" local json_string = Parsers.json_string or error() local Io = require "luan:Io.luan" local Http = require "luan:http/Http.luan" local Shared = require "site:/lib/Shared.luan" local head = Shared.head or error() local body_header = Shared.body_header or error() local footer = Shared.footer or error() local compressed = Shared.compressed or error() local User = require "site:/lib/User.luan" local Reporting = require "site:/lib/Reporting.luan" local get_data = Reporting.get_data or error() local Logging = require "luan:logging/Logging.luan" local logger = Logging.logger "analytics_new.html" return function() local user = User.current_required() if user==nil then return end local user_name = user.name Io.stdout = Http.response.text_writer() %> <!doctype html> <html lang="en"> <head> <% head() %> <title>Link My Style</title> <style> h1 { text-align: center; margin-bottom: 0; } p[top] { text-align: center; } div[report] { max-width: 600px; margin-left: auto; margin-right: auto; margin-top: 20px; margin-bottom: 20px; } @media (max-width: 700px) { div[report] { max-width: 90%; } } </style> <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script> <script> <% do local data = get_data( "+type:visit +owner:"..user_name ) %> function initTraffic() { let options = { chart: { type: 'line' }, series: [{ name: 'Visitors', data: <%=json_string(data,compressed)%>, }], xaxis: { type: 'datetime' }, title: { text: 'Traffic' } }; let div = document.querySelector('div[report="traffic"]'); let chart = new ApexCharts( div, options ); chart.render(); } <% end_do do local data = get_data( "+type:page_view +owner:"..user_name, "value" ) %> function initPages() { let data = <%=json_string(data,compressed)%>; let options = { chart: { type: 'bar', height: barChartHeight(data.length) }, plotOptions: { bar: { horizontal: true } }, series: [{ name: 'Visitors', data: data, }], title: { text: 'Pages' } }; let div = document.querySelector('div[report="pages"]'); let chart = new ApexCharts( div, options ); chart.render(); } <% end_do do local data = get_data( "+type:link_click +owner:"..user_name, "value" ) %> function initClicks() { let data = <%=json_string(data,compressed)%>; let options = { chart: { type: 'bar', height: barChartHeight(data.length) }, plotOptions: { bar: { horizontal: true } }, series: [{ name: 'Clicks', data: data, }], title: { text: 'Clicks by page and link' } }; let div = document.querySelector('div[report="clicks"]'); let chart = new ApexCharts( div, options ); chart.render(); } <% end_do do local data = get_data( "+type:referrer +owner:"..user_name, "value" ) %> function initReferrers() { let data = <%=json_string(data,compressed)%>; let options = { chart: { type: 'bar', height: barChartHeight(data.length) }, plotOptions: { bar: { horizontal: true } }, series: [{ name: 'Visitors', data: data, }], title: { text: 'Referring Domains' } }; let div = document.querySelector('div[report="referrers"]'); let chart = new ApexCharts( div, options ); chart.render(); } <% end_do %> function init() { initTraffic(); initPages(); initClicks(); initReferrers(); } </script> </head> <body onload="init()"> <div full> <% body_header() %> <h1>Analytics</h1> <p top>For the last 30 days</p> <div report=traffic></div> <div report=pages></div> <div report=clicks></div> <div report=referrers></div> <% footer() %> </div> </body> </html> <% end