Customising Editors

The main content editor and generally other editors in Lynicon use the MVC default template system. You should be familiar with this to understand how the templating system works. The templates for the default editors can be found at /areas/lynicon/views/shared and /areas/lynicon/views/shared/editortemplates.  These include editor scripts for all the built-in content types in Lynicon.  If you want to alter these, that can be done freely.

If you want to create a custom template, the Razor view for this can be situated at /views/shared/editortemplates and this will get used for any subobject of whose type name is the same as the name of the template as usual.  The best strategy is usually to copy an existing built-in type template for a similar type and adapt as necessary.

To help with this, below is shown the Razor template for the standard String type, and some commentary to indicate how it works.

@using Lynicon.Utility

@if (ViewData.ModelMetadata.AdditionalValues.ContainsKey("StringLength"))
{
    ViewData["classes"] = (ViewData["classes"] ?? "") + " char-count";
}
<span class="text-display">@(Model == null || ViewData.TemplateInfo.FormattedModelValue == "" ? "---" : ViewData.TemplateInfo.FormattedModelValue)</span>
@Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, ViewData.ModelMetadata.IsReadOnly ?
(object)new { @class = "text-box single-line " + ViewData["classes"], @readonly = true } :
(object)new { @class = "text-box single-line " + ViewData["classes"] })

@if (ViewData.ModelMetadata.AdditionalValues.ContainsKey("StringLength"))
{
    <div class="character-count">@(Model == null || Model.ToString() == "" ? 0 : Model.ToString().Length)</div>
    @Html.RegisterScript("lyn-char-count", @"javascript:
        $(document).ready(function () {
            $('#edit').on('keyup', '.text-box.char-count', function () {
                $(this).next('.character-count').text(($(this).val() || '').length);
            });
        });", new List<string> { "jquery" })
}

This script does not declare a model type: this then means the model is any object.  This is necessary for the String template as it can be used to render unknown types, in which case they are converted to a string using ToString().

The template creates the display of the string as a span element, together with an input element which starts off hidden. A part of the global editor script file deals with this functionality, so you can't see it in the template file.  However, the template shows the technique of supplying a script to be run to add interactivity to the editor using Lynicon's requirement registration subsystem. In this case it shows the character count of the entered string.

The template varies its display if the ViewData.ModelMetadata.IsReadOnly flag is set - this can be done using the ReadOnlyAttribute on a content model field.  It also optionally adds the character count based on the AdditionalValues property which is a dictionary to which you can add values for the field for which you are rendering the editor by attaching an AdditionalMetadataAttribute to it.