Add insert button to media widget

This is better handled by modules such as Insert, Insert Field and Advanced Entity Tokens.

Switched from 'media multiselect' widget to 'media browser' widget for file field. Insert module is installed but does not display Insert button in Media 7.2-alpha3.

Applied #2 patch and still do not see the Insert button using Attachments with WYSIWYG and CKeditor 4.4.7

Disabled manualcrop and the Insert button re-appeared on Attachments. Re-enable manualcrop and the Insert button remains.

In the latest dev version of Media, media_ckeditor has been split out into a separate project, so here is a reroll and slight modification of #2 that can be applied to media_ckeditor instead of media. The modification is a minor fix to prevent the hijacking of the normal Ckeditor toolbar button after the new insert buttons have been clicked. (Interdiff attached too.)

To be clear, if you use an older version of the Media module, from before media_ckeditor was split into a separate project, you would still need to use #2.

A slight change to move the Insert button just before "Remove".

Another tweak to remove the href of "#", which can be problematic.

Yet another tweak, to fix a logic issue: If the user has a media item selected in the WYSIWYG and then click an "Insert" button, the popup reflects the selected (in the WYSIWYG) file, instead of the file associated with that "Insert" button. This update fixes that by re-arranging some logic.

Whoops, code from another patch snuck in there. Trying again.

This is a version for anyone who also uses #2710841-8: The toolbar button does not open/edit selected media in latest CKEditor.

That didn't work. Once again, this is a version for anyone who also uses #2710841-8: The toolbar button does not open/edit selected media in latest CKEditor.

Tested Patch #12 and works. Thanks

A slight tweak to deal with an edge case involving Ctool modals. This was happening:

1. Open an entity edit form in a Ctools modal that had a Media widget, but no Ckeditor instance (as would be expected, no Insert link)
2. Click on "Edit" in that media widget, which closes the Ctools modal and opens another Ctools modal to edit the file, and the file does have a Ckeditor instance in it (like, if you had a Ckeditor-enabled Caption field on the Image file type, for example)
3. After saving/closing that Ctools modal, re-open the first entity edit form Ctools modal from step #1. It now has an insert button that doesn't do anything. :(

So a simple fix is to do a safety check. I've wrapped the whole thing in:

if (typeof Drupal.ckeditorInstance !== 'undefined') {
  // Everything else the same
}

Messed up the alternate version, trying again.

#16 was broken because it relied on the Ckeditor instance to be instantiated before the code runs, which can't be assumed. Will have to accept the behavior described in #16 as an unfortunate edge case for now, and keep working on a better solution. Please disregard #16 and #17.

Here is a re-roll and revamp of this functionality. With the new patch, this Insert button is configurable per file field instance. This should hopefully make this safer to use, since it doesn't change anything by itself. The insert button will only appear if you turn it on for a particular field instance. The option will appear as a checkbox in the field instance configuration, but only if the field widget is the Media browser.

I'll be testing this out. The only thing I'm not totally sure about is the changing of the weight of the library.js file from -20 to 20. That seems to be needed in order to have library.js fire after CKEditor is loaded. But I'll be keeping an eye on that for any issues.

I need to test this alongside #2731335: Fully rendered file in WYSIWYG, including overridden fields, so here is a version that includes that patch. Please disregard this one and review #19.

I have tried this and it doesn't work with my setup. (patch 19)

I get "Show button for inserting files into WYSIWYG editor" on the manage field page for a Media Browser field type but no insert button on a node edit page.

I haven't checked in to the code yet but is there something else I should know/do?

@size, can you check the browser console to see if any javascript errors are happening on the node edit page?

@brockfanning

I will try and investigate further as time allows but it seem that the js/plugins/media/library.js isn't even loading, I have tried changing it to other weights but still no joy, it just doesn't load.

using un-patched .module with patch 12, all is fine still.

@size , which version of jQuery are you using? which version of jquery_update?

@brockfanning, which version of jQuery are you using?

jquery_update allows us to specify which version of jQuery is used by which theme, note that the theme used during admin tasks is not always the same as the theme used for displaying your content to the public.

The site where I'm running this patch uses jQuery 1.7.

@size: Just to make sure, does your node type have a long text field that defaults to use a text format associated with a CKEditor profile that has "Plugin for embedding files using Media CKEditor" checked?

I have tried all options available for admin JQuery and have 1.7 as default, even though that shouldn't effect admin Jquery when it is different.

I have tried Bartik but generally have Seven as admin theme.

Something is stopping the load of the library.js on page load as you mention.

@brockfanning, yes I have "Plugin for embedding files using Media CKEditor" checked on all my CKEditor profiles. I am using the default body field / widget type: text area with a summary.

@size: I'm going to investigate further, thanks for the feedback. First though a quick re-roll since it doesn't apply anymore.

One problem is that it only worked for multi-value file fields, and did not work for single-value file fields. Here's a fix for that problem. @size: Do you think that could have been the issue?

thanks @brockfanning

appreciate your work on this, I will also try and find sometime in the next week to see what I can come up with / apply your re-rolled patches. It is a nice feature and having it configurable per field is definitely the way to go, but for now I can live with #12 patch.

regarding file fields, I am using image fields with media browser widget, only using/wanting it on multi-valued (unlimited) fields.

as said will test re-rolled patches and get back to you.

tested #28 and works with image field type (multi-value) with media widget.

insert toggle on configuration works as expected

thanks @brockfanning

@brockfanning , do you want this committed and then tag a new release with this? I haven't yet tested this but if you say its good, lets put it in.

As far as I know this is a pretty harmless addition, because nothing should really change until the site builder makes an intentional configuration change; and it's working for me. That said, I'm not in a huge hurry to get this feature committed, since I'm happy to keep using a patch. If you'd prefer to wait and push for a 2.0 release before adding new features, that's fine with me.

after applying this patch, my linkit plugin stopped working, the dialog popup failed to load.

Backing off this patch restored my linkit functionality for an imce inserted image that uses the image plugin.

The only thing I can think of that might cause that is the changing of the javascript's weight, and now that I'm testing it again on a vanilla site, it doesn't seem like it needs to change. I'm hopeful that I was just mistaken when I thought that needed to be done. Here's another version with the weight changed back to normal. I'll test this on a client site tomorrow.

Don't use this patch...

Yeah, it seems to work fine without changing the javascript weight. @size and @joseph.oldstad do you mind re-testing with #34?

I still need weight set at 20, but with weight set at -20 the library.js is still loading but no insert button is attached. I haven't tested anything past that.

I don't have media_oembed as per the recipe at [#2843391] but other than that I think my set up is almost the same.

Ah, you're right @size, I hadn't tried testing with existing content. Ok, I'll hide #34, and #28 is still the best patch for now.

@joseph.oldstad: We need to figure out what's going wrong in your setup. I use Linkit, but not IMCE. I haven't noticed any issues with Linkit with this patch. Can you list the steps you're taking to get to the failure, so I can try and recreate it?

@brockfanning , I'm using a few other ckeditor plugins like pastefromexcel and one or two others, plus imce , plus the image plugin (works with imce) and of course linkit.
I'll try to test this out again in the next few days possibly and see if there's some more debug info I can provide.

I reviewed this, it didn't seem to harm anything, however I didn't yet actually test the insert button.

Upon further regression testing of this patch it was found to break linkit integration.

When this patch applies, the linkit dialog fails to open fully, it opens with no items in it and locks up.

So I back off this patch, and linkit functionality is restored. So same issue as reported in #33

@joseph.olstad: Are there any javascript errors or any clues as to what might be going on? I am having trouble recreating that. I'm testing this recipe and Linkit seems to be unaffected:

projects:
  media:
    version: "2.0-rc5"
  media_ckeditor:
    version: "2.0-rc3"
    patch:
      - https://www.drupal.org/files/issues/add_insert_button_to-2451959-28.patch
  media_oembed: "2.7"
  ckeditor: "1.17"
  ctools: "1.12"
  file_entity: "2.0-beta3"
  token: "1.6"
  views: "3.14"
  linkit: "3.5"
  entity: "1.8"

