diff --git a/media/includes/media.filter.inc b/media/includes/media.filter.inc index 32424df..f76693d 100644 --- a/media/includes/media.filter.inc +++ b/media/includes/media.filter.inc @@ -173,31 +173,28 @@ // Track the fid of this file in the {media_filter_usage} table. media_filter_track_usage($file->fid); - $attributes = is_array($tag_info['attributes']) ? $tag_info['attributes'] : array(); - $attribute_whitelist = media_variable_get('wysiwyg_allowed_attributes'); - $settings['attributes'] = array_intersect_key($attributes, array_flip($attribute_whitelist)); + if (!empty($tag_info['attributes']) && is_array($tag_info['attributes'])) { + $attribute_whitelist = media_variable_get('wysiwyg_allowed_attributes'); + $settings['attributes'] = array_intersect_key($tag_info['attributes'], array_flip($attribute_whitelist)); - // Many media formatters will want to apply width and height independently - // of the style attribute or the corresponding HTML attributes, so pull - // these two out into top-level settings. Different WYSIWYG editors have - // different behavior with respect to whether they store user-specified - // dimensions in the HTML attributes or the style attribute, so check both. - // Per http://www.w3.org/TR/html5/the-map-element.html#attr-dim-width, the - // HTML attributes are merely hints: CSS takes precedence. - if (isset($settings['attributes']['style'])) { - $css_properties = media_parse_css_declarations($settings['attributes']['style']); - foreach (array('width', 'height') as $dimension) { - if (isset($css_properties[$dimension]) && substr($css_properties[$dimension], -2) == 'px') { - $settings[$dimension] = substr($css_properties[$dimension], 0, -2); - } - elseif (isset($settings['attributes'][$dimension])) { - $settings[$dimension] = $settings['attributes'][$dimension]; + // Many media formatters will want to apply width and height independently + // of the style attribute or the corresponding HTML attributes, so pull + // these two out into top-level settings. Different WYSIWYG editors have + // different behavior with respect to whether they store user-specified + // dimensions in the HTML attributes or the style attribute, so check both. + // Per http://www.w3.org/TR/html5/the-map-element.html#attr-dim-width, the + // HTML attributes are merely hints: CSS takes precedence. + if (isset($settings['attributes']['style'])) { + $css_properties = media_parse_css_declarations($settings['attributes']['style']); + foreach (array('width', 'height') as $dimension) { + if (isset($css_properties[$dimension]) && substr($css_properties[$dimension], -2) == 'px') { + $settings[$dimension] = substr($css_properties[$dimension], 0, -2); + } + elseif (isset($settings['attributes'][$dimension])) { + $settings[$dimension] = $settings['attributes'][$dimension]; + } } } - } - - if ($wysiwyg) { - $settings['wysiwyg'] = $wysiwyg; } } catch (Exception $e) { @@ -205,7 +202,26 @@ return ''; } - $element = media_get_file_without_label($file, $tag_info['view_mode'], $settings); + if ($wysiwyg) { + $settings['wysiwyg'] = $wysiwyg; + // If sending markup to a WYSIWYG, we need to pass the file infomation so + // that a inline macro can be generated when the WYSIWYG is detached. + // The WYSIWYG plugin is expecting this information in the format of a + // urlencoded JSON string stored in the data-file_info attribute of the + // element. + $element = media_get_file_without_label($file, $tag_info['view_mode'], $settings); + $data = drupal_json_encode(array( + 'type' => 'media', + 'fid' => $file->fid, + 'view_mode' => $tag_info['view_mode'], + )); + $element['#attributes']['data-file_info'] = urlencode($data); + $element['#attributes']['class'][] = 'media-element'; + } + else { + $element = media_get_file_without_label($file, $tag_info['view_mode'], $settings); + } + drupal_alter('media_token_to_markup', $element, $tag_info, $settings); return drupal_render($element); } @@ -410,6 +426,10 @@ } } + if (!empty($element['#attributes']['class']) && !is_array($element['#attributes']['class'])) { + $element['#attributes']['class'] = array($element['#attributes']['class']); + } + return $element; } diff --git a/media/js/media.format_form.js b/media/js/media.format_form.js index 446cb54..64244e1 100644 --- a/media/js/media.format_form.js +++ b/media/js/media.format_form.js @@ -23,7 +23,7 @@ $('' + Drupal.t('Submit') + '').appendTo($('#media-format-form')).bind('click', Drupal.media.formatForm.submit); $('' + Drupal.t('Cancel') + '').appendTo($('#media-format-form')).bind('click', Drupal.media.formatForm.submit); - if (Drupal.settings.media_format_form.autosubmit) { + if (Drupal.settings.media_format_form && Drupal.settings.media_format_form.autosubmit) { $('.button.fake-ok').click(); } } diff --git a/media/js/wysiwyg-media.js b/media/js/wysiwyg-media.js index 97697f0..ebc0b3e 100644 --- a/media/js/wysiwyg-media.js +++ b/media/js/wysiwyg-media.js @@ -7,113 +7,48 @@ (function ($) { Drupal.media = Drupal.media || {}; - -// Define the behavior. +/** + * Register the plugin with WYSIWYG. + */ Drupal.wysiwyg.plugins.media = { /** - * Initializes the tag map. + * Determine whether a DOM element belongs to this plugin. + * + * @param node + * A DOM element. */ - initializeTagMap: function () { - if (typeof Drupal.settings.tagmap == 'undefined') { - Drupal.settings.tagmap = { }; - } + isNode: function(node) { + return $(node).is('img.media-element'); }, /** * Execute the button. - * @TODO: Debug calls from this are never called. What's its function? + * + * @param data + * An object containing data about the current selection: + * - format: 'html' when the passed data is HTML content, 'text' when the + * passed data is plain-text content. + * - node: When 'format' is 'html', the focused DOM element in the editor. + * - content: The textual representation of the focused/selected editor + * content. + * @param settings + * The plugin settings, as provided in the plugin's PHP include file. + * @param instanceId + * The ID of the current editor instance. */ invoke: function (data, settings, instanceId) { if (data.format == 'html') { - Drupal.media.popups.mediaBrowser(function (mediaFiles) { - Drupal.wysiwyg.plugins.media.mediaBrowserOnSelect(mediaFiles, instanceId); - }, settings['global']); - } - }, - - /** - * Respond to the mediaBrowser's onSelect event. - * @TODO: Debug calls from this are never called. What's its function? - */ - mediaBrowserOnSelect: function (mediaFiles, instanceId) { - var mediaFile = mediaFiles[0]; - var options = {}; - Drupal.media.popups.mediaStyleSelector(mediaFile, function (formattedMedia) { - Drupal.wysiwyg.plugins.media.insertMediaFile(mediaFile, formattedMedia.type, formattedMedia.html, formattedMedia.options, Drupal.wysiwyg.instances[instanceId]); - }, options); - - return; - }, - - insertMediaFile: function (mediaFile, viewMode, formattedMedia, options, wysiwygInstance) { - - this.initializeTagMap(); - // @TODO: the folks @ ckeditor have told us that there is no way - // to reliably add wrapper divs via normal HTML. - // There is some method of adding a "fake element" - // But until then, we're just going to embed to img. - // This is pretty hacked for now. - // - var imgElement = $(this.stripDivs(formattedMedia)); - this.addImageAttributes(imgElement, mediaFile.fid, viewMode, options); - - var toInsert = this.outerHTML(imgElement); - // Create an inline tag - var inlineTag = Drupal.wysiwyg.plugins.media.createTag(imgElement); - // Add it to the tag map in case the user switches input formats - Drupal.settings.tagmap[inlineTag] = toInsert; - wysiwygInstance.insert(toInsert); - }, - - /** - * Gets the HTML content of an element - * - * @param jQuery element - */ - outerHTML: function (element) { - return $('