finish shorthands

cztomsik · May 9, 2021 · dcadb8d · dcadb8d
1 parent 9e6c221
commit dcadb8d
Show file tree

Hide file tree

Showing 6 changed files with 65 additions and 30 deletions.
diff --git a/examples/calculator.html b/examples/calculator.html
@@ -13,7 +13,7 @@
 
       .display {
         display: flex;
-        justify-content: flex-end;
+        /*justify-content: flex-end;*/
         align-items: center;
         height: 70px;
         padding-left: 10px;

diff --git a/libgraffiti/src/css/parser.rs b/libgraffiti/src/css/parser.rs
@@ -87,14 +87,26 @@ pub(super) fn style<'a>() -> Parser<'a, Style> {
     let prop_value = (!sym(";") * !sym("}") * skip(1)).repeat(1..).collect();
     let prop = any() - sym(":") + prop_value - sym(";").discard().repeat(0..);
 
-    prop.repeat(0..).map(|props| Style {
-        // skip unknown
-        props: props.iter().filter_map(|(p, v)| parse_style_prop(p, v).ok()).collect(),
+    prop.repeat(0..).map(|props| {
+        let mut style = Style::new();
+
+        for (p, v) in props {
+            // skip unknown
+            parse_prop_into(p, v, &mut style);
+        }
+
+        style
     })
 }
 
-pub(super) fn parse_style_prop<'a>(prop: Token, value: &[Token]) -> Result<StyleProp, ParseError> {
-    prop_parser(prop).parse(value)
+pub(super) fn parse_prop_into<'a>(prop: &str, value: &[&str], style: &mut Style) {
+    if let Ok(p) = super::prop_parser(prop).parse(value) {
+        style.add_prop(p);
+    } else if let Ok(props) = super::shorthand_parser(prop).parse(value) {
+        for p in props {
+            style.add_prop(p);
+        }
+    }
 }
 
 pub(super) fn try_from<'a, T: 'static + TryFrom<&'a str>>() -> Parser<'a, T>
@@ -513,33 +525,45 @@ mod tests {
     #[test]
     fn parse_prop() {
         assert_eq!(
-            parse_style_prop("padding-left", &["10", "px"]),
+            prop_parser("padding-left").parse(&["10", "px"]),
             Ok(StyleProp::PaddingLeft(CssDimension::Px(10.)))
         );
         assert_eq!(
-            parse_style_prop("margin-top", &["5", "%"]),
+            prop_parser("margin-top").parse(&["5", "%"]),
             Ok(StyleProp::MarginTop(CssDimension::Percent(5.)))
         );
-        assert_eq!(parse_style_prop("opacity", &["1"]), Ok(StyleProp::Opacity(1.)));
+        assert_eq!(prop_parser("opacity").parse(&["1"]), Ok(StyleProp::Opacity(1.)));
         assert_eq!(
-            parse_style_prop("color", &["#", "000000"]),
+            prop_parser("color").parse(&["#", "000000"]),
             Ok(StyleProp::Color(CssColor::BLACK))
         );
     }
 
     #[test]
     fn parse_align() {
         assert_eq!(try_from().parse(&["auto"]), Ok(CssAlign::Auto));
-        assert_eq!(try_from().parse(&["start"]), Ok(CssAlign::Start));
+        //assert_eq!(try_from().parse(&["start"]), Ok(CssAlign::Start));
         assert_eq!(try_from().parse(&["flex-start"]), Ok(CssAlign::FlexStart));
         assert_eq!(try_from().parse(&["center"]), Ok(CssAlign::Center));
-        assert_eq!(try_from().parse(&["end"]), Ok(CssAlign::End));
+        //assert_eq!(try_from().parse(&["end"]), Ok(CssAlign::End));
         assert_eq!(try_from().parse(&["flex-end"]), Ok(CssAlign::FlexEnd));
         assert_eq!(try_from().parse(&["stretch"]), Ok(CssAlign::Stretch));
         assert_eq!(try_from().parse(&["baseline"]), Ok(CssAlign::Baseline));
         assert_eq!(try_from().parse(&["space-between"]), Ok(CssAlign::SpaceBetween));
         assert_eq!(try_from().parse(&["space-around"]), Ok(CssAlign::SpaceAround));
-        assert_eq!(try_from().parse(&["space-evenly"]), Ok(CssAlign::SpaceEvenly));
+        //assert_eq!(try_from().parse(&["space-evenly"]), Ok(CssAlign::SpaceEvenly));
+    }
+
+    #[test]
+    fn parse_justify() {
+        //assert_eq!(try_from().parse(&["start"]), Ok(CssJustify::Start));
+        assert_eq!(try_from().parse(&["flex-start"]), Ok(CssJustify::FlexStart));
+        assert_eq!(try_from().parse(&["center"]), Ok(CssJustify::Center));
+        //assert_eq!(try_from().parse(&["end"]), Ok(CssJustify::End));
+        assert_eq!(try_from().parse(&["flex-end"]), Ok(CssJustify::FlexEnd));
+        assert_eq!(try_from().parse(&["space-between"]), Ok(CssJustify::SpaceBetween));
+        assert_eq!(try_from().parse(&["space-around"]), Ok(CssJustify::SpaceAround));
+        assert_eq!(try_from().parse(&["space-evenly"]), Ok(CssJustify::SpaceEvenly));
     }
 
     #[test]

diff --git a/libgraffiti/src/css/properties.rs b/libgraffiti/src/css/properties.rs
@@ -3,7 +3,7 @@
 use super::parser::{background, box_shadow, color, dimension, flex, float, font_family, overflow, sides_of, try_from};
 use super::{
     CssAlign, CssBorderStyle, CssBoxShadow, CssColor, CssDimension, CssDisplay, CssFlexDirection, CssFlexWrap,
-    CssOverflow, CssPosition, CssTextAlign, CssVisibility,
+    CssJustify, CssOverflow, CssPosition, CssTextAlign, CssVisibility,
 };
 use crate::util::Atom;
 
@@ -108,7 +108,7 @@ css_properties! {
     ("align-content", try_from()) => AlignContent(CssAlign),
     ("align-items", try_from()) => AlignItems(CssAlign),
     ("align-self", try_from()) => AlignSelf(CssAlign),
-    ("justify-content", try_from()) => JustifyContent(CssAlign),
+    ("justify-content", try_from()) => JustifyContent(CssJustify),
 
     // text
     ("font-family", font_family()) => FontFamily(Atom<String>),

diff --git a/libgraffiti/src/css/style.rs b/libgraffiti/src/css/style.rs
@@ -33,7 +33,7 @@ impl Style {
 
     pub fn property_value(&self, prop: &str) -> Option<String> {
         if let Some(prop) = self.find_prop_by_name(prop) {
-            return Some(prop.value_as_string())
+            return Some(prop.value_as_string());
         }
 
         self.shorthand_value(prop)
@@ -47,9 +47,7 @@ impl Style {
     pub fn set_property(&mut self, prop: &str, value: &str) {
         let tokens = super::parser::tokenize(value.as_bytes());
 
-        if let Ok(prop) = super::parser::parse_style_prop(prop, &tokens) {
-            self.add_prop(prop)
-        }
+        super::parser::parse_prop_into(prop, &tokens, self);
     }
 
     // TODO: should return previous value

diff --git a/libgraffiti/src/css/value_types.rs b/libgraffiti/src/css/value_types.rs
@@ -43,18 +43,29 @@ macro_rules! css_enums {
 }
 
 css_enums! {
+    // https://drafts.csswg.org/css-flexbox-1/#align-items-property
+    // + yoga also has space-between & space-around
     #[derive(Debug, Clone, Copy, PartialEq, Eq)]
     pub enum CssAlign {
         Auto = "auto",
-        Start = "start",
         FlexStart = "flex-start",
         Center = "center",
-        End = "end",
         FlexEnd = "flex-end",
         Stretch = "stretch",
         Baseline = "baseline",
         SpaceBetween = "space-between",
         SpaceAround = "space-around",
+    }
+
+    // https://drafts.csswg.org/css-flexbox-1/#justify-content-property
+    // + yoga also has evenly
+    #[derive(Debug, Clone, Copy, PartialEq, Eq)]
+    pub enum CssJustify {
+        FlexStart = "flex-start",
+        Center = "center",
+        FlexEnd = "flex-end",
+        SpaceBetween = "space-between",
+        SpaceAround = "space-around",
         SpaceEvenly = "space-evenly",
     }
 

diff --git a/libgraffiti/src/viewport.rs b/libgraffiti/src/viewport.rs
@@ -214,21 +214,24 @@ fn update_layout_node(ln: &mut LayoutNode, style: &Style) {
     fn align(d: &CssAlign) -> Align {
         match d {
             CssAlign::Auto => Align::Auto,
-            CssAlign::Start => Align::FlexStart,
             CssAlign::FlexStart => Align::FlexStart,
             CssAlign::Center => Align::Center,
-            CssAlign::End => Align::FlexEnd,
             CssAlign::FlexEnd => Align::FlexEnd,
             CssAlign::Stretch => Align::Stretch,
             CssAlign::Baseline => Align::Baseline,
             CssAlign::SpaceBetween => Align::SpaceBetween,
             CssAlign::SpaceAround => Align::SpaceAround,
+        }
+    }
 
-            // TODO: add Justify enum?
-            CssAlign::SpaceEvenly => {
-                println!("TODO: justify enum?");
-                Align::FlexStart
-            }
+    fn justify(d: &CssJustify) -> Justify {
+        match d {
+            CssJustify::FlexStart => Justify::FlexStart,
+            CssJustify::Center => Justify::Center,
+            CssJustify::FlexEnd => Justify::FlexEnd,
+            CssJustify::SpaceBetween => Justify::SpaceBetween,
+            CssJustify::SpaceAround => Justify::SpaceAround,
+            CssJustify::SpaceEvenly => Justify::SpaceEvenly,
         }
     }
 
@@ -298,8 +301,7 @@ fn update_layout_node(ln: &mut LayoutNode, style: &Style) {
             P::AlignContent(v) => ln.set_align_content(align(v)),
             P::AlignItems(v) => ln.set_align_items(align(v)),
             P::AlignSelf(v) => ln.set_align_self(align(v)),
-            //P::JustifyContent(v) => ln.set_justify_content(align(v)),
-
+            P::JustifyContent(v) => ln.set_justify_content(justify(v)),
             _ => {}
         }
     }