# The Ckeditor library and some plugins.
libraries:
  ckeditor:
    download:
      type: "file"
      url: "http://download.cksource.com/CKEditor/CKEditor/CKEditor%204.6.1/ckeditor_4.6.1_full.zip"
  lineutils:
    download:
      type: "file"
      url: "http://download.ckeditor.com/lineutils/releases/lineutils_4.6.1.zip"
    destination: "libraries/ckeditor/plugins"
  widget:
    download:
      type: "file"
      url: "http://download.ckeditor.com/widget/releases/widget_4.6.1.zip"
    destination: "libraries/ckeditor/plugins"
  widgetselection:
    download:
      type: "file"
      url: "http://download.ckeditor.com/widgetselection/releases/widgetselection_4.6.1.zip"
    destination: "libraries/ckeditor/plugins"

I'm using ckeditor 4.6.2

perhaps thats the difference.

I'll try to run some more tests see if there's some javascript error.

Also, we're using jQuery 1.4

I forgot to add the entity module to the recipe above, FYI. It's there now.

I tried going up to CKEditor 4.6.2, and I'm still not getting problems with Linkit. I'm testing on standard Drupal 7 so I'm also using jQuery 1.4.

This is a version only for use with a totally unrelated patch, #2731335-33: Fully rendered file in WYSIWYG, including overridden fields. The patch to test is still #28 above.

jQuery 1.4

projects:
  media:
    version: "2.0-rc5"
  media_ckeditor:
    version: "2.0-rc3"
    patch:
      - https://www.drupal.org/files/issues/add_insert_button_to-2451959-28.patch
  media_oembed: "2.7"
  ckeditor: "1.17"
  ctools: "1.11"#SORRY HAVEN'T YET TESTED with ctools 7.x-1.12.
  file_entity: "2.0-beta3"
  token: "1.6"
  views: "3.14"
  linkit: "3.5"

# The Ckeditor library and some plugins.
libraries:
  ckeditor:
    download:
      type: "file"
      url: "http://download.cksource.com/CKEditor/CKEditor/CKEditor%204.6.2/ckeditor_4.6.2_full.zip"
  lineutils:
    download:
      type: "file"
      url: "http://download.ckeditor.com/lineutils/releases/lineutils_4.6.2.zip"
    destination: "libraries/ckeditor/plugins"
  widget:
    download:
      type: "file"
      url: "http://download.ckeditor.com/widget/releases/widget_4.6.2.zip"
    destination: "libraries/ckeditor/plugins"
  widgetselection:
    download:
      type: "file"
      url: "http://download.ckeditor.com/widgetselection/releases/widgetselection_4.6.2.zip"
    destination: "libraries/ckeditor/plugins"

TypeError:

TypeError: Drupal.settings.media_ckeditor is undefined[Learn More]  library.js:15:61
	Drupal.behaviors.mediaWidgetInsert.attach http://test.127.0.0.1.nip.io/sites/all/modules/media_ckeditor/js/plugins/media/library.js:15:61
	Drupal.attachBehaviors/< http://test.127.0.0.1.nip.io/misc/drupal.js:76:7
	c</<.each http://test.127.0.0.1.nip.io/misc/jquery.js:33:531
	Drupal.attachBehaviors http://test.127.0.0.1.nip.io/misc/drupal.js:74:3
	Drupal.ajax.prototype.commands.insert http://test.127.0.0.1.nip.io/misc/ajax.js:570:7
	Drupal.ajax.prototype.success http://test.127.0.0.1.nip.io/misc/ajax.js:428:7
	Drupal.linkit.getDashboard/Drupal.ajax["linkit-modal"].options.success http://test.127.0.0.1.nip.io/sites/all/modules//linkit/js/linkit.js:121:5
	.handleSuccess http://test.127.0.0.1.nip.io/misc/jquery.js:143:438
	.ajax/w.onreadystatechange

Doh, I didn't even think to test this without a Media widget being present. Makes sense, good catch! Here is another version that should hopefully fix that, and removes some unnecessary "typeof" operators. (Along with an interdiff, and an update to a temporary patch for use with an unrelated issue.)

We still require the patch to use with 2731335-33. It didn't apply with latest dev. Here is the rerolled one.

The other patche applies without problem, so it is same as #50 above.

Sorry that my above comment #52 is wrong. Both patches from #50 still applies.

been sitting here long enough, committed patch 50 as-is.

Thanks to @brockfanning once again!