From 21f979c81f1294a6070a667626714876e6013a92 Mon Sep 17 00:00:00 2001
From: ilari <ilosti@utu.fi>
Date: Thu, 31 Mar 2022 15:32:26 +0300
Subject: [PATCH] border version 1.0
---
.idea/modules.xml | 2 +-
projekti/src/App.js | 41 ++++++++++++++++++++++++++++++++++++++++-
2 files changed, 41 insertions(+), 2 deletions(-)
diff --git a/.idea/modules.xml b/.idea/modules.xml
index 3774a58..09659ce 100644
--- a/.idea/modules.xml
+++ b/.idea/modules.xml
@@ -2,7 +2,7 @@
<project version="4">
<component name="ProjectModuleManager">
<modules>
- <module fileurl="file://$PROJECT_DIR$/.idea/dtek0065_project.iml" filepath="$PROJECT_DIR$/.idea/dtek0065_project.iml" />
+ <module fileurl="file://$PROJECT_DIR$/.idea/DTEK0065_project.iml" filepath="$PROJECT_DIR$/.idea/DTEK0065_project.iml" />
</modules>
</component>
</project>
\ No newline at end of file
diff --git a/projekti/src/App.js b/projekti/src/App.js
index 5d36cee..d6a881a 100644
--- a/projekti/src/App.js
+++ b/projekti/src/App.js
@@ -1,11 +1,51 @@
import React, {Component} from "react";
+
class App extends Component {
constructor() {
super();
this.state = initialState;
}
+}
+
+ export interface ICanvasBoard {
+ height: number;
+ width: number;
+}
+
+const CanvasBoard = ({ height, width }: ICanvasBoard) => {
+ return (
+ <canvas
+ style={{
+ border: "3px solid black",
+ }}
+ height={height}
+ width={width}
+ />
+ );
+};
+
+import { ChakraProvider, Container, Heading } from "@chakra-ui/react";
+import { Provider } from "react-redux";
+import CanvasBoard from "./components/CanvasBoard";
+import ScoreCard from "./components/ScoreCard";
+import store from "./store";
+
+const App = () => {
+ return (
+ <Provider store={store}>
+ <ChakraProvider>
+ <Container maxW="container.lg" centerContent>
+ <Heading as="h1" size="xl">SNAKE GAME</Heading>
+ <CanvasBoard height={600} width={1000} /> //Canvasboard component added
+ </Container>
+ </ChakraProvider>
+ </Provider>
+ );
+};
+
+export default App;
// how the snake moves on the board
moveSnake() {
@@ -14,7 +54,6 @@ class App extends Component {
// updates the direction of the snake from the input it gets
changeDirection() {
-//homonaama
}
// checks if food is eaten
--
GitLab