Add download captcha UI

res/static/script/Toolbar.js

@@ -49,19 +49,30 @@ var Toolbar = {
 				triggerDL();
 			}
 		}).fail(function(data){
-			console.log(data);
 			if(data.responseJSON.success === false) {
 				var popupDiv = document.getElementById("captcha_popup");
+				var popupTitle = document.getElementById("captcha_popup_title");
+				var popupContent = document.getElementById("captcha_popup_content");
+				var popupCaptcha = document.getElementById("captcha_popup_captcha");
 
 				if(data.responseJSON.value === "file_rate_limited_captcha_required") {
-					popupDiv.innerHTML = '<div class="highlight_light border_top border_bottom">Rate limiting enabled!</div>'+
-						data.responseJSON.message;
+					popupTitle.innerText = "Rate limiting enabled!";
+					popupContent.innerText = "This file is using a suspicious "+
+						"amount of bandwidth relative to its popularity. To "+
+						"continue downloading this file you will have to "+
+						"prove that you're a human first.";
 				}else if(data.responseJSON.value === "virus_detected_captcha_required"){
-					popupDiv.innerHTML = '<div class="highlight_light border_top border_bottom">Malware warning!</div>'+
-						data.responseJSON.message+
-						"<hr/>Malware type: " + data.responseJSON.extra;
+					popupTitle.innerText = "Malware warning!";
+					popupContent.innerText = "According to our scanning "+
+						"systems this file may contain a virus (type '"+
+						data.responseJSON.extra+"'). You can continue "+
+						"downloading this file at your own risk, but you will "+
+						"have to prove that you're a human first.";
 				}
 
+				// Load the recaptcha script with a load function
+				$.getScript("https://www.google.com/recaptcha/api.js?onload=loadCaptcha&render=explicit");
+
 				popupDiv.style.opacity = "1";
 				popupDiv.style.visibility = "visible";
 			}else{
@@ -135,6 +146,23 @@ function copyText(text) {
 	return success;
 }
 
+function loadCaptcha(){
+	grecaptcha.render("captcha_popup_captcha", {
+		sitekey: captchaKey,
+		theme: "dark",
+		callback: function(token){
+			document.getElementById("download_frame").src = "/api/file/" + Viewer.currentFile +
+				"?download&recaptcha_response="+token;
+	
+			setTimeout(function(){
+				var popupDiv = document.getElementById("captcha_popup");
+				popupDiv.style.opacity = "0";
+				popupDiv.style.visibility = "hidden";
+			}, 1000)
+		}
+	});
+}
+
 var DetailsWindow = {
 	visible:       false,
 	popupDiv:      document.getElementById("info_popup"),

res/static/style/viewer.css

@@ -214,6 +214,7 @@ body{
 	opacity: 0;
 	transition: visibility 1s, opacity 1s, left 1s;
 	background-color: var(--background_color);
+	border-color: var(--accent_color_dark_border); 
 	height: auto;
 	width: 500px;
 	max-width: 100%;
@@ -226,6 +227,9 @@ body{
 	box-shadow: var(--shadow_color) 0px 0px 50px;
 	z-index: 100;
 }
+#captcha_popup_captcha > div {
+	display: inline-block;
+}
 
 table {width: auto !important;}
 table > tbody > tr {border: none !important;}

res/template/file_viewer.html

@@ -166,7 +166,12 @@
 				<br/>
 			</span>
 		</div>
-		<div id="captcha_popup" class="captcha_popup"></div>
+		<div id="captcha_popup" class="captcha_popup border_bottom">
+			<div id="captcha_popup_title" class="highlight_light border_top border_bottom"></div>
+			<div id="captcha_popup_content"></div>
+			<br/>
+			<div id="captcha_popup_captcha" style="text-align: center;"></div>
+		</div>
 
 		<div id="filepreview">
 			<img src="/res/img/misc/loadthink.gif" style="margin-top: 20%; width: 200px; height: 200px;" />

webcontroller/file_viewer.go

@@ -54,7 +54,7 @@ func (wc *WebController) serveFileViewer(w http.ResponseWriter, r *http.Request,
 		templateData.Title = fmt.Sprintf("%d files in Pixeldrain", len(finfo))
 		templateData.Other = viewerData{
 			Type:       "list",
-			CaptchaKey: wc.captchaSiteKey,
+			CaptchaKey: wc.captchaKey(),
 			APIResponse: map[string]interface{}{
 				"data":          finfo,
 				"date_created":  "now",
@@ -67,7 +67,7 @@ func (wc *WebController) serveFileViewer(w http.ResponseWriter, r *http.Request,
 		templateData.Title = fmt.Sprintf("%s ~ Pixeldrain file", finfo[0].Name)
 		templateData.Other = viewerData{
 			Type:        "file",
-			CaptchaKey:  wc.captchaSiteKey,
+			CaptchaKey:  wc.captchaKey(),
 			APIResponse: finfo[0],
 		}
 	}

webcontroller/user_account.go

@@ -14,24 +14,7 @@ func (wc *WebController) serveRegister(
 	p httprouter.Params,
 ) {
 	var tpld = wc.newTemplateData(w, r)
-
-	// This only runs on the first request
-	if wc.captchaSiteKey == "" {
-		var api = pixelapi.New(wc.conf.APIURLInternal, "")
-		capt, err := api.GetRecaptcha()
-		if err != nil {
-			log.Error("Error getting recaptcha key: %s", err)
-			w.WriteHeader(http.StatusInternalServerError)
-			return
-		}
-		if capt.SiteKey == "" {
-			wc.captchaSiteKey = "none"
-		} else {
-			wc.captchaSiteKey = capt.SiteKey
-		}
-	}
-
-	tpld.Other = wc.captchaSiteKey
+	tpld.Other = wc.captchaKey()
 
 	err := wc.templates.Get().ExecuteTemplate(w, "register", tpld)
 	if err != nil {

webcontroller/web_controller.go

@@ -7,6 +7,7 @@ import (
 	"github.com/google/uuid"
 
 	"fornaxian.com/pixeldrain-web/init/conf"
+	"fornaxian.com/pixeldrain-web/pixelapi"
 	"github.com/Fornaxian/log"
 	"github.com/julienschmidt/httprouter"
 )
@@ -118,3 +119,22 @@ func (wc *WebController) getAPIKey(r *http.Request) (key string, err error) {
 	}
 	return "", errors.New("not a valid pixeldrain authentication cookie")
 }
+
+func (wc *WebController) captchaKey() string {
+	// This only runs on the first request
+	if wc.captchaSiteKey == "" {
+		var api = pixelapi.New(wc.conf.APIURLInternal, "")
+		capt, err := api.GetRecaptcha()
+		if err != nil {
+			log.Error("Error getting recaptcha key: %s", err)
+			return ""
+		}
+		if capt.SiteKey == "" {
+			wc.captchaSiteKey = "none"
+		} else {
+			wc.captchaSiteKey = capt.SiteKey
+		}
+	}
+
+	return wc.captchaSiteKey
+}