Initial commit

.gitignore

@@ -0,0 +1 @@
+.discourse-site

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Penar Musaraj
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1 @@
+# discourse-category-icons

about.json

@@ -0,0 +1,6 @@
+{
+  "name": "Category Icons",
+  "about_url": "https://github.com/pmusaraj/discourse-category-icons",
+  "license_url": "https://github.com/pmusaraj/discourse-category-icons/blob/master/LICENSE",
+  "component": "true"
+}

common/common.scss

@@ -0,0 +1,3 @@
+span.category-badge-icon {
+	display: inline-flex;
+}

common/header.html

@@ -0,0 +1,98 @@
+<script type="text/discourse-plugin" version="0.8.26">
+let categoryThemeList = settings.category_icon_list.split('|');
+let lockIcon = settings.category_lock_icon || 'lock';
+console.log(settings.category_lock_icon);
+
+const { iconHTML } = require("discourse-common/lib/icon-library");
+const { isRTL } = require("discourse/lib/text-direction");
+
+var get = Em.get,
+  escapeExpression = Handlebars.Utils.escapeExpression;
+
+function categoryStripe(color, classes) {
+  var style = color ? "style='background-color: #" + color + ";'" : "";
+  return "<span class='" + classes + "' " + style + "></span>";
+}
+
+function categoryIconsRenderer(category, opts) {
+	let description = get(category, "description_text");
+	let restricted = get(category, "read_restricted");
+	let url = opts.url
+	  ? opts.url
+	  : Discourse.getURL("/c/") + Discourse.Category.slugFor(category);
+	let href = opts.link === false ? "" : url;
+	let tagName = opts.link === false || opts.link === "false" ? "span" : "a";
+	let extraClasses = opts.extraClasses ? " " + opts.extraClasses : "";
+	let color = get(category, "color");
+	let html = "";
+	let parentCat = null;
+	let categoryDir = "";
+
+	if (!opts.hideParent) {
+	  parentCat = Discourse.Category.findById(
+	    get(category, "parent_category_id")
+	  );
+	}
+
+	const categoryStyle =
+	  opts.categoryStyle || Discourse.SiteSettings.category_style;
+	if (categoryStyle !== "none") {
+	  if (parentCat && parentCat !== category) {
+	    html += categoryStripe(
+	      get(parentCat, "color"),
+	      "badge-category-parent-bg"
+	    );
+	  }
+	  html += categoryStripe(color, "badge-category-bg");
+	}
+
+	let classNames = "badge-category clear-badge";
+	if (restricted) {
+	  classNames += " restricted";
+	}
+
+	let style = "";
+	if (categoryStyle === "box") {
+	  style = `style="color: #${get(category, "text_color")};"`;
+	}
+
+	html +=
+	  `<span ${style} ` +
+	  'data-drop-close="true" class="' +
+	  classNames +
+	  '"' +
+	  (description ? 'title="' + escapeExpression(description) + '" ' : "") +
+	  ">";
+
+	/// Add custom category icon from theme settings
+	let categoryThemeItem = categoryThemeList.find((str) => str.indexOf(category.slug) > -1);
+	if (categoryThemeItem) {
+		let iconItem = categoryThemeItem.split(',');
+		let itemColor = iconItem[2] ? `style="color: ${iconItem[2]}"` : "";
+		let itemIcon = iconItem[1] != '' ? iconHTML(iconItem[1]) : "";
+
+	    html += `<span ${itemColor} class="category-badge-icon">${itemIcon}</span>`;
+	}
+	/// End custom category icon 
+
+	let categoryName = escapeExpression(get(category, "name"));
+
+	if (Discourse.SiteSettings.support_mixed_text_direction) {
+	  categoryDir = isRTL(categoryName) ? 'dir="rtl"' : 'dir="ltr"';
+	}
+
+	if (restricted) {
+	  html += iconHTML(lockIcon);
+	}
+	html += `<span class="category-name" ${categoryDir}>${categoryName}</span></span>`;
+
+	if (href) {
+	  href = ` href="${href}" `;
+	}
+
+	extraClasses = categoryStyle ? categoryStyle + extraClasses : extraClasses;
+	return `<${tagName} class="badge-wrapper ${extraClasses}" ${href}>${html}</${tagName}>`;
+};
+
+api.replaceCategoryLinkRenderer(categoryIconsRenderer);
+</script>

settings.yml

@@ -0,0 +1,12 @@
+category_icon_list: 
+  default: 'help,question-circle,#CC0000|'
+  type: 'list'
+  description: 'Enter comma-delimited configuration for categories, in the format "category-slug,icon,color".'
+svg_icons: 
+  default: 'question-circle'
+  type: 'list'
+  list_type: 'compact'
+  description: 'List of FontAwesome 5 icons used in this theme component'
+category_lock_icon: 
+  default: ''
+  description: 'Enter the name of a FontAwesome 5 icon to display instead of the lock icon next to private categories.'