X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;f=editor.coffee;h=b78f6a0018331c02d253f9c4ceb385beca790810;hb=de7ea41e62923186961069c83372e2525b42d707;hp=7d34100925145dcc4b12c244d9de0ba1f5f5e911;hpb=1d14b271fa3419e81ab843ba78eafc8d32119faf;p=peach-html5-editor.git

diff --git a/editor.coffee b/editor.coffee
index 7d34100..b78f6a0 100644
--- a/editor.coffee
+++ b/editor.coffee
@@ -19,6 +19,11 @@ overlay_padding = 10
 
 timeout = (ms, cb) -> return setTimeout cb, ms
 
+# xml 1.0 says:
+valid_attr_regex = new RegExp '^[a-zA-Z_:][-a-zA-Z0-9_:.]*$'
+# html5 spec is much more lax, but chromium won't let me make at attribute with the name "4"
+js_attr_regex = new RegExp '^[oO][nN].'
+
 debug_dot_at = (doc, x, y) ->
 	return # disabled
 	el = doc.createElement 'div'
@@ -231,6 +236,19 @@ outer_css = (args) ->
 	ret += '@keyframes blink {'
 	ret +=     'to { visibility: hidden; }'
 	ret += '}'
+	ret += '.ann_box {'
+	ret +=     'z-index: 5;'
+	ret +=     'position: absolute;'
+	ret +=     'border: 1px solid rgba(0,0,0,0.1);'
+	ret +=     'outline: 1px solid rgba(255,255,255,0.1);' # in case there's a black background
+	ret += '}'
+	ret += '.ann_tag {'
+	ret +=     'z-index: 10;'
+	ret +=     'position: absolute;'
+	ret +=     'font-size: 8px;'
+	ret +=     'white-space: pre;'
+	ret +=     'background: rgba(255,255,255,0.4);'
+	ret += '}'
 	return ret
 
 # key codes:
@@ -283,11 +301,14 @@ instantiate_tree = (tree, parent) ->
 				if c.name in ['script', 'object', 'iframe', 'link']
 					# TODO put placeholders instead
 					remove.unshift i
+					continue
 				# TODO create in correct namespace
 				c.el = parent.ownerDocument.createElement c.name
 				for k, v of c.attrs
 					# FIXME if attr_whitelist[k]?
-					c.el.setAttribute k, v
+					if valid_attr_regex.test k
+						unless js_attr_regex.test k
+							c.el.setAttribute k, v
 				parent.appendChild c.el
 				if c.children.length
 					instantiate_tree c.children, c.el
@@ -791,10 +812,10 @@ class PeachHTML5Editor
 			if bounds.x is prev_bounds.x and bounds.y is prev_bounds.y and bounds.w is prev_bounds.w and bounds.h is prev_bounds.h
 				n = n.parent
 				continue
-			matt = domify @outer_idoc, div: style: "position: absolute; left: #{bounds.x - 1 + overlay_padding}px; top: #{bounds.y - 1 + overlay_padding}px; width: #{bounds.w}px; height: #{bounds.h}px; outline: 1000px solid rgba(0,153,255,#{alpha}); border: 1px solid rgba(0,0,0,.1)"
+			matt = domify @outer_idoc, div: class: 'ann_box', style: "left: #{bounds.x - 1 + overlay_padding}px; top: #{bounds.y - 2 + overlay_padding}px; width: #{bounds.w}px; height: #{bounds.h}px" # outline: 1000px solid rgba(0,153,255,#{alpha});
 			@overlay.appendChild matt
 			@matting.push matt
-			ann = domify @outer_idoc, div: style: "position: absolute; left: #{bounds.x - 2 + overlay_padding}px; top: #{bounds.y - 6 + overlay_padding}px; font-size: 8px", children: [domify @outer_idoc, text: "<#{n.name}>"]
+			ann = domify @outer_idoc, div: class: 'ann_tag', style: "left: #{bounds.x + 1 + overlay_padding}px; top: #{bounds.y - 7 + overlay_padding}px", children: [domify @outer_idoc, text: " #{n.name} "]
 			@overlay.appendChild ann
 			@matting.push ann
 			n = n.parent