NEW: Files can be uploaded directly in the 'Insert Link' form

admin/css/screen.css

@@ -140,7 +140,7 @@ body, html { font-size: 12px; line-height: 16px; font-family: Arial, sans-serif;
 .ui-accordion .ui-accordion-header { border-color: #c0c0c2; margin-bottom: 0; }
 .ui-accordion .ui-accordion-content { border: 1px solid #c0c0c2; border-top: none; }
 
-.ui-autocomplete { max-height: 240px; overflow-x: hidden; overflow-y: auto; }
+.ui-autocomplete { max-height: 240px; overflow-x: hidden; overflow-y: auto; /** sorry about the !important but the specificity of other selectors mandates it over writing out very specific selectors **/ }
 .ui-autocomplete-loading { background-image: url(../images/throbber.gif) !important; background-position: 97% center !important; background-repeat: no-repeat !important; background-size: auto !important; }
 
 /** This file defines common styles for form elements used throughout the CMS interface. It is an addition to the base styles defined in framework/css/Form.css.  @package framework @subpackage admin */
@@ -687,6 +687,7 @@ body.cms-dialog { overflow: auto; background: url("../images/textures/bg_cms_mai
 .htmleditorfield-dialog .CompositeField .text select { margin: 5px 0 0 0; }
 
 .htmleditorfield-linkform .step2 { margin-bottom: 16px; }
+.htmleditorfield-linkform .ss-uploadfield .middleColumn { width: auto; }
 
 .htmleditorfield-mediaform .ss-gridfield .gridfield-button-delete { display: none; }
 .htmleditorfield-mediaform .ss-gridfield table.ss-gridfield-table tbody td:first-child { padding: 0; text-align: center; }

admin/scss/_style.scss

@@ -1520,6 +1520,11 @@ body.cms-dialog {
 	.step2 {
 		margin-bottom: $grid-x*2;
 	}
+	.ss-uploadfield {
+		.middleColumn {
+			width: auto;
+		}
+	}
 }
 
 .htmleditorfield-mediaform {

forms/HtmlEditorField.php

@@ -258,7 +258,7 @@ class HtmlEditorField_Toolbar extends RequestHandler {
 					$siteTree,
 					TextField::create('external', _t('HtmlEditorField.URL', 'URL'), 'http://'),
 					EmailField::create('email', _t('HtmlEditorField.EMAIL', 'Email address')),
-					TreeDropdownField::create('file', _t('HtmlEditorField.FILE', 'File'), 'File', 'ID', 'Title', true),
+					$fileField = UploadField::create('file', _t('HtmlEditorField.FILE', 'File')),
 					TextField::create('Anchor', _t('HtmlEditorField.ANCHORVALUE', 'Anchor')),
 					TextField::create('Subject', _t('HtmlEditorField.SUBJECT', 'Email subject')),
 					TextField::create('Description', _t('HtmlEditorField.LINKDESCR', 'Link description')),
@@ -281,6 +281,7 @@ class HtmlEditorField_Toolbar extends RequestHandler {
 
 		$headerWrap->addExtraClass('CompositeField composite cms-content-header nolabel ');
 		$contentComposite->addExtraClass('ss-insert-link content');
+		$fileField->setAllowedMaxFileNumber(1);
 
 		$form->unsetValidator();
 		$form->loadDataFrom($this);

javascript/HtmlEditorField.js

@@ -498,8 +498,8 @@ ss.editorWrappers['default'] = ss.editorWrappers.tinyMCE;
 
 					this.find(':input:not(:submit)[data-skip-autofocus!="true"]').filter(':visible:enabled').eq(0).focus();
 
-					this.updateFromEditor();
 					this.redraw();
+					this.updateFromEditor();
 				},
 
 				onssdialogclose: function(){
@@ -573,6 +573,8 @@ ss.editorWrappers['default'] = ss.editorWrappers.tinyMCE;
 
 				this.addAnchorSelector();
 
+				this.resetFileField();
+
 				// Toggle field visibility depending on the link type.
 				this.find('div.content .field').hide();
 				this.find('.field[id$="LinkType"]').show();
@@ -623,7 +625,7 @@ ss.editorWrappers['default'] = ss.editorWrappers.tinyMCE;
 						break;
 					
 					case 'file':
-						href = '[file_link,id=' + this.find(':input[name=file]').val() + ']';
+						href = '[file_link,id=' + this.find('.ss-uploadfield .ss-uploadfield-item').attr('data-fileid') + ']';
 						target = '_blank';
 						break;
 					
@@ -653,17 +655,27 @@ ss.editorWrappers['default'] = ss.editorWrappers.tinyMCE;
 				this.modifySelection(function(ed){
 					ed.insertLink(this.getLinkAttributes());
 				});
-
-				this.updateFromEditor();
 			},
 			removeLink: function() {
 				this.modifySelection(function(ed){
 					ed.removeLink();
 				});
 
+				this.resetFileField();
 				this.close();
 			},
 
+			resetFileField: function() {
+				// If there's an attached item, remove it
+				var fileField = this.find('#file'),
+					fileUpload = fileField.data('fileupload'),
+					currentItem = fileField.find('.ss-uploadfield-item[data-fileid]');
+
+				if(currentItem.length) {
+					fileUpload._trigger('destroy', null, {content: currentItem});
+				}
+			},
+
 			/**
 			 * Builds an anchor selector element and injects it into the DOM next to the anchor field.
 			 */
@@ -810,6 +822,18 @@ ss.editorWrappers['default'] = ss.editorWrappers.tinyMCE;
 							el.prop('checked', selected).change();
 						} else if(el.is(':radio')) {
 							el.val([selected]).change();
+						} else if(fieldName == 'file') {
+							// Can't rely on fieldName, ad UploadFields have different naming convention
+							el = $('#' + fieldName);
+
+							// We have to wait for the UploadField to initialise
+							(function attach(el, selected) {
+								if( ! el.getConfig()) {
+									setTimeout(function(){ attach(el, selected); }, 50);
+								} else {
+									el.attachFiles([selected]);
+								}
+							})(el, selected);
 						} else {
 							el.val(selected).change();
 						}