goblin-desktop 2.0.0 → 2.0.2

package/widgets/desktop-clock-menu/widget.js

@@ -1,63 +1,63 @@
-import React from 'react';
-import Widget from 'goblin-laboratory/widgets/widget';
-import * as styles from './styles';
-import AnalogClock from 'goblin-gadgets/widgets/analog-clock/widget';
-
-/******************************************************************************/
-
-export default class DesktopClockMenu extends Widget {
-  constructor() {
-    super(...arguments);
-    this.styles = styles;
-  }
-
-  renderMenuItem(look, index) {
-    return (
-      <div
-        key={index}
-        className={
-          look === this.props.selected
-            ? this.styles.classNames.menuItemSelected
-            : this.styles.classNames.menuItem
-        }
-        onClick={() => this.props.onSelect(look)}
-      >
-        <div
-          className={`background-hover ${this.styles.classNames.background}`}
-        />
-        <div className={`clock-hover ${this.styles.classNames.clock}`}>
-          <AnalogClock
-            size={this.props.clockSize}
-            look={look}
-            transition="none"
-            serverTick={this.props.serverTick}
-          />
-        </div>
-      </div>
-    );
-  }
-
-  renderMenuItems() {
-    const result = [];
-    let index = 0;
-    for (const look of this.props.looks) {
-      result.push(this.renderMenuItem(look, index++));
-    }
-    return result;
-  }
-
-  render() {
-    return (
-      <div
-        className={this.styles.classNames.fullScreen}
-        onClick={this.props.onClose}
-      >
-        <div className={this.styles.classNames.desktopClockMenu}>
-          {this.renderMenuItems()}
-        </div>
-      </div>
-    );
-  }
-}
-
-/******************************************************************************/
+import React from 'react';
+import Widget from 'goblin-laboratory/widgets/widget';
+import * as styles from './styles';
+import AnalogClock from 'goblin-gadgets/widgets/analog-clock/widget';
+
+/******************************************************************************/
+
+export default class DesktopClockMenu extends Widget {
+  constructor() {
+    super(...arguments);
+    this.styles = styles;
+  }
+
+  renderMenuItem(look, index) {
+    return (
+      <div
+        key={index}
+        className={
+          look === this.props.selected
+            ? this.styles.classNames.menuItemSelected
+            : this.styles.classNames.menuItem
+        }
+        onClick={() => this.props.onSelect(look)}
+      >
+        <div
+          className={`background-hover ${this.styles.classNames.background}`}
+        />
+        <div className={`clock-hover ${this.styles.classNames.clock}`}>
+          <AnalogClock
+            size={this.props.clockSize}
+            look={look}
+            transition="none"
+            serverTick={this.props.serverTick}
+          />
+        </div>
+      </div>
+    );
+  }
+
+  renderMenuItems() {
+    const result = [];
+    let index = 0;
+    for (const look of this.props.looks) {
+      result.push(this.renderMenuItem(look, index++));
+    }
+    return result;
+  }
+
+  render() {
+    return (
+      <div
+        className={this.styles.classNames.fullScreen}
+        onClick={this.props.onClose}
+      >
+        <div className={this.styles.classNames.desktopClockMenu}>
+          {this.renderMenuItems()}
+        </div>
+      </div>
+    );
+  }
+}
+
+/******************************************************************************/

package/widgets/desktop-connection-status/reducer.js

@@ -1,15 +1,15 @@
-import Shredder from 'xcraft-core-shredder';
-
-const initialState = new Shredder({dialogVisibility: false});
-
-export default (state = initialState, action = {}) => {
-  switch (action.type) {
-    case 'SHOW_DIALOG': {
-      return state.set('dialogVisibility', true);
-    }
-    case 'HIDE_DIALOG': {
-      return state.set('dialogVisibility', false);
-    }
-  }
-  return state;
-};
+import Shredder from 'xcraft-core-shredder';
+
+const initialState = new Shredder({dialogVisibility: false});
+
+export default (state = initialState, action = {}) => {
+  switch (action.type) {
+    case 'SHOW_DIALOG': {
+      return state.set('dialogVisibility', true);
+    }
+    case 'HIDE_DIALOG': {
+      return state.set('dialogVisibility', false);
+    }
+  }
+  return state;
+};

package/widgets/desktop-connection-status/styles.js

