Skip to content

Commit

Permalink
1. add eslint
Browse files Browse the repository at this point in the history
2. use scss
3. format code
  • Loading branch information
s956142 committed Apr 24, 2024
1 parent 8340a05 commit 9b0aba9
Show file tree
Hide file tree
Showing 12 changed files with 2,710 additions and 822 deletions.
46 changes: 46 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
// mimic CommonJS variables -- not needed if using CommonJS
module.exports = {
root: true,
parser: "@babel/eslint-parser",
parserOptions: {
ecmaVersion: 2021,
sourceType: "module",
},
ignorePatterns: ["*.d.ts"],
overrides: [
{
files: ["*.ts", "*.tsx"],
parser: "@typescript-eslint/parser",
parserOptions: {
ecmaVersion: 2021,
sourceType: "module",
project: "./tsconfig.json",
},
extends: [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"plugin:@typescript-eslint/recommended-requiring-type-checking",
],
plugins: ["@typescript-eslint"],
rules: {
eqeqeq: "error",
"no-unused-vars": "off",
"@typescript-eslint/no-unused-vars": [
"error",
{
args: "all",
argsIgnorePattern: "^_",
caughtErrors: "all",
caughtErrorsIgnorePattern: "^_",
destructuredArrayIgnorePattern: "^_",
varsIgnorePattern: "^_",
ignoreRestSiblings: true,
},
],
"prefer-const": ["error", { ignoreReadBeforeAssign: true }],
semi: "error",
quotes: ["error", "single"],
},
},
],
};
22 changes: 22 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"editor.defaultFormatter": "rvest.vs-code-prettier-eslint",
"editor.formatOnType": false, // required
"editor.formatOnPaste": true, // optional
"editor.formatOnSave": true, // optional
"editor.formatOnSaveMode": "file", // required to format on save
"files.autoSave": "onFocusChange", // optional but recommended
"vs-code-prettier-eslint.prettierLast": true, // set as "true" to run 'prettier' last not first
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact"
],
"FSharp.excludeProjectDirectories": [
".git",
"paket-files",
".fable",
"packages",
"node_modules"
]
}
19 changes: 18 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,18 +10,35 @@
"build": "webpack --mode=production --node-env=production",
"build:dev": "webpack --mode=development",
"build:prod": "webpack --mode=production --node-env=production",
"watch": "webpack --watch"
"watch": "webpack --watch",
"lint": "eslint . --ignore-pattern .gitignore ."
},
"devDependencies": {
"@eslint/eslintrc": "^3.0.2",
"@eslint/js": "^9.1.1",
"@types/jquery": "^3.5.29",
"@webpack-cli/generators": "^3.0.7",
"clean-webpack-plugin": "^4.0.0",
"copy-webpack-plugin": "^12.0.2",
"css-loader": "^7.1.1",
"eslint": "8",
"eslint-config-standard-with-typescript": "^43.0.1",
"eslint-config-xo-typescript": "^4.0.0",
"eslint-loader": "^4.0.2",
"eslint-plugin-eslint-comments": "^3.2.0",
"eslint-plugin-import": "^2.25.2",
"eslint-plugin-n": "^15.0.0 || ^16.0.0 ",
"eslint-plugin-prettier": "^5.1.3",
"eslint-plugin-promise": "^6.0.0",
"eslint-plugin-spellcheck": "^0.0.20",
"globals": "^15.0.0",
"html-webpack-plugin": "^5.6.0",
"prettier": "^3.1.0",
"prettier-eslint": "^16.1.2",
"sass": "^1.75.0",
"sass-loader": "^14.2.1",
"typescript": "^5.4.5",
"typescript-eslint": "^7.7.1",
"webpack": "^5.91.0"
},
"dependencies": {
Expand Down
51 changes: 1 addition & 50 deletions src/index.d.ts
Original file line number Diff line number Diff line change
@@ -1,50 +1 @@
type CellEntity = {
x: number;
y: number;
groupId: number;
groupX: number;
groupY: number;
color: string;
cellId: string;
cubeType: CUBE_TYPE;
rotation: ROTATION_TYPE;
};
type CellPosition = {
x: number;
y: number;
};
type CubeBody = {
name: string;
bodyArray: (type: ROTATION_TYPE) => CellPosition[];
startY: number;
color: string;
previewSize: number;
};
type CubeDescription = {
[key in CUBE_TYPE]: CubeBody;
};
declare enum CUBE_TYPE {
CUBE1 = "S",
CUBE2 = "T",
CUBE3 = "I",
CUBE4 = "L",
CUBE5 = "Z",
CUBE6 = "O",
CUBE7 = "J"
}
declare enum ROTATION_TYPE {
TYPE1 = "type1",
TYPE2 = "type2",
TYPE3 = "type3",
TYPE4 = "type4"
}
declare enum MOVE_DIRECTION {
LEFT = "left",
DOWN = "down",
RIGHT = "right",
UP = "up"
}
type CubeAndType = {
cubeItem?: CubeBody;
cubeType?: CUBE_TYPE;
};
import './styles/index.scss';
92 changes: 9 additions & 83 deletions src/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,100 +4,26 @@
<meta charset="utf-8" />
<script src="./lib/js/jquery-1.10.2.min.js"></script>
<link rel="icon" href="./img/tetris.png" type="image/x-icon">
<style>
#canvas {
width: 300px;
height: 600px;
margin: 0px auto;
padding: 10px;
text-align: center;
background: #FFFFF4;
}
.container {
/* width: 310px; */
/* height: 510px; */
margin: 0px auto;
padding: 5px;
position: relative;
background-color: #FFFFF4;

}
.flex-row{
display: flex;
flex-direction: row;
}
.align-center{
align-items: center;

}

.ta-l {
text-align: left;
}
.ta-c {
text-align: center;
}
.fs-0 {
font-size: 0px;
}
.fs-16 {
font-size: 16px;
}
.fs-20 {
font-size: 20px;
}
.inline-div {
display: inline-block;
position: relative;
}
#game-over {
width: 310px;
height: 620px;
position: absolute;
top: 0px;
left: 0px;
display: none;
}
.score-board {
vertical-align: top;
}

.mt-10 {
margin-top: 10px;
}
.mr-2 {
margin-right: 2px;
}
.operation-intro{
display:flex;
flex-direction: column;
border: 1px solid #181804;
border-radius: 4px;
padding: 10px;

}
</style>
</head>

<body style="text-align: center;">
<div class="container">
<div class="fs-0">
<div class="inline-div">
<canvas id="canvas" width="310" height="620"></canvas>
<div class="container">
<div class="flex-row content-center">
<div class="flex-column main-view">
<div class="p-relative">
<canvas id="canvas" width="300" height="600"></canvas>
<img id="game-over" src="./img/gameOver.png" />
<div class="fs-16">
</div>

<div class="fs-16 game-group-btn">
<button id="pause">暫停</button>
<button id="continue">繼續</button>
<button id="restart">重新開始</button>
</div>
</div>
<input type="hidden" name="version" value="">
<div class="inline-div score-board fs-16 ta-l">
<div class="flex-column score-board fs-16 ta-l">
<div class="mt-10">分數: <span id="score-number">0</span></div>
<div class="mt-10">Combo: <span id="combo-number">0</span></div>



<div class="mt-10">Next</div>
<div class="preview ta-c">
<canvas class="mt-10" id="preview-canvas" width="100" height="100"></canvas>
Expand Down
Loading

0 comments on commit 9b0aba9

Please sign in to comment.