From 20abb2c2dfd15eb339d9730589cf65fada4299cb Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 21 Apr 2017 13:01:10 +0100 Subject: [PATCH 001/147] Add Forward Message button to m.room.message events Conform this file to eslint Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .../views/context_menus/MessageContextMenu.js | 64 ++++++++++++------- 1 file changed, 41 insertions(+), 23 deletions(-) diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index db416b8a..4a6c9788 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -16,13 +16,13 @@ limitations under the License. 'use strict'; -var React = require('react'); +const React = require('react'); -var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); -var dis = require('matrix-react-sdk/lib/dispatcher'); -var sdk = require('matrix-react-sdk'); -var Modal = require('matrix-react-sdk/lib/Modal'); -var Resend = require("matrix-react-sdk/lib/Resend"); +const MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); +const dis = require('matrix-react-sdk/lib/dispatcher'); +const sdk = require('matrix-react-sdk'); +const Modal = require('matrix-react-sdk/lib/Modal'); +const Resend = require("matrix-react-sdk/lib/Resend"); import * as UserSettingsStore from 'matrix-react-sdk/lib/UserSettingsStore'; module.exports = React.createClass({ @@ -45,7 +45,7 @@ module.exports = React.createClass({ }, onViewSourceClick: function() { - var ViewSource = sdk.getComponent('structures.ViewSource'); + const ViewSource = sdk.getComponent('structures.ViewSource'); Modal.createDialog(ViewSource, { content: this.props.mxEvent.event, }, 'mx_Dialog_viewsource'); @@ -70,12 +70,12 @@ module.exports = React.createClass({ MatrixClientPeg.get().redactEvent( this.props.mxEvent.getRoomId(), this.props.mxEvent.getId() ).catch(function(e) { - var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); // display error message stating you couldn't delete this. - var code = e.errcode || e.statusCode; + const code = e.errcode || e.statusCode; Modal.createDialog(ErrorDialog, { title: "Error", - description: "You cannot delete this message. (" + code + ")" + description: "You cannot delete this message. (" + code + ")", }); }).done(); }, @@ -88,6 +88,14 @@ module.exports = React.createClass({ if (this.props.onFinished) this.props.onFinished(); }, + onForwardClick: function() { + dis.dispatch({ + action: 'forward_message', + content: this.props.mxEvent.getContent(), + }); + this.closeMenu(); + }, + closeMenu: function() { if (this.props.onFinished) this.props.onFinished(); }, @@ -99,7 +107,7 @@ module.exports = React.createClass({ if (this.props.onFinished) this.props.onFinished(); }, - onQuoteClick: function () { + onQuoteClick: function() { console.log(this.props.mxEvent); dis.dispatch({ action: 'quote', @@ -108,15 +116,16 @@ module.exports = React.createClass({ }, render: function() { - var eventStatus = this.props.mxEvent.status; - var resendButton; - var viewSourceButton; - var viewClearSourceButton; - var redactButton; - var cancelButton; - var permalinkButton; - var unhidePreviewButton; - var externalURLButton; + const eventStatus = this.props.mxEvent.status; + let resendButton; + let redactButton; + let cancelButton; + let forwardButton; + let viewSourceButton; + let viewClearSourceButton; + let unhidePreviewButton; + let permalinkButton; + let externalURLButton; if (eventStatus === 'not_sent') { resendButton = ( @@ -142,6 +151,14 @@ module.exports = React.createClass({ ); } + if (this.props.mxEvent.getType() === 'm.room.message') { + forwardButton = ( +
+ Forward Message +
+ ); + } + viewSourceButton = (
View Source @@ -162,7 +179,7 @@ module.exports = React.createClass({
Unhide Preview
- ) + ); } } @@ -185,7 +202,7 @@ module.exports = React.createClass({ externalURLButton = (
Source URL + rel="noopener" target="_blank" onClick={ this.closeMenu }>Source URL
); } @@ -196,6 +213,7 @@ module.exports = React.createClass({ {resendButton} {redactButton} {cancelButton} + {forwardButton} {viewSourceButton} {viewClearSourceButton} {unhidePreviewButton} @@ -204,5 +222,5 @@ module.exports = React.createClass({ {externalURLButton}
); - } + }, }); From 77ce58b59d8e382568cf436f5eeaef56d6a495f6 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 21 Apr 2017 12:58:43 +0100 Subject: [PATCH 002/147] add .idea to .gitignore so I don't accidentally push my IDE config Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .gitignore | 1 + 1 file changed, 1 insertion(+) diff --git a/.gitignore b/.gitignore index c28df64c..c9e9b250 100644 --- a/.gitignore +++ b/.gitignore @@ -12,3 +12,4 @@ npm-debug.log electron/dist electron/pub +/.idea From 92b52a61e71f808a65afc0e4d93aa9a08f5a022b Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 24 Apr 2017 18:33:25 +0100 Subject: [PATCH 003/147] don't show forward option for things we cannot decrypt Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/context_menus/MessageContextMenu.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index 4a6c9788..5de8d18d 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -151,7 +151,8 @@ module.exports = React.createClass({ ); } - if (this.props.mxEvent.getType() === 'm.room.message') { + if (this.props.mxEvent.getType() === 'm.room.message' + && this.props.mxEvent.getContent().msgtype !== 'm.bad.encrypted') { forwardButton = (
Forward Message From 9124c1475aecbe6dd6713e3ec5e2c80c5528c3c9 Mon Sep 17 00:00:00 2001 From: turt2live Date: Mon, 24 Apr 2017 12:48:32 -0600 Subject: [PATCH 004/147] Change redact -> remove to improve clarity Addresses #2814 Non-technical users may not understand what 'redact' means and can more easily understand what 'Remove' does. See discussion on vector-im/riot-web#2814 for more information. Signed-off-by: Travis Ralston --- src/components/views/context_menus/MessageContextMenu.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index db416b8a..5a7356a1 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -129,7 +129,7 @@ module.exports = React.createClass({ if (!eventStatus && !this.props.mxEvent.isRedacted()) { // sent and not redacted redactButton = (
- Redact + Remove
); } From 0a1ebc2487cf3f85f017b93f21088215136342a2 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 24 Apr 2017 22:43:02 +0100 Subject: [PATCH 005/147] Don't show for anything that doesn't have a msgtype and body otherwise the server will just reject it anyway Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .../views/context_menus/MessageContextMenu.js | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index 5de8d18d..002ec5bc 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -151,13 +151,17 @@ module.exports = React.createClass({ ); } - if (this.props.mxEvent.getType() === 'm.room.message' - && this.props.mxEvent.getContent().msgtype !== 'm.bad.encrypted') { - forwardButton = ( -
- Forward Message -
- ); + if (this.props.mxEvent.getType() === 'm.room.message') { + const content = this.props.mxEvent.getContent(); + if (content.msgtype // truthy check msgtype + && content.msgtype !== 'm.bad.encrypted' + && content.hasOwnProperty('body')) { + forwardButton = ( +
+ Forward Message +
+ ); + } } viewSourceButton = ( From bbda658b7f7e0dd4b173b2b4ed02484ff9eba170 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sat, 13 May 2017 12:37:13 +0100 Subject: [PATCH 006/147] make Electron tray icon mimic the Favico.js one DRY: moved Favicon stuff into the base platform Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- electron_app/src/tray.js | 16 ++++---- src/vector/platform/VectorBasePlatform.js | 47 ++++++++++++++++++++++- src/vector/platform/WebPlatform.js | 44 --------------------- 3 files changed, 55 insertions(+), 52 deletions(-) diff --git a/electron_app/src/tray.js b/electron_app/src/tray.js index 2ccdf40c..ab3a8e1c 100644 --- a/electron_app/src/tray.js +++ b/electron_app/src/tray.js @@ -15,12 +15,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -const path = require('path'); -const electron = require('electron'); - -const app = electron.app; -const Tray = electron.Tray; -const MenuItem = electron.MenuItem; +const {app, Tray, Menu, nativeImage} = require('electron'); let trayIcon = null; @@ -44,7 +39,7 @@ exports.create = function (win, config) { } }; - const contextMenu = electron.Menu.buildFromTemplate([ + const contextMenu = Menu.buildFromTemplate([ { label: 'Show/Hide ' + config.brand, click: toggleWin @@ -64,4 +59,11 @@ exports.create = function (win, config) { trayIcon.setToolTip(config.brand); trayIcon.setContextMenu(contextMenu); trayIcon.on('click', toggleWin); + + win.webContents.on('page-favicon-updated', function(ev, favicons) { + try { + const img = nativeImage.createFromDataURL(favicons[0]); + trayIcon.setImage(img); + } catch (e) {console.error(e);} + }); }; diff --git a/src/vector/platform/VectorBasePlatform.js b/src/vector/platform/VectorBasePlatform.js index 1466b76a..00c9c47c 100644 --- a/src/vector/platform/VectorBasePlatform.js +++ b/src/vector/platform/VectorBasePlatform.js @@ -17,12 +17,57 @@ See the License for the specific language governing permissions and limitations under the License. */ -import BasePlatform from 'matrix-react-sdk/lib/BasePlatform' +import BasePlatform from 'matrix-react-sdk/lib/BasePlatform'; +import Favico from 'favico.js'; /** * Vector-specific extensions to the BasePlatform template */ export default class VectorBasePlatform extends BasePlatform { + constructor() { + super(); + + // The 'animations' are really low framerate and look terrible. + // Also it re-starts the animationb every time you set the badge, + // and we set the state each time, even if the value hasn't changed, + // so we'd need to fix that if enabling the animation. + this.favicon = new Favico({animation: 'none'}); + this._updateFavicon(); + } + + _updateFavicon() { + try { + // This needs to be in in a try block as it will throw + // if there are more than 100 badge count changes in + // its internal queue + let bgColor = "#d00", + notif = this.notificationCount; + + if (this.errorDidOccur) { + notif = notif || "×"; + bgColor = "#f00"; + } + + this.favicon.badge(notif, { + bgColor: bgColor, + }); + } catch (e) { + console.warn(`Failed to set badge count: ${e.message}`); + } + } + + setNotificationCount(count: number) { + if (this.notificationCount === count) return; + super.setNotificationCount(count); + this._updateFavicon(); + } + + setErrorStatus(errorDidOccur: boolean) { + if (this.errorDidOccur === errorDidOccur) return; + super.setErrorStatus(errorDidOccur); + this._updateFavicon(); + } + /** * Check for the availability of an update to the version of the * app that's currently running. diff --git a/src/vector/platform/WebPlatform.js b/src/vector/platform/WebPlatform.js index 72ca19f0..204317ba 100644 --- a/src/vector/platform/WebPlatform.js +++ b/src/vector/platform/WebPlatform.js @@ -18,7 +18,6 @@ limitations under the License. */ import VectorBasePlatform from './VectorBasePlatform'; -import Favico from 'favico.js'; import request from 'browser-request'; import dis from 'matrix-react-sdk/lib/dispatcher.js'; import q from 'q'; @@ -27,49 +26,6 @@ import url from 'url'; import UAParser from 'ua-parser-js'; export default class WebPlatform extends VectorBasePlatform { - constructor() { - super(); - this.runningVersion = null; - // The 'animations' are really low framerate and look terrible. - // Also it re-starts the animationb every time you set the badge, - // and we set the state each time, even if the value hasn't changed, - // so we'd need to fix that if enabling the animation. - this.favicon = new Favico({animation: 'none'}); - this._updateFavicon(); - } - - _updateFavicon() { - try { - // This needs to be in in a try block as it will throw - // if there are more than 100 badge count changes in - // its internal queue - let bgColor = "#d00", - notif = this.notificationCount; - - if (this.errorDidOccur) { - notif = notif || "×"; - bgColor = "#f00"; - } - - this.favicon.badge(notif, { - bgColor: bgColor, - }); - } catch (e) { - console.warn(`Failed to set badge count: ${e.message}`); - } - } - - setNotificationCount(count: number) { - if (this.notificationCount === count) return; - super.setNotificationCount(count); - this._updateFavicon(); - } - - setErrorStatus(errorDidOccur: boolean) { - if (this.errorDidOccur === errorDidOccur) return; - super.setErrorStatus(errorDidOccur); - this._updateFavicon(); - } /** * Returns true if the platform supports displaying From 8927afca036cda1f0cc2b1c0cac23f4510fa351d Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sat, 13 May 2017 12:37:27 +0100 Subject: [PATCH 007/147] re-add electron node modules to gitignore Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .gitignore | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.gitignore b/.gitignore index 6dd2b988..6072f0ff 100644 --- a/.gitignore +++ b/.gitignore @@ -5,7 +5,7 @@ /key.pem /lib /node_modules -/electron/node_modules +/electron_app/node_modules /packages/ /webapp /.npmrc From 6aae97b81204e20ef463ecbfa903af7658dbd6de Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sat, 13 May 2017 12:39:55 +0100 Subject: [PATCH 008/147] Update tray tooltip based on document.title Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- electron_app/src/tray.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/electron_app/src/tray.js b/electron_app/src/tray.js index ab3a8e1c..b0a657a0 100644 --- a/electron_app/src/tray.js +++ b/electron_app/src/tray.js @@ -66,4 +66,8 @@ exports.create = function (win, config) { trayIcon.setImage(img); } catch (e) {console.error(e);} }); + + win.webContents.on('page-title-updated', function(ev, title) { + trayIcon.setToolTip(title); + }); }; From 808240eef9bfef0a4e685933bd986b8347bead1e Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sat, 13 May 2017 12:40:17 +0100 Subject: [PATCH 009/147] shouldn't need this try-catch Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- electron_app/src/tray.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/electron_app/src/tray.js b/electron_app/src/tray.js index b0a657a0..75104042 100644 --- a/electron_app/src/tray.js +++ b/electron_app/src/tray.js @@ -61,10 +61,7 @@ exports.create = function (win, config) { trayIcon.on('click', toggleWin); win.webContents.on('page-favicon-updated', function(ev, favicons) { - try { - const img = nativeImage.createFromDataURL(favicons[0]); - trayIcon.setImage(img); - } catch (e) {console.error(e);} + trayIcon.setImage(nativeImage.createFromDataURL(favicons[0])); }); win.webContents.on('page-title-updated', function(ev, title) { From aa7728cad39f388f607cea1eb810eec5ea33a4f2 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sat, 13 May 2017 12:41:13 +0100 Subject: [PATCH 010/147] tidy up tray.js - it made my eyes hurt Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- electron_app/src/tray.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/electron_app/src/tray.js b/electron_app/src/tray.js index 75104042..7198356c 100644 --- a/electron_app/src/tray.js +++ b/electron_app/src/tray.js @@ -21,15 +21,15 @@ let trayIcon = null; exports.hasTray = function hasTray() { return (trayIcon !== null); -} +}; -exports.create = function (win, config) { +exports.create = function(win, config) { // no trays on darwin if (process.platform === 'darwin' || trayIcon) { return; } - const toggleWin = function () { + const toggleWin = function() { if (win.isVisible() && !win.isMinimized()) { win.hide(); } else { @@ -42,17 +42,17 @@ exports.create = function (win, config) { const contextMenu = Menu.buildFromTemplate([ { label: 'Show/Hide ' + config.brand, - click: toggleWin + click: toggleWin, }, { - type: 'separator' + type: 'separator', }, { label: 'Quit', - click: function () { + click: function() { app.quit(); - } - } + }, + }, ]); trayIcon = new Tray(config.icon_path); From cef26a5b20601904ae104cf1688f9721edfb83c8 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@googlemail.com> Date: Mon, 15 May 2017 21:14:01 +0100 Subject: [PATCH 011/147] fix #3894 --- scripts/package.sh | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scripts/package.sh b/scripts/package.sh index cffb6d28..23d0925b 100755 --- a/scripts/package.sh +++ b/scripts/package.sh @@ -21,7 +21,7 @@ npm run build$dev cp config.sample.json webapp/ mkdir -p dist -cp -r webapp vector-$version +cp -r webapp riot-$version # if $version looks like semver with leading v, strip it before writing to file if [[ ${version} =~ ^v[[:digit:]]+\.[[:digit:]]+\.[[:digit:]]+(-.+)?$ ]]; then From 3cead032c2fe1a0b0034c2a3b2c06248ebc2c564 Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 16 May 2017 16:27:58 +0100 Subject: [PATCH 012/147] Revert "Merge pull request #3804 from vector-im/dbkr/left_panel_for_newbies_2" This reverts commit e6133820a2f70f94e693f6352da71c03ef5a079a, reversing changes made to d1db602b3a3e735430016af2fc837841feafdb43. --- src/components/structures/BottomLeftMenu.js | 127 +++++++++++++++--- src/components/structures/RoomSubList.js | 19 ++- .../structures/RoomSubListHeader.js | 44 +++--- src/skins/vector/css/_components.scss | 1 - .../views/elements/_RoleButton.scss | 33 ----- .../views/rooms/_RoomList.scss | 23 ---- .../css/vector-web/structures/_LeftPanel.scss | 34 +++-- 7 files changed, 170 insertions(+), 111 deletions(-) delete mode 100644 src/skins/vector/css/matrix-react-sdk/views/elements/_RoleButton.scss diff --git a/src/components/structures/BottomLeftMenu.js b/src/components/structures/BottomLeftMenu.js index 63dfac60..f378cac6 100644 --- a/src/components/structures/BottomLeftMenu.js +++ b/src/components/structures/BottomLeftMenu.js @@ -1,6 +1,5 @@ /* Copyright 2015, 2016 OpenMarket Ltd -Copyright 2017 Vector Creations Ltd Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -15,8 +14,13 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from 'react'; -import sdk from 'matrix-react-sdk'; +'use strict'; + +var React = require('react'); +var ReactDOM = require('react-dom'); +var sdk = require('matrix-react-sdk') +var dis = require('matrix-react-sdk/lib/dispatcher'); +var AccessibleButton = require('matrix-react-sdk/lib/components/views/elements/AccessibleButton'); module.exports = React.createClass({ displayName: 'BottomLeftMenu', @@ -26,28 +30,121 @@ module.exports = React.createClass({ teamToken: React.PropTypes.string, }, + getInitialState: function() { + return({ + directoryHover : false, + roomsHover : false, + homeHover: false, + peopleHover : false, + settingsHover : false, + }); + }, + + // Room events + onDirectoryClick: function() { + dis.dispatch({ action: 'view_room_directory' }); + }, + + onDirectoryMouseEnter: function() { + this.setState({ directoryHover: true }); + }, + + onDirectoryMouseLeave: function() { + this.setState({ directoryHover: false }); + }, + + onRoomsClick: function() { + dis.dispatch({ action: 'view_create_room' }); + }, + + onRoomsMouseEnter: function() { + this.setState({ roomsHover: true }); + }, + + onRoomsMouseLeave: function() { + this.setState({ roomsHover: false }); + }, + + // Home button events + onHomeClick: function() { + dis.dispatch({ action: 'view_home_page' }); + }, + + onHomeMouseEnter: function() { + this.setState({ homeHover: true }); + }, + + onHomeMouseLeave: function() { + this.setState({ homeHover: false }); + }, + + // People events + onPeopleClick: function() { + dis.dispatch({ action: 'view_create_chat' }); + }, + + onPeopleMouseEnter: function() { + this.setState({ peopleHover: true }); + }, + + onPeopleMouseLeave: function() { + this.setState({ peopleHover: false }); + }, + + // Settings events + onSettingsClick: function() { + dis.dispatch({ action: 'view_user_settings' }); + }, + + onSettingsMouseEnter: function() { + this.setState({ settingsHover: true }); + }, + + onSettingsMouseLeave: function() { + this.setState({ settingsHover: false }); + }, + + // Get the label/tooltip to show + getLabel: function(label, show) { + if (show) { + var RoomTooltip = sdk.getComponent("rooms.RoomTooltip"); + return ; + } + }, + render: function() { - const HomeButton = sdk.getComponent('elements.HomeButton'); - const StartChatButton = sdk.getComponent('elements.StartChatButton'); - const RoomDirectoryButton = sdk.getComponent('elements.RoomDirectoryButton'); - const CreateRoomButton = sdk.getComponent('elements.CreateRoomButton'); - const SettingsButton = sdk.getComponent('elements.SettingsButton'); + var TintableSvg = sdk.getComponent('elements.TintableSvg'); var homeButton; if (this.props.teamToken) { - homeButton = ; + homeButton = ( + + + { this.getLabel("Welcome page", this.state.homeHover) } + + ); } return (
{ homeButton } - - - - - - + + + { this.getLabel("Start chat", this.state.peopleHover) } + + + + { this.getLabel("Room directory", this.state.directoryHover) } + + + + { this.getLabel("Create new room", this.state.roomsHover) } + + + + { this.getLabel("Settings", this.state.settingsHover) } +
); diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index ab6c4422..c315ae46 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -1,5 +1,4 @@ /* -Copyright 2017 Vector Creations Ltd Copyright 2015, 2016 OpenMarket Ltd Licensed under the Apache License, Version 2.0 (the "License"); @@ -84,8 +83,6 @@ var RoomSubList = React.createClass({ incomingCall: React.PropTypes.object, onShowMoreRooms: React.PropTypes.func, searchFilter: React.PropTypes.string, - emptyContent: React.PropTypes.node, // content shown if the list is empty - headerItems: React.PropTypes.node, // content shown in the sublist header }, getInitialState: function() { @@ -472,15 +469,16 @@ var RoomSubList = React.createClass({ render: function() { var connectDropTarget = this.props.connectDropTarget; + var RoomDropTarget = sdk.getComponent('rooms.RoomDropTarget'); var TruncatedList = sdk.getComponent('elements.TruncatedList'); var label = this.props.collapsed ? null : this.props.label; - let content; - if (this.state.sortedList.length == 0) { - content = this.props.emptyContent; - } else { - content = this.makeRoomTiles(); + //console.log("render: " + JSON.stringify(this.state.sortedList)); + + var target; + if (this.state.sortedList.length == 0 && this.props.editable) { + target = ; } var roomCount = this.props.list.length > 0 ? this.props.list.length : ''; @@ -500,7 +498,8 @@ var RoomSubList = React.createClass({ if (!this.state.hidden) { subList = - { content } + { target } + { this.makeRoomTiles() } ; } else { @@ -522,7 +521,6 @@ var RoomSubList = React.createClass({ roomNotificationCount={ this.roomNotificationCount() } onClick={ this.onClick } onHeaderClick={ this.props.onHeaderClick } - headerItems={this.props.headerItems} /> { subList }
@@ -544,7 +542,6 @@ var RoomSubList = React.createClass({ roomNotificationCount={ this.roomNotificationCount() } onClick={ this.onClick } onHeaderClick={ this.props.onHeaderClick } - headerItems={this.props.headerItems} /> : undefined } { (this.props.showSpinner && !this.state.hidden) ? : undefined } diff --git a/src/components/structures/RoomSubListHeader.js b/src/components/structures/RoomSubListHeader.js index 74094ae0..ad9aff5f 100644 --- a/src/components/structures/RoomSubListHeader.js +++ b/src/components/structures/RoomSubListHeader.js @@ -14,11 +14,16 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from 'react'; -import classNames from 'classnames'; -import sdk from 'matrix-react-sdk'; -import { formatCount } from 'matrix-react-sdk/lib/utils/FormattingUtils'; -import AccessibleButton from 'matrix-react-sdk/lib/components/views/elements/AccessibleButton'; +'use strict'; + +var React = require('react'); +var ReactDOM = require('react-dom'); +var classNames = require('classnames'); +var sdk = require('matrix-react-sdk') +var FormattingUtils = require('matrix-react-sdk/lib/utils/FormattingUtils'); +var RoomNotifs = require('matrix-react-sdk/lib/RoomNotifs'); +var AccessibleButton = require('matrix-react-sdk/lib/components/views/elements/AccessibleButton'); +var ConstantTimeDispatcher = require('matrix-react-sdk/lib/ConstantTimeDispatcher'); module.exports = React.createClass({ displayName: 'RoomSubListHeader', @@ -37,7 +42,6 @@ module.exports = React.createClass({ hidden: React.PropTypes.bool, onClick: React.PropTypes.func, onHeaderClick: React.PropTypes.func, - headerItems: React.PropTypes.node, // content shown in the sublist header }, getDefaultProps: function() { @@ -59,34 +63,35 @@ module.exports = React.createClass({ // }, render: function() { - const TintableSvg = sdk.getComponent("elements.TintableSvg"); + var TintableSvg = sdk.getComponent("elements.TintableSvg"); - const subListNotifications = this.props.roomNotificationCount; - const subListNotifCount = subListNotifications[0]; - const subListNotifHighlight = subListNotifications[1]; + var subListNotifications = this.props.roomNotificationCount; + var subListNotifCount = subListNotifications[0]; + var subListNotifHighlight = subListNotifications[1]; - const chevronClasses = classNames({ + var chevronClasses = classNames({ 'mx_RoomSubList_chevron': true, 'mx_RoomSubList_chevronRight': this.props.hidden, 'mx_RoomSubList_chevronDown': !this.props.hidden, }); - const badgeClasses = classNames({ + var badgeClasses = classNames({ 'mx_RoomSubList_badge': true, 'mx_RoomSubList_badgeHighlight': subListNotifHighlight, }); - let badge; + var badge; if (subListNotifCount > 0) { - badge =
{ formatCount(subListNotifCount) }
; - } else if (subListNotifHighlight) { + badge =
{ FormattingUtils.formatCount(subListNotifCount) }
; + } + else if (subListNotifHighlight) { badge =
!
; } // When collapsed, allow a long hover on the header to show user // the full tag name and room count - let title; - const roomCount = this.props.roomCount; + var title; + var roomCount = this.props.roomCount; if (this.props.collapsed) { title = this.props.label; if (roomCount !== '') { @@ -94,9 +99,9 @@ module.exports = React.createClass({ } } - let incomingCall; + var incomingCall; if (this.props.isIncomingCallRoom) { - const IncomingCallBox = sdk.getComponent("voip.IncomingCallBox"); + var IncomingCallBox = sdk.getComponent("voip.IncomingCallBox"); incomingCall = ; } @@ -104,7 +109,6 @@ module.exports = React.createClass({
{ this.props.collapsed ? '' : this.props.label } - {this.props.headerItems}
{ roomCount }
{ badge } diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss index 5b23bb82..df3c4600 100644 --- a/src/skins/vector/css/_components.scss +++ b/src/skins/vector/css/_components.scss @@ -27,7 +27,6 @@ @import "./matrix-react-sdk/views/elements/_MemberEventListSummary.scss"; @import "./matrix-react-sdk/views/elements/_ProgressBar.scss"; @import "./matrix-react-sdk/views/elements/_RichText.scss"; -@import "./matrix-react-sdk/views/elements/_RoleButton.scss"; @import "./matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss"; @import "./matrix-react-sdk/views/login/_ServerConfig.scss"; @import "./matrix-react-sdk/views/messages/_MEmoteBody.scss"; diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/_RoleButton.scss b/src/skins/vector/css/matrix-react-sdk/views/elements/_RoleButton.scss deleted file mode 100644 index 094e0b9b..00000000 --- a/src/skins/vector/css/matrix-react-sdk/views/elements/_RoleButton.scss +++ /dev/null @@ -1,33 +0,0 @@ -/* -Copyright 2107 Vector Creations Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.mx_RoleButton { - margin-left: 4px; - margin-right: 4px; - cursor: pointer; - display: inline-block; -} - -.mx_RoleButton object { - pointer-events: none; -} - -.mx_RoleButton_tooltip { - display: inline-block; - position: relative; - top: -25px; - left: 6px; -} diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomList.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomList.scss index 35787ca0..110dcd5b 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomList.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomList.scss @@ -1,6 +1,5 @@ /* Copyright 2015, 2016 OpenMarket Ltd -Copyright 2107 Vector Creations Ltd Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -38,25 +37,3 @@ limitations under the License. .mx_RoomList_scrollbar .gm-scrollbar.-vertical { z-index: 6; } - -.mx_RoomList_emptySubListTip { - font-size: 13px; - margin-left: 18px; - margin-right: 18px; - margin-top: 8px; - margin-bottom: 7px; - padding: 5px; - border: 1px dashed $accent-color; - color: $primary-fg-color; - background-color: $droptarget-bg-color; - border-radius: 4px; -} - -.mx_RoomList_emptySubListTip .mx_RoleButton { - vertical-align: -3px; -} - -.mx_RoomList_headerButtons { - position: absolute; - right: 60px; -} diff --git a/src/skins/vector/css/vector-web/structures/_LeftPanel.scss b/src/skins/vector/css/vector-web/structures/_LeftPanel.scss index f171591c..d3bbce1b 100644 --- a/src/skins/vector/css/vector-web/structures/_LeftPanel.scss +++ b/src/skins/vector/css/vector-web/structures/_LeftPanel.scss @@ -64,25 +64,43 @@ limitations under the License. pointer-events: none; } -.collapsed .mx_RoleButton { +.mx_LeftPanel .mx_BottomLeftMenu_homePage, +.mx_LeftPanel .mx_BottomLeftMenu_directory, +.mx_LeftPanel .mx_BottomLeftMenu_createRoom, +.mx_LeftPanel .mx_BottomLeftMenu_people, +.mx_LeftPanel .mx_BottomLeftMenu_settings { + display: inline-block; + cursor: pointer; +} + +.collapsed .mx_BottomLeftMenu_homePage, +.collapsed .mx_BottomLeftMenu_directory, +.collapsed .mx_BottomLeftMenu_createRoom, +.collapsed .mx_BottomLeftMenu_people, +.collapsed .mx_BottomLeftMenu_settings { margin-right: 0px ! important; padding-top: 3px ! important; padding-bottom: 3px ! important; } -.mx_BottomLeftMenu_options .mx_RoleButton { - margin-left: 0px; +.mx_LeftPanel .mx_BottomLeftMenu_homePage, +.mx_LeftPanel .mx_BottomLeftMenu_directory, +.mx_LeftPanel .mx_BottomLeftMenu_createRoom, +.mx_LeftPanel .mx_BottomLeftMenu_people { margin-right: 10px; } -.mx_BottomLeftMenu_options .mx_BottomLeftMenu_settings { +.mx_LeftPanel .mx_BottomLeftMenu_settings { float: right; } -.mx_BottomLeftMenu_options .mx_BottomLeftMenu_settings .mx_RoleButton { - margin-right: 0px; -} - .mx_LeftPanel.collapsed .mx_BottomLeftMenu_settings { float: none; } + +.mx_LeftPanel .mx_BottomLeftMenu_tooltip { + display: inline-block; + position: relative; + top: -25px; + left: 6px; +} From 03476705b1cccf03070bdc55af5139450dd1c1cc Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 16 May 2017 16:35:06 +0100 Subject: [PATCH 013/147] Revert "better solution to incomingcallbox weirdness" This reverts commit be527874730d959fa980e81c897a658a03952aad. --- src/components/structures/RoomSubListHeader.js | 2 +- .../css/matrix-react-sdk/views/voip/_IncomingCallbox.scss | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/structures/RoomSubListHeader.js b/src/components/structures/RoomSubListHeader.js index ad9aff5f..eb73f721 100644 --- a/src/components/structures/RoomSubListHeader.js +++ b/src/components/structures/RoomSubListHeader.js @@ -112,8 +112,8 @@ module.exports = React.createClass({
{ roomCount }
{ badge } + { incomingCall } - { incomingCall }
); }, diff --git a/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss b/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss index 64eac25d..e63814f5 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss @@ -25,6 +25,8 @@ limitations under the License. margin-top: -3px; margin-left: -20px; width: 200px; + font-weight: initial; + text-transform: initial; } .mx_IncomingCallBox_chevron { From 9399b7ddf0cf7b272e527b9086fc6fe68db2e66d Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 16 May 2017 16:35:17 +0100 Subject: [PATCH 014/147] Revert "fix incoming call box" This reverts commit b3431bb75008b068a2a1805803b91d0ff2616571. --- src/components/structures/RoomSubList.js | 1 - src/components/structures/RoomSubListHeader.js | 1 - .../vector/css/matrix-react-sdk/structures/_RoomView.scss | 4 ++-- .../css/matrix-react-sdk/views/voip/_IncomingCallbox.scss | 2 -- 4 files changed, 2 insertions(+), 6 deletions(-) diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index c315ae46..f741a30f 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -516,7 +516,6 @@ var RoomSubList = React.createClass({ roomCount={ roomCount } collapsed={ this.props.collapsed } hidden={ this.state.hidden } - incomingCall={ this.props.incomingCall } isIncomingCallRoom={ isIncomingCallRoom } roomNotificationCount={ this.roomNotificationCount() } onClick={ this.onClick } diff --git a/src/components/structures/RoomSubListHeader.js b/src/components/structures/RoomSubListHeader.js index eb73f721..5618b39b 100644 --- a/src/components/structures/RoomSubListHeader.js +++ b/src/components/structures/RoomSubListHeader.js @@ -36,7 +36,6 @@ module.exports = React.createClass({ React.PropTypes.number ]), collapsed: React.PropTypes.bool.isRequired, // is LeftPanel collapsed? - incomingCall: React.PropTypes.object, isIncomingCallRoom: React.PropTypes.bool, roomNotificationCount: React.PropTypes.array, hidden: React.PropTypes.bool, diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_RoomView.scss b/src/skins/vector/css/matrix-react-sdk/structures/_RoomView.scss index e251ecd1..3d5fe029 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/_RoomView.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/_RoomView.scss @@ -172,7 +172,7 @@ hr.mx_RoomView_myReadMarker { max-height: 0px; background-color: $primary-bg-color; - z-index: 5; + z-index: 1000; overflow: hidden; -webkit-transition: all .2s ease-out; @@ -260,4 +260,4 @@ hr.mx_RoomView_myReadMarker { .mx_RoomView_ongoingConfCallNotification a { color: $accent-fg-color ! important; -} +} \ No newline at end of file diff --git a/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss b/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss index e63814f5..64eac25d 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/voip/_IncomingCallbox.scss @@ -25,8 +25,6 @@ limitations under the License. margin-top: -3px; margin-left: -20px; width: 200px; - font-weight: initial; - text-transform: initial; } .mx_IncomingCallBox_chevron { From fdf326c9f0651c9766d55bc5aeddd60d5e0372d1 Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 16 May 2017 17:13:39 +0100 Subject: [PATCH 015/147] Revert "Cancel quick-search on Escape, clearing it and returning focus to composer." This reverts commit 52a119244b2ff221c32c082166e77f9913833573. --- src/components/structures/SearchBox.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/components/structures/SearchBox.js b/src/components/structures/SearchBox.js index d0868b69..d79617c0 100644 --- a/src/components/structures/SearchBox.js +++ b/src/components/structures/SearchBox.js @@ -100,10 +100,6 @@ module.exports = React.createClass({ } switch (ev.keyCode) { - case KeyCode.ESCAPE: - this._clearSearch(); - dis.dispatch({action: 'focus_composer'}); - break; case KeyCode.KEY_K: if (ctrlCmdOnly) { if (this.refs.search) { From 844ea390c87eab83c9f287313d32e727c958a6fb Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 16 May 2017 17:13:55 +0100 Subject: [PATCH 016/147] Revert "clear the searchbox after quick-search" This reverts commit ddd12edc064bdd81fffbad941e199eaa065e3ae0. --- src/components/structures/RoomSubList.js | 3 +-- src/components/structures/SearchBox.js | 6 +++++- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index f741a30f..a1291eeb 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -165,11 +165,10 @@ var RoomSubList = React.createClass({ } }, - onRoomTileClick(roomId, ev) { + onRoomTileClick(roomId) { dis.dispatch({ action: 'view_room', room_id: roomId, - clear_search: (ev && (ev.keyCode == 13 || ev.keyCode == 32)), }); }, diff --git a/src/components/structures/SearchBox.js b/src/components/structures/SearchBox.js index d79617c0..a3848dcc 100644 --- a/src/components/structures/SearchBox.js +++ b/src/components/structures/SearchBox.js @@ -48,14 +48,18 @@ module.exports = React.createClass({ }, onAction: function(payload) { + // Disabling this as I find it really really annoying, and was used to the + // previous behaviour - see https://github.com/vector-im/riot-web/issues/3348 +/* switch (payload.action) { // Clear up the text field when a room is selected. case 'view_room': - if (payload.clear_search && this.refs.search) { + if (this.refs.search) { this._clearSearch(); } break; } +*/ }, onChange: function() { From 9fc9de3af53e6457a6f83e1305c1f2247ab95421 Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 16 May 2017 17:21:49 +0100 Subject: [PATCH 017/147] Revert "Merge pull request #3654 from vector-im/matthew/quick-search" This reverts commit 8f20fcfa6b6828421d1278b169df663e80d2a743, reversing changes made to 751f715e77a73fa704298dd1dbad0035eb7a75e8. --- package.json | 3 +- src/components/structures/LeftPanel.js | 94 +---------- src/components/structures/RoomSubList.js | 147 ++++++++++-------- .../structures/RoomSubListHeader.js | 120 -------------- src/components/structures/SearchBox.js | 31 ---- 5 files changed, 86 insertions(+), 309 deletions(-) delete mode 100644 src/components/structures/RoomSubListHeader.js diff --git a/package.json b/package.json index a1f06b00..644e9309 100644 --- a/package.json +++ b/package.json @@ -61,6 +61,7 @@ "favico.js": "^0.3.10", "filesize": "3.5.6", "flux": "~2.0.3", + "gemini-scrollbar": "matrix-org/gemini-scrollbar#b302279", "gfm.css": "^1.1.1", "highlight.js": "^9.0.0", "linkifyjs": "^2.1.3", @@ -73,7 +74,7 @@ "react-dnd": "^2.1.4", "react-dnd-html5-backend": "^2.1.2", "react-dom": "^15.4.0", - "react-gemini-scrollbar": "matrix-org/react-gemini-scrollbar#39d858c", + "react-gemini-scrollbar": "matrix-org/react-gemini-scrollbar#5e97aef", "sanitize-html": "^1.11.1", "ua-parser-js": "^0.7.10", "url": "^0.11.0" diff --git a/src/components/structures/LeftPanel.js b/src/components/structures/LeftPanel.js index 2d97313a..a9df37a8 100644 --- a/src/components/structures/LeftPanel.js +++ b/src/components/structures/LeftPanel.js @@ -19,11 +19,9 @@ limitations under the License. var React = require('react'); var DragDropContext = require('react-dnd').DragDropContext; var HTML5Backend = require('react-dnd-html5-backend'); -var KeyCode = require('matrix-react-sdk/lib/KeyCode'); var sdk = require('matrix-react-sdk') var dis = require('matrix-react-sdk/lib/dispatcher'); - var VectorConferenceHandler = require('../../VectorConferenceHandler'); var CallHandler = require("matrix-react-sdk/lib/CallHandler"); @@ -42,10 +40,6 @@ var LeftPanel = React.createClass({ }; }, - componentWillMount: function() { - this.focusedElement = null; - }, - componentDidMount: function() { this.dispatcherRef = dis.register(this.onAction); }, @@ -68,91 +62,6 @@ var LeftPanel = React.createClass({ } }, - _onFocus: function(ev) { - this.focusedElement = ev.target; - }, - - _onBlur: function(ev) { - this.focusedElement = null; - }, - - _onKeyDown: function(ev) { - if (!this.focusedElement) return; - let handled = false; - - switch (ev.keyCode) { - case KeyCode.UP: - this._onMoveFocus(true); - handled = true; - break; - case KeyCode.DOWN: - this._onMoveFocus(false); - handled = true; - break; - } - - if (handled) { - ev.stopPropagation(); - ev.preventDefault(); - } - }, - - _onMoveFocus: function(up) { - var element = this.focusedElement; - - // unclear why this isn't needed - // var descending = (up == this.focusDirection) ? this.focusDescending : !this.focusDescending; - // this.focusDirection = up; - - var descending = false; // are we currently descending or ascending through the DOM tree? - var classes; - - do { - var child = up ? element.lastElementChild : element.firstElementChild; - var sibling = up ? element.previousElementSibling : element.nextElementSibling; - - if (descending) { - if (child) { - element = child; - } - else if (sibling) { - element = sibling; - } - else { - descending = false; - element = element.parentElement; - } - } - else { - if (sibling) { - element = sibling; - descending = true; - } - else { - element = element.parentElement; - } - } - - if (element) { - classes = element.classList; - if (classes.contains("mx_LeftPanel")) { // we hit the top - element = up ? element.lastElementChild : element.firstElementChild; - descending = true; - } - } - - } while(element && !( - classes.contains("mx_RoomTile") || - classes.contains("mx_SearchBox_search") || - classes.contains("mx_RoomSubList_ellipsis"))); - - if (element) { - element.focus(); - this.focusedElement = element; - this.focusedDescending = descending; - } - }, - _recheckCallElement: function(selectedRoomId) { // if we aren't viewing a room with an ongoing call, but there is an // active call, show the call element - we need to do this to make @@ -211,8 +120,7 @@ var LeftPanel = React.createClass({ } return ( -