diff --git a/packages/backend/src/Feed.ts b/packages/backend/src/Feed.ts index 2c87371..a9bb75c 100644 --- a/packages/backend/src/Feed.ts +++ b/packages/backend/src/Feed.ts @@ -28,7 +28,7 @@ export default class Feed { public static feedVersion(): FeedMessage.Message { return { - action: Actions.FeedVersionLegacy, + action: Actions.FeedVersion, payload: VERSION }; } diff --git a/packages/common/src/feed.ts b/packages/common/src/feed.ts index 24748fe..219ba17 100644 --- a/packages/common/src/feed.ts +++ b/packages/common/src/feed.ts @@ -16,7 +16,6 @@ import { } from './types'; export const Actions = { - FeedVersionLegacy : 0xff as 0xff, FeedVersion : 0x00 as 0x00, BestBlock : 0x01 as 0x01, AddedNode : 0x02 as 0x02, @@ -39,12 +38,6 @@ export namespace Variants { action: Action; } - // TOOD: remove - export interface FeedVersionLegacyMessage extends MessageBase { - action: typeof Actions.FeedVersionLegacy; - payload: FeedVersion; - } - export interface FeedVersionMessage extends MessageBase { action: typeof Actions.FeedVersion; payload: FeedVersion; @@ -107,7 +100,6 @@ export namespace Variants { } export type Message = - | Variants.FeedVersionLegacyMessage | Variants.FeedVersionMessage | Variants.BestBlockMessage | Variants.AddedNodeMessage diff --git a/packages/common/src/index.ts b/packages/common/src/index.ts index 213dfa9..24b4df7 100644 --- a/packages/common/src/index.ts +++ b/packages/common/src/index.ts @@ -6,4 +6,4 @@ import * as FeedMessage from './feed'; export { Types, FeedMessage }; -export const VERSION: Types.FeedVersion = 3 as Types.FeedVersion; +export const VERSION: Types.FeedVersion = 4 as Types.FeedVersion; diff --git a/packages/frontend/src/Connection.ts b/packages/frontend/src/Connection.ts index 631df79..169765c 100644 --- a/packages/frontend/src/Connection.ts +++ b/packages/frontend/src/Connection.ts @@ -97,8 +97,6 @@ export class Connection { messages: for (const message of FeedMessage.deserialize(data)) { switch (message.action) { - // TODO: Kick legacy out on next update - case Actions.FeedVersionLegacy: case Actions.FeedVersion: { if (message.payload !== VERSION) { this.state = this.update({ status: 'upgrade-requested' }); diff --git a/packages/frontend/src/components/Chain.css b/packages/frontend/src/components/Chain.css index aae6b78..860903a 100644 --- a/packages/frontend/src/components/Chain.css +++ b/packages/frontend/src/components/Chain.css @@ -8,7 +8,7 @@ position: relative; } -.Chain-map-toggle { +.Chain-map-toggle .Icon { position: absolute; right: 20px; bottom: 0; @@ -21,7 +21,7 @@ border-radius: 4px 4px 0 0; } -.Chain-map-toggle-on { +.Chain-map-toggle-on .Icon { color: #fff; } diff --git a/packages/frontend/src/components/Chain.tsx b/packages/frontend/src/components/Chain.tsx index 11b0dce..ffa49ac 100644 --- a/packages/frontend/src/components/Chain.tsx +++ b/packages/frontend/src/components/Chain.tsx @@ -65,32 +65,13 @@ export class Chain extends React.Component { } public componentWillMount() { - const vp = viewport(); + this.calculateMapDimensions(); - vp.height -= HEADER; + window.addEventListener('resize', this.calculateMapDimensions); + } - const ratio = vp.width / vp.height; - - let top = 0; - let left = 0; - let width = 0; - let height = 0; - - if (ratio >= MAP_RATIO) { - console.log('wider'); - - width = Math.round(vp.height * MAP_RATIO); - height = Math.round(vp.height); - left = (vp.width - width) / 2; - } else { - console.log('taller'); - - width = Math.round(vp.width); - height = Math.round(vp.width / MAP_RATIO); - top = (vp.height - height) / 2; - } - - this.setState({ map: { top, left, width, height }}); + public componentWillUnmount() { + window.removeEventListener('resize', this.calculateMapDimensions); } public render() { @@ -109,7 +90,9 @@ export class Chain extends React.Component { #{formatNumber(best)} { blockAverage == null ? '-' : secondsWithPrecision(blockAverage / 1000) } - +
+ +
@@ -148,10 +131,11 @@ export class Chain extends React.Component { // const location = [36.7183391, -4.5193071]as Types.NodeLocation; // Malaga return ( -
); @@ -161,15 +145,6 @@ export class Chain extends React.Component { ); } - private pixelPosition(lat: Types.Latitude, lon: Types.Longitude): { left: number, top: number } { - const { map } = this.state; - - const left = Math.round(((lon + 180) / 360) * map.width + map.left) - 35; - const top = Math.round(((-lat + 90) / 180) * map.height + map.top) + 4; - - return { left, top } - } - private renderTable() { return ( @@ -198,4 +173,38 @@ export class Chain extends React.Component { private nodes() { return Array.from(this.props.appState.nodes.values()); } + + private pixelPosition(lat: Types.Latitude, lon: Types.Longitude): { left: number, top: number } { + const { map } = this.state; + + const left = Math.round(((lon + 180) / 360) * map.width + map.left) - 35; + const top = Math.round(((-lat + 90) / 180) * map.height + map.top) + 4; + + return { left, top } + } + + private calculateMapDimensions: () => void = () => { + const vp = viewport(); + + vp.height -= HEADER; + + const ratio = vp.width / vp.height; + + let top = 0; + let left = 0; + let width = 0; + let height = 0; + + if (ratio >= MAP_RATIO) { + width = Math.round(vp.height * MAP_RATIO); + height = Math.round(vp.height); + left = (vp.width - width) / 2; + } else { + width = Math.round(vp.width); + height = Math.round(vp.width / MAP_RATIO); + top = (vp.height - height) / 2; + } + + this.setState({ map: { top, left, width, height }}); + } }