Theme switching. Need to update _session*_light
Vincent
5 years ago
parent
8c9854dd90
commit
dd421d58f1
@ -1,125 +1,144 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
|
|
||||||
import { SessionSettingListItem, SessionSettingType } from './session/settings/SessionSettingListItem';
|
import {
|
||||||
|
SessionSettingListItem,
|
||||||
|
SessionSettingType,
|
||||||
|
} from './session/settings/SessionSettingListItem';
|
||||||
|
|
||||||
import { SessionSettingCategory } from './session/LeftPaneSettingSection';
|
import { SessionSettingCategory } from './session/LeftPaneSettingSection';
|
||||||
import { SessionButtonColor } from './session/SessionButton';
|
import { SessionButtonColor } from './session/SessionButton';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Grab initial values from database on startup
|
// Grab initial values from database on startup
|
||||||
const localSettings = [
|
const localSettings = [
|
||||||
{
|
{
|
||||||
id: "typingIndicators",
|
id: 'typingIndicators',
|
||||||
title: "Typing Indicators",
|
title: 'Typing Indicators',
|
||||||
description: "See and share when messages are being typed. This setting is optional and applies to all conversations.",
|
description:
|
||||||
type: SessionSettingType.Toggle,
|
'See and share when messages are being typed. This setting is optional and applies to all conversations.',
|
||||||
category: SessionSettingCategory.Privacy,
|
type: SessionSettingType.Toggle,
|
||||||
value: false,
|
category: SessionSettingCategory.Privacy,
|
||||||
},
|
value: false,
|
||||||
{
|
},
|
||||||
id: "screenLock",
|
{
|
||||||
title: "Screen Lock",
|
id: 'screenLock',
|
||||||
description: "Unlock Loki Session using your password. Visit notification settings to customise.",
|
title: 'Screen Lock',
|
||||||
type: SessionSettingType.Toggle,
|
description:
|
||||||
category: SessionSettingCategory.Privacy,
|
'Unlock Loki Session using your password. Visit notification settings to customise.',
|
||||||
value: true,
|
type: SessionSettingType.Toggle,
|
||||||
},
|
category: SessionSettingCategory.Privacy,
|
||||||
{
|
value: true,
|
||||||
id: "screenSecurity",
|
},
|
||||||
title: "Screen Security",
|
{
|
||||||
description: "Prevent Loki Session previews from appearing in desktop notifications.",
|
id: 'screenSecurity',
|
||||||
type: SessionSettingType.Toggle,
|
title: 'Screen Security',
|
||||||
category: SessionSettingCategory.Privacy,
|
description:
|
||||||
value: false,
|
'Prevent Loki Session previews from appearing in desktop notifications.',
|
||||||
},
|
type: SessionSettingType.Toggle,
|
||||||
{
|
category: SessionSettingCategory.Privacy,
|
||||||
id: "linkPreviews",
|
value: false,
|
||||||
title: "Send Link Previews",
|
},
|
||||||
description: "Supported for imgur, Instagram, Pinterest, Reddit and YouTube.",
|
{
|
||||||
type: SessionSettingType.Toggle,
|
id: 'linkPreviews',
|
||||||
category: SessionSettingCategory.Privacy,
|
title: 'Send Link Previews',
|
||||||
value: true,
|
description:
|
||||||
},
|
'Supported for Imgur, Instagram, Pinterest, Reddit and YouTube.',
|
||||||
{
|
type: SessionSettingType.Toggle,
|
||||||
id: "screenSecurity",
|
category: SessionSettingCategory.Privacy,
|
||||||
title: "Screen Security",
|
value: true,
|
||||||
description: "Prevent Loki Session previews from appearing in desktop notifications.",
|
},
|
||||||
category: SessionSettingCategory.Privacy,
|
{
|
||||||
type: SessionSettingType.Toggle,
|
id: 'clearConversationHistory',
|
||||||
value: false,
|
title: 'Clear Conversation History',
|
||||||
},
|
category: SessionSettingCategory.Privacy,
|
||||||
{
|
type: SessionSettingType.Button,
|
||||||
id: "clearConversationHistory",
|
value: false,
|
||||||
title: "Clear Conversation History",
|
buttonText: 'Clear',
|
||||||
category: SessionSettingCategory.Privacy,
|
buttonColor: SessionButtonColor.Danger,
|
||||||
type: SessionSettingType.Button,
|
},
|
||||||
value: false,
|
{
|
||||||
buttonText: 'Clear',
|
id: 'changePassword',
|
||||||
buttonColor: SessionButtonColor.Danger,
|
title: 'Change Password',
|
||||||
},
|
category: SessionSettingCategory.Account,
|
||||||
|
type: SessionSettingType.Button,
|
||||||
|
value: false,
|
||||||
|
buttonText: 'Change',
|
||||||
|
buttonColor: SessionButtonColor.Primary,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'removePassword',
|
||||||
|
title: 'Remove Password',
|
||||||
|
category: SessionSettingCategory.Account,
|
||||||
|
type: SessionSettingType.Button,
|
||||||
|
value: false,
|
||||||
|
buttonText: 'Remove',
|
||||||
|
buttonColor: SessionButtonColor.Danger,
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
export class MainViewController {
|
export class MainViewController {
|
||||||
public static renderMessageView() {
|
public static renderMessageView() {
|
||||||
const element = (
|
const element = (
|
||||||
<div className="conversation-stack">
|
<div className="conversation-stack">
|
||||||
<div className="conversation placeholder">
|
<div className="conversation placeholder">
|
||||||
<div className="conversation-header"></div>
|
<div className="conversation-header" />
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<div className="content">
|
<div className="content">
|
||||||
<img src="images/session/brand.svg" className="session-filter-color-green session-logo-128"/>
|
<img
|
||||||
<p className="session-logo-text">SESSION</p>
|
src="images/session/brand.svg"
|
||||||
</div>
|
className="session-filter-color-green session-logo-128"
|
||||||
</div>
|
/>
|
||||||
</div>
|
<p className="session-logo-text">SESSION</p>
|
||||||
</div>
|
</div>
|
||||||
);
|
</div>
|
||||||
|
</div>
|
||||||
ReactDOM.render(element, document.getElementById('main-view'));
|
</div>
|
||||||
}
|
);
|
||||||
|
|
||||||
|
ReactDOM.render(element, document.getElementById('main-view'));
|
||||||
|
}
|
||||||
|
|
||||||
public static renderSettingsView() {
|
public static renderSettingsView(category: SessionSettingCategory) {
|
||||||
const element = (
|
const element = (
|
||||||
<div className="session-settings-list">
|
<div className="session-settings-list">
|
||||||
{ localSettings.map(setting => {
|
{localSettings.map(setting => {
|
||||||
return (
|
return (
|
||||||
<SessionSettingListItem
|
<div key={setting.id}>
|
||||||
title = { setting.title }
|
{setting.category === category && (
|
||||||
description = { setting.description }
|
<SessionSettingListItem
|
||||||
type = { setting.type }
|
title={setting.title}
|
||||||
value = { setting.value }
|
description={setting.description}
|
||||||
onClick = { () => {
|
type={setting.type}
|
||||||
SettingsManager.updateSetting(setting);
|
value={setting.value}
|
||||||
}}
|
onClick={() => {
|
||||||
buttonText = { setting.buttonText || undefined }
|
SettingsManager.updateSetting(setting);
|
||||||
buttonColor = { setting.buttonColor || undefined }
|
}}
|
||||||
/>
|
buttonText={setting.buttonText || undefined}
|
||||||
);
|
buttonColor={setting.buttonColor || undefined}
|
||||||
}) }
|
/>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
})}
|
||||||
ReactDOM.render(element, document.getElementById('main-view'));
|
</div>
|
||||||
}
|
);
|
||||||
}
|
|
||||||
|
|
||||||
|
ReactDOM.render(element, document.getElementById('main-view'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export class SettingsManager {
|
export class SettingsManager {
|
||||||
public static updateSetting({ id, type, value } ) {
|
public static updateSetting({ id, type, value }) {
|
||||||
if (type === SessionSettingType.Toggle){
|
if (type === SessionSettingType.Toggle) {
|
||||||
alert(`You clicked a toggle with ID: ${id}`);
|
alert(`You clicked a toggle with ID: ${id}`);
|
||||||
|
|
||||||
// Manage toggle events
|
|
||||||
|
|
||||||
|
// Manage toggle events
|
||||||
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
alert('you clicked something else');
|
alert('you clicked something else');
|
||||||
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue