Allow for fractions to be used within lost-center

[peterramsing]

Is this a feature request or a bug report?
Feature Enhancement

What is the current behavior?
No lost-center: <column-fraction>;

What is the behavior that you expect?
Being able to use a fraction w/in lost-center

What's the motivation or use-case behind changing the behavior?
#294 (comment)

[peterramsing]

cc @codebysubtract

[steve-holland]

@peterramsing Hi Peter, as it was me who raised this enhancement, I thought it would be appropriate for me to at least have a look into solving it. I've done some work locally on it mainly using the stuff from lost-column. As you will imagine there is some duplication of code now and I'd like to address this first before I go any further. In terms of coding style is anything I should do/avoid in terms of contributing? I noticed some of the shorter function syntax, so I am right in thinking you're moving to ES6 going forward? All the best, Steve.

[peterramsing]

@codebysubtract You are epic!

ES6: As much ES6 that Node 4 can handle. LostGrid Node Support

Making it work: I'd love to see what you have locally. If you wanna pair over Skype we could do that as well. If I had to do this off the top of my head I'd do some parsing at the beginning of the lost-center file that notices if there is a fraction or a fixed value. Then on line 91 use either the value or a calc(100% - ( 2/6 )); if it was fraction of 2/6 given. (I'd have to double check that would be the math...

I think that'd work. What is the strategy you were going with?

[steve-holland]

Hi Peter, I've forked the dev branch to make my changes. You can see what I've done so far here:

https://github.com/codebysubtract/lost/tree/lost-center-fraction

I've approached it more or less in the same way you've suggested. So I've checked for a fraction value (using a simple regex). If it's a fraction then I've used calcValue from lgLogic (which I borrowed from the lost-column code). Otherwise it carries on as normal with the width.

I've added a new function parseLostProperty to lgLogic just to try to reduce some of the duplicate code. Otherwise there ends up being a fair bit copy/pasted from lost-column. I've tried to keep it very generic, so it could also be used in lost-column later down the line. This was the part I wasn't sure you'd like, so I'm totally open to replacing/improving it. It really depends of the sort of style you want going forward.

I've not had much of a chance to test it properly yet, but I have added some unit tests so far.

If I'm way off, please let me know as I haven't really contributed to any open source before, so it's all a bit new!

Steve.

[peterramsing]

@codebysubtract Sounds like you're pushing logic to lgLogic which is where I'd love to have that logic going so that's right on track. If you want to submit a PR then I can comment inline as well. Thanks!

[peterramsing]

Apparently my mind went blank and I also had this in #344 😳

[steve-holland]

@peterramsing Glad you liked everything and thanks for accepting the pull request. I really enjoyed working on it. I'm hoping to have a little spare time coming up so I might be able to take a look at one of the others if you'd like?