Add: SessionStorageManager

src/game/global/global_variables.js

@@ -19,19 +19,13 @@ function isReleaseMode() {
 const GAME_SCREEN_SIZE = { x: 1024, y: 768 }
 
 
-let sessingPlayerName;
-let sessionPlayerUserID;
-let sessionPlayingAppName;
 
+let sessionStorageManager = new SessionStorageManager();
 {
-	sessionPlayerName = sessionStorage.getItem("playerName");
+	console.log("playerName : " + sessionStorageManager.playerName);
-	console.log("playerName : " + sessionPlayerName);
+	console.log("playerUserID : " + sessionStorageManager.playerUserID);
-	sessionPlayerUserID = sessionStorage.getItem("playerUserID");
+	console.log("playingAppName : " + sessionStorageManager.playingAppName);
-	console.log("playerUserID : " + sessionPlayerUserID);
-	sessionPlayingAppName = sessionStorage.getItem("playingAppName");
-	console.log("sessionPlayingAppName : " + sessionPlayingAppName);
 }
-
 let appInfoManager = new AppInfoManager();
 
 let textStyleBasic = { font: "bold 32px Arial", fill: "#fff", align: "center", boundsAlignH: "center", boundsAlignV: "middle" };

src/game/lib/session_storage_manager.js

@@ -0,0 +1,38 @@
+class SessionStorageManager {
+
+	constructor() {
+	}
+
+	clear() {
+		sessionStorage.clear();
+	}
+
+	removeItem(key) {
+		return sessionStorage.removeItem(key);
+	}
+
+	// player name
+	set playerName(value) {
+		sessionStorage.setItem("playerName", value);
+	}
+	get playerName() {
+		return sessionStorage.getItem("playerName");
+	}
+
+	// player user ID
+	set playerUserID(value) {
+		sessionStorage.setItem("playerUserID", value);
+	}
+	get playerUserID() {
+		return sessionStorage.getItem("playerUserID");
+	}
+
+	// playing app name
+	set playingAppName(value) {
+		sessionStorage.setItem("playingAppName", value);
+	}
+	get playingAppName() {
+		return sessionStorage.getItem("playingAppName");
+	}
+
+}

src/game/login/login.js

@@ -12,9 +12,7 @@ let Login = {
 	create: function() {
 		self = this;
 
-		sessionStorage.removeItem("playerName");
+		sessionStorageManager.clear();
-		sessionStorage.removeItem("playerUserID");
-		sessionStorage.removeItem("playingAppName");
 
 		this.game.stage.backgroundColor = '#4d4d4d';
 
@@ -83,7 +81,7 @@ let Login = {
 	},
 
 	startMenu: function() {
-		sessionPlayerName = self.inputTextName.canvasInput._value;
+		sessionStorageManager.playerName = self.inputTextName.canvasInput._value;
 		let birthday = self.inputTextBirthday.canvasInput._value;
 
 		xhr = new XMLHttpRequest();
@@ -109,7 +107,7 @@ let Login = {
 		}
 		xhr.open('POST', '../../web/client/php/check_user.php', true);
 		xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
-		let param = 'name=' + sessionPlayerName + '&birthday=' + birthday;
+		let param = 'name=' + sessionStorageManager.playerName + '&birthday=' + birthday;
 		// console.log(param);
 		xhr.send(param);
 
@@ -131,23 +129,15 @@ let Login = {
 	},
 
 	loginSucceeded: function(jsonData) {
-		sessionPlayerUserID = jsonData['UserID'];
+		sessionStorageManager.playerUserID = jsonData['UserID'];
-		// console.log('playerUserID : ' + playerUserID);
-		// this.state.start('Menu');
-
-		sessionStorage.setItem("playerName", sessionPlayerName);
-		sessionStorage.setItem("playerUserID", sessionPlayerUserID);
-		sessionStorage.setItem("playingAppName", "menu");
-		console.log("playerName : " + sessionStorage.getItem("playerName"));
-		console.log("playerUserID : " + sessionStorage.getItem("playerUserID"));
-		console.log("playingAppName : " + sessionStorage.getItem("playingAppName"));
 
+		sessionStorageManager.playingAppName = "menu";
 		location.href = '../../web/client/menu_app.html';
 	},
 
 	loginFailed: function(jsonData) {
-		sessionStorage.removeItem("playerName");
+		sessionStorageManager.clear();
-		sessionStorage.removeItem("playerUserID");
+
 		// show retry message
 		console.log('login failed, jsonData : ' + JSON.stringify(jsonData));
 	}

src/game/menu/menu_app.js

@@ -12,9 +12,7 @@ let MenuApp = {
 
 		// top
 		let backButton = new BackButton( () => {
-			sessionStorage.removeItem("playerName");
+			sessionStorageManager.clear();
-			sessionStorage.removeItem("playerUserID");
-			sessionStorage.removeItem("playingAppName");
 
 			location.href = '../../web/client/login.html';
 		});
@@ -25,9 +23,7 @@ let MenuApp = {
 		// app icons
 		let space_invaders = new AppButton(AppButton.TYPE_MOUSE, "icon_fullscreen",
 			() => {
-				sessionPlayingAppName = "space_invaders";
+				sessionStorageManager.playingAppName = "space_invaders";
-				sessionStorage.setItem("playingAppName", sessionPlayingAppName);
-
 				location.href = '../../web/client/start.html';
 			}
 		);
@@ -45,8 +41,9 @@ let MenuApp = {
 		let screenBottom = new ScreenBottom(game);
 		screenBottom.makeBottomLine();
 		// screenBottom.printBottomLeftText("게임 진행 정보");
-		screenBottom.printBottomCenterText(appInfoManager.getAppNameKorean(sessionPlayingAppName));
+		let playingAppName = appInfoManager.getAppNameKorean(sessionStorageManager.playingAppName);
-		screenBottom.printBottomRightText(sessionPlayerName);
+		screenBottom.printBottomCenterText(playingAppName);
+		screenBottom.printBottomRightText(sessionStorageManager.playerName);
 
 		// this.loadTypingStageData();
 	},

src/game/start/start.js

@@ -25,9 +25,10 @@ let Start = {
 		// bottom
 		let screenBottom = new ScreenBottom(game);
 		screenBottom.makeBottomLine();
-		// screenBottom.printBottomLeftText("게임 진행 정보");
+		screenBottom.printBottomLeftText("게임 진행 정보");
-		screenBottom.printBottomCenterText(appInfoManager.getAppNameKorean(sessionPlayingAppName));
+		let playingAppName = appInfoManager.getAppNameKorean(sessionStorageManager.playingAppName);
-		screenBottom.printBottomRightText(sessionPlayerName);
+		screenBottom.printBottomCenterText(playingAppName);
+		screenBottom.printBottomRightText(sessionStorageManager.playerName);
 
 		// this.loadTypingStageData();
 	},

src/web/client/login.html

@@ -11,6 +11,7 @@
 
 		<!-- global source files -->
 		<script src="../../game/lib/app_info_manager.js"></script>
+		<script src="../../game/lib/session_storage_manager.js"></script>
 		<script src="../../game/global/global_variables.js"></script>
 
 		<!-- library source files -->

src/web/client/menu_app.html

@@ -11,6 +11,7 @@
 
 		<!-- global source files -->
 		<script src="../../game/lib/app_info_manager.js"></script>
+		<script src="../../game/lib/session_storage_manager.js"></script>
 		<script src="../../game/global/global_variables.js"></script>
 
 		<!-- library source files -->

src/web/client/space_invaders.html

@@ -11,6 +11,7 @@
 
 		<!-- global source files -->
 		<script src="../../game/lib/app_info_manager.js"></script>
+		<script src="../../game/lib/session_storage_manager.js"></script>
 		<script src="../../game/global/global_variables.js"></script>
 
 		<!-- Space Invaders : source files -->

src/web/client/start.html

@@ -11,6 +11,7 @@
 
 		<!-- global source files -->
 		<script src="../../game/lib/app_info_manager.js"></script>
+		<script src="../../game/lib/session_storage_manager.js"></script>
 		<script src="../../game/global/global_variables.js"></script>
 
 		<!-- library source files -->

test/app_info_manager.html

@@ -10,7 +10,7 @@
   <div id="qunit"></div>
   <div id="qunit-fixture"></div>
   <script src="https://code.jquery.com/qunit/qunit-2.6.0.js"></script>
-  <script src="../src/game/lib/app_info_manager.js"></script>
+  <script src="../src/game/lib/session_storage_manager.js"></script>
   <script src="test_app_info_manager.js"></script>
 </body>
 </html>

test/session_storage_manager.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width">
+  <title>QUnit Example</title>
+  <link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.6.0.css">
+</head>
+<body>
+  <div id="qunit"></div>
+  <div id="qunit-fixture"></div>
+  <script src="https://code.jquery.com/qunit/qunit-2.6.0.js"></script>
+  <script src="../src/game/lib/session_storage_manager.js"></script>
+  <script src="test_session_storage_manager.js"></script>
+</body>
+</html>

test/test_session_storage_manager.js

@@ -0,0 +1,34 @@
+let sessionStorageManager = new SessionStorageManager();
+
+QUnit.test( "PlayerName", function( assert ) {
+	sessionStorageManager.clear();
+	assert.equal(sessionStorageManager.playerName, null, "playerName");
+
+	sessionStorageManager.playerName = "박지상";
+	assert.equal(sessionStorageManager.playerName, "박지상", "playerName");
+
+	sessionStorageManager.removeItem("playerName");
+	assert.equal(sessionStorageManager.playerName, null, "playerName");
+});
+
+QUnit.test( "playerUserID", function( assert ) {
+	sessionStorageManager.clear();
+	assert.equal(sessionStorageManager.playerUserID, null, "playerUserID");
+
+	sessionStorageManager.playerUserID = 1;
+	assert.equal(sessionStorageManager.playerUserID, 1, "playerUserID");
+
+	sessionStorageManager.removeItem("playerUserID");
+	assert.equal(sessionStorageManager.playerUserID, null, "playerUserID");
+});
+
+QUnit.test( "playingAppName", function( assert ) {
+	sessionStorageManager.clear();
+	assert.equal(sessionStorageManager.playingAppName, null, "playingAppName");
+
+	sessionStorageManager.playingAppName = "space_invaders";
+	assert.equal(sessionStorageManager.playingAppName, "space_invaders", "playingAppName");
+
+	sessionStorageManager.removeItem("playingAppName");
+	assert.equal(sessionStorageManager.playingAppName, null, "playingAppName");
+});