nodebb-theme-harmony 1.0.23 → 1.0.25

package/languages/harmony.json

@@ -0,0 +1 @@
+{}

package/lib/controllers.js

@@ -15,8 +15,8 @@ Controllers.renderThemeSettings = async (req, res, next) => {
 		return next();
 	}
 
-	userData.title = '[[harmony:settings.title]]';
-	userData.breadcrumbs = helpers.buildBreadcrumbs([{ text: userData.username, url: `/user/${userData.userslug}` }, { text: '[[harmony:settings.title]]' }]);
+	userData.title = '[[themes/harmony:settings.title]]';
+	userData.breadcrumbs = helpers.buildBreadcrumbs([{ text: userData.username, url: `/user/${userData.userslug}` }, { text: '[[themes/harmony:settings.title]]' }]);
 
 	res.render('account/theme', userData);
 };

package/library.js

@@ -16,6 +16,7 @@ const defaults = {
 	stickyToolbar: 'on',
 	autohideBottombar: 'off',
 	openSidebars: 'off',
+	chatModals: 'off',
 };
 
 library.init = async function (params) {
@@ -64,7 +65,7 @@ library.addProfileItem = async (data) => {
 		id: 'theme',
 		route: 'theme',
 		icon: 'fa-paint-brush',
-		name: '[[harmony:settings.title]]',
+		name: '[[themes/harmony:settings.title]]',
 		visibility: {
 			self: true,
 			other: false,
@@ -146,6 +147,7 @@ async function loadThemeConfig(uid) {
 	config.stickyToolbar = config.stickyToolbar === 'on';
 	config.autohideBottombar = config.autohideBottombar === 'on';
 	config.openSidebars = config.openSidebars === 'on';
+	config.chatModals = config.chatModals === 'on';
 	return config;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-theme-harmony",
-  "version": "1.0.23",
+  "version": "1.0.25",
   "nbbpm": {
     "compatibility": "^3.0.0"
   },

package/public/harmony.js

@@ -36,8 +36,8 @@ $(document).ready(function () {
 		});
 
 		hooks.on('filter:chat.openChat', function (hookData) {
-			// disables chat modals & goes straight to chat page
-			hookData.modal = false;
+			// disables chat modals & goes straight to chat page based on user setting
+			hookData.modal = config.theme.chatModals;
 			return hookData;
 		});
 	});

package/scss/chats.scss

@@ -105,5 +105,13 @@ body.page-user-chats {
 	[component="chat/nav-wrapper"][data-loaded="0"] + [component="chat/main-wrapper"] {
 		display: none!important;
 	}
+}
 
+.chat-modal {
+	left: auto;
+	top: auto;
+	bottom: 0px;
+	right: 2rem;
+	width: auto!important;
+	height: auto!important;
 }

package/templates/account/theme.tpl

@@ -1,7 +1,7 @@
 <!-- IMPORT partials/account/header.tpl -->
 
 <div class="mb-3 d-flex justify-content-between">
-	<h3 class="fw-semibold fs-5">[[harmony:settings.title]]</h3>
+	<h3 class="fw-semibold fs-5">[[themes/harmony:settings.title]]</h3>
 
 	<button id="save" type="button" class="btn btn-primary">[[global:save_changes]]</button>
 </div>
@@ -9,25 +9,25 @@
 <form id="theme-settings" role="form">
 	<div class="form-check mb-3">
 		<input class="form-check-input" type="checkbox" id="enableQuickReply" name="enableQuickReply" {{{ if config.theme.enableQuickReply }}}checked{{{ end }}}>
-		<label class="form-check-label" for="enableQuickReply">[[harmony:settings.enableQuickReply]]</label>
+		<label class="form-check-label" for="enableQuickReply">[[themes/harmony:settings.enableQuickReply]]</label>
 	</div>
 
 	<div class="form-check mb-3">
 		<input class="form-check-input" type="checkbox" id="centerHeaderElements" name="centerHeaderElements" {{{ if config.theme.centerHeaderElements }}}checked{{{ end }}}>
-		<label class="form-check-label" for="centerHeaderElements">[[harmony:settings.centerHeaderElements]]</label>
+		<label class="form-check-label" for="centerHeaderElements">[[themes/harmony:settings.centerHeaderElements]]</label>
 	</div>
 
 	<div class="form-check mb-3">
 		<input class="form-check-input" type="checkbox" id="mobileTopicTeasers" name="mobileTopicTeasers" {{{ if config.theme.mobileTopicTeasers }}}checked{{{ end }}}>
-		<label class="form-check-label" for="mobileTopicTeasers">[[harmony:settings.mobileTopicTeasers]]</label>
+		<label class="form-check-label" for="mobileTopicTeasers">[[themes/harmony:settings.mobileTopicTeasers]]</label>
 	</div>
 
 	<div class="form-check mb-3">
 		<input class="form-check-input" type="checkbox" id="stickyToolbar" name="stickyToolbar" {{{ if config.theme.stickyToolbar }}}checked{{{ end }}}>
 		<label class="form-check-label" for="stickyToolbar">
-			[[harmony:settings.stickyToolbar]]
+			[[themes/harmony:settings.stickyToolbar]]
 			<p class="form-text mb-0">
-				[[harmony:settings.stickyToolbar.help]]
+				[[themes/harmony:settings.stickyToolbar.help]]
 			</p>
 		</label>
 	</div>
@@ -35,13 +35,20 @@
 	<div class="form-check mb-3">
 		<input class="form-check-input" type="checkbox" id="autohideBottombar" name="autohideBottombar" {{{ if config.theme.autohideBottombar }}}checked{{{ end }}}>
 		<label class="form-check-label" for="autohideBottombar">
-			[[harmony:settings.autohideBottombar]]
+			[[themes/harmony:settings.autohideBottombar]]
 			<p class="form-text mb-0">
-				[[harmony:settings.autohideBottombar.help]]
+				[[themes/harmony:settings.autohideBottombar.help]]
 			</p>
 		</label>
 	</div>
 
+	<div class="form-check mb-3">
+		<input class="form-check-input" type="checkbox" id="chatModals" name="chatModals" {{{ if config.theme.chatModals }}}checked{{{ end }}}>
+		<label class="form-check-label" for="chatModals">
+			[[themes/harmony:settings.chatModals]]
+		</label>
+	</div>
+
 </form>
 
 <!-- IMPORT partials/account/footer.tpl -->

package/templates/admin/plugins/harmony.tpl

@@ -4,34 +4,40 @@
 		<form role="form" class="harmony-settings">
 			<div class="form-check form-switch">
 				<input type="checkbox" class="form-check-input" id="enableQuickReply" name="enableQuickReply" />
-				<label for="enableQuickReply" class="form-check-label">[[harmony:settings.enableQuickReply]]</label>
+				<label for="enableQuickReply" class="form-check-label">[[themes/harmony:settings.enableQuickReply]]</label>
 			</div>
 			<div class="form-check form-switch">
 				<input type="checkbox" class="form-check-input" id="centerHeaderElements" name="centerHeaderElements" />
-				<label for="centerHeaderElements" class="form-check-label">[[harmony:settings.centerHeaderElements]]</label>
+				<label for="centerHeaderElements" class="form-check-label">[[themes/harmony:settings.centerHeaderElements]]</label>
 			</div>
 			<div class="form-check form-switch">
 				<input type="checkbox" class="form-check-input" id="mobileTopicTeasers" name="mobileTopicTeasers" />
-				<label for="mobileTopicTeasers" class="form-check-label">[[harmony:settings.mobileTopicTeasers]]</label>
+				<label for="mobileTopicTeasers" class="form-check-label">[[themes/harmony:settings.mobileTopicTeasers]]</label>
 			</div>
 			<div class="form-check form-switch">
 				<input type="checkbox" class="form-check-input" id="stickyToolbar" name="stickyToolbar" />
 				<div for="stickyToolbar" class="form-check-label">
-					[[harmony:settings.stickyToolbar]]
+					[[themes/harmony:settings.stickyToolbar]]
 					<p class="form-text">
-						[[harmony:settings.stickyToolbar.help]]
+						[[themes/harmony:settings.stickyToolbar.help]]
 					</p>
 				</div>
 			</div>
 			<div class="form-check form-switch">
 				<input type="checkbox" class="form-check-input" id="autohideBottombar" name="autohideBottombar" />
 				<div for="autohideBottombar" class="form-check-label">
-					[[harmony:settings.autohideBottombar]]
+					[[themes/harmony:settings.autohideBottombar]]
 					<p class="form-text">
-						[[harmony:settings.autohideBottombar.help]]
+						[[themes/harmony:settings.autohideBottombar.help]]
 					</p>
 				</div>
 			</div>
+			<div class="form-check form-switch">
+				<input type="checkbox" class="form-check-input" id="chatModals" name="chatModals" />
+				<div for="chatModals" class="form-check-label">
+					[[themes/harmony:settings.chatModals]]
+				</div>
+			</div>
 		</form>
 	</div>
 </div>

package/templates/chat.tpl

@@ -0,0 +1,42 @@
+<div id="chat-modal" class="chat-modal d-flex flex-nowrap modal hide overflow-visible" tabindex="-1" role="dialog" aria-labelledby="Chat" aria-hidden="true" data-center="false">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header d-flex gap-4 justify-content-between">
+				<div class="fs-6 flex-grow-1" component="chat/room/name">{./chatWithMessage}</div>
+				<div class="d-flex gap-1 align-items-center">
+					<button type="button" class="btn-ghost-sm d-none d-md-flex" data-action="maximize">
+						<i class="fa fa-fw fa-expand text-muted"></i>
+					</button>
+
+					<!-- IMPORT partials/chats/options.tpl -->
+
+					<button id="chat-close-btn" type="button" class="btn-close btn-ghost-sm" data-bs-dismiss="modal" aria-label="Close"></button>
+				</div>
+			</div>
+
+			<div class="modal-body d-flex flex-column" style="height: 500px;">
+				<div class="position-relative">
+					<div component="chat/messages/scroll-up-alert" class="position-absolute scroll-up-alert alert alert-info hidden w-100" role="button" style="z-index: 1;">[[modules:chat.scroll-up-alert]]</div>
+				</div>
+				<ul class="chat-content p-0 m-0 list-unstyled d-flex flex-column overflow-auto flex-grow-1" component="chat/messages">
+					<!-- IMPORT partials/chats/messages.tpl -->
+				</ul>
+
+				<div component="chat/composer" class="d-flex flex-column flex-md-row gap-2 border-top pt-2 align-items-start align-items-md-end">
+					<div class="w-100 flex-grow-1 flex-nowrap position-relative input-group">
+						<button component="chat/upload/button" class="btn btn-outline-primary btn-sm align-self-stretch px-3 px-md-2" type="button"><i class="fa fa-fw fa-upload"></i></button>
+						<div class="flex-grow-1 position-relative">
+							<textarea component="chat/input" placeholder="[[modules:chat.placeholder.mobile]]" class="form-control chat-input mousetrap rounded-0" style="height:0;max-height:30vh;resize:none;"></textarea>
+							<span component="chat/message/remaining" class="text-xs text-muted position-absolute me-1 mb-1 end-0 bottom-0">{maximumChatMessageLength}</span>
+						</div>
+						<button class="btn btn-primary btn-sm align-self-stretch px-3 px-md-2" type="button" data-action="send"><i class="fa fa-fw fa-paper-plane"></i></button>
+					</div>
+					<form class="hidden" component="chat/upload" method="post" enctype="multipart/form-data">
+						<input type="file" name="files[]" multiple class="hidden"/>
+					</form>
+				</div>
+			</div>
+			<div class="imagedrop"><div>[[topic:composer.drag_and_drop_images]]</div></div>
+		</div>
+	</div>
+</div>

package/templates/partials/chats/options.tpl

@@ -1,5 +1,5 @@
 <div class="dropdown">
-  <button class="btn btn-outline align-text-top" data-bs-toggle="dropdown" component="chat/controlsToggle">
+  <button class="btn-ghost-sm" data-bs-toggle="dropdown" component="chat/controlsToggle">
     <i class="fa fa-gear text-muted"></i>
   </button>
   <ul class="dropdown-menu dropdown-menu-end p-1 text-sm" component="chat/controls">

package/templates/partials/chats/recent_room.tpl

@@ -2,7 +2,6 @@
 	<div class="d-flex gap-1 justify-content-between p-1">
 		<div class="chat-room-btn position-relative d-flex flex-grow-1 gap-2 justify-content-start align-items-start btn-ghost-sm ff-sans">
 			<div class="main-avatar">
-				<a class="stretched-link" href="{config.relative_path}/me/chats/{./roomId}"></a>
 				{{{ if ./users.length }}}
 				{{{ if ./groupChat}}}
 				<div class="position-relative stacked-avatars">

package/templates/partials/sidebar/logged-out-menu.tpl

@@ -27,9 +27,9 @@
 
 {{{ if config.searchEnabled }}}
 <li component="sidebar/search" class="visible-open nav-item mx-2 search">
-	<div class="d-flex gap-2 py-1 px-2 align-items-center" title="[[harmony:login-register-to-search]]">
+	<div class="d-flex gap-2 py-1 px-2 align-items-center" title="[[themes/harmony:login-register-to-search]]">
 		<i class="fa fa-fw fa-search text-muted"></i>
-		<span class="nav-text visible-open text-xs text-muted">[[harmony:login-register-to-search]]</span>
+		<span class="nav-text visible-open text-xs text-muted">[[themes/harmony:login-register-to-search]]</span>
 	</a>
 </a>
 {{{ end }}}

package/templates/partials/sidebar-left.tpl

@@ -33,10 +33,10 @@
 		{{{ end }}}
 
 		<div class="sidebar-toggle m-2 d-none d-lg-block">
-			<a href="#" role="button" component="sidebar/toggle" class="nav-btn d-flex gap-2 align-items-center p-2 pointer nav-link w-100 text-nowrap" title="[[harmony:expand]]">
+			<a href="#" role="button" component="sidebar/toggle" class="nav-btn d-flex gap-2 align-items-center p-2 pointer nav-link w-100 text-nowrap" title="[[themes/harmony:expand]]">
 				<i class="fa fa-fw fa-angles-right"></i>
 				<i class="fa fa-fw fa-angles-left"></i>
-				<span class="nav-text visible-open fw-semibold small lh-1">[[harmony:collapse]]</span>
+				<span class="nav-text visible-open fw-semibold small lh-1">[[themes/harmony:collapse]]</span>
 			</a>
 		</div>
 	</div>

package/templates/partials/skin-switcher.tpl

@@ -1,11 +1,11 @@
-<div class="dropend m-2" component="skinSwitcher" title="[[harmony:skins]]">
+<div class="dropend m-2" component="skinSwitcher" title="[[themes/harmony:skins]]">
 	<a data-bs-toggle="dropdown" href="#" role="button" class="nav-link nav-btn position-relative">
 		<span class="justify-content-between w-100">
 			<span class="d-flex gap-2 align-items-center text-nowrap truncate-open">
 				<span>
 					<i component="skinSwitcher/icon" class="fa fa-fw fa-paintbrush"></i>
 				</span>
-				<span class="nav-text small visible-open fw-semibold">[[harmony:skins]]</span>
+				<span class="nav-text small visible-open fw-semibold">[[themes/harmony:skins]]</span>
 			</span>
 		</span>
 	</a>

package/languages/en-GB/harmony.json

@@ -1,14 +0,0 @@
-{
-	"skins": "Skins",
-	"collapse": "Collapse",
-	"expand": "Expand",
-	"login-register-to-search": "Login or register to search.",
-	"settings.title": "Theme settings",
-	"settings.enableQuickReply": "Enable quick reply",
-	"settings.centerHeaderElements": "Center header elements",
-	"settings.mobileTopicTeasers": "Show topic teasers on mobile",
-	"settings.stickyToolbar": "Sticky toolbar",
-	"settings.stickyToolbar.help": "The toolbar on topic and category pages will stick to the top of the page",
-	"settings.autohideBottombar": "Auto hide bottom bar",
-	"settings.autohideBottombar.help": "The bottom bar on mobile view will be hidden when the page is scrolled down"
-}

package/languages/he/harmony.json

@@ -1,14 +0,0 @@
-{
-	"skins": "עיצובים",
-	"collapse": "כיווץ",
-	"expand": "הרחבה",
-	"login-register-to-search": "התחבר או הירשם כדי לחפש.",
-	"settings.title": "הגדרות ערכת נושא",
-	"settings.enableQuickReply": "אפשר תשובה מהירה",
-	"settings.centerHeaderElements": "מרכז אלמנטים של כותרת",
-	"settings.mobileTopicTeasers": "הצג טיזרים לנושאים בנייד",
-	"settings.stickyToolbar": "סרגל כלים דביק",
-	"settings.stickyToolbar.help": "סרגל הכלים בדפי נושאים וקטגוריות ייצמד לראש העמוד",
-	"settings.autohideBottombar": "הסתר אוטומטית את הסרגל התחתון",
-	"settings.autohideBottombar.help": "הסרגל התחתון בתצוגת הנייד יוסתר כאשר הדף ייגלל מטה"
-}