Complete Writing Widget Tutorial?

Topics: Writing modules
Feb 27, 2011 at 2:01 PM

Is there a complete tutorial on writing Widgets around? I've been following the tutorials on writing module and content parts and the short widget sample in the docs, but when I add my Widget to a zone, my editor fields are not showing up and I can't figure out why. I could use an end to end sample, which includes an edit template as well.

Cheers,

Johan

Feb 27, 2011 at 4:06 PM

You’d better post more detailed info about the issue. So we can figure out what really happen. Maybe it’s not your fault, it’s just a bug.

Feb 27, 2011 at 4:13 PM

Sorry, but there's too much code and too many steps involved to post it here. In short - I followed the "Writing a Widget" sample on http://www.orchardproject.net/docs/Writing-a-widget.ashx, which says to first do the Map-sample for creating a content part on http://www.orchardproject.net/docs/Writing-a-content-part.ashx. Maybe I missed something, or maybe it didn't work because I had the Orchard.Web version and not the full source code. I just downloaded the full source and will try again and see if it works better this time.

Another thing - the orchard.exe program seems to crash for me with errors like "Failed to initialize Orchard session." and other session-related probs. I usually works if I try again though, but should it be like this?

 

Jul 9, 2011 at 2:04 AM

Did you ever resolve this issue?  I'm having the same problem.  I created a Content Part based on "Writing a Content Part" article, and added the "Writing a Widget" article modifications - and when I try to add a new widget in Orchard, the Editor Template fields do not appear.

 

Driver:

    public class SideBarDriver : ContentPartDriver
    {
        protected const string TemplateName = "Parts/SideBar";
        protected readonly INotifier _notifier;

        public SideBarDriver(INotifier notifier)
        {
            _notifier = notifier;
        }

        protected override DriverResult Display(SideBarPart part, string displayType, dynamic shapeHelper)
        {
            return ContentShape("Parts_SideBar",
                () => shapeHelper.Parts_SideBar(
                    HeaderText: part.HeaderText,
                    Text: part.Text));
        }

        protected override DriverResult Editor(SideBarPart part, dynamic shapeHelper)
        {
            return ContentShape("Parts_SideBar_Edit",
                () => shapeHelper.EditorTemplate(
                    TemplateName: TemplateName,
                    Model: part,
                    Prefix: Prefix));
        }

        protected override DriverResult Editor(SideBarPart part, IUpdateModel updater, dynamic shapeHelper)
        {
            updater.TryUpdateModel(part, Prefix, null, null);
            return Editor(part, shapeHelper);
        }


    }

Handler:

    public class SideBarHandler : ContentHandler
    {
        public SideBarHandler(IRepository repository)
        {
            Filters.Add(StorageFilter.For(repository));
        }
    }

Part class:

    public class SideBarPart : ContentPart
    {
        [Required]
        [DisplayName("SideBar Header")]
        public virtual string HeaderText
        {
            get { return Record.HeaderText; }
            set { Record.HeaderText = value; }
        }

        [Required]
        [DisplayName("Text")]
        public virtual string Text
        {
            get { return Record.Text; }
            set { Record.Text = value; }
        }
    }

Record:

    public class SideBarRecord : ContentPartRecord
    {
        public virtual string HeaderText { get; set; }
        public virtual string Text { get; set; }
    }

Migrations:

    public class Migrations : DataMigrationImpl
    {

        public int Create()
        {
            SchemaBuilder.CreateTable("SideBarRecord",
                table => table
                    .ContentPartRecord()
                    .Column("HeaderText")
                    .Column("Text")
                );

            ContentDefinitionManager.AlterPartDefinition(typeof(SideBarPart).Name,
                cfg => cfg.Attachable());

            return 1;
        }

        public int UpdateFrom1()
        {
            ContentDefinitionManager.AlterTypeDefinition("SideBarWidget",
                cfg => cfg
                    .WithPart("SideBarPart")
                    .WithPart("WidgetPart")
                    .WithPart("CommonPart")
                    .WithSetting("Stereotype", "Widget"));
            return 2;
        }
    }

Views\Parts\SideBar.cshtml:

<aside>

    <h4>@(Model.HeaderText)</h4>

    <p>@Display(Model.Text)</p>

</aside>

 

Views\EditorTemplates\Parts\SideBar.cshtml:

@model Fundable.Cms.Modules.CommonParts.Models.SideBarPart

 

<fieldset>

    <legend>SideBar Fields</legend>
    <div class="editor-label">@Html.LabelFor(m => m.HeaderText)</div>

    <div class="editor-field">@Html.EditorFor(m => m.HeaderText)</div>

    <div class="editor-label">@Html.LabelFor(m => m.Text)</div>

    <div class="editor-field">@Html.EditorFor(m => m.Text)</div>

</fieldset>

Jul 9, 2011 at 2:09 AM

Also I forgot to include the Placement.info file:

<Placement>

  <Place Parts_SideBar="SideBar:1" />

  <Place Parts_SideBar_Edit="Content:5" />

</Placement>

Jul 9, 2011 at 7:52 AM

I don't remember, but I think I got it working eventually by installing the full source of Orchard and work from that. It was a mistage to try and use the "web-version".

In the end we decided to code from scratch with asp.net mvc instead of using Orchard - it was too painful to modify and too slow.

Jul 9, 2011 at 8:10 PM

That worked.  Thanks for your help.