Info panel redesign

Restyled the whole exp trackers plugin panel to follow my proposed
design style on issue #1342

- Added two new entries to the runelite properties file (github and
patreon link). And addes respective getter methods in the
RuneLiteProperties.java file.

runelite-client/src/main/java/net/runelite/client/RuneLiteProperties.java

@@ -41,6 +41,8 @@ public class RuneLiteProperties
 	private static final String RUNESCAPE_VERSION = "runescape.version";
 	private static final String DISCORD_APP_ID = "runelite.discord.appid";
 	private static final String DISCORD_INVITE = "runelite.discord.invite";
+	private static final String GITHUB_LINK = "runelite.github.link";
+	private static final String PATREON_LINK = "runelite.patreon.link";
 
 	private final Properties properties = new Properties();
 
@@ -82,4 +84,14 @@ public class RuneLiteProperties
 	{
 		return properties.getProperty(DISCORD_INVITE);
 	}
-}
+
+	public String getGithubLink()
+	{
+		return properties.getProperty(GITHUB_LINK);
+	}
+
+	public String getPatreonLink()
+	{
+		return properties.getProperty(PATREON_LINK);
+	}
+}

runelite-client/src/main/java/net/runelite/client/plugins/info/InfoPanel.java

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018 Abex
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -27,14 +28,22 @@ package net.runelite.client.plugins.info;
 import com.google.common.eventbus.EventBus;
 import com.google.common.eventbus.Subscribe;
 import com.google.inject.Inject;
+import java.awt.BorderLayout;
+import java.awt.Color;
 import java.awt.Font;
+import java.awt.GridLayout;
+import java.awt.event.MouseAdapter;
+import java.awt.event.MouseEvent;
+import java.io.IOException;
 import java.util.concurrent.ScheduledExecutorService;
 import javax.annotation.Nullable;
+import javax.imageio.ImageIO;
 import javax.inject.Singleton;
-import javax.swing.BorderFactory;
-import javax.swing.GroupLayout;
+import javax.swing.Box;
+import javax.swing.ImageIcon;
 import javax.swing.JLabel;
-import javax.swing.LayoutStyle;
+import javax.swing.JPanel;
+import javax.swing.border.EmptyBorder;
 import javax.swing.event.HyperlinkEvent;
 import lombok.extern.slf4j.Slf4j;
 import net.runelite.api.Client;
@@ -42,8 +51,10 @@ import net.runelite.api.events.SessionClose;
 import net.runelite.api.events.SessionOpen;
 import net.runelite.client.RuneLiteProperties;
 import net.runelite.client.account.SessionManager;
+import net.runelite.client.ui.ColorScheme;
 import net.runelite.client.ui.FontManager;
 import net.runelite.client.ui.PluginPanel;
+import net.runelite.client.util.LinkBrowser;
 import net.runelite.client.util.RunnableExceptionLogger;
 
 @Slf4j
@@ -52,6 +63,14 @@ public class InfoPanel extends PluginPanel
 {
 	private static final String RUNELITE_LOGIN = "https://runelite_login/";
 
+	private static final ImageIcon ARROW_RIGHT_ICON;
+	private static final ImageIcon GITHUB_ICON;
+	private static final ImageIcon DISCORD_ICON;
+	private static final ImageIcon PATREON_ICON;
+
+	private final JLabel loggedLabel = new JLabel();
+	private final JRichTextPane emailLabel = new JRichTextPane();
+
 	@Inject
 	@Nullable
 	private Client client;
@@ -68,33 +87,58 @@ public class InfoPanel extends PluginPanel
 	@Inject
 	private ScheduledExecutorService executor;
 
-	private final GroupLayout layout = new GroupLayout(this);
-	private final JLabel usernameHeader = new JLabel();
-	private final JRichTextPane username = new JRichTextPane();
+	static
+	{
+		try
+		{
+			synchronized (ImageIO.class)
+			{
+				ARROW_RIGHT_ICON = new ImageIcon(ImageIO.read(InfoPanel.class.getResourceAsStream("arrow_right.png")));
+				GITHUB_ICON = new ImageIcon(ImageIO.read(InfoPanel.class.getResourceAsStream("github_icon.png")));
+				DISCORD_ICON = new ImageIcon(ImageIO.read(InfoPanel.class.getResourceAsStream("discord_icon.png")));
+				PATREON_ICON = new ImageIcon(ImageIO.read(InfoPanel.class.getResourceAsStream("patreon_icon.png")));
+			}
+		}
+		catch (IOException e)
+		{
+			throw new RuntimeException(e);
+		}
+	}
 
 	void init()
 	{
-		setLayout(layout);
+		setLayout(new BorderLayout());
+		setBackground(ColorScheme.DARK_GRAY_COLOR);
+		setBorder(new EmptyBorder(10, 10, 10, 10));
+
+		JPanel versionPanel = new JPanel();
+		versionPanel.setBackground(ColorScheme.DARKER_GRAY_COLOR);
+		versionPanel.setBorder(new EmptyBorder(10, 10, 10, 10));
+		versionPanel.setLayout(new GridLayout(0, 1));
 
 		final Font smallFont = FontManager.getRunescapeSmallFont();
 
-		final JLabel runeliteVersionHeader = new JLabel("RuneLite version");
-		runeliteVersionHeader.setFont(smallFont);
-		final JLabel runeliteVersion = new JLabel(runeLiteProperties.getVersion());
+		JLabel version = new JLabel(htmlLabel("RuneLite version: ", runeLiteProperties.getVersion()));
+		version.setFont(smallFont);
 
-		final JLabel runescapeVersionHeader = new JLabel("OldSchool Engine");
-		runescapeVersionHeader.setFont(smallFont);
+		JLabel revision = new JLabel();
+		revision.setFont(smallFont);
 
 		String engineVer = "Unknown";
 		if (client != null)
 		{
 			engineVer = String.format("Rev %s", runeLiteProperties.getRunescapeVersion());
 		}
-		final JLabel runescapeVersion = new JLabel(engineVer);
 
-		usernameHeader.setFont(smallFont);
-		username.enableAutoLinkHandler(false);
-		username.addHyperlinkListener(e ->
+		revision.setText(htmlLabel("Oldschool revision: ", engineVer));
+
+		loggedLabel.setForeground(ColorScheme.LIGHT_GRAY_COLOR);
+		loggedLabel.setFont(smallFont);
+
+		emailLabel.setForeground(Color.WHITE);
+		emailLabel.setFont(smallFont);
+		emailLabel.enableAutoLinkHandler(false);
+		emailLabel.addHyperlinkListener(e ->
 		{
 			if (HyperlinkEvent.EventType.ACTIVATED.equals(e.getEventType()) && e.getURL() != null)
 			{
@@ -105,51 +149,74 @@ public class InfoPanel extends PluginPanel
 			}
 		});
 
+		versionPanel.add(version);
+		versionPanel.add(revision);
+		versionPanel.add(Box.createGlue());
+		versionPanel.add(loggedLabel);
+		versionPanel.add(emailLabel);
+
 		updateLoggedIn();
 
-		final JRichTextPane issueLink = new JRichTextPane("text/html",
-			"RuneLite is open source!<br>"
-			+ "Found an issue? Want a feature?<br>"
-			+ "<a href=\"https://github.com/runelite/runelite/issues\">"
-			+ "Open an issue on GitHub!"
-			+ "</a>"
-		);
+		JPanel actionsContainer = new JPanel();
+		actionsContainer.setBorder(new EmptyBorder(10, 0, 0, 0));
+		actionsContainer.setOpaque(false);
+		actionsContainer.setLayout(new GridLayout(3, 1, 0, 10));
 
-		setBorder(BorderFactory.createEmptyBorder(2, 6, 6, 6));
+		actionsContainer.add(buildLinkPanel(GITHUB_ICON, "Report an issue or", "make a suggestion", runeLiteProperties.getGithubLink()));
+		actionsContainer.add(buildLinkPanel(DISCORD_ICON, "Talk to us on our", "discord server", runeLiteProperties.getDiscordInvite()));
+		actionsContainer.add(buildLinkPanel(PATREON_ICON, "Become a patron to", "help support RuneLite", runeLiteProperties.getPatreonLink()));
 
-		layout.setVerticalGroup(layout.createSequentialGroup()
-			.addGroup(layout.createParallelGroup()
-				.addComponent(runeliteVersionHeader)
-				.addComponent(runescapeVersionHeader)
-			).addGroup(layout.createParallelGroup()
-				.addComponent(runeliteVersion)
-				.addComponent(runescapeVersion)
-			).addGap(6)
-			.addComponent(usernameHeader)
-			.addGroup(layout.createParallelGroup()
-				.addComponent(username)
-			)
-			.addGap(12)
-			.addComponent(issueLink)
-		);
-
-		layout.setHorizontalGroup(layout.createParallelGroup()
-			.addGroup(layout.createSequentialGroup()
-				.addComponent(runeliteVersionHeader)
-				.addPreferredGap(LayoutStyle.ComponentPlacement.UNRELATED, GroupLayout.PREFERRED_SIZE, Short.MAX_VALUE)
-				.addComponent(runescapeVersionHeader))
-			.addGroup(layout.createSequentialGroup()
-				.addComponent(runeliteVersion)
-				.addPreferredGap(LayoutStyle.ComponentPlacement.UNRELATED, GroupLayout.PREFERRED_SIZE, Short.MAX_VALUE)
-				.addComponent(runescapeVersion))
-			.addComponent(usernameHeader)
-			.addComponent(username)
-			.addComponent(issueLink)
-		);
+		add(versionPanel, BorderLayout.NORTH);
+		add(actionsContainer, BorderLayout.CENTER);
 
 		eventBus.register(this);
 	}
 
+	/**
+	 * Builds a link panel with a given icon, text and url to redirect to.
+	 */
+	private static JPanel buildLinkPanel(ImageIcon icon, String topText, String bottomText, String url)
+	{
+		JPanel container = new JPanel();
+		container.setBackground(ColorScheme.DARKER_GRAY_COLOR);
+		container.setLayout(new BorderLayout());
+		container.setBorder(new EmptyBorder(10, 10, 10, 10));
+		container.addMouseListener(new MouseAdapter()
+		{
+			@Override
+			public void mousePressed(MouseEvent mouseEvent)
+			{
+				LinkBrowser.browse(url);
+			}
+		});
+
+		JLabel iconLabel = new JLabel(icon);
+		container.add(iconLabel, BorderLayout.WEST);
+
+		JPanel textContainer = new JPanel();
+		textContainer.setOpaque(false);
+		textContainer.setLayout(new GridLayout(2, 1));
+		textContainer.setBorder(new EmptyBorder(5, 10, 5, 10));
+
+		JLabel topLine = new JLabel(topText);
+		topLine.setForeground(Color.WHITE);
+		topLine.setFont(FontManager.getRunescapeSmallFont());
+
+		JLabel bottomLine = new JLabel(bottomText);
+		bottomLine.setForeground(Color.WHITE);
+		bottomLine.setFont(FontManager.getRunescapeSmallFont());
+
+		textContainer.add(topLine);
+		textContainer.add(bottomLine);
+
+		container.add(textContainer, BorderLayout.CENTER);
+
+		JLabel arrowLabel = new JLabel(ARROW_RIGHT_ICON);
+		container.add(arrowLabel, BorderLayout.EAST);
+
+		return container;
+	}
+
 	private void updateLoggedIn()
 	{
 		final String name = sessionManager.getAccountSession() != null
@@ -158,18 +225,23 @@ public class InfoPanel extends PluginPanel
 
 		if (name != null)
 		{
-			username.setContentType("text/plain");
-			username.setText(name);
-			usernameHeader.setText("Logged in as");
+			emailLabel.setContentType("text/plain");
+			emailLabel.setText(name);
+			loggedLabel.setText("Logged in as");
 		}
 		else
 		{
-			username.setContentType("text/html");
-			username.setText("<a href=\"" + RUNELITE_LOGIN + "\">Login</a> to sync settings to the cloud.");
-			usernameHeader.setText("Not logged in");
+			emailLabel.setContentType("text/html");
+			emailLabel.setText("<a href=\"" + RUNELITE_LOGIN + "\">Login</a> to sync settings to the cloud.");
+			loggedLabel.setText("Not logged in");
 		}
 	}
 
+	private static String htmlLabel(String key, String value)
+	{
+		return "<html><body style = 'color:#a5a5a5'>" + key + "<span style = 'color:white'>" + value + "</span></body></html>";
+	}
+
 	@Subscribe
 	public void onSessionOpen(SessionOpen sessionOpen)
 	{

runelite-client/src/main/resources/net/runelite/client/runelite.properties

@@ -2,4 +2,6 @@ runelite.title=RuneLite
 runelite.version=${project.version}
 runescape.version=${rs.version}
 runelite.discord.appid=409416265891971072
-runelite.discord.invite=https://discord.gg/R4BQ8tU
+runelite.discord.invite=https://discord.gg/R4BQ8tU
+runelite.github.link=https://github.com/runelite
+runelite.patreon.link=https://www.patreon.com/runelite