Add: TypingExamButton

This commit is contained in:
2019-07-11 19:08:27 +09:00
parent 42046efc14
commit 33ac149831
10 changed files with 494 additions and 20 deletions
@@ -1,4 +1,4 @@
Beautiful Dreamer Beautiful dreamer
Stephen Foster Stephen Foster
Beautiful dreamer, wake unto me, Beautiful dreamer, wake unto me,
@@ -1,4 +1,4 @@
THE WOLF AND THE SEVEN LITTLE KIDS The wolf and the seven little kids
The Brothers Grimm The Brothers Grimm
There was once upon a time an old goat who had seven little kids, and loved them with all the love of a mother for her children. One day she wanted to go into the forest and fetch some food. So she called all seven to her and said: 'Dear children, I have to go into the forest, be on your guard against the wolf; if he comes in, he will devour you all--skin, hair, and everything. The wretch often disguises himself, but you will know him at once by his rough voice and his black feet.' The kids said: 'Dear mother, we will take good care of ourselves; you may go away without any anxiety.' Then the old one bleated, and went on her way with an easy mind. There was once upon a time an old goat who had seven little kids, and loved them with all the love of a mother for her children. One day she wanted to go into the forest and fetch some food. So she called all seven to her and said: 'Dear children, I have to go into the forest, be on your guard against the wolf; if he comes in, he will devour you all--skin, hair, and everything. The wretch often disguises himself, but you will know him at once by his rough voice and his black feet.' The kids said: 'Dear mother, we will take good care of ourselves; you may go away without any anxiety.' Then the old one bleated, and went on her way with an easy mind.
+54
View File
@@ -0,0 +1,54 @@
TypingExamButton.prototype = Object.create(RoundRectButton.prototype);
TypingExamButton.constructor = TypingExamButton;
function TypingExamButton(x, y, iconName, buttonText, writingID) {
this.writingID = writingID;
var setting = new RoundRectButtonSetting(
x, y,
TypingExamButton.BUTTON_WIDTH, TypingExamButton.BUTTON_HEIGHT
);
setting.fontStyle.boundsAlignH = "center"; // left, center. right
setting.fontStyle.boundsAlignV = "middle"; // top, middle, bottom
setting.strokeWidthPx = 5;
setting.setStrokeColor(
0x446688,
0x6688aa,
0x6688aa,
0x333333
);
setting.setButtonColor(
0xaabbdd,
0xddeeff,
0xddeeff,
0x666666
);
setting.setTextColor(
"#468",
"#68a",
"#68a",
"#333"
);
RoundRectButton.call(this, setting, iconName, buttonText, this.onClick);
}
TypingExamButton.prototype.onClick = function() {
sessionStorageManager.setWritingID(this.writingID);
// location.href = '../../web/client/typing_examination.html';
printSessionStorage();
}
TypingExamButton.BUTTON_WIDTH = 490;
TypingExamButton.BUTTON_HEIGHT = 80;
TypingExamButton.BUTTON_GAP = 5;
TypingExamButton.MARGIN_VERTICAL = 100;
TypingExamButton.PRACTICE_BUTTON_POS_X = GAME_SCREEN_SIZE.x / 4 + TypingExamButton.BUTTON_GAP;
TypingExamButton.TEST_BUTTON_POS_X = GAME_SCREEN_SIZE.x / 4 * 3 - TypingExamButton.BUTTON_GAP;
TypingExamButton.BUTTON_POS_Y = GAME_SCREEN_SIZE.y - 104;
+16 -11
View File
@@ -38,17 +38,7 @@ var sessionStorageManager = new SessionStorageManager();
console.log("Running in TDD mode"); console.log("Running in TDD mode");
} else { } else {
if(isDebugMode()) { if(isDebugMode()) {
console.log("maestroName : " + sessionStorageManager.getMaestroName()); printSessionStorage();
console.log("maestroID : " + sessionStorageManager.getMaestroID());
console.log("maestroAccountType : " + sessionStorageManager.getMaestroAccountType());
console.log("playerName : " + sessionStorageManager.getPlayerName());
console.log("playerID : " + sessionStorageManager.getPlayerID());
console.log("playerAccountType : " + sessionStorageManager.getPlayerAccountType());
console.log("playingAppID : " + sessionStorageManager.getPlayingAppID());
console.log("playingAppName : " + sessionStorageManager.getPlayingAppName());
console.log("playingAppKoreanName : " + sessionStorageManager.getPlayingAppKoreanName());
console.log("record : " + sessionStorageManager.getRecord());
console.log("appHighestRecord : " + sessionStorageManager.getAppHighestRecord());
} }
if(sessionStorageManager.getMaestroID() === null && !isLogin()) { if(sessionStorageManager.getMaestroID() === null && !isLogin()) {
@@ -57,6 +47,21 @@ var sessionStorageManager = new SessionStorageManager();
} }
} }
function printSessionStorage() {
console.log("maestroName : " + sessionStorageManager.getMaestroName());
console.log("maestroID : " + sessionStorageManager.getMaestroID());
console.log("maestroAccountType : " + sessionStorageManager.getMaestroAccountType());
console.log("playerName : " + sessionStorageManager.getPlayerName());
console.log("playerID : " + sessionStorageManager.getPlayerID());
console.log("playerAccountType : " + sessionStorageManager.getPlayerAccountType());
console.log("playingAppID : " + sessionStorageManager.getPlayingAppID());
console.log("playingAppName : " + sessionStorageManager.getPlayingAppName());
console.log("playingAppKoreanName : " + sessionStorageManager.getPlayingAppKoreanName());
console.log("record : " + sessionStorageManager.getRecord());
console.log("appHighestRecord : " + sessionStorageManager.getAppHighestRecord());
console.log("writingID : " + sessionStorageManager.getWritingID());
}
function isLogin() { function isLogin() {
var filename = location.pathname.substring(location.pathname.lastIndexOf("/") + 1); var filename = location.pathname.substring(location.pathname.lastIndexOf("/") + 1);
+8
View File
@@ -107,6 +107,14 @@ SessionStorageManager.prototype.getIsNewAppHighestRecord = function() {
return sessionStorage.getItem("isNewAppHighestRecord"); return sessionStorage.getItem("isNewAppHighestRecord");
} }
// writing ID
SessionStorageManager.prototype.setWritingID = function(value) {
sessionStorage.setItem("writingID", value);
}
SessionStorageManager.prototype.getWritingID = function() {
return sessionStorage.getItem("writingID");
}
SessionStorageManager.prototype.resetPlayingAppData = function() { SessionStorageManager.prototype.resetPlayingAppData = function() {
this.removeItem("playingAppID"); this.removeItem("playingAppID");
this.removeItem("playingAppName"); this.removeItem("playingAppName");
+12
View File
@@ -0,0 +1,12 @@
/////////////////////////////
// Main game
var CONTENT_ID = "MenuApp";
var game = new Phaser.Game(
GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y,
Phaser.CANVAS, CONTENT_ID
);
game.state.add('MenuTypingExam', MenuTypingExam);
game.state.start('MenuTypingExam');
+295
View File
@@ -0,0 +1,295 @@
var MenuTypingExam = {
preload: function() {
game.load.image('icon_fullscreen', '../../../resources/image/icon/fullscreen_white.png');
game.load.image('space_invaders', '../../../resources/image/icon/space_invaders.png');
Animal.loadResources();
},
create: function() {
game.stage.backgroundColor = '#4d4d4d';
// typing app area
var typingBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_APP, 1,
0, 60,
GAME_SCREEN_SIZE.x, GAME_SCREEN_SIZE.y - 110
);
// korean app area
// var koreanBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_KOREAN, 1,
// 0, 60 + AppAreaBG.GAP_Y,
// GAME_SCREEN_SIZE.x, 270
// );
// koreanBG.printText(
// "한 글 타 자",
// game.world.centerX, 320,
// 36, "#000", 0.05
// );
// english app area
// var englishBG = new AppAreaBG(AppAreaBG.COLOR_TYPING_ENGLISH, 1,
// 0, 340,
// GAME_SCREEN_SIZE.x, 270
// );
// englishBG.printText(
// "영 문 타 자",
// game.world.centerX, 370,
// 36, "#000", 0.05
// );
// keyboard shortcut
this.keyboardShortcut = new KeyboardShortcut();
this.keyboardShortcut.addCallback(
Phaser.KeyCode.ESC, // keyCode
null, // keyDownHandler
(function() { this.back(); }).bind(this), // keyUpHandler
"menu_typing_test" // callerClassName
);
// top ui
var screenTopUI = new ScreenTopUI();
screenTopUI.makeBackButton( (function() { this.back(); }).bind(this) );
screenTopUI.makeFullScreenButton();
// typing tab buttons
var typingPracticeTabButton = new TypingTabButton(
TypingTabButton.PRACTICE_BUTTON_POS_X, TypingTabButton.BUTTON_POS_Y,
"", "타자 연습",
(function() {
location.href = '../../web/client/menu_typing_practice.html';
})
);
// typingPracticeTabButton.setInputEnabled(false);
var typingTestTabButton = new TypingTabButton(
TypingTabButton.TEST_BUTTON_POS_X, TypingTabButton.BUTTON_POS_Y,
"", "타자 시험",
(function() {
location.href = '../../web/client/menu_typing_test.html';
})
);
typingTestTabButton.setInputEnabled(false);
this.animalRecordList = new AnimalRecordList();
this.animalRecordList.printScore(AnimalRecordList.TYPE_TEST);
this.makeActiveTypingTestAppButtons();
// bottom ui
var screenBottomUI = new ScreenBottomUI();
// screenBottomUI.printLeftText("게임 진행 정보");
screenBottomUI.printCenterText("메뉴 > 타자 시험");
screenBottomUI.printRightText(sessionStorageManager.getPlayerName());
},
back: function() {
location.href = '../../web/client/menu_app.html';
},
makeActiveTypingTestAppButtons: function() {
var dbService = new DBService();
dbService.setMaestroID(sessionStorageManager.getMaestroID());
dbService.setPlayerID(sessionStorageManager.getPlayerID());
dbService.requestWritingPlayerList(
(jsonData) => { // onSucceeded
var writingArray = jsonData["writingArray"];
// assert.equal(writingArray[0].name, "봄 - 윤동주", "name");
// assert.equal(writingArray[3].name, "허생전 - 박지원", "name");
// done();
this.downloadListSucceeded(jsonData);
},
(jsonData) => { // onFailed
this.downloadListFailed(jsonData);
}
);
/*
var dbConnectManager = new DBConnectManager();
dbConnectManager.requestTypingTestAppList(
sessionStorageManager.getMaestroID(),
sessionStorageManager.getPlayerID(),
// self.downloadListSucceeded,
// self.downloadListFailed
(function(replyJSON) {
this.downloadListSucceeded(replyJSON);
}).bind(this),
(function(replyJSON) {
this.downloadListFailed(replyJSON);
}).bind(this)
);
*/
},
hasApp: function(appID, appList) {
for(var i = 0; i < appList.length; i++) {
if(appList[i].AppID === appID)
return true;
}
return false;
},
getAppHighestRecord: function(jsonList, appID) {
var count = jsonList.length; // Object.keys(jsonList).length;
for(var i = 0; i < count; i++) {
if(jsonList[i].AppID === appID)
return jsonList[i].AppHighestRecord;
}
return 0;
},
getAnimalSprite: function(jsonList, appID) {
var appHighestRecord = this.getAppHighestRecord(jsonList, appID);
var animalSprite = null;
if(appHighestRecord === 0) {
animalSprite = new Animal(Animal.TYPE_ICON, 0, 0, 0);
// animalSprite.sprite.tint = RoundRectButtonSetting.DEFAULT_BUTTON_COLORS.disabled;
} else {
var animalLevel = Animal.animalLevelIDByRecord(appHighestRecord, Animal.TYPE_TEST);
animalSprite = new Animal(Animal.TYPE_ICON, animalLevel, 0, 0);
}
return animalSprite;
},
downloadListSucceeded: function(replyJSON) {
console.log(replyJSON);
var writingArray = replyJSON["writingArray"];
var writingCount = writingArray.length;
var indexKoreanWriting = 0;
var indexEnglishWriting = 0;
for(var i = 0; i < writingCount; i++) {
var writingData = writingArray[i];
if(writingData.language === "korean") {
var typingPracticeExamButton = new TypingExamButton(
TypingExamButton.PRACTICE_BUTTON_POS_X, 200 + 100 * indexKoreanWriting,
"", writingData.name,
writingData.writingID
);
indexKoreanWriting++;
} else { // english
var typingPracticeExamButton = new TypingExamButton(
TypingTabButton.TEST_BUTTON_POS_X, 200 + 100 * indexEnglishWriting,
"", writingData.name,
writingData.writingID
);
indexEnglishWriting++;
}
}
/*
var buttonWidthGap = TypingAppButton.BUTTON_WIDTH + MenuTypingExam.BUTTON_GAP;
var koreanTypingPracticeAppCount = replyJSON.KoreanAppList.length; // Object.keys(replyJSON.KoreanAppList).length;
var englishTypingPracticeAppCount = replyJSON.EnglishAppList.length; // Object.keys(replyJSON.EnglishAppList).length;
for(var i = 0; i < koreanTypingPracticeAppCount; i++) {
var activeApp = replyJSON.KoreanAppList[i];
var posX = this.getButtonPosX(i, koreanTypingPracticeAppCount);
var posY = this.getButtonPosY(i, koreanTypingPracticeAppCount,
TypingAppButton.BUTTON_UPPER_POS_Y
);
var typingTestButton = new TypingAppButton(
TypingAppButton.TYPE_TEST_KOREAN,
posX, posY,
this.getAnimalSprite(replyJSON.KoreanHighScoreList, activeApp.AppID),
activeApp.KoreanName,
{
AppID: activeApp.AppID,
AppName: activeApp.AppName,
KoreanName: activeApp.KoreanName
}
);
if(!this.hasApp(activeApp.AppID, replyJSON.KoreanActiveAppList))
typingTestButton.setInputEnabled(false);
}
for(var i = 0; i < englishTypingPracticeAppCount; i++) {
var activeApp = replyJSON.EnglishAppList[i];
var posX = this.getButtonPosX(i, englishTypingPracticeAppCount);
var posY = this.getButtonPosY(i, englishTypingPracticeAppCount,
TypingAppButton.BUTTON_LOWER_POS_Y
);
var typingTestButton = new TypingAppButton(
TypingAppButton.TYPE_TEST_ENGLISH,
posX, posY,
this.getAnimalSprite(replyJSON.EnglishHighScoreList, activeApp.AppID),
activeApp.KoreanName,
{
AppID: activeApp.AppID,
AppName: activeApp.AppName,
KoreanName: activeApp.KoreanName
}
);
if(!this.hasApp(activeApp.AppID, replyJSON.EnglishActiveAppList))
typingTestButton.setInputEnabled(false);
}
*/
},
getButtonPosX: function(index, buttonCount) {
var gap = TypingAppButton.BUTTON_WIDTH + TypingAppButton.BUTTON_GAP;
var maxColumnNum = Math.floor( (game.world.width - TypingAppButton.MARGIN_VERTICAL) / gap );
// console.log("maxColumnNum : " + maxColumnNum);
var rowCount = Math.ceil(buttonCount / maxColumnNum);
// console.log("rowCount : " + rowCount);
var columnIndex = index % maxColumnNum;
// console.log("columnIndex : " + columnIndex);
var rowIndex = Math.floor(index / maxColumnNum);
// console.log("rowIndex : " + rowIndex);
var columnCountForThisRow = 0;
if(rowIndex < rowCount - 1)
columnCountForThisRow = maxColumnNum;
else
columnCountForThisRow = buttonCount - (maxColumnNum * rowIndex);
// console.log("columnCountForThisRow : " + columnCountForThisRow);
var startX = game.world.width / 2 - ( (gap / 2) * (columnCountForThisRow - 1) );
return startX + gap * columnIndex;
},
getButtonPosY: function(index, buttonCount, startPosY) {
var rowGap = TypingAppButton.BUTTON_HEIGHT + TypingAppButton.BUTTON_GAP;
var columnGap = TypingAppButton.BUTTON_WIDTH + TypingAppButton.BUTTON_GAP;
var maxColumnNum = Math.floor( (game.world.width - TypingAppButton.MARGIN_VERTICAL) / columnGap );
// console.log("maxColumnNum : " + maxColumnNum);
// console.log("buttonCount : " + buttonCount);
var rowCount = Math.ceil(buttonCount / maxColumnNum);
// console.log("rowCount : " + rowCount);
var rowIndex = Math.floor(index / maxColumnNum);
// console.log("rowIndex : " + rowIndex);
var startY = startPosY - ( (rowGap / 2) * (rowCount - 1) );
return startY + rowGap * rowIndex;
},
downloadListFailed: function(replyJSON) {
console.log('download app list failed, jsonData : ' + JSON.stringify(replyJSON));
}
}
+92
View File
@@ -0,0 +1,92 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<meta charset="UTF-8">
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-85912788-2"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-85912788-2');
</script>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-N8PB4F3');</script>
<!-- End Google Tag Manager -->
<title>타자 시험 메뉴</title>
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link href="../../../resources/font/open-iconic-master/font/css/open-iconic-bootstrap.css" rel="stylesheet">
<link href="../../../resources/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="./../../../resources/jquery/jquery-3.3.1.min.js"></script>
<script src="../../../resources/js/phaser.min.js"></script>
<!-- global source files -->
<script src="../../game/lib/session_storage_manager.js"></script>
<script src="../../game/lib/global/global_variables.js"></script>
<!-- library source files -->
<script src="../../game/lib/util/number_util.js"></script>
<script src="../../game/lib/util/string_util.js"></script>
<script src="../../game/lib/util/record_util.js"></script>
<script src="../../game/lib/text/input_type_text.js"></script>
<script src="../../game/lib/text/screen_top_ui.js"></script>
<script src="../../game/lib/text/screen_bottom_ui.js"></script>
<script src="../../game/lib/keyboard_shortcut.js"></script>
<script src="../../game/lib/button/round_rect_button.js"></script>
<script src="../../game/lib/button/back_button.js"></script>
<script src="../../game/lib/button/fullscreen_button.js"></script>
<script src="../../game/lib/button/typing_app_button.js"></script>
<script src="../../game/lib/button/typing_tab_button.js"></script>
<script src="../../game/lib/button/typing_exam_button.js"></script>
<script src="../../game/lib/db_connect_manager.js"></script>
<script src="../../game/lib/db_service.js"></script>
<script src="../../game/typing/lib/animal.js"></script>
<!-- source files -->
<script src="../../game/menu/app_area_bg.js"></script>
<script src="../../game/menu/animal_record_list.js"></script>
<script src="../../game/menu/menu_typing_exam.js"></script>
<script src="../../game/menu/main_menu_typing_exam.js"></script>
<script src="../../game/menu/app_area_bg.js"></script>
<style>
body{
padding: 0;
margin: 0;
}
canvas{
margin: 0 auto;
}
</style>
<script>
$(document).ready(function() {
$('#client_refresh').load("./../module/client_refresh.html");
});
</script>
</head>
<body>
<div id="MenuApp" style="text-align:center;"></div>
<div id="client_refresh"></div>
</body>
</html>
+4 -2
View File
@@ -7,17 +7,19 @@ class WritingCollection extends DBMethodContainer
$writer = "system"; $writer = "system";
$query = " $query = "
SELECT Name, Filename, LetterCount SELECT WritingID, Language, Name, Filename, LetterCount
FROM writing FROM writing
WHERE Writer = ?"; WHERE Writer = ?";
$stmt = $this->mysqli->prepare($query); $stmt = $this->mysqli->prepare($query);
$stmt->bind_param("s", $writer); $stmt->bind_param("s", $writer);
$stmt->execute(); $stmt->execute();
$stmt->bind_result($name, $filename, $letterCount); $stmt->bind_result($writingID, $language, $name, $filename, $letterCount);
$resultArray = array(); $resultArray = array();
while($stmt->fetch()) { while($stmt->fetch()) {
$rowArray = array(); $rowArray = array();
$rowArray["writingID"] = $writingID;
$rowArray["language"] = $language;
$rowArray["name"] = $name; $rowArray["name"] = $name;
$rowArray["filename"] = $filename; $rowArray["filename"] = $filename;
$rowArray["letterCount"] = $letterCount; $rowArray["letterCount"] = $letterCount;
+11 -5
View File
@@ -129,6 +129,7 @@ INSERT INTO `ads_client` (`AdsClientID`, `ClientName`) VALUES
CREATE TABLE writing ( CREATE TABLE writing (
WritingID INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY, WritingID INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY,
Language CHAR(10) NOT NULL,
Name CHAR(50) NOT NULL, Name CHAR(50) NOT NULL,
Filename CHAR(50) NOT NULL, Filename CHAR(50) NOT NULL,
Writer CHAR(50) NOT NULL, Writer CHAR(50) NOT NULL,
@@ -136,11 +137,16 @@ CREATE TABLE writing (
UpdateDate DATETIME NOT NULL, UpdateDate DATETIME NOT NULL,
LetterCount INT UNSIGNED NOT NULL LetterCount INT UNSIGNED NOT NULL
); );
INSERT INTO `writing` (`WritingID`, `Name`, `Filename`, `Writer`, `WriterID`, `UpdateDate`, `LetterCount`) VALUES INSERT INTO `writing` (`WritingID`, `Language`, `Name`, `Filename`, `Writer`, `WriterID`, `UpdateDate`, `LetterCount`) VALUES
(1, '봄 - 윤동주', 'korean_spring.txt', 'System', , '2019-07-04 00:00:00', 93), (1, 'korean', '봄2', 'korean_spring.txt', 'system', NULL, '2019-07-04 00:00:00', 93),
(2, '애국가', 'korean_national_anthem.txt', 'System', , '2019-07-04 00:00:00', 208), (2, 'korean', '애국가', 'korean_national_anthem.txt', 'system', NULL, '2019-07-04 00:00:00', 208),
(3, '냉면 - 김남천', 'korean_cold_noodle.txt', 'System', , '2019-07-04 00:00:00', 2101), (3, 'korean', '냉면', 'korean_cold_noodle.txt', 'system', NULL, '2019-07-04 00:00:00', 2101),
(4, '허생전 - 박지원', 'korean_heoseng.txt', 'System', , '2019-07-04 00:00:00', 8839); (4, 'korean', '허생전', 'korean_heoseng.txt', 'system', NULL, '2019-07-04 00:00:00', 8839),
(5, 'english', 'Time is', 'english_time_is.txt', 'system', NULL, '2019-07-11 00:00:00', 186),
(6, 'english', 'Beautiful dreamer', 'english_beautiful_dreamer.txt', 'system', NULL, '2019-07-11 00:00:00', 729),
(7, 'english', 'The wolf and the seven little kids', 'english_wolf_7kids.txt', 'system', NULL, '2019-07-11 00:00:00', 5765),
(8, 'english', 'The happy prince', 'english_happy_prince.txt', 'system', NULL, '2019-07-11 00:00:00', 18355);
CREATE TABLE typing_exam_record ( CREATE TABLE typing_exam_record (
TypingExamRecordID INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY, TypingExamRecordID INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY,