bugs solved

src/main.js

@@ -139,21 +139,8 @@ var App = {
 		} else
 			this.resetForm(true);
 
-		var branch = this.getBranch();
+		this.$('branch').value = this.getBranch();
-		if (!branch) branch = defaultBranch;
+		this.onChangeBranchChange();
-		this.$('branchDiv').value = branch;
-		if (this.$("branch").value == "master") {
-			this.$("branch").style.backgroundColor = "#c20000";
-			this.$("optionsLogo").style.backgroundColor = "#c20000";
-		}
-		if (this.$("branch").value == "test") {
-			this.$("branch").style.backgroundColor = "#31a527";
-			this.$("optionsLogo").style.backgroundColor = "#31a527";
-		}
-		if (this.$("branch").value == "dev") {
-			this.$("branch").style.backgroundColor = "#a59827";
-			this.$("optionsLogo").style.backgroundColor = "#a59827";
-		}
 	},
 
 	resetForm: function(clearPassword) {
@@ -193,30 +180,16 @@ var App = {
 	},
 
 	onShowOptionsClick: function() {
-		if (this.$("branchDiv").style.visibility == "hidden") {
+		var style = this.$("branchSelector").style;
-			this.$("branchDiv").style.visibility = "visible";
+		style.display = style.display == 'none' || !style.display
-			this.$("optionsLogo").style.borderRadius = "25px 0px 0px 25px";
+			? 'inline'
-			this.$("optionsLogo").style.paddingRight = ".45em";
+			: 'none';
-		} else {
-			this.$("branchDiv").style.visibility = "hidden";
-			this.$("optionsLogo").style.borderRadius = "100%";
-			this.$("optionsLogo").style.paddingRight = ".2em";
-		}
 	},
 
-	onChangeBranchClick: function() {
+	onChangeBranchChange: function() {
-		if (this.$("branch").value == "master") {
+		this.$("branchButton").className = this.$("branch").value;
-			this.$("branch").style.backgroundColor = "#c20000";
+		this.$("branch").className = this.$("branch").value;
-			this.$("optionsLogo").style.backgroundColor = "#c20000";
+		this.$('user').focus();
-		}
-		if (this.$("branch").value == "test") {
-			this.$("branch").style.backgroundColor = "#31a527";
-			this.$("optionsLogo").style.backgroundColor = "#31a527";
-		}
-		if (this.$("branch").value == "dev") {
-			this.$("branch").style.backgroundColor = "#a59827";
-			this.$("optionsLogo").style.backgroundColor = "#a59827";
-		}
 	},
 
 	cleanCache: function() {
@@ -286,7 +259,7 @@ var App = {
 					? '.archive/'+ this.module +'/'+ version +'.7z'
 					: this.module +'.7z?'+ new Date().getTime();
 				remoteFile = Conf.remoteUrl +'/'+ remoteFile;
-				var request = new ActiveXObject("Microsoft.XMLHTTP");
+				var request = new ActiveXObject("MSXML2.XMLHTTP");
 				request.open('GET', remoteFile, true);
 				request.onreadystatechange = function() {
 					App.onRequestReady(request);
@@ -586,8 +559,7 @@ var App = {
 	 * @return {string} Branch name, master if cannot
 	 */
 	getBranch: function() {
-
+		var branch = Conf.defaultBranch;
-		var branch = 'master';
 		try {
 			var mdbConn = new ActiveXObject('ADODB.Connection');
 			mdbConn.open(this.getOdbcString({

src/style.css

@@ -19,16 +19,26 @@ a {
 	width: 80%;
 }
 button,
-input,
+input {
+	font-size: 1em;
+	background-color: transparent;
+	color: black;
+}
 select {
 	font-size: 1em;
-}
-select {
 	background-color: black;
-	color: white;
 }
-option::selection {
+select.master {
-	background-color: white;
+	background-color: #c20000;
+}
+select.test {
+	background-color: #31a527;
+}
+select.dev {
+	background-color: #a59827;
+}
+option {
+	color: white;
 }
 #fields {
 	max-width: 11em;
@@ -58,7 +68,6 @@ input[type='password'] {
 	padding-top: .5em;
 	padding-bottom: .5em;
 	padding-left: .2em;
-	padding-right: .2em;
 	max-width: auto;
 }
 input[type='text']:focus,
@@ -103,35 +112,49 @@ button {
 	border-radius: 25px;
 }
 button:hover {
-	background-color: #db821b;
+	background-color: #eb8b1d;
 	cursor: pointer;
 }
 
 /* Branch */
 
 #branchOptions {
-	text-align: left;
+	margin-top: 1em;
-	margin-top: 1.55em;
 }
-#optionsLogo {
+#branchLogo {
 	cursor: pointer;
-	padding: .2em;
+	padding-top: .4em;
-}
+	padding-bottom: .2em;
-#branchDiv {
+	padding-left: .4em;
-	margin-top: -2em;
+	padding-right: .4em;
-	margin-left: 2em;
-	font-size: 1em;
 }
 #branch {
-	padding-left: 1em;
-	padding-top: .465em;
-	padding-bottom: .46em;
-	padding-right: .46em;
-	border-radius: 0px 5px 5px 0px;
 	border: none;
 	cursor: pointer;
-	margin-top: -.435em;
 	margin-left: .4em;
+	float: right;
+}
+#branchSelector {
+	float: right;
+	margin-top: .7em;
+	display: none;
+	padding-left: .3em;
+	padding-right: .8em;
+}
+#branchButton {
+	float: left;
+	border-radius: 25px;
+	color: white;
+	box-shadow: 0px 0px 5px 0px #000000;
+}
+#branchButton.master {
+	background-color: #c20000;
+}
+#branchButton.test {
+	background-color: #31a527;
+}
+#branchButton.dev {
+	background-color: #a59827;
 }
 
 /* Message */
@@ -152,6 +175,7 @@ button:hover {
 	font-size: .9em;
 	display: none;
 	border-radius: 25px;
+	box-shadow: 0px 0px 5px 0px #000000
 }
 #message.error {
 	border-color: black;

src/vn-access.hta

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
 <head>
-	<meta charset="UTF-8" http-equiv="X-UA-Compatible" http-equiv="X-UA-Compatible" content="IE=9"/>
+	<meta charset="UTF-8" http-equiv="X-UA-Compatible" content="IE=9"/>
 	<title>ㅤ</title>
 	<link rel="stylesheet" href="style.css"/>
 	<script type="text/javascript" src="main.js"></script>
@@ -65,18 +65,19 @@
 		</a>
 	</div>
 	<div id="branchOptions">
-		<img
+		<div id="branchButton">
-		id="optionsLogo"
+			<img
-		src="branch.png"
+				id="branchLogo"
-		onclick="App.onShowOptionsClick()"
+				src="branch.png"
-		style="border-radius: 100%; padding-right: .2em;"
+				onclick="App.onShowOptionsClick()"
-		alt="Options"/>
+				alt="Change branch"/>
-		<div id="branchDiv" style="visibility: hidden;">
+			<div id="branchSelector">
-			<select id="branch" onclick="App.onChangeBranchClick()">
+				<select id="branch" onchange="App.onChangeBranchChange()">
-				<option>master</option>
+					<option value="master">master</option>
-				<option>test</option>
+					<option value="test">test</option>
-				<option>dev</option>
+					<option value="dev">dev</option>
-			</select>
+				</select>
+			</div>
 		</div>
 	</div>
 	<div id="background">