merge devel

src/views/info-view.jsx

@@ -12,6 +12,7 @@ import ErrorPanel from '../widgets/error-panel.jsx';
 import GroupManager from '../widgets/group-manager.jsx';
 import MenuCancel from '../widgets/menu-cancel.jsx';
 import PermissionsEditor from '../widgets/permissions-editor.jsx';
+import ShowQRCode from '../widgets/show-qrcode.jsx';
 import TopicCommonView from './topic-common-view.jsx';
 import TopicSecurity from '../widgets/topic-security.jsx';
 
@@ -76,6 +77,11 @@ const messages = defineMessages({
     defaultMessage: 'Edit permissions',
     description: 'Menu item [Edit permissions]'
   },
+  qrcode: {
+    id: 'scan_qr_code',
+    defaultMessage: 'Scan QR Code',
+    description: 'Title for scanning QR code'
+  },
 });
 
 class InfoView extends React.Component {
@@ -120,6 +126,8 @@ class InfoView extends React.Component {
     this.handleUnarchive = this.handleUnarchive.bind(this);
     this.handlePermissionsChanged = this.handlePermissionsChanged.bind(this);
     this.handleLaunchPermissionsEditor = this.handleLaunchPermissionsEditor.bind(this);
+    this.handleCopyID = this.handleCopyID.bind(this);
+    this.handleShowQRCode = this.handleShowQRCode.bind(this);
     this.handleShowAddMembers = this.handleShowAddMembers.bind(this);
     this.handleMemberUpdateRequest = this.handleMemberUpdateRequest.bind(this);
     this.handleMemberSelected = this.handleMemberSelected.bind(this);
@@ -368,6 +376,16 @@ class InfoView extends React.Component {
     this.props.onNavigate(`perm/${which}`);
   }
 
+  handleCopyID(e) {
+    e.preventDefault();
+    navigator.clipboard.writeText(this.props.myUserId);
+  }
+
+  handleShowQRCode(e) {
+    e.preventDefault();
+    this.props.onNavigate('qrcode');
+  }
+
   handleShowAddMembers(e) {
     e.preventDefault();
     this.props.onInitFind();
@@ -514,6 +532,11 @@ class InfoView extends React.Component {
             onLaunchPermissionsEditor={this.handleLaunchPermissionsEditor}
             onNavigate={this.props.onNavigate} />
           :
+        view == 'qrcode' ?
+          <ShowQRCode
+            uri={Tinode.URI_TOPIC_ID_PREFIX + this.props.tinode.myUserId}
+            onCancel={this.handleBackNavigate} />
+          :
           <div id="info-view-content" className="scrollable-panel">
             <div className="panel-form-column">
               <a href="#" className="flat-button float-right" onClick={(e) => {e.preventDefault(); this.props.onNavigate('general');}}>
@@ -546,10 +569,20 @@ class InfoView extends React.Component {
                 </div>
                 : null
               }
-              <div className="group">
-                <label className="small"><FormattedMessage id="label_user_id" defaultMessage="ID:"
-                  description="Label for user address (ID)" /></label>&nbsp;
-                <tt>{this.state.address}</tt>
+              <div className="panel-form-row">
+                <div>
+                  <label className="small"><FormattedMessage id="label_user_id" defaultMessage="ID:"
+                    description="Label for user address (ID)" /></label>&nbsp;
+                  <tt>{this.state.address}</tt>
+                </div>
+                <div style={{marginLeft: 'auto'}}>
+                  &nbsp;<a href="#" onClick={this.handleCopyID}>
+                    <i className="material-icons">content_copy</i>
+                  </a>&nbsp;
+                  &nbsp;<a href="#" onClick={this.handleShowQRCode}>
+                    <i className="material-icons">qr_code</i>
+                  </a>&nbsp;
+                </div>
               </div>
               <div className="group">
                 <BadgeList trustedBadges={this.state.trustedBadges} />

src/views/messages-view.jsx

@@ -1685,7 +1685,7 @@ class MessagesView extends React.Component {
           <>
             <div id="topic-caption-panel" className="caption-panel">
               {this.props.displayMobile ?
-                <a href="#" id="hide-message-view" onClick={(e) => {e.preventDefault(); this.props.onHideMessagesView();}}>
+                <a href="#" id="hide-message-view" onClick={(e) => {e.preventDefault(); this.leave(this.state.topic); this.props.onHideMessagesView();}}>
                   <i className="material-icons">arrow_back</i>
                 </a>
                 :

src/views/new-topic-view.jsx

@@ -113,6 +113,7 @@ class NewTopicView extends React.Component {
             onError={this.props.onError} /> :
           this.state.tabSelected === 'byid' ?
             <NewTopicById
+              myURI={Tinode.URI_TOPIC_ID_PREFIX + this.props.tinode.getCurrentUserID()}
               onSubmit={this.handleGroupByID}
               onError={this.props.onError} /> :
             <div className="flex-column">

src/views/tinode-web.jsx

@@ -19,7 +19,7 @@ import MessagesView from './messages-view.jsx';
 import SidepanelView from './sidepanel-view.jsx';
 
 import { API_KEY, APP_NAME, DEFAULT_P2P_ACCESS_MODE, FORWARDED_PREVIEW_LENGTH, LOGGING_ENABLED,
-  MEDIA_BREAKPOINT } from '../config.js';
+  MEDIA_BREAKPOINT, WAKE_UP_TICK, WAKE_UP_TIMEOUT } from '../config.js';
 import { CALL_STATE_NONE, CALL_STATE_OUTGOING_INITATED,
          CALL_STATE_INCOMING_RECEIVED, CALL_STATE_IN_PROGRESS,
          CALL_HEAD_STARTED }  from '../constants.js';
@@ -298,6 +298,18 @@ class TinodeWeb extends React.Component {
       console.warn("Your browser does not support BroadcastChannel. Some features will not be available");
     }
 
+    // Detect if computer just woke up from sleep. Checks how much time has passed since the last tick.
+    // If too much time has passed then the computer was asleep.
+    this.lastWakeUpCheck = new Date().getTime();
+    this.wakeUpTicker = setInterval(_ => {
+      const now = new Date().getTime();
+      if (now - this.lastWakeUpCheck > WAKE_UP_TIMEOUT) {
+        // Trigger reconnect.
+        this.handleOnlineOn();
+      }
+      this.lastWakeUpCheck = now;
+    }, WAKE_UP_TICK);
+
     // Window/tab visible or invisible for pausing timers.
     document.addEventListener('visibilitychange', this.handleVisibilityEvent);
 
@@ -339,9 +351,6 @@ class TinodeWeb extends React.Component {
         });
       }
 
-      this.readTimer = null;
-      this.readTimerCallback = null;
-
       // Parse the hash navigation params.
       const parsedNav = HashNavigation.parseUrlHash(window.location.hash);
       // Maybe navigate to home screen.
@@ -364,6 +373,8 @@ class TinodeWeb extends React.Component {
     window.removeEventListener('online', this.handleOnlineOn);
     window.removeEventListener('offline', this.handleOnlineOff);
     document.removeEventListener('visibilitychange', this.handleVisibilityEvent);
+
+    clearInterval(this.wakeUpTicker);
   }
 
   // Setup transport (usually websocket) and server address. This will terminate connection with the server.