@@ -1,44 +1,44 @@
-/******************************************************************************/
-
-export default function styles(theme) {
-  const dialog = {
-    zIndex: 10,
-    top: '80px',
-    right: '20px',
-    width: '400px',
-    position: 'fixed',
-    padding: '20px 20px 20px 20px',
-    borderRadius: '10px',
-    backgroundColor: theme.palette.flyingDialogBackground,
-    boxShadow: 'rgba(0, 0, 0, 1) 0px 0px 40px 15px',
-    display: 'flex',
-    flexDirection: 'row',
-    alignItems: 'start',
-    transformOrigin: 'top right',
-  };
-
-  const list = {
-    display: 'flex',
-    flexDirection: 'column',
-  };
-
-  const blink = {
-    animationName: {
-      '50%': {
-        opacity: 0,
-      },
-    },
-    animationDuration: '1.2s',
-    animationIterationCount: 'infinite',
-  };
-
-  /******************************************************************************/
-
-  return {
-    dialog,
-    list,
-    blink,
-  };
-}
-
-/******************************************************************************/
+/******************************************************************************/
+
+export default function styles(theme) {
+  const dialog = {
+    zIndex: 10,
+    top: '80px',
+    right: '20px',
+    width: '400px',
+    position: 'fixed',
+    padding: '20px 20px 20px 20px',
+    borderRadius: '10px',
+    backgroundColor: theme.palette.flyingDialogBackground,
+    boxShadow: 'rgba(0, 0, 0, 1) 0px 0px 40px 15px',
+    display: 'flex',
+    flexDirection: 'row',
+    alignItems: 'start',
+    transformOrigin: 'top right',
+  };
+
+  const list = {
+    display: 'flex',
+    flexDirection: 'column',
+  };
+
+  const blink = {
+    animationName: {
+      '50%': {
+        opacity: 0,
+      },
+    },
+    animationDuration: '1.2s',
+    animationIterationCount: 'infinite',
+  };
+
+  /******************************************************************************/
+
+  return {
+    dialog,
+    list,
+    blink,
+  };
+}
+
+/******************************************************************************/

package/widgets/desktop-connection-status/widget.js

