fixing type error in web-world

examples/drag-and-drop/drag-and-drop-1.rkt

@@ -1,6 +1,10 @@
 #lang planet dyoo/whalesong
 
-(require (planet dyoo/whalesong/web-world))
+(require (planet dyoo/whalesong/web-world)
+         (planet dyoo/whalesong/resource))
+
+(define-resource view.html)
+(define-resource style.css)
 
 ;; A small drag-and-drop example using the web-world library.
 ;;
@@ -12,3 +16,47 @@
 (define-struct box (id x y))
 
 
+
+;; add-fresh-box: world view -> world
+;; Given a world, creates a new world within the boundaries of the playground.
+(define (add-fresh-box w v)
+  (define-values (max-width max-height) (width-and-height "playground"))
+  (define new-world (cons (make-box (fresh-id)
+                                    (random max-width)
+                                    (random max-height))
+                          w))
+  new-world)
+
+
+
+;; FIXME: do some javascript stuff here to get at this.
+;;
+(define (width-and-height element-id)
+  (values 500 500))
+
+
+(define (draw w v)
+  (foldl (lambda (a-box v)
+           (cond
+            [(view-focus? v (box-id a-box))
+             v]
+            [else
+             (view-append-child v
+                                (xexp->dom `(span (@ (class "box")
+                                                    (id ,(box-id a-box))
+                                                    (style ,(format "position: relative; left: ~apx; top: ~apx"
+                                                                   (box-x a-box)
+                                                                   (box-y a-box))))
+                                                 "I am a box")))]))
+         (view-focus v "playground")
+         w))
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+
+(define the-view (view-bind-many view.html
+                                 ["add" "click" add-fresh-box]))
+  
+(big-bang (list)
+          (initial-view the-view)
+          (to-draw draw))
+          

examples/drag-and-drop/style.css

@@ -1,17 +1,15 @@
-html {
-    width: 100%;
-    height: 100%;
-}
-
-body {
-    width: 100%;
-    height: 100%;
-}
 
 #playground {
     background-color: lightgray;
     border: 1px solid black;
-    width: 70%;
-    height: 70%;
+    width: 500px;
+    height: 500px;
     display: block;
+}
+
+
+.box {
+    position: relative;
+    background-color: orange;
+    border: 1px solid black;
 }

examples/drag-and-drop/view.html

@@ -10,7 +10,7 @@
 This is the playground.
 </div>
 
-<input type="button" value="Add"/>
+<input type="button" id="add" value="Add"/>
 
 </body>
 </html>

web-world/js-impl.js

@@ -543,7 +543,7 @@
             },
             function(eventHandlers) { return eventHandlers; },
             function(view) {
-                var clone = deepClone(domNode);
+                var clone = $(deepClone(domNode));
                 clone.appendTo($(view.focus));
                 view.focus = clone.get(0);
             }
@@ -557,7 +557,7 @@
             },
             function(eventHandlers) { return eventHandlers; },
             function(view) {
-                var clone = deepClone(domNode);
+                var clone = $(deepClone(domNode));
                 clone.insertAfter($(view.focus));
                 view.focus = clone.get(0);
             }
@@ -571,7 +571,7 @@
             },
             function(eventHandlers) { return eventHandlers; },
             function(view) {
-                var clone = deepClone(domNode);
+                var clone = $(deepClone(domNode));
                 clone.insertBefore($(view.focus));
                 view.focus = clone.get(0);
             }