UNPKG

gd-sprest-bs

Version:

SharePoint JavaScript, TypeScript and Web Components designed using the Bootstrap framework.

1,070 lines • 58.3 kB
"use strict"; var __assign = (this && this.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; Object.defineProperty(exports, "__esModule", { value: true }); exports.ListForm = void 0; var gd_sprest_1 = require("gd-sprest"); var core_1 = require("../core"); var datetime_1 = require("../datetime"); var field_1 = require("../field"); var richTextBox_1 = require("../richTextBox"); // Extend the list form exports.ListForm = gd_sprest_1.Helper.ListForm; // Method to get the fields to render var getFieldsToRender = function (props) { var fieldNames = []; // See if the "include" fields property is defined if (props.includeFields) { // Set the field names fieldNames = props.includeFields; } else { // Parse the fields for (var fieldName in props.info.fields) { // See if the "exclude" property is set if (props.excludeFields) { var renderFl = true; // Parse the fields for (var i = 0; i < props.excludeFields.length; i++) { // See if we are excluding this field if (props.excludeFields[i] == fieldName) { // Set the flag renderFl = false; break; } } // Skip this field, if we are not rendering it if (!renderFl) { continue; } } // Add the field name fieldNames.push(fieldName); } } // See if an event exists if (props.onGetFields) { // Call the event fieldNames = props.onGetFields(fieldNames); } // Return the field names return fieldNames; }; // Method to render the display control var renderDisplay = function (fieldName, props) { var control = null; var field = props.info.fields[fieldName]; var isRichText = field ? field.RichText : false; var value = props.info.fieldValuesAsText ? props.info.fieldValuesAsText[fieldName] || "" : ""; var html = props.info.fieldValuesAsHtml ? props.info.fieldValuesAsHtml[fieldName] || props.info.fieldValuesAsHtml[fieldName.replace(/\_/g, "_x005f_")] || "" : ""; // Ensure the field exists if (field == null) { // See if a value was found if (value || html) { // Return a read-only control return { data: value || html, isDisabled: true, label: fieldName, name: fieldName, type: core_1.Components.FormControlTypes.TextField, value: value || html }; } // Log console.warn("[List Form] Field '" + fieldName + "' does not exist. Check the list or query."); return control; } // See if we are hiding the field if (field.SchemaXml.indexOf('ShowInDisplayForm="FALSE"') > 0) { return control; } // See if this is an image field if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Image) { // Ensure a value exists if (value) { // Update the html try { var imgInfo = JSON.parse(value); html = "<img style='height: 64px; width: 64px;' src='" + imgInfo.serverRelativeUrl + "' alt='" + imgInfo.fileName + "' />"; } catch (_a) { } } } // Else, see if this is a note field else if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Note) { // Update the html html = html.replace(/\r?\n/g, '<br />') .replace(/&quot;/g, '"'); } // Else, see if this is a user field else if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.User) { // See if this is a multi-user selection if (field.AllowMultipleValues) { var userNames = []; // Parse the users var users = (props.info.item[fieldName] ? props.info.item[fieldName].results : null) || []; for (var j = 0; j < users.length; j++) { // Append the user name userNames.push(users[j].Title); } // Set the html value html = userNames.join('<br />\n'); } else { // Extract the text only for single selections var elUser = document.createElement("div"); elUser.innerHTML = html; html = elUser.innerText; } } // Else, see if this is a choice field else if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Choice || field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.MultiChoice) { // Update the html html = value; } // Set the control control = { data: html, description: field.Description, isDisabled: true, label: field.Title, name: field.InternalName, type: core_1.Components.FormControlTypes.TextField, value: html }; // Update the type, based on the field switch (field.FieldTypeKind) { case gd_sprest_1.SPTypes.FieldType.DateTime: // Set the time flag control.showTime = field.DisplayFormat == gd_sprest_1.SPTypes.DateFormat.DateTime ? true : false; // Set the type control.type = datetime_1.DateTimeControlType; break; case gd_sprest_1.SPTypes.FieldType.Lookup: // Ensure a value exists if (html) { // Create an element to store the html var elLookup = document.createElement("div"); elLookup.innerHTML = html; // Update the value to be text html = elLookup.innerText; control.data = html; control.value = html; } break; case gd_sprest_1.SPTypes.FieldType.Note: // See if this is a rich text field if (isRichText) { // Set the properties control.toolbarType = richTextBox_1.RichTextBoxTypes.None; control.type = richTextBox_1.RichTextBoxControlType; } else { // Set the type control.type = core_1.Components.FormControlTypes.TextArea; } break; case gd_sprest_1.SPTypes.FieldType.URL: // Set the value var urlValue = props.info.item[fieldName]; html = urlValue ? urlValue.Url : html; control.value = html; break; case gd_sprest_1.SPTypes.FieldType.User: // Set the type control.type = field.AllowMultipleValues ? core_1.Components.FormControlTypes.TextArea : control.type; break; } // Detect html if (/<*>/g.test(html)) { var isMultiLine = html.indexOf("<br />") >= 0 ? true : false; // See if it's an image if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Image) { // Set the rendered event control.onControlRendered = function (control) { // Override the html rendered control.el.innerHTML = html; }; } // Else, ensure this isn't a rich text field or multi-line else if (!isRichText && !isMultiLine) { // Update the control to be read-only control.type = core_1.Components.FormControlTypes.Readonly; // Set the rendered event control.onControlRendered = function (control) { // Get the target element var elTarget = control.el.querySelector("input") || control.el; // Override the html rendered elTarget.innerHTML = control.props.data; }; } else { // Update the html break line html = html.replace(/<br \/>/g, '\n'); control.data = html; control.value = html; } } // Else, detect xml else if (/&lt;|&gt;|&amp;|&quot;/i.test(html)) { // Update the value control.value = html.replace(/&lt;/ig, '<') .replace(/&gt;/ig, '>') .replace(/&amp;/ig, '&') .replace(/&quot;/ig, '"'); } // Return the control return control; }; // Method to generate the attachments row var generateAttachmentsControl = function (props) { // See if we are rendering attachments var displayAttachments = typeof (props.displayAttachments) === "boolean" ? props.displayAttachments : true; if (props.info.attachments && displayAttachments) { // Render the attachments return { id: "ListFormAttachments", label: "Attachments", name: "Attachments", onControlRendered: function (control) { var items = []; // Parse the attachments for (var i = 0; i < props.info.attachments.length; i++) { var attachment = props.info.attachments[i]; // Add the item items.push({ buttons: [{ className: "me-1", data: attachment.ServerRelativeUrl, isSmall: true, text: attachment.FileName, onClick: function (btn) { // Open the attachment in a new tab window.open(btn.data, "_blank"); } }] }); } // Render a toolbar core_1.Components.Toolbar({ el: control.el, items: items }); } }; } }; // Method to render a display form for an item exports.ListForm.renderDisplayForm = function (props) { var form = null; var totalControls = 0; // Render a loading message var progress = core_1.Components.Progress({ el: props.el, isAnimated: true, isStriped: true, label: "Loading the Form", size: 100 }); var mapper = {}; var rows = []; // Get the fields to render var fieldNames = getFieldsToRender(props); // Parse the fields to render for (var i = 0; i < fieldNames.length; i++) { var fieldName = fieldNames[i]; // See if this is the attachment field if (fieldName == "Attachments") { // Generate the attachments control var ctrlAttachments = generateAttachmentsControl(props); if (ctrlAttachments) { rows.push({ columns: [{ control: ctrlAttachments }] }); } // Increment the total controls totalControls++; // Continue the loop continue; } // Generate the control var control = renderDisplay(fieldName, props); if (control) { // Update the mapper mapper[fieldName] = control; // Add the row rows.push({ columns: [{ control: control }] }); // Increment the total controls totalControls++; } } // See if there is a template if (props.template) { // Reset the total controls totalControls = 0; // Updates the control var updateControl = function (refControl) { // Get the control from the mapper var control = refControl ? mapper[refControl.name] : null; // Ensure the controls exists if (control && refControl) { // Parse the control keys for (var key in control) { // Skip if a value is already defined if (refControl[key]) { continue; } // Update the property refControl[key] = control[key]; } // Update the mapper mapper[refControl.name] = refControl; } }; // Parse the template for (var i = 0; i < props.template.length; i++) { var row = props.template[i]; // Parse the columns if there are columns var columns = row.columns || []; for (var j = 0; j < columns.length; j++) { var column = columns[j]; // Update the control updateControl(column.control); // Increment the total controls totalControls++; } } } // Remove the progress bar progress.el.parentElement ? progress.el.parentElement.removeChild(progress.el) : null; // Counter for each control var ctrlCounter = 0; // Render the form form = core_1.Components.Form({ el: props.el, className: props.className, groupClassName: props.groupClassName, rowClassName: props.rowClassName, onControlRendered: function (control) { // See if all of the controls have been rendered if (++ctrlCounter == totalControls) { // See if an event exists if (props.onFormRendered) { // Execute the form rendered event in another thread setTimeout(function () { props.onFormRendered(form); }, 10); } } // Return the control rendered event return props.onControlRendered ? props.onControlRendered(control, props.info.fields[control.props.name]) : null; }, onControlRendering: function (control) { return props.onControlRendering ? props.onControlRendering(control, props.info.fields[control.name]) : null; }, rows: props.template || rows }); // Execute the assign to event props.assignTo ? props.assignTo(form) : null; // Return the form informaiton return { get el() { return form ? form.el : null; }, getControl: function (fieldName) { return form ? form.getControl(fieldName) : null; } }; }; // Render the edit form exports.ListForm.renderEditForm = function (props) { var customControls = []; var mapper = {}; var rows = []; var totalControls = 0; var value = {}; var attachments = { delete: [], new: [] }; // Method to add a refresh alert var addRefreshLink = function () { // Ensure the link doesn't already exist if (props.el.querySelector(".refresh-btn")) { return; } // Create the refresh button var alert = core_1.Components.ButtonGroup({ className: "refresh-btn", buttonType: core_1.Components.ButtonTypes.Danger, buttons: [ { text: "Refresh Form", onClick: function () { // Clear the element and reload the form props.el.innerHTML = ""; // Render the form exports.ListForm.renderEditForm(props); } }, { text: "Refresh Page", onClick: function () { // Refresh the page document.location.href = document.location.href; } } ] }); // Add the element at the top props.el.insertBefore(alert.el, props.el.children[0]); }; // Method to remove the attachments var removeAttachments = function (info) { // Return a promise return new Promise(function (resolve, reject) { // Ensure attachments exists if (attachments.delete.length == 0) { resolve(); return; } // Get the web props.info.list.ParentWeb().execute(function (web) { // Parse the attachments gd_sprest_1.Helper.Executor(attachments.delete, function (attachment) { // Get the attachment file web.getFileByServerRelativeUrl(attachment.ServerRelativeUrl).delete().execute(); // Parse the attachments for (var i = 0; i < props.info.attachments.length; i++) { // See if this is the target attachment if (props.info.attachments[i].ServerRelativeUrl == attachment.ServerRelativeUrl) { // Remove this item props.info.attachments.splice(i, 1); break; } } }).then(function () { // Wait for the files to be deleted web.done(function () { // Clear the attachments attachments.delete = []; // Resolve the promise resolve(); }); }); }); }); }; // Method to save the attachments var saveAttachments = function (info) { // Return a promise return new Promise(function (resolve, reject) { // Ensure attachments exists if (attachments.new.length == 0) { resolve(); return; } // Parse the attachments gd_sprest_1.Helper.Executor(attachments.new, function (attachment) { // Get the item's attachments props.info.list.Items(info.item.Id).AttachmentFiles() // Add the file .add(attachment.name, attachment.data) // Execute the request .execute(function (attachment) { // Ensure attachments exist info.attachments = info.attachments || []; // Append the attachment info.attachments.push(attachment); }); }).then(function () { // Wait for the files to upload props.info.list.done(function () { // Clear the attachments attachments.new = []; // Resolve the promise resolve(); }); }); }); }; // Method to upload the images var images = []; var uploadImages = function (info) { // Return a promise return new Promise(function (resolve) { var values = {}; // Ensure we have images if (images.length == 0) { // Do nothing resolve(values); return; } // Get the list folder gd_sprest_1.Helper.ListFormField.getOrCreateImageFolder(info).then(function (fld) { // Removes the existing image var removeExisting = function (value) { // Return a promise return new Promise(function (resolve) { // Try to get the image info var imageInfo = null; try { imageInfo = JSON.parse(value); } catch (_a) { } // Ensure the info exists if (imageInfo) { // See if the file exists fld.Files(imageInfo.fileName).execute( // Exists function (file) { // Delete the file file.delete().execute(function () { // Resolve the request resolve(null); }); }, // Doesn't exist function () { // Resolve the request resolve(null); }); } else { // Resolve the request resolve(null); } }); }; // Validates the list name var validateFileName = function (fileName) { // Return a promise return new Promise(function (resolve) { // Get the file name w/out the extension var info = fileName.toLowerCase().split('.'); var fileExt = info[info.length - 1]; var fileNameNoExt = ""; for (var i = 0; i < info.length - 1; i++) { fileNameNoExt += info[i]; } // Get the files with a similar name fld.Files().query({ Filter: "startswith(Name, '" + fileNameNoExt + "')", Top: 5000 }).execute(function (files) { var isValid = true; var counter = -1; var validFileName = null; // See if no files were found if (files.results.length == 0) { // Resolve the request resolve(fileName); return; } // Loop until it's valid do { // Reset the flag and file name validFileName = fileNameNoExt + (++counter == 0 ? "" : counter) + "." + fileExt; isValid = true; // Parse the files for (var i = 0; i < files.results.length; i++) { var file = files.results[i]; // See if there is a match if (file.Name.toLowerCase() == validFileName) { // Set the flag isValid = false; break; } } } while (!isValid); // Resolve the request resolve(validFileName); }); }); }; // Parse the images gd_sprest_1.Helper.Executor(images, function (imageInfo) { // See if this is a file that needs to be uploaded if (imageInfo.name && imageInfo.data && imageInfo.fieldName) { // Return a promise return new Promise(function (resolve) { // Remove the existing image removeExisting(info.item ? info.item[imageInfo.fieldName] : null).then(function () { // Validate the name validateFileName(imageInfo.name).then(function (fileName) { // Upload the file fld.Files().add(fileName, true, imageInfo.data).execute(function (file) { // Update the field value values[imageInfo.fieldName] = JSON.stringify({ fieldId: imageInfo.fieldId, fieldName: imageInfo.fieldName, fileName: file.Name, id: file.UniqueId, nativeFile: {}, serverRelativeUrl: file.ServerRelativeUrl, type: "thumbnail" }); // Resolve the request resolve(null); }); }); }); }); } }).then(function () { // Resolve the request resolve(values); }); }); }); }; // Render a loading message var progress = core_1.Components.Progress({ el: props.el, isAnimated: true, isStriped: true, label: "Loading the Form", size: 100 }); // Generates the attachments row var controlAttachments = null; var generateAttachmentsRow = function () { // See if we are rendering attachments var displayAttachments = typeof (props.displayAttachments) === "boolean" ? props.displayAttachments : true; var attachmentsExist = props.info.item == null ? true : (props.info.attachments ? true : false); if (attachmentsExist && displayAttachments) { // Set a default field // This will help w/ the onControlRendering/ed events to not have a null value for this parameter props.info.fields["Attachments"] = {}; // Create the attachments control controlAttachments = { id: "ListFormAttachments", label: "Attachments", name: "Attachments", onControlRendered: function (control) { // Render a toolbar var toolbar = core_1.Components.Toolbar({ el: control.el, items: [{ buttons: [{ className: "upload-btn me-1", isSmall: true, text: "Upload", type: core_1.Components.ButtonTypes.Secondary, onClick: function (btn, ev) { var elUpload = ev.currentTarget; // Display an upload dialog gd_sprest_1.Helper.ListForm.showFileDialog().then(function (fileInfo) { // Get the buttons and remove any duplicates var buttons = elUpload.parentElement.querySelectorAll(".btn"); for (var i = 0; i < buttons.length; i++) { var button = buttons[i]; // See if this is the associated button if (button.innerText.replace(/X$/, '') == fileInfo.name) { // Get the badge var badge = button.querySelector(".badge"); if (badge) { // Remove the button badge.click(); } break; } } // Save the file information attachments.new.push(fileInfo); // Append the attachment elUpload.parentElement.appendChild(core_1.Components.Popover({ isDismissible: true, type: core_1.Components.PopoverPlacements.Bottom, btnProps: { className: "me-1 file-attachment", isSmall: true, text: fileInfo.name }, options: { content: core_1.Components.Button({ data: fileInfo, isSmall: true, text: "Remove", type: core_1.Components.ButtonTypes.Danger, onClick: function (btn, ev) { var fileName = btn.data.name; // Parse the array for (var i = 0; i < attachments.new.length; i++) { // See if this is the target attachment if (attachments.new[i].name == fileName) { // Remove this attachment attachments.new.splice(i, 1); break; } } // Get the files var files = btnGroup.querySelectorAll(".btn.file-attachment"); for (var i = 0; i < files.length; i++) { var file = files[i]; // See if this is the target button if (file.innerText == fileName) { // Remove this popover file.parentElement.removeChild(file); break; } } } }).el } }).el); }); } }] }] }); // Get the button group var btnGroup = toolbar.el.querySelector(".btn-group"); if (btnGroup) { // Parse the attachments var itemAttachments = props.info.attachments || []; for (var i = 0; i < itemAttachments.length; i++) { var attachment = itemAttachments[i]; // Add the attachment btnGroup.appendChild(core_1.Components.Popover({ isDismissible: true, type: core_1.Components.PopoverPlacements.Bottom, btnProps: { className: "me-1 file-attachment", isSmall: true, text: attachment.FileName, }, options: { content: core_1.Components.ButtonGroup({ buttons: [ { data: attachment, isSmall: true, text: "Remove", type: core_1.Components.ButtonTypes.Danger, onClick: function (btn, ev) { var attachment = btn.data; // Add this file for deletion attachments.delete.push(attachment); // Get the files var files = btnGroup.querySelectorAll(".btn.file-attachment"); for (var i_1 = 0; i_1 < files.length; i_1++) { var file = files[i_1]; // See if this is the target button if (file.innerText == attachment.FileName) { // Remove this popover file.parentElement.removeChild(file); break; } } } }, { data: attachment, isDisabled: attachment.ServerRelativeUrl ? false : true, isSmall: true, text: "View", type: core_1.Components.ButtonTypes.Primary, onClick: function (btn, ev) { var fileUrl = btn.data.ServerRelativeUrl; // Show the file in a new tab window.open(fileUrl, "_blank"); } } ] }).el } }).el); } } } }; // Render the attachments rows.push({ columns: [{ control: controlAttachments }] }); } }; // Get the fields to render var fieldNames = getFieldsToRender(props); // Parse the fields to render for (var i = 0; i < fieldNames.length; i++) { var fieldName = fieldNames[i]; var field = props.info.fields[fieldName]; // See if this is the attachment field if (fieldName == "Attachments") { // Generate the attachments row generateAttachmentsRow(); // Increment the total controls totalControls++; // Check the next field continue; } // Ensure the field exists if (field == null) { // Log console.error("[List Form] Field '" + fieldName + "' does not exist. Check the list or query."); continue; } // See if the item exists value[fieldName] = null; if (props.info.item) { // Set the value value[fieldName] = props.info.item[fieldName]; // See if this is a lookup or user field if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Lookup || field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.User) { // Update the value value[fieldName] = value[fieldName + "Id"] || (value[fieldName] ? value[fieldName].Id : null) || value[fieldName]; } // See if this is a file leaf ref if (fieldName == "FileLeafRef") { // Update the value value[fieldName] = value[fieldName] || props.info.item.Title; } } // Determine the control mode var controlMode = props.controlMode || (props.info.item ? gd_sprest_1.SPTypes.ControlMode.Edit : gd_sprest_1.SPTypes.ControlMode.New); // See if this is an edit form and we are hiding this field if (controlMode == gd_sprest_1.SPTypes.ControlMode.Edit && field.SchemaXml.indexOf('ShowInEditForm="FALSE"') > 0) { continue; } // See if this is a new form and we are hiding this field if (controlMode == gd_sprest_1.SPTypes.ControlMode.New && field.SchemaXml.indexOf('ShowInNewForm="FALSE"') > 0) { continue; } // See if thi sis a new form and this is an associated lookup field if (controlMode == gd_sprest_1.SPTypes.ControlMode.New && field.IsDependentLookup) { continue; } // See if this is a display form and we are hiding this field if (controlMode == gd_sprest_1.SPTypes.ControlMode.Display && field.SchemaXml.indexOf('ShowInDisplayForm="FALSE"') > 0) { continue; } // See if this is a read-only field if (field.ReadOnlyField) { // Do not render in the new form if (props.controlMode == gd_sprest_1.SPTypes.ControlMode.New) { continue; } } // Do not render a hidden taxonomy field if (field.Hidden && field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Note && /_0$/.test(field.Title)) { continue; } // See if this is an invalid field type if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Invalid) { // Ensure it's not a taxonomy field if (!/^TaxonomyFieldType/.test(field.TypeAsString)) { continue; } } // Else, see if this is a calculated column else if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Calculated) { // Do not render in the new/edit forms if (props.controlMode != gd_sprest_1.SPTypes.ControlMode.Display) { continue; } } // See if this is a lookup field var lookupFilter = null; if (field.FieldTypeKind == gd_sprest_1.SPTypes.FieldType.Lookup) { // Call the filter event lookupFilter = props.onFilterLookupField ? props.onFilterLookupField(field) : null; } // See if there is a custom event for setting the value if (props.onSetFieldDefaultValue) { // Call the event to override the value value[fieldName] = props.onSetFieldDefaultValue(field, value[fieldName]); } // Create the control var fieldControl = (0, field_1.Field)({ controlMode: props.controlMode, field: field, listInfo: props.info, lookupFilter: lookupFilter, value: value[fieldName], onControlRendered: function (control, field) { // Update the mapper mapper[field.InternalName].control = control; }, onValidate: props.onValidate, onError: function (msg) { // Add the refresh link addRefreshLink(); // Call the event props.onError ? props.onError(msg) : null; } }); // Update the mapper mapper[fieldName] = fieldControl; // Add the row rows.push({ columns: [{ control: fieldControl.controlProps }] }); // Increment the total controls totalControls++; } // See if there is a template if (props.template) { // Reset the total controls totalControls = 0; // Method to handle internal and custom events var createEvent_1 = function (event, control, templateControl) { var templateEvent = templateControl[event]; // Set the event return function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } var controlProps = args[0]; // Call the events control[event].apply(control, args); templateEvent.apply(void 0, args); // Update the mapper mapper[controlProps.name] ? mapper[controlProps.name].controlProps = controlProps : null; }; }; // Method to update the template control var updateControl = function (templateControl) { // Get the control from the mapper var control = templateControl && mapper[templateControl.name] ? mapper[templateControl.name].controlProps : null; // See if this is a reference to the attachments if (templateControl && templateControl.name == "Attachments") { control = templateControl.isDisabled || templateControl.isReadonly ? generateAttachmentsControl(props) : controlAttachments; } // Ensure the controls exists if (control && templateControl) { // Parse the control keys for (var key in control) { // Skip if a value is already defined if (typeof (templateControl[key]) !== "undefined") { // See if this is an internal event if (key == "onControlRendering" || key == "onControlRendered") { // Create a new event to call both internal and custom events templateControl[key] = createEvent_1(key, control, templateControl); } // Skip this property continue; } // Update the property templateControl[key] = control[key]; } // Update the mapper mapper[templateControl.name] ? mapper[templateControl.name].controlProps = templateControl : null; } }; // Parse the template for (var i = 0; i < props.template.length; i++) { var row = props.template[i]; // Parse the columns if there are columns var columns = row.columns || []; for (var j = 0; j < columns.length; j++) { var column = columns[j]; // Update the control updateControl(column.control); // Increment the total controls totalControls++; } } } // Remove the progress bar progress.el.parentElement ? progress.el.parentElement.removeChild(progress.el) : null; // Counter for each control var ctrlCounter = 0; // Render the form var form = core_1.Components.Form({ el: props.el, className: props.className, groupClassName: props.groupClassName, rowClassName: props.rowClassName, onControlRendered: function (control) { var _a; // Ensure the control is set var field = mapper[(_a = control.props) === null || _a === void 0 ? void 0 : _a.name]; if (field && field.control == null) { field.setControl(control); } // See if all of the controls have been rendered if (++ctrlCounter == totalControls) { // See if an event exists if (props.onFormRendered) { // Execute the form rendered event in another thread setTimeout(function () { props.onFormRendered(form); }, 10); } } // Return the event return props.onControlRendered ? props.onControlRendered(control, props.info.fields[control.props.name]) : null; }, onControlRendering: function (control) { var findTemplateControl = function (ctrlName) { // Parse the template for (var i = 0; i < props.template.length; i++) { var row = props.template[i]; // Parse the columns if there are columns var columns = row.columns || []; for (var j = 0; j < columns.length; j++) { var column = columns[j]; // See if this is the control if (column.control && column.control.name == ctrlName) { return column.control; } } } // Not found return null; }; var updateReadOnly = function (control) { // See if this control is readonly if (control.isReadonly && control.name) { // Get the control display properties var dispControl = control.name == "Attachments" ? generateAttachmentsControl(props) : renderDisplay(control.name, props); if (dispControl) { var ctrlTemplate = props.template ? findTemplateControl(control.name) : null; // Update the properties control.data = ctrlTemplate ? ctrlTemplate.data : dispControl.data; control.label = ctrlTemplate ? ctrlTemplate.label : dispControl.label; control.showTime = ctrlTemplate ? ctrlTemplate.showTime : dispControl.showTime; control.type = ctrlTemplate ? ctrlTemplate.type : dispControl.type; control.value = ctrlTemplate ? ctrlTemplate.value : dispControl.value; } } }; // Execute the rendering event var field = props.info.fields[control.name] || {}; var returnVal = props.onControlRendering ? props.onControlRendering(control, field) : null; if (returnVal && returnVal.then) { // Wait for the event to complete returnVal.then(function (ctrlProps) { // Update the properties updateReadOnly(ctrlProps || control); }); } else { // Update the properties updateReadOnly(control); } }, rows: props.template || rows, value: value }); // Method to get the values var getValues = function () { var values = {}; // See if the content type was set if (props.info.contentType) { // Set the content type id values["ContentTypeId"] = props.info.contentType.Id.StringValue; } // Clear the image values images = []; // Parse the fields for (var fieldNam