@@ -1,129 +1,129 @@
-import React from 'react';
-import Widget from 'goblin-laboratory/widgets/widget';
-import * as styles from './styles';
-import T from 't';
-import Button from 'goblin-gadgets/widgets/button/widget';
-import Label from 'goblin-gadgets/widgets/label/widget';
-import Container from 'goblin-gadgets/widgets/container/widget';
-import {ColorManipulator} from 'goblin-theme';
-
-/******************************************************************************/
-
-class DesktopConnectionStatusNC extends Widget {
-  constructor() {
-    super(...arguments);
-    this.styles = styles;
-
-    this.onToggleDialog = this.onToggleDialog.bind(this);
-  }
-
-  get showDialog() {
-    return this.props.dialogVisibility;
-  }
-
-  set showDialog(value) {
-    this.dispatchTo(this.widgetId, {
-      type: value ? 'SHOW_DIALOG' : 'HIDE_DIALOG',
-    });
-  }
-
-  onToggleDialog() {
-    this.showDialog = !this.showDialog;
-  }
-
-  _getColor(lag) {
-    const color = lag ? '#ff0000' : '#00ff00';
-    return ColorManipulator.darken(color, 0.4);
-  }
-
-  renderRow(horde, lag, delta, noSocket) {
-    return (
-      <Container kind="row" key={horde}>
-        <Label singleLine={true} text={T('{horde} :', '', {horde})} />
-        <Label
-          singleLine={true}
-          kind="warning"
-          text={
-            noSocket
-              ? T('inatteignable')
-              : lag
-              ? T('déconnecté depuis {delta}s', '', {
-                  delta: parseInt(delta / 1000),
-                })
-              : T('connecté')
-          }
-        />
-      </Container>
-    );
-  }
-
-  renderDialog(hordes, color) {
-    if (!this.showDialog) {
-      return null;
-    }
-    return (
-      <div className={this.styles.classNames.dialog}>
-        <Label
-          width="50px"
-          glyph="solid/globe"
-          glyphSize="150%"
-          glyphColor={color}
-        />
-        <div className={this.styles.classNames.list}>
-          <Label fontWeight="bold" text={T('Réseau')} bottomSpacing="large" />
-          {hordes
-            .entrySeq()
-            .map(([horde, {lag, delta, noSocket}]) =>
-              this.renderRow(horde, lag, delta, noSocket)
-            )}
-        </div>
-      </div>
-    );
-  }
-
-  renderStatus(hordes) {
-    const lag = hordes
-      .valueSeq()
-      .toArray()
-      .some(({lag}) => lag);
-    const color = this._getColor(lag);
-
-    return (
-      <>
-        <Button
-          kind="main-tab-right"
-          glyph="solid/globe"
-          glyphColor={lag ? color : null}
-          tooltip={T('Statut du réseau')}
-          onClick={() => this.onToggleDialog()}
-          className={lag && this.styles.classNames.blink}
-        />
-        {this.renderDialog(hordes, color)}
-      </>
-    );
-  }
-
-  render() {
-    const {hordes} = this.props;
-    if (!hordes || hordes.isEmpty()) {
-      return null;
-    }
-
-    return this.renderStatus(hordes);
-  }
-}
-
-/******************************************************************************/
-
-const DesktopConnectionStatus = Widget.connect((state, props) => {
-  const stateWidgets = state.get('widgets').get(props.id);
-  const stateNetwork = state.get('network');
-
-  const hordes = stateNetwork.get('hordes');
-  const dialogVisibility = stateWidgets
-    ? stateWidgets.get('dialogVisibility')
-    : false;
-  return {hordes, dialogVisibility};
-})(DesktopConnectionStatusNC);
-
-export default DesktopConnectionStatus;
+import React from 'react';
+import Widget from 'goblin-laboratory/widgets/widget';
+import * as styles from './styles';
+import T from 't';
+import Button from 'goblin-gadgets/widgets/button/widget';
+import Label from 'goblin-gadgets/widgets/label/widget';
+import Container from 'goblin-gadgets/widgets/container/widget';
+import {ColorManipulator} from 'goblin-theme';
+
+/******************************************************************************/
+
+class DesktopConnectionStatusNC extends Widget {
+  constructor() {
+    super(...arguments);
+    this.styles = styles;
+
+    this.onToggleDialog = this.onToggleDialog.bind(this);
+  }
+
+  get showDialog() {
+    return this.props.dialogVisibility;
+  }
+
+  set showDialog(value) {
+    this.dispatchTo(this.widgetId, {
+      type: value ? 'SHOW_DIALOG' : 'HIDE_DIALOG',
+    });
+  }
+
+  onToggleDialog() {
+    this.showDialog = !this.showDialog;
+  }
+
+  _getColor(lag) {
+    const color = lag ? '#ff0000' : '#00ff00';
+    return ColorManipulator.darken(color, 0.4);
+  }
+
+  renderRow(horde, lag, delta, noSocket) {
+    return (
+      <Container kind="row" key={horde}>
+        <Label singleLine={true} text={T('{horde} :', '', {horde})} />
+        <Label
+          singleLine={true}
+          kind="warning"
+          text={
+            noSocket
+              ? T('inatteignable')
+              : lag
+              ? T('déconnecté depuis {delta}s', '', {
+                  delta: parseInt(delta / 1000),
+                })
+              : T('connecté')
+          }
+        />
+      </Container>
+    );
+  }
+
+  renderDialog(hordes, color) {
+    if (!this.showDialog) {
+      return null;
+    }
+    return (
+      <div className={this.styles.classNames.dialog}>
+        <Label
+          width="50px"
+          glyph="solid/globe"
+          glyphSize="150%"
+          glyphColor={color}
+        />
+        <div className={this.styles.classNames.list}>
+          <Label fontWeight="bold" text={T('Réseau')} bottomSpacing="large" />
+          {hordes
+            .entrySeq()
+            .map(([horde, {lag, delta, noSocket}]) =>
+              this.renderRow(horde, lag, delta, noSocket)
+            )}
+        </div>
+      </div>
+    );
+  }
+
+  renderStatus(hordes) {
+    const lag = hordes
+      .valueSeq()
+      .toArray()
+      .some(({lag}) => lag);
+    const color = this._getColor(lag);
+
+    return (
+      <>
+        <Button
+          kind="main-tab-right"
+          glyph="solid/globe"
+          glyphColor={lag ? color : null}
+          tooltip={T('Statut du réseau')}
+          onClick={() => this.onToggleDialog()}
+          className={lag && this.styles.classNames.blink}
+        />
+        {this.renderDialog(hordes, color)}
+      </>
+    );
+  }
+
+  render() {
+    const {hordes} = this.props;
+    if (!hordes || hordes.isEmpty()) {
+      return null;
+    }
+
+    return this.renderStatus(hordes);
+  }
+}
+
+/******************************************************************************/
+
+const DesktopConnectionStatus = Widget.connect((state, props) => {
+  const stateWidgets = state.get('widgets').get(props.id);
+  const stateNetwork = state.get('network');
+
+  const hordes = stateNetwork.get('hordes');
+  const dialogVisibility = stateWidgets
+    ? stateWidgets.get('dialogVisibility')
+    : false;
+  return {hordes, dialogVisibility};
+})(DesktopConnectionStatusNC);
+
+export default DesktopConnectionStatus;

