New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Lightbox is unusable #7895

Closed
hypeJunction opened this Issue Feb 10, 2015 · 8 comments

Comments

Projects
None yet
3 participants
@hypeJunction
Contributor

hypeJunction commented Feb 10, 2015

Every time I need to open something in a lightbox and do something more than just display the content, I end up tossing Elgg's lightbox, and using something else instead.
We need a simple AMD solution that doesn't require loading a script, loading a stylesheet, and then going through the multitude of views to figure out how to modify the settings.
It seems a lightbox is a very common feature that will be used accross pages, so I think we should just add the css to the main stylesheet, and convert the js to AMD module.

@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay Feb 10, 2015

Member

Do you find Colorbox unusable, or the integration with Elgg? I've found with the data-colorbox-opts attribute and the official docs I'm pretty productive. Can you give an example?

Member

mrclay commented Feb 10, 2015

Do you find Colorbox unusable, or the integration with Elgg? I've found with the data-colorbox-opts attribute and the official docs I'm pretty productive. Can you give an example?

@hypeJunction

This comment has been minimized.

Show comment
Hide comment
@hypeJunction

hypeJunction Feb 10, 2015

Contributor

It does it's job when you already have the triggers and data in your DOM. But there is no easy way to just display arbitrary HTML content in a lightbox.

For example, if I just wanted to load something via elgg.ajax and only display part of the response in a lightbox, I would first have to load the js and css on the page, then somehow ensure that I have the js and css loaded, then use the colorbox api.

Something straightforward would be nice:

var ligthbox = require(['elgg.lightbox']);
lightbox.open({ 
   // colorbox options
});
lightbox.close();
Contributor

hypeJunction commented Feb 10, 2015

It does it's job when you already have the triggers and data in your DOM. But there is no easy way to just display arbitrary HTML content in a lightbox.

For example, if I just wanted to load something via elgg.ajax and only display part of the response in a lightbox, I would first have to load the js and css on the page, then somehow ensure that I have the js and css loaded, then use the colorbox api.

Something straightforward would be nice:

var ligthbox = require(['elgg.lightbox']);
lightbox.open({ 
   // colorbox options
});
lightbox.close();
@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay May 30, 2015

Member

Yep, convert lightbox to AMD, and have it load CSS somehow.

Member

mrclay commented May 30, 2015

Yep, convert lightbox to AMD, and have it load CSS somehow.

@jdalsem

This comment has been minimized.

Show comment
Hide comment
@jdalsem

jdalsem Jun 2, 2015

Member

Converting all JS to AMD is on the roadmap for 2.0. This needs to be piece of cake then

Member

jdalsem commented Jun 2, 2015

Converting all JS to AMD is on the roadmap for 2.0. This needs to be piece of cake then

@hypeJunction

This comment has been minimized.

Show comment
Hide comment
@hypeJunction

hypeJunction Jun 2, 2015

Contributor

Yes, I think we can close this as it will be taken care of by Steve's new ajax api.

Contributor

hypeJunction commented Jun 2, 2015

Yes, I think we can close this as it will be taken care of by Steve's new ajax api.

@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay Jun 2, 2015

Member

Let's leave this until the APIs/fix is firmly in place.

Member

mrclay commented Jun 2, 2015

Let's leave this until the APIs/fix is firmly in place.

@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay Jun 2, 2015

Member

Related #8405

Member

mrclay commented Jun 2, 2015

Related #8405

@hypeJunction

This comment has been minimized.

Show comment
Hide comment
Contributor

hypeJunction commented Sep 30, 2015

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Apr 6, 2016

feature(js): adds elgg/lightbox AMD module, loaded on all pages
`elgg/lightbox` AMD module can now be used to open and close the lightbox
programmatically. The module is inlined in `elgg.js` alongside the colorbox
library, and the CSS is included with `elgg.css` as well.

Hence it's no longer necessary to use `elgg_load_js('lightbox')` or
`elgg_load_css('lightbox')`.

Fixes #7895
Fixes #8309
Fixes #6991

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Apr 6, 2016

feature(js): adds elgg/lightbox AMD module, loaded on all pages
`elgg/lightbox` AMD module can now be used to open and close the lightbox
programmatically. The module is inlined in `elgg.js` alongside the colorbox
library, and the CSS is included with `elgg.css` as well.

Hence it's no longer necessary to use `elgg_load_js('lightbox')` or
`elgg_load_css('lightbox')`.

Fixes #7895
Fixes #8309
Fixes #6991

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Apr 6, 2016

feature(js): adds elgg/lightbox AMD module, loaded on all pages
`elgg/lightbox` AMD module can now be used to open and close the lightbox
programmatically. The module is inlined in `elgg.js` alongside the colorbox
library, and the CSS is included with `elgg.css` as well.

Hence it's no longer necessary to use `elgg_load_js('lightbox')` or
`elgg_load_css('lightbox')`.

Fixes #7895
Fixes #8309
Fixes #6991

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Apr 6, 2016

feature(js): adds elgg/lightbox AMD module, loaded on all pages
`elgg/lightbox` AMD module can now be used to open and close the lightbox
programmatically. The module is inlined in `elgg.js` alongside the colorbox
library, and the CSS is included with `elgg.css` as well.

Hence it's no longer necessary to use `elgg_load_js('lightbox')` or
`elgg_load_css('lightbox')`.

Fixes #7895
Fixes #8309
Fixes #6991

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Apr 6, 2016

feature(js): adds elgg/lightbox AMD module, loaded on all pages
`elgg/lightbox` AMD module can now be used to open and close the lightbox
programmatically. The module is inlined in `elgg.js` alongside the colorbox
library, and the CSS is included with `elgg.css` as well.

Hence it's no longer necessary to use `elgg_load_js('lightbox')` or
`elgg_load_css('lightbox')`.

Fixes #7895
Fixes #8309
Fixes #6991

@mrclay mrclay closed this in #9625 Apr 7, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment