ready for v1.0.8

CHANGELOG.md

@@ -1,3 +1,13 @@
+# 1.0.8 (23 Feb 2021)
+
+Changes:
+
+- added locales for Traditional Chinese language, special thanks to @taotieren
+- minor UI improvements
+
+<br/>
+<br/>
+
 # 1.0.7 (21 Feb 2021)
 
 Changes:

app/client/src/components/PlayerControlPanel/__snapshots__/index.spec.tsx.snap

@@ -121,6 +121,7 @@ exports[`should match exact snapshot 1`] = `
                     style={
                       Object {
                         "transform": "translateY(2px) translateX(-5px)",
+                        "width": "max-content",
                       }
                     }
                   >
@@ -137,27 +138,6 @@ exports[`should match exact snapshot 1`] = `
         </span>
       </span>
     </div>
-    <div
-      className="col-xs-12 col-md-1"
-    >
-      <div
-        className="row center-xs"
-        style={
-          Object {
-            "height": "42px",
-          }
-        }
-      >
-        <div
-          className=""
-        >
-          FPS: 
-        </div>
-        <p
-          id="fps-show"
-        />
-      </div>
-    </div>
     <div
       className="col-xs-12 col-md-5"
     >
@@ -237,7 +217,7 @@ exports[`should match exact snapshot 1`] = `
                     className="col-xs"
                   >
                     <div
-                      className="bp3-text-large"
+                      className="bp3-text-large play-pause-text"
                     >
                       Pause
                     </div>

app/client/src/components/PlayerControlPanel/index.css

@@ -0,0 +1,3 @@
+.play-pause-text {
+  width: max-content;
+}

app/client/src/components/PlayerControlPanel/index.tsx

@@ -30,6 +30,8 @@ import handlePlayerToggleFullscreen from './handlePlayerToggleFullscreen';
 import initScreenfullOnChange from './initScreenfullOnChange';
 import ScreenSharingSource from '../../features/PeerConnection/ScreenSharingSourceEnum';
 import { REACT_PLAYER_WRAPPER_ID } from '../../constants/appConstants';
+import './index.css'
+
 
 const videoQualityButtonStyle: React.CSSProperties = {
   width: '100%',
@@ -152,7 +154,10 @@ function PlayerControlPanel(props: PlayerControlPanelProps) {
                   </Col>
                   <Col xs>
                     <div
-                      style={{ transform: 'translateY(2px) translateX(-5px)' }}
+                      style={{
+                        transform: 'translateY(2px) translateX(-5px)',
+                        width: 'max-content',
+                      }}
                     >
                       <Text>{t('Donate')}</Text>
                     </div>
@@ -161,12 +166,6 @@ function PlayerControlPanel(props: PlayerControlPanelProps) {
               </Button>
             </Tooltip>
           </Col>
-          <Col xs={12} md={1}>
-            <Row center="xs" style={{ height: '42px' }}>
-              <Text>FPS:&nbsp;</Text>
-              <p id="fps-show"></p>
-            </Row>
-          </Col>
           <Col xs={12} md={5}>
             <Row center="xs" style={{ height: '42px' }}>
               <Row
@@ -206,7 +205,8 @@ function PlayerControlPanel(props: PlayerControlPanelProps) {
                         />
                       </Col>
                       <Col xs>
-                        <Text className="bp3-text-large">
+                        { /* @ts-ignore */ }
+                        <Text className="bp3-text-large play-pause-text">
                           {isPlaying ? t('Pause') : t('Play')}
                         </Text>
                       </Col>
@@ -252,7 +252,9 @@ function PlayerControlPanel(props: PlayerControlPanelProps) {
                                   toaster?.show({
                                     icon: 'clean',
                                     intent: Intent.PRIMARY,
-                                    message: `${t('Video quality has been changed to')} ${q}`,
+                                    message: `${t(
+                                      'Video quality has been changed to'
+                                    )} ${q}`,
                                   });
                                 }}
                               >
@@ -266,7 +268,10 @@ function PlayerControlPanel(props: PlayerControlPanelProps) {
                     position={Position.BOTTOM}
                     popoverClassName={Classes.POPOVER_CONTENT_SIZING}
                   >
-                    <Tooltip content={t('Click to Open Video Settings')} position={Position.BOTTOM}>
+                    <Tooltip
+                      content={t('Click to Open Video Settings')}
+                      position={Position.BOTTOM}
+                    >
                       <Button minimal>
                         <Icon icon="cog" color="white" />
                       </Button>
@@ -321,7 +326,9 @@ function PlayerControlPanel(props: PlayerControlPanelProps) {
                       icon: 'video',
                       intent: Intent.PRIMARY,
                       message: `${
-                        isDefaultPlayerTurnedOn ? t('Default video player has been turned OFF') : t('Default video player has been turned ON')
+                        isDefaultPlayerTurnedOn
+                          ? t('Default video player has been turned OFF')
+                          : t('Default video player has been turned ON')
                       }`,
                     });
                   }}

app/client/src/containers/PlayerView/__snapshots__/index.spec.tsx.snap

@@ -133,6 +133,7 @@ exports[`should match exact snapshot 1`] = `
                       style={
                         Object {
                           "transform": "translateY(2px) translateX(-5px)",
+                          "width": "max-content",
                         }
                       }
                     >
