Merge pull request #207 from soulcramer/add_editor_tools_anime_edit_page

Add editor tools to the anime edit page

images/icons/annilist.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid"
+	 width="172" height="172" viewBox="0 0 172 172">
+	<path fill-rule="evenodd" fill="#02a9ff"
+		  d="M111.322,111.157 L111.322,41.029 C111.322,37.010 109.105,34.792 105.086,34.792 L91.365,34.792 C87.346,34.792 85.128,37.010 85.128,41.029 C85.128,41.029 85.128,56.337 85.128,74.333 C85.128,75.271 94.165,79.626 94.401,80.547 C101.286,107.449 95.897,128.980 89.370,129.985 C100.042,130.513 101.216,135.644 93.267,132.138 C94.483,117.784 99.228,117.812 112.869,131.610 C112.986,131.729 115.666,137.351 115.833,137.351 C131.170,137.351 148.050,137.351 148.050,137.351 C152.069,137.351 154.286,135.134 154.286,131.115 L154.286,117.394 C154.286,113.375 152.069,111.157 148.050,111.157 L111.322,111.157 Z"
+		  class="cls-1"/>
+	<path fill-rule="evenodd" fill="#fefefe"
+		  d="M54.365,34.792 L18.331,137.351 L46.327,137.351 L52.425,119.611 L82.915,119.611 L88.875,137.351 L116.732,137.351 L80.836,34.792 L54.365,34.792 ZM58.800,96.882 L67.531,68.470 L77.094,96.882 L58.800,96.882 Z"
+		  class="cls-2"/>
+</svg>

images/icons/google.svg

@@ -1 +1,13 @@
-<svg width="1792" height="1792" viewBox="0 0 1792 1792"><path d="M896 786h725q12 67 12 128 0 217-91 387.5t-259.5 266.5-386.5 96q-157 0-299-60.5t-245-163.5-163.5-245-60.5-299 60.5-299 163.5-245 245-163.5 299-60.5q300 0 515 201l-209 201q-123-119-306-119-129 0-238.5 65t-173.5 176.5-64 243.5 64 243.5 173.5 176.5 238.5 65q87 0 160-24t120-60 82-82 51.5-87 22.5-78h-436v-264z"/></svg>
+<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
+	<defs>
+		<path id="a"
+			  d="M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z"/>
+	</defs>
+	<clipPath id="b">
+		<use xlink:href="#a" overflow="visible"/>
+	</clipPath>
+	<path clip-path="url(#b)" fill="#FBBC05" d="M0 37V11l17 13z"/>
+	<path clip-path="url(#b)" fill="#EA4335" d="M0 11l17 13 7-6.1L48 14V0H0z"/>
+	<path clip-path="url(#b)" fill="#34A853" d="M0 37l30-23 7.9 1L48 0v48H0z"/>
+	<path clip-path="url(#b)" fill="#4285F4" d="M48 48L17 24l-4-3 35-10z"/>
+</svg>

images/icons/mal.svg

@@ -0,0 +1,15 @@
+<svg width="100%" height="100%" viewBox="0 0 48 48" version="1.1"
+	 xmlns="http://www.w3.org/2000/svg"
+	 style="fill-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
+	<g>
+		<path fill="#fff"
+			  d="M2.549,15.213l-0.004,15.261l3.988,-0.001l0,-9.297l3.429,4.216l3.65,-4.193l0.011,9.278l3.974,0.014l-0.001,-15.27l-3.957,0.002l-3.669,4.564l-3.337,-4.571l-4.084,-0.003Z"
+		/>
+		<path fill="#fff"
+			  d="M32.71,15.195c0,0 -3.979,-0.194 -5.496,0.001c-1.267,0.163 -2.544,0.537 -3.607,1.17c-1.062,0.634 -2.136,1.569 -2.768,2.629c-0.632,1.062 -0.87,1.674 -1.027,3.742c-0.058,0.765 -0.104,1.536 0.01,2.294c0.157,1.048 0.51,2.717 0.933,3.992c0.417,1.255 1.608,3.656 1.608,3.656l3.282,-2.215c0,0 -0.908,-1.655 -1.214,-2.504c-0.302,-0.84 -0.62,-2.588 -0.62,-2.588l4.861,0.008l-0.001,5.094l4.428,0.013l-0.007,-11.532l-4.427,0.011l0.011,3.296c0,0 -3.752,0.077 -3.938,-0.046c-0.066,-0.044 0.303,-1.683 0.765,-2.297c0.462,-0.614 1.424,-1.27 2.008,-1.389c0.059,-0.012 6.283,-0.014 6.283,-0.014l-1.084,-3.321Z"
+		/>
+		<path fill="#fff"
+			  d="M36.195,15.196l-0.002,15.282l8.644,-0.012l0.887,-3.307l-5.535,-0.008l0,-11.957l-3.994,0.002Z"
+		/>
+	</g>
+</svg>

