Inline checkbox editor

Inline checkbox - EditorDescriptor

using System;
using System.Collections.Generic;
using EPiServer.Shell;
using EPiServer.Shell.ObjectEditing;
using EPiServer.Shell.ObjectEditing.EditorDescriptors;

namespace EpiServerThumbnail.Business.EditorDescriptors
{
    [EditorDescriptorRegistration(TargetType = typeof (bool), UIHint = UiHint)]
    [EditorDescriptorRegistration(TargetType = typeof(bool?), UIHint = UiHint)]
    public class InlineBoleanEditorDescriptor : BooleanEditorDescriptor
    {
        public const string UiHint = "InlineBoolean";

        public InlineBoleanEditorDescriptor()
        {
            this.ClientEditingClass = "epi.shell.widget.CheckBox";
        }

        public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes)
        {
            base.ModifyMetadata(metadata, attributes);
            metadata.CustomEditorSettings["uiWrapperType"] = UiWrapperType.Inline;
            metadata.CustomEditorSettings["uiType"] = "alloy.editors.inlineCheckbox";
        }
    }
}

Inline checkbox - Property Renderer

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CheckboxProperty.ascx.cs" Inherits="EpiServerThumbnail.Views.Properties.CheckboxProperty" %>

<div class="property-checkbox"><%# this.CurrentData == null || this.CurrentData.Value == false ?  "Maintenance message hidden": "Maintenance message visible"  %></div>

Inline checkbox - Widget

define([
        "dojo/_base/array",
        "dojo/_base/connect",
        "dojo/_base/declare",
        "dojo/_base/lang",
        "dojo/dom-construct",
        "dijit/focus",
        "dojo/on",
        "dojo/query",
        "dojo/dom-attr",
        "dojo/dom-style",
        "epi/dependency",
         "dijit/Tooltip",
        "epi/shell/widget/CheckBox"
    ],
    function(
        array,
        connect,
        declare,
        lang,
        domConstruct,
        focusUtil,
        on,
        query,
        domAttr,
        domStyle,
        dependency,
        Tooltip,
        CheckBox
    ) {
        return declare("alloy.editors.inlineCheckbox", [CheckBox], {
            
            labelNode: null,

            postCreate: function () {
                this.inherited(arguments);
                
                this.own(
                    on(this.checkbox, "change", lang.hitch(this, function(e) {
                        this._updateText();
                    }))
                );
                this.labelNode = domConstruct.toDom("<label style='font-weight: bold;'>Show/hide message</label>");
                domAttr.set(this.labelNode, "for", this.checkbox.id);
                domConstruct.place(this.labelNode, this.checkbox.domNode, "after");
                domStyle.set(this.domNode, "padding", "20px");
            },

            focus: function () {
                this._makeContentEditable();
                this.inherited(arguments);
            },

            isValid: function (/*Boolean*/ isFocused) {
                return true;
            },

            _makeContentEditable: function () {
                focusUtil.focus(this.domNode);
            },

            isEditing: function () {
                return false;
            },

            _updateText: function() {
                var value = this.get('value');
                var propertyText = query('.property-checkbox', this.get("overlayItem").sourceItemNode);

                if (value) {
                    propertyText.text("Maintenance message visible");
                } else {
                    propertyText.text("Maintenance message hidden");
                }
            }
        });
    });