@@ -149,27 +150,6 @@ exports[`should match exact snapshot 1`] = `
           </span>
         </span>
       </div>
-      <div
-        className="col-xs-12 col-md-1"
-      >
-        <div
-          className="row center-xs"
-          style={
-            Object {
-              "height": "42px",
-            }
-          }
-        >
-          <div
-            className=""
-          >
-            FPS: 
-          </div>
-          <p
-            id="fps-show"
-          />
-        </div>
-      </div>
       <div
         className="col-xs-12 col-md-5"
       >
@@ -249,7 +229,7 @@ exports[`should match exact snapshot 1`] = `
                       className="col-xs"
                     >
                       <div
-                        className="bp3-text-large"
+                        className="bp3-text-large play-pause-text"
                       >
                         Play
                       </div>

app/client/src/features/PeerConnection/peerConnectionHandlePeer.ts

@@ -14,63 +14,6 @@ export function getSharingShourceType(peerConnection: PeerConnection) {
   }
 }
 
-let lastFramesReceived = 0;
-let lastCalculatedFPS = 0;
-let lastCalculatedFPSTimestamp = 0;
-
-function dumpStatsFramesPerSecondOnly(results: any) {
-  // framesReceived
-  let isFremsPerSecondSet;
-  // let statsString = '';
-
-  results.forEach((res: any) => {
-    // statsString += '<h3>Report type=';
-    // statsString += res.type;
-    // statsString += '</h3>\n';
-    // statsString += `id ${res.id}<br>`;
-    // statsString += `time ${res.timestamp}<br>`;
-    Object.keys(res).forEach(k => {
-      if (k.includes('framesPerSecond') && k !== 'timestamp' && k !== 'type' && k !== 'id') {
-        // statsString += `${k}: ${res[k]}<br>`;
-        const fpsElement = document.getElementById('fps-show');
-        if (fpsElement) {
-          fpsElement.innerHTML = res[k];
-        }
-        isFremsPerSecondSet = true;
-      }
-
-      if (k.includes('framesReceived') && k !== 'timestamp' && k !== 'type' && k !== 'id') {
-        const currentTime = new Date().getTime();
-        const currentFramesReceived = parseInt(res[k], 10);
-
-        if (lastFramesReceived === 0) {
-          lastFramesReceived = currentFramesReceived;
-          lastCalculatedFPSTimestamp = currentTime;
-          return;
-        }
-        const framesDifference = currentFramesReceived - lastFramesReceived;
-        console.log('framesDifference', framesDifference);
-
-        const timeDifference = currentTime - lastCalculatedFPSTimestamp;
-        console.log('timeDifference', timeDifference);
-        const howManyTimesTimeDifferenceIsMorThanOneSecond = timeDifference / 1000;
-        console.log('howManyTimesTimeDifferenceIsMorThanOneSecond', howManyTimesTimeDifferenceIsMorThanOneSecond);
-
-        lastCalculatedFPS = Math.floor(framesDifference / howManyTimesTimeDifferenceIsMorThanOneSecond);
-        lastFramesReceived = currentFramesReceived;
-        lastCalculatedFPSTimestamp = currentTime;
-      }
-    });
-  });
-  if (!isFremsPerSecondSet) {
-    const fpsElement = document.getElementById('fps-show');
-    if (fpsElement) {
-      fpsElement.innerHTML = `~${lastCalculatedFPS}`;
-    }
-  }
-  // return statsString;
-}
-
 export default (peerConnection: PeerConnection) => {
   if (peerConnection.peer === null) {
     throw new PeerConnectionPeerIsNullError();
@@ -100,17 +43,6 @@ export default (peerConnection: PeerConnection) => {
       });
     }, 1000);
 
