developHEADmaster

5 files changed, 135 insertions, 41 deletions

diff --git a/Settings.jsx b/Settings.jsx
index b13da96..768cddd 100644
--- a/Settings.jsx
+++ b/Settings.jsx
@@ -1,19 +1,14 @@
 const { React } = require('powercord/webpack');
-const {
-  Category,
-  SwitchItem,
-  TextInput,
-  RadioGroup,
-  SelectInput
-} = require('powercord/components/settings');
+const { SelectInput } = require('powercord/components/settings');
+const { SETTINGS_TIMEZONE } = require('./constants');
 const tz = require('./tz');
 
 
-  module.exports = class Settings extends React.Component {
+module.exports = class Settings extends React.Component {
   constructor (props) {
     super(props);
     this.state = {
-      timezone: this.props.getSetting('timezone', 'GMT')
+      timezone: this.props.getSetting(SETTINGS_TIMEZONE, 'GMT')
     };
   }
 
@@ -22,7 +17,7 @@ const tz = require('./tz');
       <SelectInput
         searchable={true}
         onChange={(e) => {
-          this.props.updateSetting('timezone', e.value);
+          this.props.updateSetting(SETTINGS_TIMEZONE, e.value);
           this.setState({ timezone: e.value });
         }}
         value={this.state.timezone}
diff --git a/constants.js b/constants.js
new file mode 100644
index 0000000..180e7f5
--- /dev/null
+++ b/constants.js
@@ -0,0 +1,12 @@
+const PLUGIN_ID = 'timezone-powercord';
+const INJECTION_ID_MESSAGE_RENDER = PLUGIN_ID + '-message-render';
+const SETTINGS_INDEV_VERSION = 'indev-version';
+const SETTINGS_TIMEZONE = 'timezone';
+
+module.exports = {
+  PLUGIN_ID,
+  INJECTION_ID_MESSAGE_RENDER,
+  SETTINGS_INDEV_VERSION,
+  SETTINGS_TIMEZONE
+};
+
diff --git a/index.js b/index.js
index 1d8caf8..0ef539a 100644
--- a/index.js
+++ b/index.js
@@ -7,25 +7,33 @@ const {
   uninject
 } = require('powercord/injector');
 const { lookup } = require('./tz');
-
+const {
+  PLUGIN_ID,
+  SETTINGS_INDEV_VERSION,
+  INJECTION_ID_MESSAGE_RENDER,
+  SETTINGS_TIMEZONE
+} = require('./constants');
 const { transformMessageArray } = require('./transformation.jsx');
 
-const PLUGIN_ID = 'timezone-powercord';
-const INJECTION_ID_MESSAGE_RENDER = PLUGIN_ID + '-message-render';
-
 const MessageContent = getModule((m) => m.type && m.type.displayName === 'MessageContent', false);
 
-
 module.exports = class TimezonePowercord extends Plugin {
   async startPlugin () {
-    inject(INJECTION_ID_MESSAGE_RENDER, MessageContent, 'type', (args) => {
-      return transformMessageArray(
-        () => lookup(this.settings.get('timezone', 'GMT')))(args);
-    }, true);
-    powercord.api.notices.sendAnnouncement('timezone-request-tz', {
-      color: 'green',
-      message: 'Timezone Powercord Plugin has been loaded.'
-    });
+    inject(INJECTION_ID_MESSAGE_RENDER, MessageContent, 'type',
+      transformMessageArray(() => lookup(this.settings.get(SETTINGS_TIMEZONE, 'GMT'))), true);
+
+    if (this.settings.get(SETTINGS_INDEV_VERSION, '0') !== manifest.version) {
+      powercord.api.notices.sendAnnouncement('timezone-request-tz', {
+        color: 'green',
+        message: 'This version of Timezone Powercord Plugin is still in development.',
+        button: {
+          text: 'Don\'t show again.',
+          onClick: async () => {
+            this.settings.set(SETTINGS_INDEV_VERSION, manifest.version);
+          }
+        }
+      });
+    }
     powercord.api.settings.registerSettings(PLUGIN_ID, {
       category: this.entityID,
       label: 'Timezone Powercord Plugin',
@@ -37,5 +45,4 @@ module.exports = class TimezonePowercord extends Plugin {
     uninject(INJECTION_ID_MESSAGE_RENDER);
     powercord.api.settings.unregisterSettings(this.entityID);
   }
-
 };
diff --git a/popup.jsx b/popup.jsx
new file mode 100644
index 0000000..2844f75
--- /dev/null
+++ b/popup.jsx
@@ -0,0 +1,82 @@
+const {
+  React,
+  getModule
+} = require('powercord/webpack');
+const { Modal } = require('powercord/components/modal');
+const {
+  FormTitle,
+  FormNotice
+} = require('powercord/components');
+const {
+  close,
+  open
+} = require('powercord/modal');
+const { SETTINGS_TIMEZONE } = require('./constants');
+const {
+  lookup,
+  timezones
+} = require('./tz');
+const { SelectInput } = require('powercord/components/settings');
+
+class TimezoneConverterPopup extends React.PureComponent {
+  constructor (props) {
+    super(props);
+    this.state = { timezone: props.toTimezone };
+  }
+
+  render () {
+    console.log(this.state, this.props);
+    return <Modal size={Modal.Sizes.LARGE} className={'vrmodal'}>
+      <Modal.Header>
+        <FormTitle tag={'h4'}>
+          Time converter
+        </FormTitle>
+        <Modal.CloseButton onClick={close}/>
+      </Modal.Header>
+      <Modal.Content>
+        <p><SelectInput
+          searchable={true}
+          onChange={(e) => {
+            this.setState({ timezone: lookup(e.value) });
+          }}
+          value={this.state.timezone.code}
+          options={[
+            ...timezones.map(it => ({
+              value: it.code,
+              label: `${it.name} (${it.offset})`
+            }))
+          ]}
+        >
+          Convert to timezone
+        </SelectInput></p>
+        <p>{text(this.props.time, this.props.fromTimezone, this.state.timezone)}</p>
+        <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
+      </Modal.Content>
+    </Modal>;
+  }
+}
+
+function a (time) {
+  return ((time / 60) | 0) + ':' + (time % 60);
+}
+
+function text (time, fromTimezone, toTimezone) {
+  let offset = toTimezone.offsetminutes - fromTimezone.offsetminutes;
+  let adjusted = (time + offset) % (24 * 60);
+  return `${a(time)} ${fromTimezone.code} -> ${a(adjusted)} ${toTimezone.code}`;
+}
+
+function getLabel (time, fromTimezone, toTimezone) {
+  return <span
+    onClick={() => open(() => <TimezoneConverterPopup
+      time={time}
+      fromTimezone={fromTimezone}
+      toTimezone={toTimezone}/>)}>
+    {text(time, fromTimezone, toTimezone)}
+  </span>;
+}
+
+module.exports = {
+  TimezoneConverterPopup,
+  getLabel
+};
diff --git a/transformation.jsx b/transformation.jsx
index a355f97..417a7df 100644
--- a/transformation.jsx
+++ b/transformation.jsx
@@ -1,5 +1,7 @@
 const { splitSegments } = require('./util');
 const { React } = require('powercord/webpack');
+const { open } = require('powercord/modal');
+const { getLabel } = require('./popup.jsx');
 const {
   timezones,
   lookup
@@ -8,30 +10,26 @@ const {
 const timezonePattern = new RegExp('(\\d+):(\\d+) *(' + timezones.map(it => `(?:${it.code})`).join('|') + ')', 'g');
 
 function transformMessage (userTimezoneProvider, msgConstruct) {
-  if (!('content' in msgConstruct)) {
-	return msgConstruct;
+  if (!('content' in msgConstruct) || !('flatMap' in msgConstruct.content)) {
+    return msgConstruct;
   }
   return Object.assign({}, msgConstruct, {
-	content: msgConstruct.content.flatMap(it => transformPart(userTimezoneProvider, it))
+    content: msgConstruct.content.flatMap(it => transformPart(userTimezoneProvider, it))
   });
 }
 
 function transformPart (userTimezoneProvider, part) {
   if (typeof part === 'string') {
-	return splitSegments(part, timezonePattern).map(it => {
-	  if (typeof it === 'string') {
-		return it;
-	  }
-	  let [ _, hour, minute, tz ] = it.match;
-	  let timezone = lookup(tz);
-	  let time = hour * 60 + minute;
-	  let userTimezone = userTimezoneProvider();
-	  let offset = userTimezone.offsetminutes - timezone.offsetminutes;
-	  let adjusted = (time + offset) % (24 * 60);
-	  return (<>
-		{hour}:{minute} {timezone.code} -> {adjusted / 60}:{adjusted % 60} {userTimezone.code}
-	  </>);
-	});
+    return splitSegments(part, timezonePattern).map(it => {
+      if (typeof it === 'string') {
+        return it;
+      }
+      let [ _, hour, minute, tz ] = it.match;
+      let timezone = lookup(tz);
+      let time = hour * 60 + minute;
+      let userTimezone = userTimezoneProvider();
+      return getLabel(time, timezone, userTimezone);
+    });
   }
   return [ part ];
 }