CKEditor + jquery.fancybox/prototype.lightbox или вариант простой фотогалереи

В свет вышел релиз CKEditor 3.0.1, значит надо что нибудь добавить :)
Я уже делал подобное совмещение(если это можно так назвать) для прошлой версии, для текущей подобное совсем не составляет труда.
Точнее, непосредственно при редактировании текста делать ссылку -> изображение для открытия без перезагрузки большого изображения, и для контент заполнителей было легко и интуитивно понятно.

Суть метода довольно проста, те кто подключал fancybox или lightbox знают, что необходимо к ссылке ведущей на большое изображение добавить:
- для lightbox rel="lightbox"
- для fancybox не важно что именно, жёсткой привязки у него нету, поэтому на своё усмотрение

Следовательно необходимо в ckeditor добавить возможность добавления необходимых атрибутов.
Я решил поступить следующим образом, так как хотелось больше контролировать ситуацию поэтому:
- для одиночных изображений в class="" добавляется "gallery"
- для массива изобаржений в class="" добавляется "gallerys" и + дополняется атрибутом rel="gallerys"

Добавить функционал довольно просто, берем не упакованный файл из [ckeditor/_source/plugins/image/dialogs/image.js] заменяем его на соответствующий в [ckeditor/plugins/..]
Открываем и добавляем на стоке 990(на момент написания) перед закрывающейся квадратной скобкой "]" следующий код:

,{
	id : 'toGallery',
	type : 'select',
	'default' : '',
	style: 'margin-top: 15px',
	items :
	[
		[ editor.lang.gallery.notSet , ''],
		[ editor.lang.gallery.single , 'gallery'],
		[ editor.lang.gallery.many , 'gallerys'],
	],
	setup : function( type, element ) {
		if ( type == LINK ) {
			var a = element.getAttribute('rel');
			if (null == a) {
				this.setValue(element.getAttribute('class'));
			} else {
				this.setValue(element.getAttribute('rel'));
			}
		}
	},
	commit : function(type, element) {
		if (type == LINK) {
			if ( this.getValue() || this.isChanged()) {
				if ('gallery' == this.getValue()) {
					element.setAttribute('class', this.getValue());
					element.removeAttribute('rel');
				} else {
					if ('' == this.getValue()) {
						element.removeAttribute('class', this.getValue());
						element.removeAttribute('rel', this.getValue());
					} else {
						element.setAttribute('class', this.getValue());
						element.setAttribute('rel', this.getValue());
					}
				}
			}
		}
	}
}

Теперь необходимо в соответствии с языком добавить соответствующий перевод, открываем к примеру [ckeditor/lang/ru.js] и просто добавляем в конец файла

CKEDITOR.lang.ru.gallery = {notSet: 'Не использовать галерею', single: 'Сделать одиночное открытие', many: 'Сделать список галлерей'};

Сохраняем и вуаля - готово :)

В итоге при вставке изображения в закладке Ссылка(Link) появится выпадающий список:

И конечно для подключения не забудьте добавить соответствующие css/script в head.

Что касается работы lightbox, то тут два варианта, либо в вышеозначенном коде изменить работу на добавление именно rel="lightox", либо оригинальный код подправить немного, что я и выбрал, не хочется быть зависимым именно от lightbox, поэтому открываем lightbox.js(2.04) и меняем строку 191 на

var target = event.findElement('a[class^=gallery]') || event.findElement('a[class^=gallery]');

(вижу что тоже самое :) так в оригинале было, не знаю с чем связано), строку 216 меняем на

if ((imageLink.rel != 'gallerys')){

Вот и всё :)

Скачать измененные js:
ckeditor/plugins/image/dialogs/image.js
lightbox.js

Посмотреть можно здесь:
fancybox
lightbox