Custom Download for F6 - Issues...

LDigital84 commented 8 years ago

From what I can tell there isn't a way to select and use the Flexbox grid if you use the Custom Download tool.

Am I missing something and there is there a way to do this?

If not, this option needs to be available.

List of issues with the Customizer and Customizer Page:

[x] ~~No way to select Flexbox Grid~~
[x] Error in the console saying jQuery is not defined. (In Firefox, Chrome does not throw a jQuery error.)
[x] JS Error: SyntaxError: function statement requires a name templates.js:1:8
[x] ~~The max-width is set to 62.5rem on the customizer page, however, the download max-width is 75rem. Colors are also different.~~
[x] The link at the top of the page (in the top bar) for Docs is broken on the customizer page.
[x] ~~In the foundation.js (and min.js) file the version is listed as 6.0.0-alpha.1.~~
[x] In the foundation.js (and min.js) file the version is 6.0.1. Should be 6.0.4.
[x] When I unzip (using 7zip) the custom download I see this error: Data error in 'custom-f6\app.css'. File is broken. Other files appear okay.
[x] If you select the Flex Grid and no other items, the customizer only downloads the normalize CSS and nothing else.
[x] Some downloads are missing foundation.css #7520 #7702
[x] Gutter size can't be changed #7593
[x] Essentials missing the grid #7753
[x] Selecting "No Grid" results in a missing foundation.css file #7819
[x] Add field to change $warning-color #7858
[ ] Checkbox state can go out of whack when manipulating the "All Foundation Components" checkbox #7820
[x] 7 digits can be entered into the color fields #8061

joomlolo commented 8 years ago

Hello, with firefox 42.0 : "Choose Your Components:" "All Foundation Components" the checkbox unchecked doesn't uncheck all foundation component, no change checked or unchecked. With chrome Version 46.0.2490.86? no problem.

LDigital84 commented 8 years ago

@joomlolo - It's because jQuery works in Chrome but not Firefox.

gakimball commented 8 years ago

Paging @erikmellum

erikmellum commented 8 years ago

@Lynda333 Thanks for your thorough review. Super helpful!

Fixed issue with jquery not being defined
Fixed doc link at top of page
Fixed auto updater for customizer
Tested 7zip in windows without any errors
Tested and fixed issue with flex grid being selected by itself

Still doing some testing to work through template.js and foundation.js errors.

LDigital84 commented 8 years ago

@erikmellum - Thanks for fixing these problems.

Three things:

It was my version of 7zip. I checked and updated my version of 7zip and there are no errors now.
Typically when you uncheck All Foundation Components it unchecks the other boxes as well. This doesn't happen currently.
If you have Grid and Flex Grid both checked it will use the default Grid. It would be great to either use radio buttons or you can only check one but not both to eliminate confusion.

Thank You!

erikmellum commented 8 years ago

@Lynda333

We will be switching those to radio buttons. You're definitely right about that! Also, I will look into seeing why the All Foundation Components checkbox doesn't work in all browsers. Keep letting me know if you find other things, it's super helpful :).

Thanks, Erik

LDigital84 commented 8 years ago

@erikmellum

Thank you. The customizer page is looking awesome!

I had Edge open and saw this error:

HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier). (XHR): GET - http://foundation.zurb.com/sites/download.html/javascripts/jquery.min.map

I don't see it in other browsers and don't see any problems in Edge.

On the All Foundation Components checkbox. I've noticed that in Chrome and Edge you are using Equalizer to align the buttons at the top. This doesn't run in Firefox. I wonder if JS isn't executing in Firefox for some reason? Maybe because of the template.js error?

erikmellum commented 8 years ago

@Lynda333,

I have looked into All Foundation Components checkbox problems in Firefox, and don't have a fix quite yet. The code basically looks for the nearest parent div with a class of row, and then searches for all inputs of type checkbox and inverts their checked attribute. I am suspicious that the way Firefox handles the checked attribute is different. My hypothesis is that some browsers use the simple "checked" attribute, and some use "checked=checked", and firefox handles those cases differently then other browsers, but havn't verified the true cause yet. I'll update here when I have a fix.

Also I am looking in to the template.js error. No updates on that one yet either, but there should be soon.

Erik

gakimball commented 8 years ago

Updated the main comment to roll in other issues: #7753 #7702 #7593 #7520

gakimball commented 8 years ago

All of the issues in the first comment have been addressed :) Thanks for your patience, y'alls.

LDigital84 commented 8 years ago

@gakimball - The JS Error SyntaxError: function statement requires a name templates.js:1:8 still happens in FireFox. Also, when you check or uncheck All Foundation Components it doesn't do anything to the other checkboxes (again in Firefox). The other browsers appear to work okay.

erikmellum commented 8 years ago

@gakimball I believe the templates.js error will be resolved when the HTML is moved from the customizer, into the marketing site. I can confirm All Foundation Components checkbox doesn't work in Firefox. Not sure what the deal is there.

gakimball commented 8 years ago

Reopening for #7820, #7858, and #7819

henrymilleruk commented 8 years ago

Waiting for the Custom Download functionality to work again - any downloads give you a directory with blank CSS and no JS. Cheers!

erikmellum commented 8 years ago

@gakimball I will take a look at this when I get home this evening.

gakimball commented 8 years ago

@erikmellum Thanks, friend!

benvanlooy commented 8 years ago

@erikmellum yeah, thanks mate :)

howks commented 8 years ago

Why authors remove custom download for F5. In F5 custom download had no bug - everything worked. Now we have nothing. In F6 custom download not working and F5 custom download is gone.

erikmellum commented 8 years ago

@howks apologies for the inconvenience. We understand it can be frustrating when things break.

Foundation 6.1.2 has some changes that are affecting the custom download. My suspicion is that you would rather have Foundation 6.1.1 than Foundation 5. I think the longer term solution here will be to fall back to the previous version in the event an update breaks the custom downloader.

We make no excuses for this, but understand that maintaining these things requires man hours and money, and ZURB also has many other projects. We will do our best to prevent this in the future, and get the fix out ASAP. Please be patient with us as we fix this, and thank you for the feedback!

rafibomb commented 8 years ago

@howks The custom download was working up until now. Looks like an error occurred over the weekend. It will be up soon.

LDigital84 commented 8 years ago

@erikmellum - I like that idea about the fallback! That would be a great solution. If possible, when it does fallback, somehow alert the user that it's falling back.

Also, yourself and the team at ZURB do an awesome job! Always appreciated the work that you all do on Foundation!

erikmellum commented 8 years ago

@gakimball custom, essential, and complete downloads are fixed. We replaced minifyCss with cssnano, but never updated the gulp task for the customizer (gulp deploy:custom). Certainly tough to minifyCss when the module isn't there ;). Always nice when it's something so straight forward!

I pushed the fix into the develop branch of foundation-sites. It should be fine to leave that out until 6.1.3 because I locally modified the foundation-sites repo for the customizer (it normally points to master). Let me know if anything else causes trouble. I'll leave this issue for you to close out.

@Lynda333 you do an awesome job too :+1: It's always nice to have community involvement to keep us in line! Keep up the great feedback :).

LDigital84 commented 8 years ago

@erikmellum - I noticed a couple things with the custom download...before I go into them, I read your comment about the fix in the development branch. When 6.1.3 is released then it may fix these problems. If that is the case, then you can ignore this comment.

Here are the problems:

There are three CSS files downloaded. app.css, foundation.css and foundation-flex.css. Typically, you have three but one of those is the foundation.min.css file. the foundation.css, and foundation-flex.css appear to be identical as I selected the flex grid. If you select the regular grid you still get both files but one file is the float grid while the foundation-flex.css is the flex grid.
The CSS folder contains the .map files for both the foundation.css and foundation-flex.css files.
There is no minifed foundation.min.js. Just the regular, unminified, version.

With that said, I don't mind using the un-minifed JS (it's not hard to minify myself) and the CSS, I typically use unminifed anyway (until production when I minify all of my CSS together.)

erikmellum commented 8 years ago

@Lynda333 Excellent catch.

The extra .css files are removed
The .map files are not intended to be there for the custom download (they are removed now)
The minified files are all intact now

All of those stemmed from a typo when I made when modifying the gulpfile on the server. I didn't make that typo on my local setup, which was where I did most of my testing. Let me know if you find anything else!

LDigital84 commented 8 years ago

@erikmellum - Don't you love typos? :smile: The download looks good.

joomlolo commented 8 years ago

thanks a lot @erikmellum

benvanlooy commented 8 years ago

@erikmellum thanks very much for the hard work you put into this great project!! :-)

howks commented 8 years ago

@erikmellum thanks! Working

joomlolo commented 8 years ago

ok ok select or unselect "ALl foundation component", it is not working for me in firefox last version, just for chrome last version and ie11 it is working, but all have no background color for "colors" field, there was before.

badcat commented 8 years ago

Yes, the download page exports are generally out of sync :( http://foundation.zurb.com/sites/download.html/

Complete: 6.1.1 for Foundation and Flex, js Essential: 6.1.2 for Foundation and Flex, js Custom: 6.1.2 for Foundation and Flex, js (using defaults)

How can we keep these synced?

LDigital84 commented 8 years ago

@erikmellum - I just downloaded the files using the custom downloader and the files are like there were before:

There are three CSS files downloaded. app.css, foundation.css and foundation-flex.css.
The CSS folder contains the .map files for both the foundation.css and foundation-flex.css files.
There is no minifed foundation.min.js. Just the regular, unminified, version.

erikmellum commented 8 years ago

Will take a look this evening

erikmellum commented 8 years ago

Fixed issues with complete download, and lack of minified .js files.

henrymilleruk commented 8 years ago

Just wanted to confirm any Custom downloads are still just outputting a blank app.css and no other CSS files.

Eagerly awaiting a fix for my projects! Thanks!

erikmellum commented 8 years ago

@henrymilleruk what options are you using on the custom download? The one known issue is that selecting "No Grid" will break the downloader. Other customizations as far as I know should be working.

henrymilleruk commented 8 years ago

@erikmellum Indeed - I am selecting 'No Grid'! I'm looking to get all of the "plugins" to use within another grid system that I'm being forced to use.

(ie: Sticky, Interchange, Abide, Equalize etc ... )

erikmellum commented 8 years ago

@henrymilleruk I will be rolling out a fix for the no grid issue by tomorrow. I'll have it going for you soon, thanks for your patience!

henrymilleruk commented 8 years ago

@erikmellum Thank you sir, appreciate your work.

erikmellum commented 8 years ago

@henrymilleruk no grid option has been fixed. I hope that helps your project!

erikmellum commented 8 years ago

@gakimball added field to change warning color, and added warning button to HTML template for custom, essential, and complete downloads.

Fixed glitch allowing 7 characters to be entered into hex fields

ghost commented 8 years ago

@erikmellum Thanks for adding the warning button to the custom download. Finally the custom download is working as it should be.

@ Zurb Team and contributers Thanks for the all great work you have done, really awesome!

benvanlooy commented 8 years ago

I really hate to say this, but I'm afraid the custom download is broken again :-(

I don't seem to get a foundation css file or foundation minified js file in my zip file.

If you download on the customize page, without changing any settings, all the files are included, but if you change the max-width, grid and colours, the download doesn't include all the files it seem!

LDigital84 commented 8 years ago

I can confirm it's broken again. It works but the min files are missing and the map files are visible.

erikmellum commented 8 years ago

The problem lies in the minifyCss->cssnano change not being in the master branch. The change keeps being overwritten locally when it polls the git repo to see if it is up to date. I will implement a fix tonight. This should resolve as soon as the develop branch is merged into master

erikmellum commented 8 years ago

@Benboe I'd hate for you to not tell us! I replaced the reference to minifyCss again, and also hopefully provided the coupe de gras. To make sure, I manually executed the git pull. It properly refused to update, but I'd like to keep the guard up. Please report if this behavior occurs again and we will turn off the git pull until the minifyCss change is in master.

Thanks everyone!

benvanlooy commented 8 years ago

@erikmellum thanks again for responding so fast :)

So, is it supposed to work already? Or not yet? Because I tried and I'm still missing my foundation css file, I do however get a foundation.min.js file ;-) Also, in the vendor directory, there are only 2 files.

This is when i change the max-width, gutter-width and colours, using a flex-grid and leaving all the components checked!

erikmellum commented 8 years ago

I'm fairly certain gutter-width is the problem, I've seen one other issue where gutter-width is referenced. I will take a look at those configurations this evening and provide a fix. Apologies for the inconvenience, and thank you for providing the configuration in question :).

benvanlooy commented 8 years ago

@erikmellum thanks mate :-)

erikmellum commented 8 years ago

paging @gakimball is there a way to use a single value for gutters? Previously the customizer used:

"column-gutter":"medium: 30px"

to update the gutters. It looks like we have changed this to:

$grid-column-responsive-gutter: (
  small: 20px,
  medium: 30px,
);

If we aren't able to continue using a single value, we will have to add a second input field so that users on the customizer can specify two sizes (small and medium) for the responsive gutter. Alternatively we could remove the gutter from the customizer altogether.

@Benboe apologies for the delay in getting to this. I left my charger back home and wasn't able to do work on it as soon as expected. I'm going to defer to @gakimball on the best course of action. Once I get some input from him I will be happy to implement the chosen functionality.

gakimball commented 8 years ago

@erikmellum In 6.2 (which will be out at the end of next week), $grid-column-gutter will accept a single value or a map, so the customizer should just assign to that value no matter what. You can ignore $grid-column-responsive-gutter.

foundation / foundation-sites

Custom Download for F6 - Issues... #7033