Brave advertisement

res/static/script/Toolbar.js

@@ -119,11 +119,11 @@ var Sharebar = {
 		}
 
 		if(this.visible){
-			document.getElementById("sharebar").style.left = "-112px";
+			document.getElementById("sharebar").style.left = "-7em";
 			document.getElementById("btnShare").classList.remove("button_highlight")
 			this.visible = false;
 		}else{
-			document.getElementById("sharebar").style.left = "120px";
+			document.getElementById("sharebar").style.left = "8em";
 			document.getElementById("btnShare").classList.add("button_highlight")
 			this.visible = true;
 		}

res/static/style/viewer.css

@@ -11,7 +11,7 @@ body{
 	position: absolute;
 	display: inline-block;
 	top: 0px;
-	left: 122px;
+	left: 8em;
 	right: 0px;
 	bottom: 0px;
 	min-height: 100px;
@@ -96,7 +96,7 @@ body{
 
 #toolbar {
 	position: absolute;
-	width: 120px;
+	width: 8em;
 	z-index: 52;
 	overflow: hidden;
 	float: left;
@@ -125,7 +125,7 @@ body{
 	position: absolute;
 	left: 0;
 	top: 0;
-	width: 120px;
+	width: 8em;
 	height: auto;
 }
 
@@ -158,7 +158,7 @@ body{
 #sponsors{
 	position: relative;
 	height: 600px;
-	width: 120px;
+	width: 8em;
 	margin: 0;
 	border: none;
 	z-index: 9;
@@ -170,8 +170,8 @@ body{
 
 #sharebar{
 	position: absolute;
-	width: 100px;
-	left: -120px;
+	width: 7em;
+	left: -8em;
 	bottom: 0;
 	top: 0;
 	overflow-y: scroll;
@@ -196,12 +196,12 @@ body{
 	opacity: 0;
 	transition: visibility 1s, opacity 1s, left 1s;
 	background-color: var(--background_color);
-	left: 142px;
-	right: 20px;
-	bottom: 20px;
-	top: 20px;
+	left: 9em;
+	right: 1em;
+	bottom: 1em;
+	top: 1em;
 	overflow-y: scroll;
-	padding: 10px;
+	padding: 1em;
 	box-sizing: border-box;
 	text-align: left;
 	box-shadow: var(--shadow_color) 0px 0px 50px;

res/template/file_viewer.html

@@ -53,35 +53,42 @@
 					<div id="stat_downloads_label" class="toolbar_label">Downloads</div>
 					<div id="stat_downloads" style="text-align: center;">N/A</div>
 
-					<a href="/" id="btnHome" class="button toolbar_button button_full_width">
+					<a href="/" id="btnHome" class="toolbar_button button_full_width button">
 						<img src="/res/img/pixeldrain_small.png" alt="Back to the Home page"/>
 						<span>Home</span>
 					</a>
-
 					<button id="btnDownload" class="toolbar_button button_full_width" onClick="Toolbar.download();">
 						<img src="/res/img/floppy_small.png" alt="Download this file"/>
 						<span>Download</span>
 					</button>
-
 					<button id="btnCopy" class="toolbar_button button_full_width" onClick="Toolbar.copyUrl();">
 						<img src="/res/img/clipboard_small.png" alt="Copy file URL to clipboard"/>
 						<span>Copy</span>
 					</button>
-
 					<button id="btnShare" class="toolbar_button button_full_width" onClick="Sharebar.toggle();">
 						<img src="/res/img/share_small.png" alt="Share this file on social media"/>
 						<span>Share</span>
 					</button>
-
 					<button id="btnDetails" class="toolbar_button button_full_width" onClick="DetailsWindow.toggle();">
 						<img src="/res/img/info_small.png" alt="Help"/>
 						<span>Details</span>
 					</button>
-
-					<iframe id='sponsors' data-aa='73974'
-						src='//ad.a-ads.com/73974?size=120x600&amp;background_color=000000&amp;text_color=eeeeee&amp;title_color=eeeeee&amp;link_color=9fcf6c&amp;link_hover_color=d2ffa1&amp;title_hover_color=d2ffa1'
-						scrolling='no' allowtransparency='true' seamless="seamless">
-					</iframe>
+					<br/><hr/>
+					<div id="brave_ref" style="text-align: center; padding: 2px;">
+						{{if ne (isBrave .UserAgent) true}}
+						Use the Brave web browser for a faster and safer web!<br/>
+						<a href="https://brave.com/pix009" id="btnBrave" class="button toolbar_button button_full_width button_highlight">
+							<img src="/res/img/brave_lion.png" alt="Brave lion"/>
+							<span>Get Brave</span>
+						</a>
+						<br/>
+						or <a href="https://medium.com/@Fornax/advertising-on-pixeldrain-a-more-honest-approach-d5e00e3f0c29">learn why pixeldrain supports Brave</a>
+						{{else}}
+						Thank you for using Brave! Please consider supporting pixeldrain with a tip
+						<img src="/res/img/bat_logo_color.png" style="height: 1em; width: 1em;" />
+						{{end}}
+					</div>
+					<br/>
 
 					<!-- This frame will load the download URL when a download button is pressed -->
 					<iframe id="download_frame" style="display: none; width: 1px; height: 1px;"></iframe>

webcontroller/template_data.go

@@ -16,6 +16,7 @@ import (
 type TemplateData struct {
 	Authenticated bool
 	Username      string
+	UserAgent     string
 	UserStyle     template.CSS
 	APIEndpoint   template.URL
 	PixelAPI      *pixelapi.PixelAPI
@@ -35,6 +36,7 @@ func (wc *WebController) newTemplateData(w http.ResponseWriter, r *http.Request)
 	var t = &TemplateData{
 		Authenticated: false,
 		Username:      "",
+		UserAgent:     r.UserAgent(),
 		UserStyle:     userStyle(r),
 		APIEndpoint:   template.URL(wc.conf.APIURLExternal),
 		URLQuery:      r.URL.Query(),

webcontroller/template_manager.go

@@ -6,6 +6,7 @@ import (
 	"os"
 	"path/filepath"
 	"strconv"
+	"strings"
 	"time"
 
 	"github.com/Fornaxian/log"
@@ -75,6 +76,7 @@ func (tm *TemplateManager) Get() *template.Template {
 func (tm *TemplateManager) funcMap() template.FuncMap {
 	return template.FuncMap{
 		"bgPattern": tm.bgPattern,
+		"isBrave":   tm.isBrave,
 		"debugMode": tm.debugMode,
 		"apiUrl":    tm.apiURL,
 		"pageNr":    tm.pageNr,
@@ -90,6 +92,9 @@ func (tm *TemplateManager) bgPattern() string {
 	}
 	return fmt.Sprintf("checker%d.png", now.UnixNano()%17)
 }
+func (tm *TemplateManager) isBrave(useragent string) bool {
+	return strings.Contains(useragent, "Brave")
+}
 func (tm *TemplateManager) debugMode() bool {
 	return tm.debugModeEnabled
 }