From d1ba11811db1b91f187320724a3fe93dfd47e169 Mon Sep 17 00:00:00 2001
From: Fabian Jakobs <fabian.jakobs@web.de>
Date: Tue, 6 Apr 2010 16:45:40 +0200
Subject: [PATCH] externalize CSS

---
 VirtualRenderer.js |  7 ++---
 editor.css         | 64 +++++++++++++++++++++++++++++++++++++++++++++
 editor.html        | 65 ++--------------------------------------------
 3 files changed, 70 insertions(+), 66 deletions(-)
 create mode 100644 editor.css

diff --git a/VirtualRenderer.js b/VirtualRenderer.js
index cfcdf631..74311db3 100644
--- a/VirtualRenderer.js
+++ b/VirtualRenderer.js
@@ -1,8 +1,9 @@
 function VirtualRenderer(containerId)
 {
   this.container = document.getElementById(containerId);
-  this.canvas = document.createElement("div");
+  this.container.className += "editor";
   
+  this.canvas = document.createElement("div");
   this.canvas.className = "canvas";
   this.container.appendChild(this.canvas);
   
@@ -331,11 +332,11 @@ VirtualRenderer.prototype.screenToTextCoordinates = function(pageX, pageY)
 };
 
 VirtualRenderer.prototype.visualizeFocus = function() {
-  this.container.className = "focus";
+  this.container.className = "editor focus";
 };
 
 VirtualRenderer.prototype.visualizeBlur = function() {
-  this.container.className = "";
+  this.container.className = "editor";
 };
 
 VirtualRenderer.prototype.showComposition = function(position)
diff --git a/editor.css b/editor.css
new file mode 100644
index 00000000..ceebf793
--- /dev/null
+++ b/editor.css
@@ -0,0 +1,64 @@
+.editor {
+  position: absolute;
+  border: 1px solid black;
+  overflow-x: auto;
+  overflow-y: hidden;	  
+}
+
+.editor.focus {
+  border: 1px solid #327fbd;;
+}
+
+.editor .canvas {
+  z-index: 2;
+  position: absolute;
+  overflow: hidden;
+  font-family: Monaco, "Courier New";
+  font-size: 12px;
+  white-space: nowrap;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  cursor: text;
+}
+	
+.composition {
+  position: absolute;
+  text-decoration: underline;
+}
+
+.cursor {
+  position: absolute;
+  width: 1px;
+  background: black;
+}
+
+.line {
+  white-space: nowrap;
+}
+
+.line.odd {
+  /*background: #FAFAFA;*/
+}
+
+.keyword {
+  color: blue;
+}
+
+.string {
+  color: rgb(3, 106, 7);
+}
+
+.comment {
+  font-style: italic;
+  color: rgb(0, 102, 255);
+}
+
+.editor .markers {
+  position: absolute;
+  z-index: 1;
+}
+
+.selection {
+  position: absolute;
+  background: rgba(77, 151, 255, 0.33);
+}
\ No newline at end of file
diff --git a/editor.html b/editor.html
index 99110776..dd7e4eed 100644
--- a/editor.html
+++ b/editor.html
@@ -9,76 +9,15 @@
 	
 	<style type="text/css" media="screen">
 	
-	#container {
-	  position: absolute;
-	  border: 1px solid black;
-	  overflow-x: auto;
-	  overflow-y: hidden;	  
+	#container {  
 	  top: 5px;
 	  right: 5px;
 	  bottom: 5px;
 	  left: 5px;
 	}
-	
-	#container.focus {
-	  border: 1px solid #327fbd;;
-	}
-	
-	.canvas {
-	  z-index: 2;
-	  position: absolute;
-    overflow: hidden;
-	  font-family: Monaco, "Courier New";
-	  font-size: 12px;
-	  white-space: nowrap;
-	  -webkit-box-sizing: border-box;
-	  box-sizing: border-box;
-	  cursor: text;
-	}
-		
-	.composition {
-	  position: absolute;
-	  text-decoration: underline;
-	}
-	
-	.cursor {
-	  position: absolute;
-	  width: 1px;
-    background: black;
-	}
-	
-	.line {
-	  white-space: nowrap;
-	}
-	
-	.line.odd {
-	  /*background: #FAFAFA;*/
-	}
-
-  .keyword {
-    color: blue;
-  }
-  
-  .string {
-    color: rgb(3, 106, 7);
-  }
-  
-  .comment {
-    font-style: italic;
-    color: rgb(0, 102, 255);
-  }
-  
-  .markers {
-    position: absolute;
-    z-index: 1;
-  }
-  
-  .selection {
-    position: absolute;
-    background: rgba(77, 151, 255, 0.33);
-  }
   
 	</style>
+	<link rel="stylesheet" href="editor.css" type="text/css" charset="utf-8">
 	
 	<script src="lib.js" type="text/javascript" charset="utf-8"></script>
 	<script src="TextDocument.js" type="text/javascript" charset="utf-8"></script>