I have added support for Colorbox to the Imagepicker module, currently in CVS. This will appear in 2.x-dev version tomorrow.
Thank you for providing such an excellent module.

CommentFileSizeAuthor
#8 colorbox_load.patch2.44 KBfrjo
#8 colorbox_load.js_.txt1.04 KBfrjo
#5 colorbox-addpaths.patch1.93 KBhutch
#5 colorbox_paths.js_.txt1003 byteshutch

Comments

frjo’s picture

frjo commented

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.

hutch’s picture

hutch commented

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 :-)

frjo’s picture

frjo commented

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);
hutch’s picture

hutch commented

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

hutch’s picture

hutch commented
StatusFileSize
new colorbox_paths.js_.txt1003 bytes
new colorbox-addpaths.patch1.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 ;-)

frjo’s picture

frjo commented
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.

hutch’s picture

hutch commented

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.

frjo’s picture

frjo commented
StatusFileSize
new colorbox_load.js_.txt1.04 KB
new colorbox_load.patch2.44 KB

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

hutch’s picture

hutch commented

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 ;-)

frjo’s picture

frjo commented

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 :-).

hutch’s picture

hutch commented

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.

hutch’s picture

hutch commented

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 ;-)

kiwi_steve’s picture

kiwi_steve commented

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

frjo’s picture

frjo commented

Committed the patch in #8 to 6-dev.

Rustan’s picture

Rustan commented

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.

frjo’s picture

frjo commented
Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.