<%--
/**
 * Copyright (c) 2000-present Liferay, Inc. All rights reserved.
 *
 * The contents of this file are subject to the terms of the Liferay Enterprise
 * Subscription License ("License"). You may not use this file except in
 * compliance with the License. You can obtain a copy of the License by
 * contacting Liferay, Inc. See the License for the specific language governing
 * permissions and limitations under the License, including but not limited to
 * distribution rights of the Software.
 *
 *
 *
 */
--%>

<%
DLFilePicker dlFilePicker = dlEditFileEntryDisplayContext.getDLFilePicker(liferayPortletResponse.getNamespace() + "onFilePick");
%>

<c:choose>
	<c:when test="<%= dlFilePicker == null %>">
		<label class="control-label">
			<liferay-ui:message key="file-upload" />
		</label>

		<div class="form-group">
			<aui:button value="select-file" />

			<react:component
				module="document_library/js/FileEntryPicker"
				props='<%=
					HashMapBuilder.<String, Object>put(
						"maxFileSize", dlEditFileEntryDisplayContext.getMaximumUploadSize()
					).put(
						"maxMimeTypeSize", dlEditFileEntryDisplayContext.getAllMimeTypeSizeLimit()
					).put(
						"namespace", liferayPortletResponse.getNamespace()
					).put(
						"validExtensions", StringUtil.merge(dlConfiguration.fileExtensions())
					).build()
				%>'
			/>
		</div>
	</c:when>
	<c:otherwise>
		<c:if test="<%= dlFilePicker.isCustomizedFileButtonVisible() %>">
			<label class="control-label">
				<liferay-ui:message key="file-upload" />
			</label>

			<aui:field-wrapper>
				<aui:button cssClass="customized-file-button disabled" disabled="<%= true %>" name="file" value="select-file" />

				<span class="inline-item inline-item-middle">
					<img id="<portlet:namespace />pickButtonIcon" src="<%= GetterUtil.getString(dlFilePicker.getCurrentIconURL()) %>" />
				</span>

				<small><strong id="<portlet:namespace />pickButtonTitle"><%= GetterUtil.getString(dlFilePicker.getCurrentTitle()) %></strong></small>
			</aui:field-wrapper>
		</c:if>

		<%
		PortalIncludeUtil.include(pageContext, dlFilePicker::renderFilePicker);
		%>

		<aui:script sandbox="<%= true %>">
			window.<portlet:namespace />onFilePick = function (fields) {
				var documentIconURL = fields['<%= dlFilePicker.getIconFieldName() %>'];

				var pickButtonIcon = document.getElementById(
					'<portlet:namespace />pickButtonIcon'
				);

				if (pickButtonIcon) {
					pickButtonIcon.setAttribute('src', documentIconURL);
				}

				var title = fields['<%= dlFilePicker.getTitleFieldName() %>'];

				var pickButtonTitleElement = document.getElementById(
					'<portlet:namespace />pickButtonTitle'
				);

				if (pickButtonTitleElement) {
					pickButtonTitleElement.innerHTML = title || fields['URL'];
				}

				var titleElement = document.getElementById('<portlet:namespace />title');

				if (titleElement && !titleElement.value) {
					titleElement.value = title;
				}

				var fileNameElement = document.getElementById(
					'<portlet:namespace />fileName'
				);

				var fileName = fields['<%= dlFilePicker.getFileNameFieldName() %>'];

				if (fileNameElement) {
					fileNameElement.value = fileName || '';
				}

				var documentDescription =
					fields['<%= dlFilePicker.getDescriptionFieldName() %>'];

				var documentDescriptionElement = document.getElementById(
					'<portlet:namespace />description'
				);

				if (documentDescriptionElement && !documentDescriptionElement.value) {
					documentDescriptionElement.value = documentDescription;
				}

				var ddmFieldWrappers = document.querySelectorAll(
					'#<portlet:namespace />fm .lfr-ddm-form-container .ddm-field'
				);

				var urlTitleElement = document.getElementById(
					'<portlet:namespace />urlTitle'
				);

				if (
					titleElement &&
					titleElement.value &&
					urlTitleElement &&
					!urlTitleElement.value
				) {
					urlTitleElement.value = titleElement.value.replace(/\.[^.]*$/, '');
				}

				Array.prototype.forEach.call(ddmFieldWrappers, (ddmFieldWrapper) => {
					var fieldName = ddmFieldWrapper.dataset.fieldName;

					var input = ddmFieldWrapper.querySelector('input');

					if (input) {
						input.value = fields[fieldName];
					}
				});
			};

			<%= dlFilePicker.getJavaScript() %>;

			var customizedFileButton = document.getElementById('<portlet:namespace />file');

			if (customizedFileButton) {
				var filePicker = new <%= dlFilePicker.getJavaScriptModuleName() %>(() => {
					Liferay.Util.toggleDisabled(customizedFileButton, false);
				});

				customizedFileButton.addEventListener(
					'click',
					filePicker['<%= dlFilePicker.getOnClickCallback() %>'].bind(filePicker)
				);
			}
		</aui:script>
	</c:otherwise>
</c:choose>