root / drupal7 / sites / all / modules / media / modules / media_wysiwyg / wysiwyg_plugins / media_ckeditor / library.js @ 2b3c8cc1
| 1 |
|
|---|---|
| 2 |
/**
|
| 3 |
* @file
|
| 4 |
* Attach Media ckeditor behaviors.
|
| 5 |
*/
|
| 6 |
|
| 7 |
(function ($) { |
| 8 |
Drupal.media = Drupal.media || {};
|
| 9 |
|
| 10 |
Drupal.settings.ckeditor.plugins['media'] = {
|
| 11 |
/**
|
| 12 |
* Execute the button.
|
| 13 |
*/
|
| 14 |
invoke: function (data, settings, instanceId) { |
| 15 |
if (data.format == 'html') { |
| 16 |
if (jQuery(data.node).is('[data-media-element]')) { |
| 17 |
// Change the view mode for already-inserted media.
|
| 18 |
var mediaFile = Drupal.media.filter.extract_file_info(jQuery(data.node));
|
| 19 |
Drupal.media.popups.mediaStyleSelector(mediaFile, function (mediaFiles) {
|
| 20 |
Drupal.settings.ckeditor.plugins['media'].insertMediaFile(mediaFile, mediaFiles, CKEDITOR.instances[instanceId]);
|
| 21 |
}, settings['global']);
|
| 22 |
} |
| 23 |
else {
|
| 24 |
Drupal.media.popups.mediaBrowser(function (mediaFiles) {
|
| 25 |
Drupal.settings.ckeditor.plugins['media'].mediaBrowserOnSelect(mediaFiles, instanceId);
|
| 26 |
}, settings['global']);
|
| 27 |
} |
| 28 |
} |
| 29 |
}, |
| 30 |
|
| 31 |
/**
|
| 32 |
* Respond to the mediaBrowser's onSelect event.
|
| 33 |
*/
|
| 34 |
mediaBrowserOnSelect: function (mediaFiles, instanceId) { |
| 35 |
var mediaFile = mediaFiles[0]; |
| 36 |
var options = {};
|
| 37 |
Drupal.media.popups.mediaStyleSelector(mediaFile, function (formattedMedia) {
|
| 38 |
Drupal.settings.ckeditor.plugins['media'].insertMediaFile(mediaFile, formattedMedia, CKEDITOR.instances[instanceId]);
|
| 39 |
}, options); |
| 40 |
|
| 41 |
return;
|
| 42 |
}, |
| 43 |
|
| 44 |
insertMediaFile: function (mediaFile, formattedMedia, ckeditorInstance) { |
| 45 |
// Customization of Drupal.media.filter.registerNewElement().
|
| 46 |
var element = Drupal.media.filter.create_element(formattedMedia.html, {
|
| 47 |
fid: mediaFile.fid,
|
| 48 |
view_mode: formattedMedia.type,
|
| 49 |
attributes: formattedMedia.options
|
| 50 |
}); |
| 51 |
|
| 52 |
// Use own wrapper element to be able to properly deal with selections.
|
| 53 |
// Check prepareDataForWysiwygMode() in plugin.js for details.
|
| 54 |
var wysiwygHTML = Drupal.media.filter.getWysiwygHTML(element);
|
| 55 |
|
| 56 |
// Insert element. Use CKEDITOR.dom.element.createFromHtml to ensure our
|
| 57 |
// custom wrapper element is preserved.
|
| 58 |
if (wysiwygHTML.indexOf("<!--MEDIA-WRAPPER-START-") !== -1) { |
| 59 |
ckeditorInstance.plugins.media.mediaLegacyWrappers = true;
|
| 60 |
wysiwygHTML = wysiwygHTML.replace(/<!--MEDIA-WRAPPER-START-(\d+)-->(.*?)<!--MEDIA-WRAPPER-END-\d+-->/gi, ''); |
| 61 |
} else {
|
| 62 |
wysiwygHTML = '<mediawrapper data="">' + wysiwygHTML + '</mediawrapper>'; |
| 63 |
} |
| 64 |
|
| 65 |
var editorElement = CKEDITOR.dom.element.createFromHtml(wysiwygHTML);
|
| 66 |
ckeditorInstance.insertElement(editorElement); |
| 67 |
|
| 68 |
// Initialize widget on our html if possible.
|
| 69 |
if (parseFloat(CKEDITOR.version) >= 4.3 && typeof(CKEDITOR.plugins.registered.widget) != 'undefined') { |
| 70 |
ckeditorInstance.widgets.initOn( editorElement, 'mediabox' );
|
| 71 |
} |
| 72 |
}, |
| 73 |
|
| 74 |
/**
|
| 75 |
* Forces custom attributes into the class field of the specified image.
|
| 76 |
*
|
| 77 |
* Due to a bug in some versions of Firefox
|
| 78 |
* (http://forums.mozillazine.org/viewtopic.php?f=9&t=1991855), the
|
| 79 |
* custom attributes used to share information about the image are
|
| 80 |
* being stripped as the image markup is set into the rich text
|
| 81 |
* editor. Here we encode these attributes into the class field so
|
| 82 |
* the data survives.
|
| 83 |
*
|
| 84 |
* @param imgElement
|
| 85 |
* The image
|
| 86 |
* @fid
|
| 87 |
* The file id.
|
| 88 |
* @param view_mode
|
| 89 |
* The view mode.
|
| 90 |
* @param additional
|
| 91 |
* Additional attributes to add to the image.
|
| 92 |
*/
|
| 93 |
forceAttributesIntoClass: function (imgElement, fid, view_mode, additional) { |
| 94 |
var wysiwyg = imgElement.attr('wysiwyg'); |
| 95 |
if (wysiwyg) {
|
| 96 |
imgElement.addClass('attr__wysiwyg__' + wysiwyg);
|
| 97 |
} |
| 98 |
var format = imgElement.attr('format'); |
| 99 |
if (format) {
|
| 100 |
imgElement.addClass('attr__format__' + format);
|
| 101 |
} |
| 102 |
var typeOf = imgElement.attr('typeof'); |
| 103 |
if (typeOf) {
|
| 104 |
imgElement.addClass('attr__typeof__' + typeOf);
|
| 105 |
} |
| 106 |
if (fid) {
|
| 107 |
imgElement.addClass('img__fid__' + fid);
|
| 108 |
} |
| 109 |
if (view_mode) {
|
| 110 |
imgElement.addClass('img__view_mode__' + view_mode);
|
| 111 |
} |
| 112 |
if (additional) {
|
| 113 |
for (var name in additional) { |
| 114 |
if (additional.hasOwnProperty(name)) {
|
| 115 |
switch (name) {
|
| 116 |
case 'field_file_image_alt_text[und][0][value]': |
| 117 |
imgElement.attr('alt', additional[name]);
|
| 118 |
break;
|
| 119 |
case 'field_file_image_title_text[und][0][value]': |
| 120 |
imgElement.attr('title', additional[name]);
|
| 121 |
break;
|
| 122 |
default:
|
| 123 |
imgElement.addClass('attr__' + name + '__' + additional[name]); |
| 124 |
break;
|
| 125 |
} |
| 126 |
} |
| 127 |
} |
| 128 |
} |
| 129 |
}, |
| 130 |
|
| 131 |
/**
|
| 132 |
* Retrieves encoded attributes from the specified class string.
|
| 133 |
*
|
| 134 |
* @param classString
|
| 135 |
* A string containing the value of the class attribute.
|
| 136 |
* @return
|
| 137 |
* An array containing the attribute names as keys, and an object
|
| 138 |
* with the name, value, and attribute type (either 'attr' or
|
| 139 |
* 'img', depending on whether it is an image attribute or should
|
| 140 |
* be it the attributes section)
|
| 141 |
*/
|
| 142 |
getAttributesFromClass: function (classString) { |
| 143 |
var actualClasses = [];
|
| 144 |
var otherAttributes = [];
|
| 145 |
var classes = classString.split(' '); |
| 146 |
var regexp = new RegExp('^(attr|img)__([^\S]*)__([^\S]*)$'); |
| 147 |
for (var index = 0; index < classes.length; index++) { |
| 148 |
var matches = classes[index].match(regexp);
|
| 149 |
if (matches && matches.length === 4) { |
| 150 |
otherAttributes[matches[2]] = {
|
| 151 |
name: matches[2], |
| 152 |
value: matches[3], |
| 153 |
type: matches[1] |
| 154 |
}; |
| 155 |
} |
| 156 |
else {
|
| 157 |
actualClasses.push(classes[index]); |
| 158 |
} |
| 159 |
} |
| 160 |
if (actualClasses.length > 0) { |
| 161 |
otherAttributes['class'] = {
|
| 162 |
name: 'class', |
| 163 |
value: actualClasses.join(' '), |
| 164 |
type: 'attr' |
| 165 |
}; |
| 166 |
} |
| 167 |
return otherAttributes;
|
| 168 |
}, |
| 169 |
|
| 170 |
sortAttributes: function (a, b) { |
| 171 |
var nameA = a.name.toLowerCase();
|
| 172 |
var nameB = b.name.toLowerCase();
|
| 173 |
if (nameA < nameB) {
|
| 174 |
return -1; |
| 175 |
} |
| 176 |
if (nameA > nameB) {
|
| 177 |
return 1; |
| 178 |
} |
| 179 |
return 0; |
| 180 |
} |
| 181 |
}; |
| 182 |
|
| 183 |
})(jQuery); |