+
Loading..
diff --git a/links/main.css b/links/main.css
index f81a471..3739c2e 100644
--- a/links/main.css
+++ b/links/main.css
@@ -1,7 +1,7 @@
body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_medium",courier,monospace;}
*:focus {outline: none; }
-canvas:hover { cursor: crosshair;}
+canvas:hover { cursor: none;}
#ronin { width:100%; height:100%; overflow:hidden; background:#111; background-image:url(../media/graphics/grid.svg); background-position: center center; }
#surface { width:50vw; height:50vh; overflow:hidden; position:fixed; left:50%; top:50%; background:none; border-radius:3px;}
@@ -15,6 +15,7 @@ canvas:hover { cursor: crosshair;}
#widget .module .highlight.managed { background:red; color:black; }
#widget .cursor { text-align: right;margin-top: 5px;position: absolute;right:0px}
#widget .layer:hover { cursor:pointer;}
+#cursor { width:10px; height:10px; position:fixed;border:1px solid red; border-radius:10px; z-index:10000; pointer-events: none}
#commander { display:none; z-index: 2000; position:fixed; }
#commander.visible { display:block; }
diff --git a/scripts/core/cursor.js b/scripts/core/cursor.js
index be1edf5..271e3a4 100644
--- a/scripts/core/cursor.js
+++ b/scripts/core/cursor.js
@@ -10,6 +10,8 @@ function Cursor(rune)
this.magnetism = null;
this.grid = new Position(4,4);
+ this.element = null;
+
this.layer = null;
this.install = function()
@@ -104,6 +106,22 @@ function Cursor(rune)
return new Position(x,y);
}
+ this.update_element = function(position)
+ {
+ position = ronin.position_in_window(position);
+
+ this.element.style.left = (position.x + window.innerWidth/2);
+ this.element.style.top = (position.y + window.innerHeight/2);
+
+ var radius = this.mode && this.mode.size ? this.mode.size : 5;
+ this.element.style.width = radius;
+ this.element.style.height = radius;
+ this.element.style.borderRadius = radius;
+ this.element.style.marginLeft = -radius/2;
+ this.element.style.marginTop = -radius/2;
+ this.element.style.borderColor = this.mode && this.mode.color ? this.mode.color.hex : "#ff0000";
+ }
+
//
this.mouse_down = function(position)
@@ -121,14 +139,18 @@ function Cursor(rune)
this.mouse_move = function(position)
{
+ this.update_element(position);
+
if(this.magnetism){
position = this.magnetic_position(position);
}
this.position = position;
+
if(this.mode.constructor.name != Cursor.name){
this.mode.mouse_move(position);
}
+
}
this.mouse_up = function(position)
diff --git a/scripts/core/init.js b/scripts/core/init.js
index 42a947d..98fe934 100644
--- a/scripts/core/init.js
+++ b/scripts/core/init.js
@@ -2,6 +2,7 @@ var ronin = new Ronin();
ronin.element = document.getElementById('ronin');
ronin.surface.element = document.getElementById('surface');
ronin.widget.element = document.getElementById('widget');
+ronin.cursor.element = document.getElementById('cursor');
ronin.cursor.mode = ronin.brush;
var commander = new Commander(document.getElementById("commander"),document.getElementById("commander_input"));