SymphonyElectron/src/renderer/preload-component.ts
Vishwas Shashidhar 198d891c94
feat: SDA-2456: add screen annotate tool (#1103)
* SDA-2456: snipping tool component

- Create a react component
- Stylise the component
- Add functionality to open a new window
- Add event against the `Done` button and upload snippet

* SDA-2456: snipping annotate tool

- Added icons for undo, redo & clear
- Made the snipping tool window & the image container dynamic

* SDA-2456: make image dynamic

* SDA-2456: add snapshot tests

* SDA-2456: add the height & width properties to the image container

* SDA-2456: update snipping tool snapshot

* SDA-2456: add support for button selected border

* SDA-2456: close existing annotate window

* SDA-2456 Changed from class to functional component

* SDA-2456: remove outdated tests

* SDA-2456: fix image dimension issue

* SDA-2456: address PR comments by Kiran

Co-authored-by: psjostrom <per.sjostrom@symphony.com>
2020-11-06 12:13:29 +05:30

100 lines
3.7 KiB
TypeScript

import { ipcRenderer } from 'electron';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { i18n } from '../common/i18n-preload';
import AboutBox from './components/about-app';
import BasicAuth from './components/basic-auth';
import NotificationComp from './components/notification-comp';
import NotificationSettings from './components/notification-settings';
import ScreenPicker from './components/screen-picker';
import ScreenSharingFrame from './components/screen-sharing-frame';
import ScreenSharingIndicator from './components/screen-sharing-indicator';
import SnippingTool from './components/snipping-tool';
import Welcome from './components/welcome';
const enum components {
aboutApp = 'about-app',
screenPicker = 'screen-picker',
screenSharingIndicator = 'screen-sharing-indicator',
screenSharingFrame = 'screen-sharing-frame',
basicAuth = 'basic-auth',
notification = 'notification-comp',
notificationSettings = 'notification-settings',
welcome = 'welcome',
snippingTool = 'snipping-tool',
}
const loadStyle = (style) => {
const styles = document.createElement('link');
styles.rel = 'stylesheet';
styles.type = 'text/css';
styles.href = `./styles/${style}.css`;
document.getElementsByTagName('head')[0].appendChild(styles);
};
/**
* Loads the appropriate component
*/
const load = () => {
const query = new URL(window.location.href).searchParams;
const componentName = query.get('componentName');
let component;
switch (componentName) {
case components.aboutApp:
loadStyle(components.aboutApp);
component = AboutBox;
document.title = i18n.t('About Symphony', 'AboutSymphony')();
break;
case components.screenPicker:
loadStyle(components.screenPicker);
document.title = i18n.t('Screen Picker - Symphony')();
component = ScreenPicker;
break;
case components.screenSharingIndicator:
loadStyle(components.screenSharingIndicator);
document.title = i18n.t('Screen Sharing Indicator - Symphony')();
component = ScreenSharingIndicator;
break;
case components.screenSharingFrame:
loadStyle(components.screenSharingFrame);
component = ScreenSharingFrame;
break;
case components.snippingTool:
loadStyle(components.snippingTool);
document.title = i18n.t('Symphony')();
component = SnippingTool;
break;
case components.basicAuth:
loadStyle(components.basicAuth);
document.title = i18n.t('Basic Authentication - Symphony')();
component = BasicAuth;
break;
case components.notification:
loadStyle(components.notification);
document.title = i18n.t('Notification - Symphony')();
component = NotificationComp;
break;
case components.notificationSettings:
document.title = i18n.t('Notification Settings - Symphony', 'NotificationSettings')();
loadStyle(components.notificationSettings);
component = NotificationSettings;
break;
case components.welcome:
document.title = i18n.t('WelcomeText', 'Welcome')();
loadStyle(components.welcome);
component = Welcome;
break;
}
const element = React.createElement(component);
ReactDOM.render(element, document.getElementById('Root'));
};
ipcRenderer.on('page-load', (_event, data) => {
const { locale, resource } = data;
i18n.setResource(locale, resource);
// Renders component as soon as the page is ready
load();
});