From b3473be89ae99720103f4382512590f34c584c5e Mon Sep 17 00:00:00 2001
From: Eduard Urbach <e.urbach@gmail.com>
Date: Mon, 16 Apr 2018 23:01:34 +0200
Subject: [PATCH] Started working on user map

---
 pages/index.go          |  1 +
 pages/users/map.go      | 11 +++++++++++
 pages/users/map.pixy    |  8 ++++++++
 pages/users/map.scarlet |  3 +++
 pages/users/users.pixy  |  1 +
 scripts/Actions/Map.ts  | 35 +++++++++++++++++++++++++++++++++++
 6 files changed, 59 insertions(+)
 create mode 100644 pages/users/map.go
 create mode 100644 pages/users/map.pixy
 create mode 100644 pages/users/map.scarlet
 create mode 100644 scripts/Actions/Map.ts

diff --git a/pages/index.go b/pages/index.go
index 2dd1b6e6..68108174 100644
--- a/pages/index.go
+++ b/pages/index.go
@@ -104,6 +104,7 @@ func Configure(app *aero.Application) {
 
 	// User lists
 	l.Page("/users", users.Active)
+	l.Page("/users/map", users.Map)
 	l.Page("/users/noavatar", users.ActiveNoAvatar)
 	l.Page("/users/games/osu", users.Osu)
 	l.Page("/users/games/overwatch", users.Overwatch)
diff --git a/pages/users/map.go b/pages/users/map.go
new file mode 100644
index 00000000..f660db8e
--- /dev/null
+++ b/pages/users/map.go
@@ -0,0 +1,11 @@
+package users
+
+import (
+	"github.com/aerogo/aero"
+	"github.com/animenotifier/notify.moe/components"
+)
+
+// Map shows a map of all users.
+func Map(ctx *aero.Context) string {
+	return ctx.HTML(components.UserMap(ctx.URI()))
+}
diff --git a/pages/users/map.pixy b/pages/users/map.pixy
new file mode 100644
index 00000000..3951293f
--- /dev/null
+++ b/pages/users/map.pixy
@@ -0,0 +1,8 @@
+component UserMap(url string)
+	UsersTabs(url)
+	h1 Map
+
+	.buttons
+		button.action(data-action="showUserMap", data-trigger="click") Show
+	
+	#user-map
\ No newline at end of file
diff --git a/pages/users/map.scarlet b/pages/users/map.scarlet
new file mode 100644
index 00000000..c3d4f394
--- /dev/null
+++ b/pages/users/map.scarlet
@@ -0,0 +1,3 @@
+// #user-map
+// 	width 100%
+// 	height 600px
\ No newline at end of file
diff --git a/pages/users/users.pixy b/pages/users/users.pixy
index 5af4b0e5..ac465752 100644
--- a/pages/users/users.pixy
+++ b/pages/users/users.pixy
@@ -47,6 +47,7 @@ component UsersTabs(url string)
 		Tab("Editors", "pencil", "/users/editors")
 		Tab("Supporters", "heart", "/users/pro")
 		Tab("Staff", "user-secret", "/users/staff")
+		//- Tab("Map", "map", "/users/map")
 	
 	if strings.Contains(url, "/users/games")
 		.tabs
diff --git a/scripts/Actions/Map.ts b/scripts/Actions/Map.ts
new file mode 100644
index 00000000..d4ace5d7
--- /dev/null
+++ b/scripts/Actions/Map.ts
@@ -0,0 +1,35 @@
+// import AnimeNotifier from "../AnimeNotifier"
+
+// // User map
+// export function showUserMap(arn: AnimeNotifier, button: HTMLElement) {
+// 	let script = document.createElement("script")
+// 	script.src = "https://www.gstatic.com/charts/loader.js"
+// 	script.onload = () => {
+// 		let google = window["google"]
+// 		google.charts.load("current", {
+// 			"packages": ["geochart"],
+// 			"mapsApiKey": ""
+// 		})
+// 		google.charts.setOnLoadCallback(drawUserMap)
+// 	}
+
+// 	document.head.appendChild(script)
+// }
+
+// function drawUserMap() {
+// 	let data = window["google"].visualization.arrayToDataTable([
+// 		["Country", "Popularity"],
+// 		["Germany", 200],
+// 		["United States", 300],
+// 		["Brazil", 400],
+// 		["Canada", 500],
+// 		["France", 600],
+// 		["RU", 700]
+// 	])
+
+// 	let options = {}
+// 	let element = document.getElementById("user-map")
+// 	let chart = new window["google"].visualization.GeoChart(element)
+// 	console.log(element, data)
+// 	chart.draw(data, options)
+// }
\ No newline at end of file