function createEye(mainDiv, eyeRadius, pupilRadius, focusPosition, bigPupilColor){
    // create the DOM
    var eyeDiv = document.createElement('div');
    var pupilDiv = document.createElement('pupil');
    eyeDiv.appendChild(pupilDiv);
    mainDiv.appendChild(eyeDiv);

    // retrieve eye position and manually update it when necessary
    var eyePos = tie(function() { return { left: eyeDiv.offsetLeft, top: eyeDiv.offsetTop }; });
    eyeRadius.onMayHaveChanged(eyePos.invalidate.bind(eyePos));

    // make sure the pupil cannot be bigger than the eye
    pupilRadius = tie.min(pupilRadius, eyeRadius)

    // calculate pupil position
    var dx = eyePos.prop("left").add(eyeRadius).sub(focusPosition.prop('x'));
    var dy = eyePos.prop("top").add(eyeRadius).sub(focusPosition.prop('y'));
    var d  = tie.min(
        eyeRadius.sub(pupilRadius),
        tie.sum(dx.pow(2), dy.pow(2)).sqrt()
    );
    var angle = tie.atan2(dy, dx);
    var pupilLeft = eyeRadius.sub(pupilRadius, d.mul(angle.cos()));
    var pupilTop  = eyeRadius.sub(pupilRadius, d.mul(angle.sin()));

    var pupilColor = eyeRadius.lte(pupilRadius).ifElse(bigPupilColor, "black");

    // set the style
    tie.bindStyle(eyeDiv, {
        "position": "relative",
        "display": "inline-block",
        "margin": "5px 10px",
        "border-radius": "100%",
        "border-color": "black",
        "border-style": "solid",
        "height": eyeRadius.mul(2).add("px"),
        "width": eyeRadius.mul(2).add("px")
    });
    tie.bindStyle(pupilDiv, {
        "position": "absolute",
        "border-radius": "100%",
        "background-color": pupilColor,
        "left": pupilLeft.add("px"),
        "top": pupilTop.add("px"),
        "height": pupilRadius.mul(2).add("px"),
        "width": pupilRadius.mul(2).add("px")
    });
}

window.addEventListener("load", function(){

    var mousePosition = tie({x: 0, y: 0});
    document.addEventListener("mousemove", function(evt){
        mousePosition.set({ x: evt.pageX, y: evt.pageY });
    });

    var eyeSizeSlider = document.querySelector("#eyes-size");
    var pupilSizeSlider = document.querySelector("#pupils-size");
    var eyeSliderVal = tie(function(){ return eyeSizeSlider.value });
    var pupilSliderVal = tie(function(){ return pupilSizeSlider.value });
    eyeSizeSlider.addEventListener("input", eyeSliderVal.invalidate.bind(eyeSliderVal));
    pupilSizeSlider.addEventListener("input", pupilSliderVal.invalidate.bind(pupilSliderVal));

    var eyeRadius = eyeSliderVal.parseFloat();
    var pupilRadius = pupilSliderVal.parseFloat();

    createEye(document.querySelector("#eyes"), eyeRadius, pupilRadius, mousePosition, "yellow");
    createEye(document.querySelector("#eyes"), eyeRadius.mul(0.7), pupilRadius.mul(0.8), mousePosition, "red");
});

@@ -2,22 +2,16 @@
 unction 
-create
 Eye(main
@@ -136,13 +136,13 @@
 ent(
-'div'
+%22div%22
 );%0A 
@@ -186,15 +186,15 @@
 ent(
-'
+%22
 pupil
-'
+%22
 );%0A 
@@ -268,229 +268,34 @@
     
-// retrieve eye position and manually update it when necessary%0A    var eyePos = tie(function() %7B return %7B left: eyeDiv.offsetLeft, top: eyeDiv.offsetTop %7D; %7D);%0A    eyeRadius.onMayHaveChanged(eyePos.invalidate.bind(eyePos)
+var eyeBorderWidth = tie(2
 );%0A%0A
@@ -400,16 +400,17 @@
 eRadius)
+;
 %0A%0A    //
@@ -455,144 +455,260 @@
  eye
-Pos.prop(%22left%22).add(eyeRadius).sub(focusPosition.prop('x'));%0A    var dy = eyePos.prop(%22top%22).add(eyeRadius).sub(focusPosition.prop('y')
+Radius.add(eyeBorderWidth).sub(focusPosition.prop(%22x%22)).alter(function(x)%7B%0A        return x + eyeDiv.offsetLeft%0A    %7D);%0A    var dy = eyeRadius.add(eyeBorderWidth).sub(focusPosition.prop(%22y%22)).alter(function(y)%7B%0A        return y + eyeDiv.offsetTop%0A    %7D
 );%0A 
@@ -1208,18 +1208,17 @@
 %22: %225px 
-10
+4
 px%22,%0A   
@@ -1239,32 +1239,82 @@
 adius%22: %22100%25%22,%0A
+        %22border-width%22: eyeBorderWidth.add(%22px%22),%0A
         %22border-
@@ -2543,30 +2543,42 @@
 oat();%0A%0A    
-create
+var leftEye = new 
 Eye(document
@@ -2593,32 +2593,58 @@
 lector(%22#eyes%22),
+%0A                         
  eyeRadius, pupi
@@ -2672,28 +2672,44 @@
 n, %22
-yellow%22);%0A    create
+lightgray%22);%0A    var rightEye = new 
 Eye(
@@ -2740,16 +2740,43 @@
 #eyes%22),
+%0A                          
  eyeRadi
@@ -2830,11 +2830,17 @@
 n, %22
-red
+lightgray
 %22);%0A

Update eye demo.