images/icons/shoboi.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.41" clip-rule="evenodd" viewBox="0 0 24 24">
+	<path fill="#abfca9" d="M1.5 1.5v10.52l9-.02V1.5h-9z"/>
+	<path fill="#2ac43c" d="M10.5 12l-9 .01V1.5h9V12zM3 3v7.51h6V3H3z"/>
+	<path fill="#fffc7f" d="M9 6.01v12.04l8.99-.02L18 6.01H9z"/>
+	<path fill="#c3b159" d="M17.99 18.03L9 18.05V6.01H18l-.01 12.02zM10.5 7.51v9.04l6-.01V7.5h-6z"/>
+	<path fill="#81fdff" d="M1.5 10.52l.01 15.77 9-.02V10.5l-9.01.02z"/>
+	<path fill="#41aaff" d="M10.5 26.27l-8.99.02-.01-15.77 9-.02v15.77zM3 12.02v12.76h6V12l-6 .02z"/>
+	<path fill="#ffac84" d="M16.5 13.5v12.05l9-.02V13.5h-9z"/>
+	<path fill="#b87730" d="M25.5 25.53l-9 .02V13.51h9v12.02zM18 15v9.04l6-.02v-9.02h-6z"/>
+</svg>

images/icons/youtube-full-color.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.41421" clip-rule="evenodd" viewBox="0 0 71 50">
+	<path fill="red" d="M69.941 7.824c-.823-3.059-3.235-5.471-6.294-6.295C58.059 0 35.706 0 35.706 0S13.353 0 7.765 1.471c-3 .823-5.471 3.294-6.294 6.353C0 13.412 0 25 0 25s0 11.647 1.471 17.176c.823 3.059 3.235 5.471 6.294 6.295C13.412 50 35.706 50 35.706 50s22.353 0 27.941-1.471c3.059-.823 5.471-3.235 6.294-6.294 1.471-5.588 1.471-17.176 1.471-17.176s.059-11.647-1.471-17.235z"/>
+	<path fill="#fff" d="M47.176 25L28.588 14.294v21.412L47.176 25z"/>
+</svg>

pages/anime/editanime/editanime.pixy

@@ -3,10 +3,23 @@ component EditAnimeTabs(anime *arn.Anime)
 		a.tab(href=anime.Link())
 			Icon("tv")
 			span Anime
-		
+
 		Tab("Edit", "pencil", anime.Link() + "/edit")
 		Tab("Images", "image", anime.Link() + "/edit/images")
 		Tab("Characters", "users", anime.Link() + "/edit/characters")
 		Tab("Relations", "exchange", anime.Link() + "/edit/relations")
 		Tab("Episodes", "list-ol", anime.Link() + "/edit/episodes")
-		Tab("History", "history", anime.Link() + "/edit/history")
+		Tab("History", "history", anime.Link() + "/edit/history")
+	.search-links
+		a.search-link.google-badge.tip(href="https://www.google.com/search?q=" + anime.Title.Canonical, target="_blank", rel="noopener", aria-label="Google")
+			RawIcon("google")
+		a.search-link.annilist-badge.tip(href="https://anilist.co/search/anime?sort=SEARCH_MATCH&search=" + anime.Title.Canonical, target="_blank", rel="noopener", aria-label="Annilist")
+			RawIcon("annilist")
+		a.search-link.mal-badge.tip(href="https://myanimelist.net/anime.php?q=" + anime.Title.Canonical, target="_blank", rel="noopener", aria-label="MyAnimeList")
+			RawIcon("mal")
+		a.search-link.shoboi-badge.tip(href="http://cal.syoboi.jp/find?type=quick&sd=1&kw=" + anime.Title.Japanese, target="_blank", rel="noopener", aria-label="Shoboi")
+			RawIcon("shoboi")
+		a.search-link.tip(href="https://www.google.com/search?q=" + anime.Title.Canonical + " anime cover&tbm=isch&tbs=imgo:1,isz:lt,islt:qsvga", target="_blank", rel="noopener", aria-label="Cover image")
+			RawIcon("image")
+		a.search-link.tip(href="https://www.youtube.com/results?search_query=" + strings.Replace(anime.Title.Canonical+" PV", " ", "+", -1), target="_blank", rel="noopener", aria-label="Trailer")
+			RawIcon("youtube-full-color")

pages/editor/editor.scarlet

@@ -25,6 +25,54 @@
 .feature-card-color-character
 	background hsl(273, feature-card-saturation, feature-card-lightness) !important
 
+.search-links
+	position fixed
+	top 25%
+	left 95%
+	vertical
+	width fit-content
+
+
+// This is a copy of the .badge style, but the position:absolute broke the layout
+.search-link
+	horizontal
+	justify-content center
+	align-items center
+	background reverse-light-color
+	border-radius 50%
+	padding 0.5rem
+	color text-color
+	width 30px
+	height 30px
+	position relative
+	margin-top 0.2em
+	margin-bottom 0.2em
+
+	:hover
+		color text-color
+		background reverse-light-hover-color
+
+	:active
+		transform scale(1.2)
+
+.google-badge,.shoboi-badge
+	background rgba(255, 255, 255, 0.80) !important
+
+	:hover
+		background rgba(255, 255, 255, 1) !important
+
+.annilist-badge
+	background rgba(31, 38, 49, 0.80) !important
+
+	:hover
+		background rgba(31, 38, 49, 1) !important
+
+.mal-badge
+	background rgba(46, 81, 181, 0.80) !important
+
+	:hover
+		background rgba(46, 81, 181, 1) !important
+
 > 1550px
 	.editor-filters
 		position fixed

pages/editor/filteranime/anilist.go

@@ -14,7 +14,7 @@ func AniList(ctx *aero.Context) string {
 			return anime.GetMapping("anilist/anime") == ""
 		},
 		func(anime *arn.Anime) string {
-			return "https://anilist.co/search?type=anime&q=" + anime.Title.Canonical
+			return "https://anilist.co/search/anime?sort=SEARCH_MATCH&search=" + anime.Title.Canonical
 		},
 	)
 }