Commit d4465f59 authored by Benni Mack's avatar Benni Mack
Browse files

[TASK] Replace BrowseLinks.js with jQuery/RequireJS Module

In the main approach to drop prototype/scriptaculous
usage, the BrowseLinks functionality
is rewritten to be used as a RequireJS module.

As BrowseLinks is still a lot of really old code
this needs to be refactored more at a later stage.

To test: FAL / IRRE usage, wizard
functionality, RTE functionality.

Resolves: #63690
Releases: master
Change-Id: I58514fa83a627fe34d13dd77ece0c44f495ee45d
Reviewed-on: http://review.typo3.org/35173


Reviewed-by: Wouter Wolters's avatarWouter Wolters <typo3@wouterwolters.nl>
Tested-by: Wouter Wolters's avatarWouter Wolters <typo3@wouterwolters.nl>
Reviewed-by: default avatarMarkus Klein <klein.t3@reelworx.at>
Reviewed-by: Mathias Schreiber's avatarMathias Schreiber <mathias.schreiber@wmdb.de>
Tested-by: Mathias Schreiber's avatarMathias Schreiber <mathias.schreiber@wmdb.de>
Reviewed-by: Benni Mack's avatarBenjamin Mack <benni@typo3.org>
Tested-by: Benni Mack's avatarBenjamin Mack <benni@typo3.org>
parent 524e32c0
/**
* This file is part of the TYPO3 CMS project.
*
* It is free software; you can redistribute it and/or modify it under
* the terms of the GNU General Public License, either version 2
* of the License, or any later version.
*
* For the full copyright and license information, please read the
* LICENSE.txt file that was distributed with this source code.
*
* The TYPO3 project - inspiring people to share!
*/
var BrowseLinks = {
elements: {},
addElements: function(elements) {
BrowseLinks.elements = $H(BrowseLinks.elements).merge(elements).toObject();
},
focusOpenerAndClose: function(close) {
if (close) {
parent.window.opener.focus();
parent.close();
}
}
};
// when selecting one or multiple files, this action is called
BrowseLinks.File = {
insertElement: function(index, close) {
var result = false;
if (typeof BrowseLinks.elements[index] !== undefined) {
var element = BrowseLinks.elements[index];
// insertElement takes the following parameters
// table, uid, type, filename,fp,filetype,imagefile,action, close
result = insertElement(
element.table,
element.uid,
element.type,
element.fileName,
element.filePath,
element.fileExt,
element.fileIcon,
'',
close
);
}
return result;
},
insertElementMultiple: function(list) {
var uidList = [];
list.each(function(index) {
if (typeof BrowseLinks.elements[index] !== undefined) {
var element = BrowseLinks.elements[index];
uidList.push(element.uid);
}
});
insertMultiple('sys_file', uidList);
return true;
}
};
BrowseLinks.Selector = {
element: 'typo3-fileList',
toggle: function(element) {
var items = this.getItems(element);
if (items.length) {
items.each(function(item) {
item.checked = (item.checked ? null : 'checked');
});
}
},
handle: function(element) {
var items = this.getItems(element);
var selectedItems = [];
if (items.length) {
items.each(function(item) {
if (item.checked && item.name) {
selectedItems.push(item.name);
}
});
if (selectedItems.length == 1) {
BrowseLinks.File.insertElement(selectedItems[0]);
} else {
BrowseLinks.File.insertElementMultiple(selectedItems);
}
BrowseLinks.focusOpenerAndClose(true);
}
},
getParentElement: function(element) {
element = $(element);
return (element ? element : $(this.element));
},
getItems: function(element) {
element = this.getParentElement(element);
return Element.select(element, '.typo3-bulk-item');
}
};
/**
* This file is part of the TYPO3 CMS project.
*
* It is free software; you can redistribute it and/or modify it under
* the terms of the GNU General Public License, either version 2
* of the License, or any later version.
*
* For the full copyright and license information, please read the
* LICENSE.txt file that was distributed with this source code.
*
* The TYPO3 project - inspiring people to share!
*/
var BrowseLinks;
/**
* this module is currently a wrapper for BrowseLinks, as the functionality
* is split up in still a lot of inline JS code.
*/
define('TYPO3/CMS/Backend/BrowseLinks', ['jquery'], function ($) {
BrowseLinks = {
elements: {},
addElements: function(elements) {
$.extend(BrowseLinks.elements, elements);
},
focusOpenerAndClose: function(close) {
if (close) {
parent.window.opener.focus();
parent.close();
}
}
};
// when selecting one or multiple files, this action is called
BrowseLinks.File = {
insertElement: function(index, close) {
var result = false;
if (typeof BrowseLinks.elements[index] !== undefined) {
var element = BrowseLinks.elements[index];
// insertElement takes the following parameters
// table, uid, type, filename,fp,filetype,imagefile,action, close
result = insertElement(element.table, element.uid, element.type, element.fileName, element.filePath, element.fileExt, element.fileIcon, '', close);
}
return result;
},
insertElementMultiple: function(list) {
var uidList = [];
list.each(function(index) {
if (typeof BrowseLinks.elements[index] !== undefined) {
var element = BrowseLinks.elements[index];
uidList.push(element.uid);
}
});
insertMultiple('sys_file', uidList);
return true;
}
};
/**
* Selector when using "Import selection" and "Toggle selection"
*/
BrowseLinks.Selector = {
containerSelectorElement: '#typo3-filelist',
// Toggle selection button is pressed
toggle: function() {
var items = this.getItems();
if (items.length) {
items.each(function(position, item) {
item.checked = (item.checked ? null : 'checked');
});
}
},
// Import selection button is pressed
handle: function() {
var items = this.getItems();
var selectedItems = [];
if (items.length) {
items.each(function(position, item) {
if (item.checked && item.name) {
selectedItems.push(item.name);
}
});
if (selectedItems.length == 1) {
BrowseLinks.File.insertElement(selectedItems[0]);
} else {
BrowseLinks.File.insertElementMultiple(selectedItems);
}
BrowseLinks.focusOpenerAndClose(true);
}
},
getParentElement: function(element) {
return $(element ? element : this.containerSelectorElement);
},
getItems: function() {
return this.getParentElement().find('.typo3-bulk-item');
}
};
// return the object in the global space
return BrowseLinks;
});
......@@ -345,10 +345,10 @@ class ElementBrowser {
$this->doc = GeneralUtility::makeInstance(\TYPO3\CMS\Backend\Template\DocumentTemplate::class);
$this->doc->bodyTagId = 'typo3-browse-links-php';
$this->doc->backPath = $GLOBALS['BACK_PATH'];
// Load the Prototype library and browse_links.js
// Load the Prototype library and the tree
$this->doc->getPageRenderer()->loadPrototype();
$this->doc->loadJavascriptLib('js/browse_links.js');
$this->doc->loadJavascriptLib('js/tree.js');
$this->doc->getPageRenderer()->loadRequireJsModule('TYPO3/CMS/Backend/BrowseLinks');
}
/**
......@@ -1540,7 +1540,10 @@ class ElementBrowser {
// Add some space
$content .= '<br /><br />';
// Setup indexed elements:
$this->doc->JScode .= $this->doc->wrapScriptTags('BrowseLinks.addElements(' . json_encode($this->elements) . ');');
$this->doc->JScode .= $this->doc->wrapScriptTags('
require(["TYPO3/CMS/Backend/BrowseLinks"], function(BrowseLinks) {
BrowseLinks.addElements(' . json_encode($this->elements) . ');
});');
// Ending page, returning content:
$content .= $this->doc->endPage();
$content = $this->doc->insertStylesAndJS($content);
......
......@@ -697,7 +697,10 @@ class SelectImage extends \TYPO3\CMS\Recordlist\Browser\ElementBrowser {
$files = $this->TBE_expandFolder($selectedFolder, $this->act === 'plain' ? self::PLAIN_MODE_IMAGE_FILE_EXTENSIONS : $GLOBALS['TYPO3_CONF_VARS']['GFX']['imagefile_ext'], $GLOBALS['BE_USER']->getTSConfigVal('options.noThumbsInRTEimageSelect'));
}
// Setup filelist indexed elements:
$this->doc->JScode .= $this->doc->wrapScriptTags('BrowseLinks.addElements(' . json_encode($this->elements) . ');');
$this->doc->JScode .= $this->doc->wrapScriptTags('
require(["TYPO3/CMS/Backend/BrowseLinks"], function(BrowseLinks) {
BrowseLinks.addElements(' . json_encode($this->elements) . ');
});');
// Wrap tree
$this->content .= '
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment