Menu icon Foundation

Developer

Engineering Lead at ZURB

My Posts

No Content

My Comments

Kevin Ball commented on Glenn Philp's post 11 months

One quick update to the answers here is that now we're using babel to compile the javascript in the ZURB stack because the Foundation JavaScript has been updated to ES2016.  The challenge here is that while in theory ES2016 is backwards compatible, in practice sometimes older javascript libraries don't seem to work properly when Babel compiles them.
 
You can tell babel to ignore/not parse certain files by passing an ignore option to babel in the build process.  Example:
 
function javascript() {
return gulp.src(PATHS.javascript)
.pipe($.sourcemaps.init())
.pipe($.babel({ignore: ['node_modules/my_es5_module/*.js']}))
.pipe($.concat('app.js'))
.pipe($.if(PRODUCTION, $.uglify()
.on('error', e => { console.log(e); })
))
.pipe($.if(!PRODUCTION, $.sourcemaps.write()))
.pipe(gulp.dest(PATHS.dist + '/assets/js'));
}

Kevin Ball commented on Ethan Hackett's post over 1 year

Hi Ethan,
I'm not totally sure, but I think the behavior that you're looking for here may already be handled by the 'data' option of panini:  https://github.com/zurb/panini#user-content-data
It lets you pass in an arbitrary set of data formated as json, yaml, or a straight js file using module.exports.

Kevin Ball commented on Pierre's post over 1 year

Hi Pierre,
Let me confirm that I understand what you're trying to accomplish here:  You'd like to have a user typing inky and css into a browser-based editor and be able to show previews inline without having to save back to the server.  Is that right?  If not please explain more so I can understand what you're trying to accomplish.
If this is the correct interpretation, I think the right way to do this is actually to run the inky parser in the browser to render into an html preview.  The inky parser is written in javascript (node) and we don't believe there are any reasons it can't be wrapped up with browserify or webpack and used straight in the browser.  We haven't had time to test this usecase yet, but it should work, or if it doesn't out of the box we should be able to fix that pretty quickly.  If you try this, we'd like to know how it goes and support you with any challenges you run into.
Let me know if this helps.
Regards,
Kevin

Kevin Ball commented on Rafi Benkual's post over 1 year

Hi @Joshua Dean ,

Thank you for the link! I took a look, and after digging through your minified CSS and JS I'm not sure what's happening in your build step, but it does look like perhaps the JS is loading an older version. In particular, while it looks like the css appears to have be up to date (though it's a little hard to tell comparing minified to scss, I see my updated styles) the JS still contains code that is eliminated in 6.2-stable (in particular I'm seeing the function _cacheValues).

The dist files are updated on release, but not on every code change... when testing from a branch like this, probably the best is to run 'gulp build' and then use the files from the '_build/assets' directory. If you haven't previously gotten your build environment set up you will need to run 'npm install' before doing this.

Regards,
Kevin

Kevin Ball commented on Rafi Benkual's post over 1 year

@Joshua Dean can you link to your example showing that problem, or include some sample code? And double check you're using 6.2-stable and not 6.2-dev? That sounds like an issue that was in the 6.2 rc1 (which is in 6.2-dev) but that I addressed in 6.2-stable.

Thanks,
Kevin

Kevin Ball commented on Rafi Benkual's post over 1 year

Hi @Christian Magill , thanks for trying it out so quickly and the detailed examples. I'll import them as test cases and see what I can figure out.

Regards,
Kevin

Kevin Ball commented on Rafi Benkual's post over 1 year

Hi folks,

I'm working on fixing the various reveal modal bugs, and have some work on this done in this branch: https://github.com/zurb/foundation-sites/tree/reveal-modal-issues

I believe this addresses all of the most blatant bugs, but would love it if you can check it out and verify.

One thing to note is that having no on-page scroll while a modal is open is by design - my understanding is that is a deliberate change from F5 to F6 due to a number of issues with the scrolling under the modal. We can definitely talk about if that is the right design decision, but that is a bigger discussion.

But most of the other issues raised here are definitely bugs, and I think I've got them all addressed in that branch. I'll be merging that in next week, so if it doesn't fix the problems you're seeing please highlight it to me as soon as possible.

Regards,
Kevin

Kevin Ball commented on Georg Kleinert's post over 1 year

Hi @Georg Kleinert and @Anthony,

I'm working on addressing this, as mentioned in this forum post: http://foundation.zurb.com/forum/posts/38403-

Would either of you be able to check out this branch of foundation and see if it fixes this for your usecases? https://github.com/zurb/foundation-sites/tree/fix-opens-left-styling

Thanks!
-Kevin

Kevin Ball commented on Rafi Benkual's post over 1 year

Hi folks,

I'm working on fixing some of the positioning and arrow issues highlighted by @James Cocker and @Georg Kleinert in this branch: https://github.com/zurb/foundation-sites/tree/fix-opens-left-styling

I believe it has addressed those particular issues... We started adding visual test cases to reproduce these issues and provide us with a way to do regression testing so future fixes won't break existing plugins, so I'm basing my sense that this has fixed the bug on this file in that branch of the repo: test/visual/responsive-menu-left-dropdown.html

Would any of you be able to check out the branch and see if it fixes your issues, or if it creates any new issues? I'd like to get these fixes into 6.2.

Thanks!
-Kevin

Posts Followed





Following

    No Content

Followers

My Posts

No Content

My Comments

You commented on Glenn Philp's post 11 months

One quick update to the answers here is that now we're using babel to compile the javascript in the ZURB stack because the Foundation JavaScript has been updated to ES2016.  The challenge here is that while in theory ES2016 is backwards compatible, in practice sometimes older javascript libraries don't seem to work properly when Babel compiles them.
 
You can tell babel to ignore/not parse certain files by passing an ignore option to babel in the build process.  Example:
 
function javascript() {
return gulp.src(PATHS.javascript)
.pipe($.sourcemaps.init())
.pipe($.babel({ignore: ['node_modules/my_es5_module/*.js']}))
.pipe($.concat('app.js'))
.pipe($.if(PRODUCTION, $.uglify()
.on('error', e => { console.log(e); })
))
.pipe($.if(!PRODUCTION, $.sourcemaps.write()))
.pipe(gulp.dest(PATHS.dist + '/assets/js'));
}

You commented on Ethan Hackett's post over 1 year

Hi Ethan,
I'm not totally sure, but I think the behavior that you're looking for here may already be handled by the 'data' option of panini:  https://github.com/zurb/panini#user-content-data
It lets you pass in an arbitrary set of data formated as json, yaml, or a straight js file using module.exports.

You commented on Pierre's post over 1 year

Hi Pierre,
Let me confirm that I understand what you're trying to accomplish here:  You'd like to have a user typing inky and css into a browser-based editor and be able to show previews inline without having to save back to the server.  Is that right?  If not please explain more so I can understand what you're trying to accomplish.
If this is the correct interpretation, I think the right way to do this is actually to run the inky parser in the browser to render into an html preview.  The inky parser is written in javascript (node) and we don't believe there are any reasons it can't be wrapped up with browserify or webpack and used straight in the browser.  We haven't had time to test this usecase yet, but it should work, or if it doesn't out of the box we should be able to fix that pretty quickly.  If you try this, we'd like to know how it goes and support you with any challenges you run into.
Let me know if this helps.
Regards,
Kevin

You commented on Rafi Benkual's post over 1 year

Hi @Joshua Dean ,

Thank you for the link! I took a look, and after digging through your minified CSS and JS I'm not sure what's happening in your build step, but it does look like perhaps the JS is loading an older version. In particular, while it looks like the css appears to have be up to date (though it's a little hard to tell comparing minified to scss, I see my updated styles) the JS still contains code that is eliminated in 6.2-stable (in particular I'm seeing the function _cacheValues).

The dist files are updated on release, but not on every code change... when testing from a branch like this, probably the best is to run 'gulp build' and then use the files from the '_build/assets' directory. If you haven't previously gotten your build environment set up you will need to run 'npm install' before doing this.

Regards,
Kevin

You commented on Rafi Benkual's post over 1 year

@Joshua Dean can you link to your example showing that problem, or include some sample code? And double check you're using 6.2-stable and not 6.2-dev? That sounds like an issue that was in the 6.2 rc1 (which is in 6.2-dev) but that I addressed in 6.2-stable.

Thanks,
Kevin

You commented on Rafi Benkual's post over 1 year

Hi @Christian Magill , thanks for trying it out so quickly and the detailed examples. I'll import them as test cases and see what I can figure out.

Regards,
Kevin

You commented on Rafi Benkual's post over 1 year

Hi folks,

I'm working on fixing the various reveal modal bugs, and have some work on this done in this branch: https://github.com/zurb/foundation-sites/tree/reveal-modal-issues

I believe this addresses all of the most blatant bugs, but would love it if you can check it out and verify.

One thing to note is that having no on-page scroll while a modal is open is by design - my understanding is that is a deliberate change from F5 to F6 due to a number of issues with the scrolling under the modal. We can definitely talk about if that is the right design decision, but that is a bigger discussion.

But most of the other issues raised here are definitely bugs, and I think I've got them all addressed in that branch. I'll be merging that in next week, so if it doesn't fix the problems you're seeing please highlight it to me as soon as possible.

Regards,
Kevin

You commented on Georg Kleinert's post over 1 year

Hi @Georg Kleinert and @Anthony,

I'm working on addressing this, as mentioned in this forum post: http://foundation.zurb.com/forum/posts/38403-

Would either of you be able to check out this branch of foundation and see if it fixes this for your usecases? https://github.com/zurb/foundation-sites/tree/fix-opens-left-styling

Thanks!
-Kevin

You commented on Rafi Benkual's post over 1 year

Hi folks,

I'm working on fixing some of the positioning and arrow issues highlighted by @James Cocker and @Georg Kleinert in this branch: https://github.com/zurb/foundation-sites/tree/fix-opens-left-styling

I believe it has addressed those particular issues... We started adding visual test cases to reproduce these issues and provide us with a way to do regression testing so future fixes won't break existing plugins, so I'm basing my sense that this has fixed the bug on this file in that branch of the repo: test/visual/responsive-menu-left-dropdown.html

Would any of you be able to check out the branch and see if it fixes your issues, or if it creates any new issues? I'd like to get these fixes into 6.2.

Thanks!
-Kevin

Posts Followed

Following

  • No Content

Followers

  • No Content