package/widgets/desktop-content/widget.js

@@ -1,68 +1,68 @@
-import React from 'react';
-import Widget from 'goblin-laboratory/widgets/widget';
-import importer from 'goblin_importer';
-/******************************************************************************/
-const viewImporter = importer('view');
-
-class Content extends Widget {
-  constructor() {
-    super(...arguments);
-  }
-
-  render() {
-    const {desktopId, workitem, dialogId, context, hinter, detail} = this.props;
-
-    let wid;
-    let view;
-    if (workitem) {
-      wid = workitem.get('id');
-      view = workitem.get('view');
-    } else if (!dialogId) {
-      return null;
-    }
-
-    if (wid === dialogId) {
-      //avoid display same content in tab
-      wid = null;
-    }
-
-    if (!view) {
-      view = 'default';
-    }
-
-    const View = viewImporter(view);
-    return (
-      <View
-        desktopId={desktopId}
-        context={context}
-        workitemId={wid}
-        dialogId={dialogId}
-        hinter={hinter}
-        detail={detail}
-      />
-    );
-  }
-}
-
-/******************************************************************************/
-
-const CurrentContent = Widget.connect((state, props) => {
-  const context = state.get(`backend.${props.id}.current.workcontext`);
-
-  const dialogId = state.get(`backend.${props.id}.current.dialogs.${context}`);
-  const workitemId = state.get(
-    `backend.${props.id}.current.workitems.${context}`
-  );
-  let workitem = null;
-  let hinter;
-  let detail;
-  if (workitemId) {
-    workitem = state.get(`backend.${props.id}.workitems.${workitemId}`);
-    hinter = workitem.get('hinter');
-    detail = workitem.get('detail');
-  }
-
-  return {workitem, dialogId, context, hinter, detail};
-})(Content);
-
-export default CurrentContent;
+import React from 'react';
+import Widget from 'goblin-laboratory/widgets/widget';
+import importer from 'goblin_importer';
+/******************************************************************************/
+const viewImporter = importer('view');
+
+class Content extends Widget {
+  constructor() {
+    super(...arguments);
+  }
+
+  render() {
+    const {desktopId, workitem, dialogId, context, hinter, detail} = this.props;
+
+    let wid;
+    let view;
+    if (workitem) {
+      wid = workitem.get('id');
+      view = workitem.get('view');
+    } else if (!dialogId) {
+      return null;
+    }
+
+    if (wid === dialogId) {
+      //avoid display same content in tab
+      wid = null;
+    }
+
+    if (!view) {
+      view = 'default';
+    }
+
+    const View = viewImporter(view);
+    return (
+      <View
+        desktopId={desktopId}
+        context={context}
+        workitemId={wid}
+        dialogId={dialogId}
+        hinter={hinter}
+        detail={detail}
+      />
+    );
+  }
+}
+
+/******************************************************************************/
+
+const CurrentContent = Widget.connect((state, props) => {
+  const context = state.get(`backend.${props.id}.current.workcontext`);
+
+  const dialogId = state.get(`backend.${props.id}.current.dialogs.${context}`);
+  const workitemId = state.get(
+    `backend.${props.id}.current.workitems.${context}`
+  );
+  let workitem = null;
+  let hinter;
+  let detail;
+  if (workitemId) {
+    workitem = state.get(`backend.${props.id}.workitems.${workitemId}`);
+    hinter = workitem.get('hinter');
+    detail = workitem.get('detail');
+  }
+
+  return {workitem, dialogId, context, hinter, detail};
+})(Content);
+
+export default CurrentContent;