(refactor) move ColorUtil to core package

core/src/index.ts

@@ -2,4 +2,5 @@ export * from './models/index'
 export * from './rtmt/index'
 export * from './theme/index'
 export * from './storage/storage'
-export * from './localization/index'
+export * from './localization/index'
+export * from './util/index'

core/src/util/ColorUtil.ts

@@ -18,6 +18,7 @@ export function hexToRgb(
   hex: string,
   result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex)
 ): number[] {
+  // TODO: fix later
   //@ts-ignore
   return result ? result.map((i) => parseInt(i, 16)).slice(1) : null;
   //returns [23, 14, 45] -> reformat if needed

core/src/util/index.ts

@@ -0,0 +1 @@
+export * from './ColorUtil'

frontend/src/MancalaApp.tsx

@@ -11,7 +11,7 @@ import Home from './routes/Home';
 
 import { initContext } from './context/context';
 import { RTMTWS, ConnectionState } from '@mancala/core';
-import { getColorByBrightness } from './util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import { Theme } from '@mancala/core';
 import LobyPage from './routes/LobyPage';
 import PrivacyPage from './routes/PrivacyPage';

frontend/src/animation/PitAnimator.ts

@@ -12,9 +12,8 @@ import { v4 } from "uuid";
 import { Context } from "../context/context";
 import BoardViewModelFactory from "../factory/BoardViewModelFactory";
 import { PitViewModelFactory } from "../factory/PitViewModelFactory";
-import { Game } from "@mancala/core";
-import { Theme } from "../theme/Theme";
-import { getColorByBrightness } from "../util/ColorUtil";
+import { Game, Theme } from "@mancala/core";
+import { getColorByBrightness } from "@mancala/core";
 import BoardViewModel from "../viewmodel/BoardViewModel";
 
 const animationUpdateInterval = 300;

frontend/src/components/Button.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { FunctionComponent } from "react";
 import { Context } from "../context/context";
-import { getColorByBrightness } from "../util/ColorUtil";
+import { getColorByBrightness } from "@mancala/core";
 
 const Button: FunctionComponent<{
   context: Context;

frontend/src/components/InfoPanel.tsx

@@ -2,7 +2,7 @@ import * as React from "react";
 import { FunctionComponent } from "react";
 import { Context } from "../context/context";
 import { Game, User } from "@mancala/core";
-import { getColorByBrightness } from "../util/ColorUtil";
+import { getColorByBrightness } from "@mancala/core";
 import CircularPanel from "./CircularPanel";
 import { useTranslation } from "react-i18next";
 

frontend/src/components/LoadingComponent.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { FunctionComponent } from 'react';
 import { Context } from '../context/context';
 import { LoadingState } from "@mancala/core";
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import CircularPanel from './CircularPanel';
 import { useTranslation } from 'react-i18next';
 

frontend/src/components/PageContainer.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { FunctionComponent } from "react";
-import { Theme } from "../theme/Theme";
+import { Theme } from "@mancala/core";
 
 const PageContainer: FunctionComponent<{ theme: Theme }> = (props) => {
     return (

frontend/src/components/UserStatus.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { FunctionComponent } from 'react';
 import { Context } from '../context/context';
 import { User } from "@mancala/core";
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import Space from './Space';
 import { useTranslation } from 'react-i18next';
 

frontend/src/components/board/StoreView.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { FunctionComponent } from "react";
 import { Context } from "../../context/context";
-import { getColorByBrightness } from "../../util/ColorUtil";
+import { getColorByBrightness } from "@mancala/core";
 import Util from "../../util/Util";
 import PitViewModel from "../../viewmodel/PitViewModel";
 import StoneView from "./StoneView";

frontend/src/routes/GamePage.tsx

@@ -22,7 +22,7 @@ import { Context } from '../context/context';
 import useWindowDimensions from '../hooks/useWindowDimensions';
 import { GameMove, LoadingState, Game, GameUsersConnectionInfo } from "@mancala/core";
 import { Theme } from '@mancala/core';
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import BoardViewModel from '../viewmodel/BoardViewModel';
 import Center from '../components/Center';
 import notyf from '../util/Notyf';

frontend/src/routes/Home.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { FunctionComponent, useEffect, useState } from "react";
-import { getColorByBrightness } from "../util/ColorUtil";
+import { getColorByBrightness } from "@mancala/core";
 import { Theme } from "@mancala/core";
 import HeaderBar from "../components/headerbar/HeaderBar";
 import PageContainer from "../components/PageContainer";

frontend/src/routes/LobyPage.tsx

@@ -13,7 +13,7 @@ import Row from '../components/Row';
 import { channel_cancel_new_game, channel_on_game_start } from '@mancala/core';
 import { Context } from '../context/context';
 import { Theme } from '@mancala/core';
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import Button from "../components/Button";
 import { useTranslation } from 'react-i18next';
 

frontend/src/routes/PrivacyPage.tsx

@@ -9,7 +9,7 @@ import PageContainer from '../components/PageContainer';
 import Row from '../components/Row';
 import { Context } from '../context/context';
 import { Theme } from '@mancala/core';
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import { useTranslation } from 'react-i18next';
 
 const PrivacyPage: FunctionComponent<{

frontend/src/util/ColorUtil.ts

@@ -1,31 +0,0 @@
-
-export function getBrightness(r: number, g: number, b: number) {
-  return (r * 299 + g * 587 + b * 114) / 1000;
-}
-
-export function getBrightnessFromHexColor(hexColor: string): number {
-  const [r, g, b] = hexToRgb(hexColor);
-  return getBrightness(r, g, b);
-}
-
-// from https://www.codegrepper.com/code-examples/javascript/javascript+convert+color+string+to+rgb
-export function rgbToHex(r: number, g: number, b: number): string {
-  return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
-}
-
-// from https://www.codegrepper.com/code-examples/javascript/javascript+convert+color+string+to+rgb
-export function hexToRgb(
-  hex: string,
-  result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex)
-): number[] {
-  return result ? result.map((i) => parseInt(i, 16)).slice(1) : null;
-  //returns [23, 14, 45] -> reformat if needed
-}
-
-export function getColorByBrightness(
-  color: string,
-  lightColor: string,
-  darkColor: string
-): string {
-  return getBrightnessFromHexColor(color) < 125 ? darkColor : lightColor;
-}

mobile/src/App.tsx

@@ -15,7 +15,7 @@ import { NativeModules, I18nManager, Platform } from 'react-native'
 // https://github.com/uuidjs/uuid/issues/514#issuecomment-691475020
 import 'react-native-get-random-values';
 import HelpScreen from './screens/HelpScreen';
-import { getColorByBrightness } from './util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import { server } from './const/config';
 
 const Stack = createNativeStackNavigator<RootStackParamList>();

mobile/src/animation/PitAnimator.ts

@@ -12,9 +12,8 @@ import { v4 } from "uuid";
 import { Context } from "../context/context";
 import BoardViewModelFactory from "../factory/BoardViewModelFactory";
 import { PitViewModelFactory } from "../factory/PitViewModelFactory";
-import { Game } from "@mancala/core";
-import { Theme } from "../theme/Theme";
-import { getColorByBrightness } from "../util/ColorUtil";
+import { Game, Theme } from "@mancala/core";
+import { getColorByBrightness } from "@mancala/core";
 import BoardViewModel from "../viewmodel/BoardViewModel";
 
 const animationUpdateInterval = 300;

mobile/src/components/Button.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { FunctionComponent } from "react";
 import { Context } from "../context/context";
-import { getColorByBrightness } from "../util/ColorUtil";
+import { getColorByBrightness } from "@mancala/core";
 import { Pressable, View } from "react-native";
 
 const Button: FunctionComponent<{

mobile/src/components/InfoPanel.tsx

@@ -2,7 +2,7 @@ import * as React from "react";
 import { FunctionComponent } from "react";
 import { Context } from "../context/context";
 import { Game, User} from "@mancala/core";
-import { getColorByBrightness } from "../util/ColorUtil";
+import { getColorByBrightness } from "@mancala/core";
 import CircularPanel from "./CircularPanel";
 import { useTranslation } from "react-i18next";
 import { Text, View, ViewStyle } from "react-native";

mobile/src/components/LoadingComponent.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { FunctionComponent } from 'react';
 import { Context } from '../context/context';
 import { LoadingState } from "@mancala/core";
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import CircularPanel from './CircularPanel';
 import { useTranslation } from 'react-i18next';
 import { Text } from 'react-native';

mobile/src/components/PageContainer.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { FunctionComponent } from "react";
-import { Theme } from "../theme/Theme";
+import { Theme } from "@mancala/core";
 import { Context } from "../context/context";
 import { View } from "react-native";
 

mobile/src/components/UserStatus.tsx

@@ -2,9 +2,9 @@ import * as React from 'react';
 import { FunctionComponent } from 'react';
 import { Context } from '../context/context';
 import { User } from "@mancala/core";
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import Space from './Space';
-import { Theme } from '../theme/Theme';
+import { Theme } from "@mancala/core";
 import { StyleSheet, Text, View, ViewStyle } from 'react-native';
 import { useTranslation } from 'react-i18next';
 

mobile/src/components/board/StoreView.tsx

@@ -1,10 +1,8 @@
 import * as React from "react";
 import { FunctionComponent } from "react";
 import { Context } from "../../context/context";
-import { getColorByBrightness } from "../../util/ColorUtil";
-import Util from "../../util/Util";
+import { getColorByBrightness } from "@mancala/core";
 import PitViewModel from "../../viewmodel/PitViewModel";
-import StoneView from "./StoneView";
 import { Text, View, ViewStyle } from "react-native";
 
 const StoreView: FunctionComponent<{

mobile/src/screens/GameScreen.tsx

@@ -9,7 +9,7 @@ import { MancalaGame, Pit } from 'mancala.js';
 import { v4 } from 'uuid';
 import PitAnimator from '../animation/PitAnimator';
 import { channel_on_game_update, channel_on_game_crashed, channel_on_game_user_leave, channel_on_user_connection_change, channel_listen_game_events, channel_unlisten_game_events, channel_leave_game, channel_game_move } from '@mancala/core';
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import Util from '../util/Util';
 import Snackbar from 'react-native-snackbar';
 import PageContainer from '../components/PageContainer';

mobile/src/screens/HomeScreen.tsx

@@ -5,7 +5,7 @@ import { HomeScreenProps } from '../types';
 import CircularPanel from '../components/CircularPanel';
 import { SvgXml } from 'react-native-svg';
 import helpSvg from '../svg/help';
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 
 export function HomeScreen({ navigation, route }: HomeScreenProps) {
 

mobile/src/screens/LobyScreen.tsx

@@ -6,7 +6,7 @@ import { useEffect } from 'react';
 import { CommonMancalaGame } from 'mancala.js';
 import { channel_cancel_new_game, channel_on_game_start } from '@mancala/core';
 import CircularPanel from '../components/CircularPanel';
-import { getColorByBrightness } from '../util/ColorUtil';
+import { getColorByBrightness } from "@mancala/core";
 import { SvgXml } from 'react-native-svg';
 import helpSvg from '../svg/help';