-    setInterval(() => {
-      // console.log('peerConnection framerate', peerConnection.peer);
-      // @ts-ignore
-      if (peerConnection.peer && peerConnection.peer._pc) {
-        // @ts-ignore
-        peerConnection.peer._pc.getStats(null).then((results: any) => {
-          dumpStatsFramesPerSecondOnly(results);
-        });
-      }
-    }, 2000);
-
     peerConnection.videoAutoQualityOptimizer.startOptimizationLoop();
 
     setTimeout(getSharingShourceType, 1000, peerConnection);

app/components/StepsOfStepper/ChooseAppOrScreenOverlay/ChooseAppOrScreenOverlay.tsx

@@ -169,6 +169,7 @@ export default function ChooseAppOrScreenOverlay(
                     onClick={handleRefreshSources}
                     style={{
                       borderRadius: '100px',
+                      width: 'max-content',
                     }}
                   >
                     {t('Refresh')}

app/components/StepsOfStepper/ChooseAppOrScreenOverlay/__snapshots__/ChooseAppOrScreenOverlay.spec.tsx.snap

@@ -550,6 +550,7 @@ exports[`should match exact snapshot 1`] = `
                                                 style={
                                                   Object {
                                                     "borderRadius": "100px",
+                                                    "width": "max-content",
                                                   }
                                                 }
                                               >
@@ -562,6 +563,7 @@ exports[`should match exact snapshot 1`] = `
                                                   style={
                                                     Object {
                                                       "borderRadius": "100px",
+                                                      "width": "max-content",
                                                     }
                                                   }
                                                   type="button"

app/components/TopPanel.tsx

@@ -103,7 +103,12 @@ export default function TopPanel(props: any) {
               />
             </Col>
             <Col xs>
-              <div style={{ transform: 'translateY(2px) translateX(-5px)' }}>
+              <div
+                style={{
+                  transform: 'translateY(2px) translateX(-5px)',
+                  width: 'max-content',
+                }}
+              >
                 <Text>{t('Donate')}</Text>
               </div>
             </Col>

app/components/__snapshots__/TopPanel.spec.tsx.snap

@@ -58,6 +58,7 @@ exports[`<TopPanel /> should match exact snapshot 1`] = `
                   style={
                     Object {
                       "transform": "translateY(2px) translateX(-5px)",
+                      "width": "max-content",
                     }
                   }
                 >

app/containers/__snapshots__/HomePage.spec.tsx.snap

@@ -212,6 +212,7 @@ exports[`should match exact snapshot 1`] = `
                                                           style={
                                                             Object {
                                                               "transform": "translateY(2px) translateX(-5px)",
+                                                              "width": "max-content",
                                                             }
                                                           }
                                                         >

app/package-lock.json

@@ -1,5 +1,5 @@
 {
   "name": "Deskreen",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "lockfileVersion": 1
 }

app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "deskreen",
   "productName": "Deskreen",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "Deskreen turns any device into a secondary screen for your computer",
   "main": "./main.prod.js",
   "author": {

package.json

@@ -1,7 +1,7 @@
 {
   "name": "deskreen",
   "productName": "Deskreen",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "Deskreen turns any device into a secondary screen for your computer",
   "scripts": {
     "build": "yarn build-client && yarn build-main && yarn build-renderer",