using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using Telerik.Sitefinity.Modules.Events.Web.UI;

namespace SitefinityWebApp.CalendarViewCustom
{
    public class ViewEventDialogCustom : ViewEventDialog
    {
        private string dateFormat;

        public string DateFormat
        {
            get
            {
                if (string.IsNullOrWhiteSpace(dateFormat))
                {
                    dateFormat = "dddd, MMMM d";
                }
                return dateFormat;
            }
            set { dateFormat = value; }
        }

        private string timeFormat;

        public string TimeFormat
        {
            get
            {
                if (string.IsNullOrWhiteSpace(timeFormat))
                {
                    timeFormat = "hh:mm tt";
                }
                return timeFormat;
            }
            set { timeFormat = value; }
        }

        public override IEnumerable<System.Web.UI.ScriptReference> GetScriptReferences()
        {
            var baseScripts = base.GetScriptReferences();
            var all = baseScripts.ToList();
            // not using embedded script
            all.Add(new System.Web.UI.ScriptReference("~/CalendarViewCustom/ViewEventDialogCustom.js"));
            return all;
        }

        public override IEnumerable<System.Web.UI.ScriptDescriptor> GetScriptDescriptors()
        {
            var @base = base.GetScriptDescriptors();
            var descriptor = @base.Last() as ScriptControlDescriptor;
            descriptor.AddProperty("dateFormat", this.DateFormat);
            descriptor.AddProperty("timeFormat", this.TimeFormat);

            return @base;
        }
    }
}


The dialog uses a modified JavaScript that gets the DateFormat and TimeFormat properties and changes the dates to these formats:



/// <reference name="MicrosoftAjax.js"/>
Type.registerNamespace("SitefinityWebApp.CalendarViewCustom");

SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom = function (element) {
    this._dateFormat = null;
    this._timeFormat = null;

    SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom.initializeBase(this, [element]);
};

SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom.prototype = {

    /* --------------------------------- set up and tear down --------------------------------- */

    initialize: function () {
        SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom.callBaseMethod(this, 'initialize');
    },

    dispose: function () {
        SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom.callBaseMethod(this, 'dispose');
    },

    _rebind: function () {
        jQuery(this.get_startDateLabel()).hide();
        jQuery(this.get_startTimeLabel()).hide();
        SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom.callBaseMethod(this, '_rebind');

        var startDate = this._appointment.get_start().format(this.get_dateFormat());
        jQuery(this.get_startDateLabel()).html(startDate);

        if (this._appointment.get_attributes().getAttribute("AllDay") != "True") {
            var startTime = this._appointment.get_start().format(this.get_timeFormat());
            jQuery(this.get_startTimeLabel()).html(startTime);
        }

        jQuery(this.get_startDateLabel()).show();
        jQuery(this.get_startTimeLabel()).show();
    },

    set_timeFormat: function (value) {
        this._timeFormat = value;
    },
    get_timeFormat: function () {
        return this._timeFormat;
    },

    set_dateFormat: function (value) {
        this._dateFormat = value;
    },
    get_dateFormat: function () {
        return this._dateFormat;
    },
};

// inherit from default control
SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom.registerClass('SitefinityWebApp.CalendarViewCustom.ViewEventDialogCustom',
    Telerik.Sitefinity.Modules.Events.Web.UI.ViewEventDialog);