Display text for img tag, background-image

4 files changed, 55 insertions, 17 deletions

diff --git a/src/css/cascade.nim b/src/css/cascade.nim
index 4c782ded..eb9e87b8 100644
--- a/src/css/cascade.nim
+++ b/src/css/cascade.nim
@@ -134,6 +134,9 @@ func calcPresentationalHints(element: Element): CSSComputedValues =
     map_align
   of TAG_COL:
     map_width
+  of TAG_IMG:
+    map_width
+    map_height
   of TAG_BODY:
     map_bgcolor
     map_text
@@ -262,6 +265,8 @@ proc applyRules(document: Document, ua, user: CSSStylesheet, cachedTree: StyledN
           let content = HTMLInputElement(styledParent.node).inputString()
           if content.len > 0:
             let styledText = styledParent.newStyledText(content)
+            # Note: some pseudo-elements (like input text) generate text nodes
+            # directly, so we have to cache them like this.
             styledText.pseudo = pseudo
             styledParent.children.add(styledText)
         of PSEUDO_TEXTAREA_TEXT:
@@ -270,6 +275,11 @@ proc applyRules(document: Document, ua, user: CSSStylesheet, cachedTree: StyledN
             let styledText = styledParent.newStyledText(content)
             styledText.pseudo = pseudo
             styledParent.children.add(styledText)
+        of PSEUDO_IMAGE:
+          let content = CSSContent(t: CONTENT_IMAGE, s: "[img]")
+          let styledText = styledParent.newStyledReplacement(content)
+          styledText.pseudo = pseudo
+          styledParent.children.add(styledText)
         of PSEUDO_NONE: discard
       else:
         assert child != nil
@@ -344,14 +354,16 @@ proc applyRules(document: Document, ua, user: CSSStylesheet, cachedTree: StyledN
 
       stack_append styledChild, PSEUDO_AFTER
 
-      if elem.tagType != TAG_TEXTAREA:
+      if elem.tagType == TAG_TEXTAREA:
+        stack_append styledChild, PSEUDO_TEXTAREA_TEXT
+      elif elem.tagType == TAG_IMG or elem.tagType == TAG_IMAGE:
+        stack_append styledChild, PSEUDO_IMAGE
+      else:
         for i in countdown(elem.childNodes.high, 0):
           if elem.childNodes[i].nodeType in {ELEMENT_NODE, TEXT_NODE}:
             stack_append styledChild, elem.childNodes[i]
         if elem.tagType == TAG_INPUT:
           stack_append styledChild, PSEUDO_INPUT_TEXT
-      else:
-        stack_append styledChild, PSEUDO_TEXTAREA_TEXT
 
       stack_append styledChild, PSEUDO_BEFORE
 
diff --git a/src/css/selectorparser.nim b/src/css/selectorparser.nim
index 926606da..8a38292b 100644
--- a/src/css/selectorparser.nim
+++ b/src/css/selectorparser.nim
@@ -19,7 +19,7 @@ type
   PseudoElem* = enum
     PSEUDO_NONE, PSEUDO_BEFORE, PSEUDO_AFTER,
     # internal
-    PSEUDO_INPUT_TEXT, PSEUDO_TEXTAREA_TEXT
+    PSEUDO_INPUT_TEXT, PSEUDO_TEXTAREA_TEXT, PSEUDO_IMAGE
 
   PseudoClass* = enum
     PSEUDO_FIRST_CHILD, PSEUDO_LAST_CHILD, PSEUDO_ONLY_CHILD, PSEUDO_HOVER,
diff --git a/src/css/stylednode.nim b/src/css/stylednode.nim
index 28537abd..bc0d1b5c 100644
--- a/src/css/stylednode.nim
+++ b/src/css/stylednode.nim
@@ -51,7 +51,7 @@ type
   StyledNode* = ref object
     parent*: StyledNode
     node*: Node
-    pseudo*: PseudoElem #TODO this should be in element only
+    pseudo*: PseudoElem
     case t*: StyledType
     of STYLED_TEXT:
       text*: string
@@ -83,6 +83,8 @@ func checked(element: Element): bool =
 func isValid*(styledNode: StyledNode): bool =
   if styledNode.t == STYLED_TEXT:
     return true
+  if styledNode.t == STYLED_REPLACEMENT:
+    return true
   if styledNode.node != nil and Element(styledNode.node).invalid:
     return false
   for d in DependencyType:
diff --git a/src/css/values.nim b/src/css/values.nim
index c40ffa4e..c79a5d9e 100644
--- a/src/css/values.nim
+++ b/src/css/values.nim
@@ -34,7 +34,7 @@ type
     PROPERTY_RIGHT, PROPERTY_TOP, PROPERTY_BOTTOM, PROPERTY_CAPTION_SIDE,
     PROPERTY_BORDER_SPACING, PROPERTY_BORDER_COLLAPSE, PROPERTY_QUOTES,
     PROPERTY_COUNTER_RESET, PROPERTY_MAX_WIDTH, PROPERTY_MAX_HEIGHT,
-    PROPERTY_MIN_WIDTH, PROPERTY_MIN_HEIGHT
+    PROPERTY_MIN_WIDTH, PROPERTY_MIN_HEIGHT, PROPERTY_BACKGROUND_IMAGE
 
   CSSValueType* = enum
     VALUE_NONE, VALUE_LENGTH, VALUE_COLOR, VALUE_CONTENT, VALUE_DISPLAY,
@@ -42,7 +42,7 @@ type
     VALUE_WORD_BREAK, VALUE_LIST_STYLE_TYPE, VALUE_VERTICAL_ALIGN,
     VALUE_TEXT_ALIGN, VALUE_LIST_STYLE_POSITION, VALUE_POSITION,
     VALUE_CAPTION_SIDE, VALUE_LENGTH2, VALUE_BORDER_COLLAPSE, VALUE_QUOTES,
-    VALUE_COUNTER_RESET
+    VALUE_COUNTER_RESET, VALUE_IMAGE
 
   CSSGlobalValueType* = enum
     VALUE_NOGLOBAL, VALUE_INITIAL, VALUE_INHERIT, VALUE_REVERT, VALUE_UNSET
@@ -101,7 +101,7 @@ type
 
   CSSContentType* = enum
     CONTENT_STRING, CONTENT_OPEN_QUOTE, CONTENT_CLOSE_QUOTE,
-    CONTENT_NO_OPEN_QUOTE, CONTENT_NO_CLOSE_QUOTE
+    CONTENT_NO_OPEN_QUOTE, CONTENT_NO_CLOSE_QUOTE, CONTENT_IMAGE
 
 const RowGroupBox* = {DISPLAY_TABLE_ROW_GROUP, DISPLAY_TABLE_HEADER_GROUP,
                       DISPLAY_TABLE_FOOTER_GROUP}
@@ -177,6 +177,8 @@ type
       bordercollapse*: CSSBorderCollapse
     of VALUE_COUNTER_RESET:
       counterreset*: seq[CSSCounterReset]
+    of VALUE_IMAGE:
+      image*: CSSContent
     of VALUE_NONE: discard
 
   CSSComputedValues* = ref array[CSSPropertyType, CSSComputedValue]
@@ -246,7 +248,8 @@ const PropertyNames = {
   "max-width": PROPERTY_MAX_WIDTH,
   "max-height": PROPERTY_MAX_HEIGHT,
   "min-width": PROPERTY_MIN_WIDTH,
-  "min-height": PROPERTY_MIN_HEIGHT
+  "min-height": PROPERTY_MIN_HEIGHT,
+  "background-image": PROPERTY_BACKGROUND_IMAGE
 }.toTable()
 
 const ValueTypes* = [
@@ -290,6 +293,7 @@ const ValueTypes* = [
   PROPERTY_MAX_HEIGHT: VALUE_LENGTH,
   PROPERTY_MIN_WIDTH: VALUE_LENGTH,
   PROPERTY_MIN_HEIGHT: VALUE_LENGTH,
+  PROPERTY_BACKGROUND_IMAGE: VALUE_IMAGE
 ]
 
 const InheritedProperties = {
@@ -815,6 +819,13 @@ func cssMaxMinSize(cval: CSSComponentValue): Option[CSSLength] =
       return some(cssLength(tok))
     else: discard
 
+#TODO this should be a separate type
+func cssImage(cval: CSSComponentValue): Option[CSSContent] =
+  if isToken(cval):
+    let tok = getToken(cval)
+    if tok.tokenType == CSS_URL_TOKEN or tok.tokenType == CSS_BAD_URL_TOKEN:
+      return some(CSSContent(t: CONTENT_IMAGE, s: "[img]"))
+
 proc getValueFromDecl(val: CSSComputedValue, d: CSSDeclaration, vtype: CSSValueType, ptype: CSSPropertyType) =
   template skip_whitespace =
     while i < d.value.len:
@@ -880,6 +891,12 @@ proc getValueFromDecl(val: CSSComputedValue, d: CSSDeclaration, vtype: CSSValueT
       val.counterreset = res.get
     else:
       raise newException(CSSValueError, "Invalid counter reset")
+  of VALUE_IMAGE:
+    let res = cssImage(d)
+    if res.isSome:
+      val.image = res.get
+    else:
+      raise newException(CSSValueError, "Invalid image")
   of VALUE_NONE: discard
 
 func getInitialColor(t: CSSPropertyType): RGBAColor =
@@ -1015,16 +1032,22 @@ proc getComputedValues(d: CSSDeclaration): seq[(CSSComputedValue, CSSGlobalValue
   of SHORTHAND_BACKGROUND:
     let global = cssGlobal(d)
     let bgcolorptype = PROPERTY_BACKGROUND_COLOR
-    let bgcolorvtype = valueType(bgcolorptype)
-    let bgcolorval = CSSComputedValue(t: bgcolorptype, v: bgcolorvtype)
+    let bgcolorval = CSSComputedValue(t: bgcolorptype, v: valueType(bgcolorptype))
+    let bgimageptype = PROPERTY_BACKGROUND_IMAGE
+    let bgimageval = CSSComputedValue(t: bgimageptype, v: valueType(bgimageptype))
     if global == VALUE_NOGLOBAL:
       for tok in d.value:
-        try:
-          bgcolorval.color = cssColor(tok)
-          result.add((bgcolorval, global))
-          break
-        except CSSValueError:
-          discard
+        let img = cssImage(tok)
+        if img.isSome:
+          bgimageval.image = img.get
+          result.add((bgimageval, global))
+        else:
+          try:
+            bgcolorval.color = cssColor(tok)
+            result.add((bgcolorval, global))
+            break
+          except CSSValueError:
+            discard
     else:
       result.add((bgcolorval, global))
 
@@ -1055,6 +1078,7 @@ func equals*(a, b: CSSComputedValue): bool =
   of VALUE_BORDER_COLLAPSE: return a.bordercollapse == b.bordercollapse
   of VALUE_QUOTES: return a.quotes == b.quotes
   of VALUE_COUNTER_RESET: return a.counterreset == b.counterreset
+  of VALUE_IMAGE: return a.image == b.image
   of VALUE_NONE: return true
   return false