Support for colorbox in imagepicker [#780674]

Comment	File	Size	Author
#8	colorbox_load.patch	2.44 KB	frjo

#8	colorbox_load.js_.txt	1.04 KB	frjo
#5	colorbox-addpaths.patch	1.93 KB	hutch

#5	colorbox_paths.js_.txt	1003 bytes	hutch

Comment #1

frjo CreditAttribution: frjo commented 24 April 2010 at 18:15

Thank you!

If you let me know when it's included in a stable release I will add information about it to the README and the project page.

Log in or register to post comments

Comment #2

hutch CreditAttribution: hutch commented 24 April 2010 at 22:36

I will let you know when I release the next stable.
Now, I would also like to find a way to use colorbox to run the imagepicker Iframe in instead of inserting it in the node-edit form. I managed to get that to work with thickbox but only by patching thickbox with module_invoke_all('thickbox_js'); immediately above drupal_add_js($path .'/thickbox.js');. Not a pretty solution but it works.
I am hoping to find a more elegant and compliant solution using colorbox. I have used the "KeepThis=true&TB_iframe=true" method with thickbox but haven't found anything equivalent for colorbox. I also need to find a way to run a function *before* colorbox is invoked in order to get Drupal.settings set up and some jquery in place for colorbox to interact with inside the Iframe. So I need a method to load a path (and subpaths) rather than a form. Any hints would be most welcome :-)

Log in or register to post comments

Comment #3

frjo CreditAttribution: frjo commented 25 April 2010 at 05:11

Happy to work with you on this, I want Colorbox to be easy to integrate in to other modules.

I suggest you start by looking at the Colorbox plugin documentation at http://colorpowered.com/colorbox/. Note that the plugin itself is developed by another person completely separate from the Colorbox module.

You can also have a look at e.g. colorbox_form.js from the Colorbox module to see how to activate the colorbox function.

Mockup code:

(function ($) {

Drupal.behaviors.initImagepickerColorbox = function (context) {
  var settings = Drupal.settings.imagepicker;
  $('a', context).filter('.imagepicker:not(.initImagepickerColorbox-processed)').addClass('initImagepickerColorbox-processed').colorbox({
    iframe:true,
    transition:settings.transition,
    speed:settings.speed,
    opacity:settings.opacity,
    close:settings.close,
    overlayClose:settings.overlayclose,
    maxWidth:settings.maxwidth,
    maxHeight:settings.maxheight,
    innerWidth:500,
    innerHeight:500,
    onComplete:function(){
      $('input:first').focus();
    }
  });
};

})(jQuery);

Log in or register to post comments

Comment #4

hutch CreditAttribution: hutch commented 25 April 2010 at 08:31

Thanks, I'll work over this in the next day or so

Log in or register to post comments

Comment #5

hutch CreditAttribution: hutch commented 26 April 2010 at 18:14

File	Size
colorbox_paths.js_.txt	1003 bytes
colorbox-addpaths.patch	1.93 KB

Please have a look at this new feature for Colorbox. The patch creates another entry in admin/settings/colorbox, similar to colorbox forms but for a path instead. It also adds some code to _colorbox_doheader() in colorbox.module. There is also a new javascript file attached, it should be renamed to colorbox_paths.js and placed in the js folder.

I have tested it in conjunction with my imagepicker module and it works a treat. I have not as yet tested it with any other path but I've tried to be careful to keep it generic so it should work. I have not added any allow/deny constraints.

So when Y'all finished ROTFL let me know what you think ;-)

Log in or register to post comments

Comment #6

frjo CreditAttribution: frjo commented 27 April 2010 at 17:21

Title:	support for colorbox in imagepicker	» Support for colorbox in imagepicker
Component:	Miscellaneous	» Code
Assigned:	hutch	» frjo
Status:	Active	» Needs review

Looks clean and neat and I can't see any bad side effects from it. Will try it out when I have time and most likely commit it.

Log in or register to post comments

Comment #7

hutch CreditAttribution: hutch commented 27 April 2010 at 21:45

When using colorbox_path.js (with Imagepicker) I'm getting an error:

c(".cboxElement").live is not a function (when using minified)
$(".cboxElement").live is not a function (when using jquery.colorbox.js) on line 328

This does not stop things working in Firefox but Safari loads an empty colorbox ;-(

Using jquery 1.3.2 as supplied by Jquery update.

I had a quick look at line 328 but this is over my head.

Log in or register to post comments

Comment #8

frjo CreditAttribution: frjo commented 28 April 2010 at 05:28

File	Size
colorbox_load.js_.txt	1.04 KB
colorbox_load.patch	2.44 KB

The path and form function are almost identical, what do you think of merging them?

Log in or register to post comments

Comment #9

hutch CreditAttribution: hutch commented 28 April 2010 at 09:35

Tested this and it works fine for imagepicker. I also tried user login and that works too, but not when I select login block in admin/settings/colorbox, it just returns me to the login page. This may be unrelated though as I did not try this earlier.
The $(".cboxElement").live error still appears in javascript error console, as before

So heads up for colorbox_load ;-)

Log in or register to post comments

Comment #10

frjo CreditAttribution: frjo commented 28 April 2010 at 12:34

hutch, $(".cboxElement").live error normally comes if you use an older version of jQuery. Are you 100% sure jQuery 1.3.x is being loaded on your pages?

What dose admin "admin/reports/status" report for "jQuery Update"?

The "login block" problem is a unrelated bug that I will try to get fixed one of these days :-).

Log in or register to post comments

Comment #11

hutch CreditAttribution: hutch commented 28 April 2010 at 14:05

You are dead right, jQuery Update is 1.3.2 and working on the main page but not in the iframe which is using the regular default in misc.
Imagepicker has it's own template file and loads the js files with $vars['scripts'] = drupal_get_js(); which is not picking up the jquery_update rewrite. I will have to investigate this.

So this is an Imagepicker bug or at least a bug with Iframes in general, oh well good to know.

Log in or register to post comments

Comment #12

hutch CreditAttribution: hutch commented 28 April 2010 at 15:11

Wahey! the fix was much easier than I feared. I changed (nonstandard) $vars to the standard $variables and added

  if (module_exists('jquery_update')) {
    jquery_update_preprocess_page($variables);
  }

and jquery_update altered $variables.

I have commited these changes to dev, what the hell ;-)

Log in or register to post comments

Comment #13

kiwi_steve CreditAttribution: kiwi_steve commented 1 May 2010 at 01:51

Just a quick but hearty thumbs up for imagepicker and colorbox - been looking for a sensible and simple way to get 'popup'-able images into posts in a simple and effective manner... two thumbs up guys :) Its working well for me using the dev versions of both at the moment.

Steve

Log in or register to post comments

Comment #14

frjo CreditAttribution: frjo commented 1 May 2010 at 13:52

Committed the patch in #8 to 6-dev.

Log in or register to post comments

Comment #15

Rustan CreditAttribution: Rustan commented 2 May 2010 at 07:42

The integration with imagepicker works fine for me, no issues. I use wysiwyg_filter instead of html filter for displaying additional styling, but both filters tested to work.