데스크탑 우클릭 이벤트 추가, 앱 리스트 및 데스크탑 설정 창 추가 Added Desktop Right Click Event…

…, App List and Desktop Settings Windows
SnowFlakeOS · Sep 15, 2018 · f88bdbd · f88bdbd
1 parent af504d0
commit f88bdbd
Show file tree

Hide file tree

Showing 6 changed files with 100 additions and 4 deletions.
diff --git a/res/ui_front/app-drawer.html b/res/ui_front/app-drawer.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
+    <title>App Drawer</title>
+  </head>
+  <body>
+    <b>Installed Apps</b>
+  </body>
+</html>
diff --git a/res/ui_front/css/context_menu.css b/res/ui_front/css/context_menu.css
@@ -0,0 +1,31 @@
+#context-menu {
+  list-style: none;
+  margin: 0px;
+  margin-top: 4px;
+  padding-left: 10px;
+  padding-right: 10px;
+  padding-bottom: 3px;
+  font-size: 15px;
+  color: #ffffff;
+}
+
+#rc-menu {
+  display: none;
+  position: fixed;
+  border: 1px solid green;
+  width: 200px;
+  background: #616161;
+  box-shadow: 3px 3px 2px #E9E9E9;
+  border-radius: 4px;
+}
+
+li {
+  padding; 3px;
+  padding-left: 10px;
+}
+
+#context-menu :hover {
+  color: white;
+  background: #9E9E9E;
+  border-radius: 2px;
+}
diff --git a/res/ui_front/desktop-settings.html b/res/ui_front/desktop-settings.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
+    <title>Desktop Settings</title>
+  </head>
+  <body>
+    <b>Desktop Settings</b>
+  </body>
+</html>
diff --git a/res/ui_front/desktop.html b/res/ui_front/desktop.html
@@ -3,8 +3,10 @@
 <html>
 	<head>
 		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
 		<link rel="stylesheet" href="./css/fixed_status_bar.css" />
 		<link rel="stylesheet" href="./css/background.css" />
+		<link rel="stylesheet" href="./css/context_menu.css" />
 	</head>
 	<body onload="startTime()">
 		<div id="desktop">
@@ -16,7 +18,19 @@
 			<div id="clock" style="float: right;"></div><br />
 			<div id="date" style="float: right;"></div>
 		</div>
-
+
+		<!-- Initially hidden, appears when right-click -->
+		<div id="rc-menu">
+			<ul id="context-menu">
+				<li>Open App Drawer</li>
+				<li>Open Desktop Settings</li>
+			</ul>
+		</div>
+
 		<script type="text/javascript" src="./js/clock.js"></script>
+		<script src="https://code.jquery.com/jquery-1.12.4.min.js"
+  	integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
+  	crossorigin="anonymous"></script>
+		<script type="text/javascript" src="./js/context_menu.js"></script>
 	</body>
-</html>
+</html>
diff --git a/res/ui_front/js/clock.js b/res/ui_front/js/clock.js
@@ -13,6 +13,11 @@
 		hour = hour - 12;
 	}
 
+	else if (hour == 0) {
+		AMPM = "오전";
+		hour = hour + 12;
+	}
+
 	else if (hour == 12) {
 		AMPM = "오후";
 	}
@@ -23,7 +28,8 @@
 
 	minute = checkTime(minute);
 	second = checkTime(second);
-
+	month = checkTime(month);
+
 	document.getElementById('clock').innerHTML = AMPM + " " + hour + ":" + minute;
 	document.getElementById('date').innerHTML = year + "-" + month + "-" + date;
 	var t = setTimeout(startTime, 500);
@@ -35,4 +41,4 @@ function checkTime (i) {
 		i = "0" + i;
 	}
 	return i;
-}
+}
diff --git a/res/ui_front/js/context_menu.js b/res/ui_front/js/context_menu.js
@@ -0,0 +1,23 @@
+// Right Click context menu, requires jQuery
+$(document).bind("contextmenu", function(e) {
+  e.preventDefault();
+  $("#rc-menu").css("left", e.pageX);
+  $("#rc-menu").css("top", e.pageY);
+  $("#rc-menu").fadeIn(100, startFocusOut());
+});
+
+function startFocusOut() {
+  $(document).on("click", function() {
+    $("#rc-menu").hide();
+    $(document).off("click");
+  });
+}
+
+$("#context-menu > li").click(function() {
+  if ($(this).text() == "Open App Drawer") {
+    window.open("./app-drawer.html", "App List", "width=1280,height=720");
+  }
+  if ($(this).text() == "Open Desktop Settings") {
+    window.open("./desktop-settings.html", "Desktop Settings", "width=1280,height=720");
+  }
+});