summaryrefslogtreecommitdiffstats
path: root/web/react/utils
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/utils')
-rw-r--r--web/react/utils/async_client.jsx27
-rw-r--r--web/react/utils/client.jsx10
-rw-r--r--web/react/utils/constants.jsx50
-rw-r--r--web/react/utils/emoticons.jsx56
-rw-r--r--web/react/utils/markdown.jsx65
-rw-r--r--web/react/utils/text_formatting.jsx66
-rw-r--r--web/react/utils/utils.jsx54
7 files changed, 247 insertions, 81 deletions
diff --git a/web/react/utils/async_client.jsx b/web/react/utils/async_client.jsx
index b22d7237e..75dd35e3f 100644
--- a/web/react/utils/async_client.jsx
+++ b/web/react/utils/async_client.jsx
@@ -3,6 +3,7 @@
var client = require('./client.jsx');
var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
+var BrowserStore = require('../stores/browser_store.jsx');
var ChannelStore = require('../stores/channel_store.jsx');
var PostStore = require('../stores/post_store.jsx');
var UserStore = require('../stores/user_store.jsx');
@@ -50,18 +51,18 @@ export function getChannels(force, updateLastViewed, checkVersion) {
callTracker.getChannels = utils.getTimestamp();
client.getChannels(
- function getChannelsSuccess(data, textStatus, xhr) {
+ (data, textStatus, xhr) => {
callTracker.getChannels = 0;
if (checkVersion) {
var serverVersion = xhr.getResponseHeader('X-Version-ID');
- if (!UserStore.getLastVersion()) {
- UserStore.setLastVersion(serverVersion);
+ if (!BrowserStore.getLastServerVersion()) {
+ BrowserStore.setLastServerVersion(serverVersion);
}
- if (serverVersion !== UserStore.getLastVersion()) {
- UserStore.setLastVersion(serverVersion);
+ if (serverVersion !== BrowserStore.getLastServerVersion()) {
+ BrowserStore.setLastServerVersion(serverVersion);
window.location.href = window.location.href;
console.log('Detected version update refreshing the page'); //eslint-disable-line no-console
}
@@ -77,7 +78,7 @@ export function getChannels(force, updateLastViewed, checkVersion) {
members: data.members
});
},
- function getChannelsFailure(err) {
+ (err) => {
callTracker.getChannels = 0;
dispatchError(err, 'getChannels');
}
@@ -131,7 +132,7 @@ export function getChannel(id) {
callTracker['getChannel' + id] = utils.getTimestamp();
client.getChannel(id,
- function getChannelSuccess(data, textStatus, xhr) {
+ (data, textStatus, xhr) => {
callTracker['getChannel' + id] = 0;
if (xhr.status === 304 || !data) {
@@ -144,21 +145,21 @@ export function getChannel(id) {
member: data.member
});
},
- function getChannelFailure(err) {
+ (err) => {
callTracker['getChannel' + id] = 0;
dispatchError(err, 'getChannel');
}
);
}
-export function updateLastViewedAt() {
+export function updateLastViewedAt(force) {
const channelId = ChannelStore.getCurrentId();
if (channelId === null) {
return;
}
- if (isCallInProgress(`updateLastViewed${channelId}`)) {
+ if (isCallInProgress(`updateLastViewed${channelId}`) && !force) {
return;
}
@@ -566,8 +567,8 @@ export function getMe() {
}
callTracker.getMe = utils.getTimestamp();
- client.getMeSynchronous(
- function getMeSyncSuccess(data, textStatus, xhr) {
+ client.getMe(
+ (data, textStatus, xhr) => {
callTracker.getMe = 0;
if (xhr.status === 304 || !data) {
@@ -579,7 +580,7 @@ export function getMe() {
me: data
});
},
- function getMeSyncFailure(err) {
+ (err) => {
callTracker.getMe = 0;
dispatchError(err, 'getMe');
}
diff --git a/web/react/utils/client.jsx b/web/react/utils/client.jsx
index f92633439..bc73f3c64 100644
--- a/web/react/utils/client.jsx
+++ b/web/react/utils/client.jsx
@@ -4,8 +4,8 @@ var BrowserStore = require('../stores/browser_store.jsx');
var TeamStore = require('../stores/team_store.jsx');
var ErrorStore = require('../stores/error_store.jsx');
-export function track(category, action, label, prop, val) {
- global.window.analytics.track(action, {category: category, label: label, property: prop, value: val});
+export function track(category, action, label, property, value) {
+ global.window.analytics.track(action, {category, label, property, value});
}
export function trackPage() {
@@ -232,6 +232,7 @@ export function logout() {
track('api', 'api_users_logout');
var currentTeamUrl = TeamStore.getCurrentTeamUrl();
BrowserStore.clear();
+ ErrorStore.storeLastError(null);
window.location.href = currentTeamUrl + '/logout';
}
@@ -385,10 +386,9 @@ export function getAllTeams(success, error) {
});
}
-export function getMeSynchronous(success, error) {
+export function getMe(success, error) {
var currentUser = null;
$.ajax({
- async: false,
cache: false,
url: '/api/v1/users/me',
dataType: 'json',
@@ -402,7 +402,7 @@ export function getMeSynchronous(success, error) {
},
error: function onError(xhr, status, err) {
if (error) {
- var e = handleError('getMeSynchronous', xhr, status, err);
+ var e = handleError('getMe', xhr, status, err);
error(e);
}
}
diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx
index 1d856e067..0e89b9470 100644
--- a/web/react/utils/constants.jsx
+++ b/web/react/utils/constants.jsx
@@ -33,7 +33,6 @@ module.exports = {
RECIEVED_MSG: null,
- CLICK_TEAM: null,
RECIEVED_TEAM: null,
RECIEVED_CONFIG: null,
@@ -99,6 +98,7 @@ module.exports = {
POST_LOADING: 'loading',
POST_FAILED: 'failed',
POST_DELETED: 'deleted',
+ POST_TYPE_JOIN_LEAVE: 'join_leave',
RESERVED_TEAM_NAMES: [
'www',
'web',
@@ -133,6 +133,7 @@ module.exports = {
OFFLINE_ICON_SVG: "<svg version='1.1' id='Layer_1' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns#' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:svg='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' sodipodi:docname='TRASH_1_4.svg' inkscape:version='0.48.4 r9939' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='12px' height='12px' viewBox='0 0 12 12' enable-background='new 0 0 12 12' xml:space='preserve'><sodipodi:namedview inkscape:cy='139.7898' inkscape:cx='26.358185' inkscape:zoom='1.18' showguides='true' showgrid='false' id='namedview6' guidetolerance='10' gridtolerance='10' objecttolerance='10' borderopacity='1' bordercolor='#666666' pagecolor='#ffffff' inkscape:current-layer='Layer_1' inkscape:window-maximized='1' inkscape:window-y='-8' inkscape:window-x='-8' inkscape:window-height='705' inkscape:window-width='1366' inkscape:guide-bbox='true' inkscape:pageshadow='2' inkscape:pageopacity='0'><sodipodi:guide position='50.036793,85.991376' orientation='1,0' id='guide2986'></sodipodi:guide><sodipodi:guide position='58.426196,66.216355' orientation='0,1' id='guide3047'></sodipodi:guide></sodipodi:namedview><g><g><path fill='#cccccc' d='M6.002,7.143C5.645,7.363,5.167,7.52,4.502,7.52c-2.493,0-2.5-2.02-2.5-2.02S1.029,5.607,0.775,6.004C0.41,6.577,0.15,7.716,0.049,8.545c-0.025,0.145-0.057,0.537-0.05,0.598c0.162,1.295,2.237,2.321,4.375,2.357c0.043,0.001,0.085,0.001,0.127,0.001c0.043,0,0.084,0,0.127-0.001c1.879-0.023,3.793-0.879,4.263-2h-2.89L6.002,7.143L6.002,7.143z M4.501,5.488c1.372,0,2.483-1.117,2.483-2.494c0-1.378-1.111-2.495-2.483-2.495c-1.371,0-2.481,1.117-2.481,2.495C2.02,4.371,3.13,5.488,4.501,5.488z M7.002,6.5v2h5v-2H7.002z'/></g></g></svg>",
MENU_ICON: "<svg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='4px' height='16px' viewBox='0 0 8 32' enable-background='new 0 0 8 32' xml:space='preserve'> <g> <circle cx='4' cy='4.062' r='4'/> <circle cx='4' cy='16' r='4'/> <circle cx='4' cy='28' r='4'/> </g> </svg>",
COMMENT_ICON: "<svg version='1.1' id='Layer_2' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='15px' height='15px' viewBox='1 1.5 15 15' enable-background='new 1 1.5 15 15' xml:space='preserve'> <g> <g> <path fill='#211B1B' d='M14,1.5H3c-1.104,0-2,0.896-2,2v8c0,1.104,0.896,2,2,2h1.628l1.884,3l1.866-3H14c1.104,0,2-0.896,2-2v-8 C16,2.396,15.104,1.5,14,1.5z M15,11.5c0,0.553-0.447,1-1,1H8l-1.493,2l-1.504-1.991L5,12.5H3c-0.552,0-1-0.447-1-1v-8 c0-0.552,0.448-1,1-1h11c0.553,0,1,0.448,1,1V11.5z'/> </g> </g> </svg>",
+ UPDATE_TYPING_MS: 5000,
THEMES: {
default: {
type: 'Mattermost',
@@ -140,7 +141,7 @@ module.exports = {
sidebarText: '#333333',
sidebarUnreadText: '#333333',
sidebarTextHoverBg: '#e6f2fa',
- sidebarTextActiveBg: '#e1e1e1',
+ sidebarTextActiveBorder: '#378FD2',
sidebarTextActiveColor: '#111111',
sidebarHeaderBg: '#2389d7',
sidebarHeaderTextColor: '#ffffff',
@@ -162,7 +163,7 @@ module.exports = {
sidebarText: '#fff',
sidebarUnreadText: '#fff',
sidebarTextHoverBg: '#136197',
- sidebarTextActiveBg: '#136197',
+ sidebarTextActiveBorder: '#7AB0D6',
sidebarTextActiveColor: '#FFFFFF',
sidebarHeaderBg: '#2f81b7',
sidebarHeaderTextColor: '#FFFFFF',
@@ -184,7 +185,7 @@ module.exports = {
sidebarText: '#fff',
sidebarUnreadText: '#fff',
sidebarTextHoverBg: '#4A5664',
- sidebarTextActiveBg: '#39769C',
+ sidebarTextActiveBorder: '#39769C',
sidebarTextActiveColor: '#FFFFFF',
sidebarHeaderBg: '#1B2C3E',
sidebarHeaderTextColor: '#FFFFFF',
@@ -206,7 +207,7 @@ module.exports = {
sidebarText: '#fff',
sidebarUnreadText: '#fff',
sidebarTextHoverBg: '#302e30',
- sidebarTextActiveBg: '#484748',
+ sidebarTextActiveBorder: '#196CAF',
sidebarTextActiveColor: '#FFFFFF',
sidebarHeaderBg: '#1f1f1f',
sidebarHeaderTextColor: '#FFFFFF',
@@ -249,8 +250,8 @@ module.exports = {
uiName: 'Sidebar Text Hover BG'
},
{
- id: 'sidebarTextActiveBg',
- uiName: 'Sidebar Text Active BG'
+ id: 'sidebarTextActiveBorder',
+ uiName: 'Sidebar Text Active Border'
},
{
id: 'sidebarTextActiveColor',
@@ -301,6 +302,13 @@ module.exports = {
uiName: 'Mention Highlight Link'
}
],
+ CODE_THEMES: {
+ github: 'GitHub',
+ solarized_light: 'Solarized light',
+ monokai: 'Monokai',
+ solarized_dark: 'Solarized Dark'
+ },
+ DEFAULT_CODE_THEME: 'github',
Preferences: {
CATEGORY_DIRECT_CHANNEL_SHOW: 'direct_channel_show',
CATEGORY_DISPLAY_SETTINGS: 'display_settings'
@@ -312,6 +320,32 @@ module.exports = {
RIGHT: 39,
BACKSPACE: 8,
ENTER: 13,
- ESCAPE: 27
+ ESCAPE: 27,
+ SPACE: 32
+ },
+ HighlightedLanguages: {
+ diff: 'Diff',
+ apache: 'Apache',
+ makefile: 'Makefile',
+ http: 'HTTP',
+ json: 'JSON',
+ markdown: 'Markdown',
+ javascript: 'JavaScript',
+ css: 'CSS',
+ nginx: 'nginx',
+ objectivec: 'Objective-C',
+ python: 'Python',
+ xml: 'XML',
+ perl: 'Perl',
+ bash: 'Bash',
+ php: 'PHP',
+ coffeescript: 'CoffeeScript',
+ cs: 'C#',
+ cpp: 'C++',
+ sql: 'SQL',
+ go: 'Go',
+ ruby: 'Ruby',
+ java: 'Java',
+ ini: 'ini'
}
};
diff --git a/web/react/utils/emoticons.jsx b/web/react/utils/emoticons.jsx
index aabddcffd..bb948b6dc 100644
--- a/web/react/utils/emoticons.jsx
+++ b/web/react/utils/emoticons.jsx
@@ -2,27 +2,27 @@
// See License.txt for license information.
const emoticonPatterns = {
- smile: /(^|\s)(:-?\))($|\s)/g, // :)
- wink: /(^|\s)(;-?\))($|\s)/g, // ;)
- open_mouth: /(^|\s)(:o)($|\s)/gi, // :o
- scream: /(^|\s)(:-o)($|\s)/gi, // :-o
- smirk: /(^|\s)(:-?])($|\s)/g, // :]
- grinning: /(^|\s)(:-?d)($|\s)/gi, // :D
- stuck_out_tongue_closed_eyes: /(^|\s)(x-d)($|\s)/gi, // x-d
- stuck_out_tongue: /(^|\s)(:-?p)($|\s)/gi, // :p
- rage: /(^|\s)(:-?[\[@])($|\s)/g, // :@
- frowning: /(^|\s)(:-?\()($|\s)/g, // :(
- sob: /(^|\s)(:['’]-?\(|:&#x27;\(|:&#39;\()($|\s)/g, // :`(
- kissing_heart: /(^|\s)(:-?\*)($|\s)/g, // :*
- pensive: /(^|\s)(:-?\/)($|\s)/g, // :/
- confounded: /(^|\s)(:-?s)($|\s)/gi, // :s
- flushed: /(^|\s)(:-?\|)($|\s)/g, // :|
- relaxed: /(^|\s)(:-?\$)($|\s)/g, // :$
- mask: /(^|\s)(:-x)($|\s)/gi, // :-x
- heart: /(^|\s)(<3|&lt;3)($|\s)/g, // <3
- broken_heart: /(^|\s)(<\/3|&lt;&#x2F;3)($|\s)/g, // </3
- thumbsup: /(^|\s)(:\+1:)($|\s)/g, // :+1:
- thumbsdown: /(^|\s)(:\-1:)($|\s)/g // :-1:
+ smile: /(^|\s)(:-?\))(?=$|\s)/g, // :)
+ wink: /(^|\s)(;-?\))(?=$|\s)/g, // ;)
+ open_mouth: /(^|\s)(:o)(?=$|\s)/gi, // :o
+ scream: /(^|\s)(:-o)(?=$|\s)/gi, // :-o
+ smirk: /(^|\s)(:-?])(?=$|\s)/g, // :]
+ grinning: /(^|\s)(:-?d)(?=$|\s)/gi, // :D
+ stuck_out_tongue_closed_eyes: /(^|\s)(x-d)(?=$|\s)/gi, // x-d
+ stuck_out_tongue: /(^|\s)(:-?p)(?=$|\s)/gi, // :p
+ rage: /(^|\s)(:-?[\[@])(?=$|\s)/g, // :@
+ frowning: /(^|\s)(:-?\()(?=$|\s)/g, // :(
+ sob: /(^|\s)(:['’]-?\(|:&#x27;\(|:&#39;\()(?=$|\s)/g, // :`(
+ kissing_heart: /(^|\s)(:-?\*)(?=$|\s)/g, // :*
+ pensive: /(^|\s)(:-?\/)(?=$|\s)/g, // :/
+ confounded: /(^|\s)(:-?s)(?=$|\s)/gi, // :s
+ flushed: /(^|\s)(:-?\|)(?=$|\s)/g, // :|
+ relaxed: /(^|\s)(:-?\$)(?=$|\s)/g, // :$
+ mask: /(^|\s)(:-x)(?=$|\s)/gi, // :-x
+ heart: /(^|\s)(<3|&lt;3)(?=$|\s)/g, // <3
+ broken_heart: /(^|\s)(<\/3|&lt;&#x2F;3)(?=$|\s)/g, // </3
+ thumbsup: /(^|\s)(:\+1:)(?=$|\s)/g, // :+1:
+ thumbsdown: /(^|\s)(:\-1:)(?=$|\s)/g // :-1:
};
function initializeEmoticonMap() {
@@ -127,28 +127,28 @@ const emoticonMap = initializeEmoticonMap();
export function handleEmoticons(text, tokens) {
let output = text;
- function replaceEmoticonWithToken(match, prefix, name, suffix) {
+ function replaceEmoticonWithToken(fullMatch, prefix, matchText, name) {
if (emoticonMap[name]) {
const index = tokens.size;
const alias = `MM_EMOTICON${index}`;
tokens.set(alias, {
- value: `<img align="absmiddle" alt="${match}" class="emoji" src="${getImagePathForEmoticon(name)}" title="${match}" />`,
- originalText: match
+ value: `<img align="absmiddle" alt="${matchText}" class="emoji" src="${getImagePathForEmoticon(name)}" title="${matchText}" />`,
+ originalText: fullMatch
});
- return prefix + alias + suffix;
+ return prefix + alias;
}
- return match;
+ return fullMatch;
}
- output = output.replace(/(^|\s):([a-zA-Z0-9_-]+):($|\s)/g, replaceEmoticonWithToken);
+ output = output.replace(/(^|\s)(:([a-zA-Z0-9_-]+):)(?=$|\s)/g, (fullMatch, prefix, matchText, name) => replaceEmoticonWithToken(fullMatch, prefix, matchText, name));
$.each(emoticonPatterns, (name, pattern) => {
// this might look a bit funny, but since the name isn't contained in the actual match
// like with the named emoticons, we need to add it in manually
- output = output.replace(pattern, (match, prefix, emoticon, suffix) => replaceEmoticonWithToken(match, prefix, name, suffix));
+ output = output.replace(pattern, (fullMatch, prefix, matchText) => replaceEmoticonWithToken(fullMatch, prefix, matchText, name));
});
return output;
diff --git a/web/react/utils/markdown.jsx b/web/react/utils/markdown.jsx
index 7a4e70054..01cc309b8 100644
--- a/web/react/utils/markdown.jsx
+++ b/web/react/utils/markdown.jsx
@@ -6,6 +6,34 @@ const Utils = require('./utils.jsx');
const marked = require('marked');
+const highlightJs = require('highlight.js/lib/highlight.js');
+const highlightJsDiff = require('highlight.js/lib/languages/diff.js');
+const highlightJsApache = require('highlight.js/lib/languages/apache.js');
+const highlightJsMakefile = require('highlight.js/lib/languages/makefile.js');
+const highlightJsHttp = require('highlight.js/lib/languages/http.js');
+const highlightJsJson = require('highlight.js/lib/languages/json.js');
+const highlightJsMarkdown = require('highlight.js/lib/languages/markdown.js');
+const highlightJsJavascript = require('highlight.js/lib/languages/javascript.js');
+const highlightJsCss = require('highlight.js/lib/languages/css.js');
+const highlightJsNginx = require('highlight.js/lib/languages/nginx.js');
+const highlightJsObjectivec = require('highlight.js/lib/languages/objectivec.js');
+const highlightJsPython = require('highlight.js/lib/languages/python.js');
+const highlightJsXml = require('highlight.js/lib/languages/xml.js');
+const highlightJsPerl = require('highlight.js/lib/languages/perl.js');
+const highlightJsBash = require('highlight.js/lib/languages/bash.js');
+const highlightJsPhp = require('highlight.js/lib/languages/php.js');
+const highlightJsCoffeescript = require('highlight.js/lib/languages/coffeescript.js');
+const highlightJsCs = require('highlight.js/lib/languages/cs.js');
+const highlightJsCpp = require('highlight.js/lib/languages/cpp.js');
+const highlightJsSql = require('highlight.js/lib/languages/sql.js');
+const highlightJsGo = require('highlight.js/lib/languages/go.js');
+const highlightJsRuby = require('highlight.js/lib/languages/ruby.js');
+const highlightJsJava = require('highlight.js/lib/languages/java.js');
+const highlightJsIni = require('highlight.js/lib/languages/ini.js');
+
+const Constants = require('../utils/constants.jsx');
+const HighlightedLanguages = Constants.HighlightedLanguages;
+
export class MattermostMarkdownRenderer extends marked.Renderer {
constructor(options, formattingOptions = {}) {
super(options);
@@ -15,6 +43,43 @@ export class MattermostMarkdownRenderer extends marked.Renderer {
this.text = this.text.bind(this);
this.formattingOptions = formattingOptions;
+
+ highlightJs.registerLanguage('diff', highlightJsDiff);
+ highlightJs.registerLanguage('apache', highlightJsApache);
+ highlightJs.registerLanguage('makefile', highlightJsMakefile);
+ highlightJs.registerLanguage('http', highlightJsHttp);
+ highlightJs.registerLanguage('json', highlightJsJson);
+ highlightJs.registerLanguage('markdown', highlightJsMarkdown);
+ highlightJs.registerLanguage('javascript', highlightJsJavascript);
+ highlightJs.registerLanguage('css', highlightJsCss);
+ highlightJs.registerLanguage('nginx', highlightJsNginx);
+ highlightJs.registerLanguage('objectivec', highlightJsObjectivec);
+ highlightJs.registerLanguage('python', highlightJsPython);
+ highlightJs.registerLanguage('xml', highlightJsXml);
+ highlightJs.registerLanguage('perl', highlightJsPerl);
+ highlightJs.registerLanguage('bash', highlightJsBash);
+ highlightJs.registerLanguage('php', highlightJsPhp);
+ highlightJs.registerLanguage('coffeescript', highlightJsCoffeescript);
+ highlightJs.registerLanguage('cs', highlightJsCs);
+ highlightJs.registerLanguage('cpp', highlightJsCpp);
+ highlightJs.registerLanguage('sql', highlightJsSql);
+ highlightJs.registerLanguage('go', highlightJsGo);
+ highlightJs.registerLanguage('ruby', highlightJsRuby);
+ highlightJs.registerLanguage('java', highlightJsJava);
+ highlightJs.registerLanguage('ini', highlightJsIni);
+ }
+
+ code(code, language) {
+ if (!language || highlightJs.listLanguages().indexOf(language) < 0) {
+ let parsed = super.code(code, language);
+ return '<code class="hljs">' + $(parsed).text() + '</code>';
+ }
+
+ let parsed = highlightJs.highlight(language, code);
+ return '<div class="post-body--code">' +
+ '<span class="post-body--code__language">' + HighlightedLanguages[language] + '</span>' +
+ '<code style="white-space: pre;" class="hljs">' + parsed.value + '</code>' +
+ '</div>';
}
br() {
diff --git a/web/react/utils/text_formatting.jsx b/web/react/utils/text_formatting.jsx
index 5c2e68f1e..4b6d87254 100644
--- a/web/react/utils/text_formatting.jsx
+++ b/web/react/utils/text_formatting.jsx
@@ -91,6 +91,7 @@ export function sanitizeHtml(text) {
return output;
}
+// Convert URLs into tokens
function autolinkUrls(text, tokens) {
function replaceUrlWithToken(autolinker, match) {
const linkText = match.getMatchedText();
@@ -132,27 +133,61 @@ function autolinkUrls(text, tokens) {
}
function autolinkAtMentions(text, tokens) {
- let output = text;
+ // Return true if provided character is punctuation
+ function isPunctuation(character) {
+ const re = /[\u2000-\u206F\u2E00-\u2E7F\\'!"#$%&()*+,\-.\/:;<=>?@\[\]^_`{|}~]/g;
+ return re.test(character);
+ }
+
+ // Test if provided text needs to be highlighted, special mention or current user
+ function mentionExists(u) {
+ return (Constants.SPECIAL_MENTIONS.indexOf(u) !== -1 || UserStore.getProfileByUsername(u));
+ }
+
+ function addToken(username, mention, extraText) {
+ const index = tokens.size;
+ const alias = `MM_ATMENTION${index}`;
+
+ tokens.set(alias, {
+ value: `<a class='mention-link' href='#' data-mention='${username}'>${mention}</a>`,
+ originalText: mention,
+ extraText
+ });
+ return alias;
+ }
function replaceAtMentionWithToken(fullMatch, prefix, mention, username) {
- const usernameLower = username.toLowerCase();
- if (Constants.SPECIAL_MENTIONS.indexOf(usernameLower) !== -1 || UserStore.getProfileByUsername(usernameLower)) {
- const index = tokens.size;
- const alias = `MM_ATMENTION${index}`;
-
- tokens.set(alias, {
- value: `<a class='mention-link' href='#' data-mention='${usernameLower}'>${mention}</a>`,
- originalText: mention
- });
+ let usernameLower = username.toLowerCase();
+ if (mentionExists(usernameLower)) {
+ // Exact match
+ const alias = addToken(usernameLower, mention, '');
return prefix + alias;
}
+ // Not an exact match, attempt to truncate any punctuation to see if we can find a user
+ const originalUsername = usernameLower;
+
+ for (let c = usernameLower.length; c > 0; c--) {
+ if (isPunctuation(usernameLower[c - 1])) {
+ usernameLower = usernameLower.substring(0, c - 1);
+
+ if (mentionExists(usernameLower)) {
+ const extraText = originalUsername.substr(c - 1);
+ const alias = addToken(usernameLower, '@' + usernameLower, extraText);
+ return prefix + alias;
+ }
+ } else {
+ // If the last character is not punctuation, no point in going any further
+ break;
+ }
+ }
+
return fullMatch;
}
- output = output.replace(/(^|\s)(@([a-z0-9.\-_]*[a-z0-9]))/gi, replaceAtMentionWithToken);
-
+ let output = text;
+ output = output.replace(/(^|\s)(@([a-z0-9.\-_]*))/gi, replaceAtMentionWithToken);
return output;
}
@@ -169,10 +204,9 @@ function highlightCurrentMentions(text, tokens) {
const newAlias = `MM_SELFMENTION${index}`;
newTokens.set(newAlias, {
- value: `<span class='mention-highlight'>${alias}</span>`,
+ value: `<span class='mention-highlight'>${alias}</span>` + token.extraText,
originalText: token.originalText
});
-
output = output.replace(alias, newAlias);
}
}
@@ -246,7 +280,7 @@ function highlightSearchTerm(text, tokens, searchTerm) {
var newTokens = new Map();
for (const [alias, token] of tokens) {
- if (token.originalText === searchTerm) {
+ if (token.originalText.indexOf(searchTerm.replace(/\*$/, '')) > -1) {
const index = tokens.size + newTokens.size;
const newAlias = `MM_SEARCHTERM${index}`;
@@ -276,7 +310,7 @@ function highlightSearchTerm(text, tokens, searchTerm) {
return prefix + alias;
}
- return output.replace(new RegExp(`(^|\\W)(${searchTerm})\\b`, 'gi'), replaceSearchTermWithToken);
+ return output.replace(new RegExp(`()(${searchTerm})`, 'gi'), replaceSearchTermWithToken);
}
function replaceTokens(text, tokens) {
diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx
index b9084b26e..7a876d518 100644
--- a/web/react/utils/utils.jsx
+++ b/web/react/utils/utils.jsx
@@ -20,6 +20,7 @@ export function isEmail(email) {
export function cleanUpUrlable(input) {
var cleaned = input.trim().replace(/-/g, ' ').replace(/[^\w\s]/gi, '').toLowerCase().replace(/\s/g, '-');
+ cleaned = cleaned.replace(/-{2,}/, '-');
cleaned = cleaned.replace(/^\-+/, '');
cleaned = cleaned.replace(/\-+$/, '');
return cleaned;
@@ -118,7 +119,7 @@ export function notifyMe(title, body, channel) {
}
if (permission === 'granted') {
- var notification = new Notification(title, {body: body, tag: body, icon: '/static/images/icon50x50.gif'});
+ var notification = new Notification(title, {body: body, tag: body, icon: '/static/images/icon50x50.png'});
notification.onclick = function onClick() {
window.focus();
if (channel) {
@@ -402,6 +403,11 @@ export function toTitleCase(str) {
}
export function applyTheme(theme) {
+ if (!theme.codeTheme) {
+ theme.codeTheme = Constants.DEFAULT_CODE_THEME;
+ }
+ updateCodeTheme(theme.codeTheme);
+
if (theme.sidebarBg) {
changeCss('.sidebar--left, .settings-modal .settings-table .settings-links, .sidebar--menu', 'background:' + theme.sidebarBg, 1);
}
@@ -425,16 +431,13 @@ export function applyTheme(theme) {
changeCss('@media(max-width: 768px){.settings-modal .settings-table .nav>li:hover a', 'background:' + theme.sidebarTextHoverBg, 1);
}
- if (theme.sidebarTextActiveBg) {
- changeCss('.sidebar--left .nav-pills__container li.active a, .sidebar--left .nav-pills__container li.active a:hover, .sidebar--left .nav-pills__container li.active a:focus, .settings-modal .nav-pills>li.active a, .settings-modal .nav-pills>li.active a:hover, .settings-modal .nav-pills>li.active a:active', 'background:' + theme.sidebarTextActiveBg, 1);
+ if (theme.sidebarTextActiveBorder) {
+ changeCss('.sidebar--left .nav li.active a:before, .settings-modal .nav-pills>li.active a:before', 'background:' + theme.sidebarTextActiveBorder, 1);
}
if (theme.sidebarTextActiveColor) {
changeCss('.sidebar--left .nav-pills__container li.active a, .sidebar--left .nav-pills__container li.active a:hover, .sidebar--left .nav-pills__container li.active a:focus, .settings-modal .nav-pills>li.active a, .settings-modal .nav-pills>li.active a:hover, .settings-modal .nav-pills>li.active a:active', 'color:' + theme.sidebarTextActiveColor, 2);
- }
-
- if (theme.sidebarTextActiveBg === theme.onlineIndicator) {
- changeCss('.sidebar--left .nav-pills__container li.active a .status .online--icon', 'fill:' + theme.sidebarTextActiveColor, 1);
+ changeCss('.sidebar--left .nav li.active a, .sidebar--left .nav li.active a:hover, .sidebar--left .nav li.active a:focus', 'background:' + changeOpacity(theme.sidebarTextActiveColor, 0.1), 1);
}
if (theme.sidebarHeaderBg) {
@@ -498,7 +501,7 @@ export function applyTheme(theme) {
changeCss('.markdown__table tbody tr:nth-child(2n)', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
changeCss('.channel-header__info>div.dropdown .header-dropdown__icon', 'color:' + changeOpacity(theme.centerChannelColor, 0.8), 1);
changeCss('.channel-header #member_popover', 'color:' + changeOpacity(theme.centerChannelColor, 0.8), 1);
- changeCss('.custom-textarea, .custom-textarea:focus, .preview-container .preview-div, .post-image__column .post-image__details, .sidebar--right .sidebar-right__body, .markdown__table th, .markdown__table td, .command-box, .modal .modal-content, .settings-modal .settings-table .settings-content .divider-light, .dropdown-menu, .modal .modal-header, .popover, .mentions--top .mentions-box', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
+ changeCss('.custom-textarea, .custom-textarea:focus, .preview-container .preview-div, .post-image__column .post-image__details, .sidebar--right .sidebar-right__body, .markdown__table th, .markdown__table td, .command-box, .modal .modal-content, .settings-modal .settings-table .settings-content .divider-light, .webhooks__container, .dropdown-menu, .modal .modal-header, .popover, .mentions--top .mentions-box', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('.popover.bottom>.arrow', 'border-bottom-color:' + changeOpacity(theme.centerChannelColor, 0.25), 1);
changeCss('.popover.right>.arrow', 'border-right-color:' + changeOpacity(theme.centerChannelColor, 0.25), 1);
changeCss('.popover.left>.arrow', 'border-left-color:' + changeOpacity(theme.centerChannelColor, 0.25), 1);
@@ -513,7 +516,7 @@ export function applyTheme(theme) {
changeCss('@media(max-width: 768px){.search-bar__container .search__form .search-bar', 'background:' + changeOpacity(theme.centerChannelColor, 0.2) + '; color: inherit;', 1);
changeCss('.input-group-addon, .search-bar__container .search__form, .form-control', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('.form-control:focus', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
- changeCss('.channel-intro .channel-intro__content', 'background:' + changeOpacity(theme.centerChannelColor, 0.05), 1);
+ changeCss('.channel-intro .channel-intro__content, .webhooks__container', 'background:' + changeOpacity(theme.centerChannelColor, 0.05), 1);
changeCss('.date-separator .separator__text', 'color:' + theme.centerChannelColor, 2);
changeCss('.date-separator .separator__hr, .modal-footer, .modal .custom-textarea, .post-right__container .post.post--root hr, .search-item-container', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('.modal .custom-textarea:focus', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
@@ -525,7 +528,7 @@ export function applyTheme(theme) {
changeCss('@media(max-width: 1800px){.inner__wrap.move--left .post.post--comment.same--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07), 2);
changeCss('.post:hover, .modal .more-table tbody>tr:hover td, .sidebar--right .sidebar--right__header, .settings-modal .settings-table .settings-content .section-min:hover', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
changeCss('.date-separator.hovered--before:after, .date-separator.hovered--after:before, .new-separator.hovered--after:before, .new-separator.hovered--before:after', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
- changeCss('.command-name:hover, .mentions-name:hover, .mentions-focus, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover', 'background:' + changeOpacity(theme.centerChannelColor, 0.15), 1);
+ changeCss('.command-name:hover, .mentions-name:hover, .mentions-focus, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .bot-indicator', 'background:' + changeOpacity(theme.centerChannelColor, 0.15), 1);
changeCss('code', 'background:' + changeOpacity(theme.centerChannelColor, 0.1), 1);
changeCss('.post.current--user:hover .post-body ', 'background: none;', 1);
changeCss('.sidebar--right', 'color:' + theme.centerChannelColor, 2);
@@ -591,6 +594,27 @@ export function rgb2hex(rgbIn) {
return '#' + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}
+export function updateCodeTheme(theme) {
+ const path = '/static/css/highlight/' + theme + '.css';
+ const $link = $('link.code_theme');
+ if (path !== $link.attr('href')) {
+ changeCss('code.hljs', 'visibility: hidden');
+ var xmlHTTP = new XMLHttpRequest();
+ xmlHTTP.open('GET', path, true);
+ xmlHTTP.onload = function onLoad() {
+ $link.attr('href', path);
+ if (isBrowserFirefox()) {
+ $link.one('load', () => {
+ changeCss('code.hljs', 'visibility: visible');
+ });
+ } else {
+ changeCss('code.hljs', 'visibility: visible');
+ }
+ };
+ xmlHTTP.send();
+ }
+}
+
export function placeCaretAtEnd(el) {
el.focus();
if (typeof window.getSelection != 'undefined' && typeof document.createRange != 'undefined') {
@@ -873,7 +897,7 @@ export function getFileUrl(filename) {
if (url.indexOf('/api/v1/files/get') !== -1) {
url = filename.split('/api/v1/files/get')[1];
}
- url = getWindowLocationOrigin() + '/api/v1/files/get' + url;
+ url = getWindowLocationOrigin() + '/api/v1/files/get' + url + '?' + getSessionIndex();
return url;
}
@@ -884,6 +908,14 @@ export function getFileName(path) {
return split[split.length - 1];
}
+export function getSessionIndex() {
+ if (global.window.mm_session_token_index >= 0) {
+ return 'session_token_index=' + global.window.mm_session_token_index;
+ }
+
+ return '';
+}
+
// Generates a RFC-4122 version 4 compliant globally unique identifier.
export function generateId() {
// implementation taken from http://stackoverflow.com/a/2117523
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-10-30 13:43:39 +0000