More in this section

Forums / General Discussions / Admin View in Sitefinity 4

Admin View in Sitefinity 4

4 posts, 0 answered
  1. Luke Durrant
    Luke Durrant avatar
    10 posts
    Registered:
    11 Sep 2009
    18 Mar 2011
    Link to this post
    Does the ProviderControlPanel architecture still exist?
    as per ivan's old blog post
    http://www.sitefinity.com/blogs/ivan/posts/09-04-22/reference_most_important_base_classes_-_providercontrolpanel_class.aspx

    Seems like everything has moved around and I'm feeling mega confused.

    Normally inside the ProviderControlPanel class we'd have something like this

    /// <summary>
    /// Summary description for PromotionsControlPanel
    /// </summary>
    public class PromotionsControlPanel : ProviderControlPanel<PromotionsControlPanel>
    {
        public PromotionsControlPanel()
            : base(false)
        {
             
        }
         
        protected override void CreateViews()
        {
            AddView<PromotionView>();
            AddView("PermissionsView", "~/Views/Backend/PermissionsView.ascx", "Permissions", string.Empty, string.Empty, null);
        }
     
        protected override void CreateCommandPanelsFromUserControls(string viewMode, System.Collections.Generic.List<string> userControls, System.Collections.Generic.List<Telerik.Web.ICommandPanel> list)
        {
            if (userControls == null)
                userControls = new List<string>();
     
            userControls.Add("~/Modules/Promotions/Views/Backend/CommandPanel.ascx");
     
            base.CreateCommandPanelsFromUserControls(viewMode, userControls, list);
        }
     
        public PromotionsManager Manager
        {
            get
            {
                if (this.manager == null)
                    this.manager = new PromotionsManager();
                return this.manager;
            }
        }
     
        private PromotionsManager manager;
    }

    With the PromotionView being defined as follows

    public class PromotionView : ViewModeControl<PromotionsControlPanel>
       {
           /// <summary>
           /// Creates the child views for the contacts view
           /// </summary>
           protected override void CreateViews()
           {
               AddView("ListView", "~/Views/Backend/Promotion/PromotionsListView.ascx", "Promotion List", "Listing Promotion", string.Empty, null);
               AddView("EditView", "~/Views/Backend/Promotion/PromotionsEditView.ascx", "Edit Promotion", "Edit Promotion", string.Empty, null);
               AddView("InsertView", "~/Views/Backend/Promotion/PromotionsInsertView.ascx", "Create Promotion", "Create Promotion", string.Empty, null);
           }
       }


    Is it possible at all to do a similar sort of thing in Sitefinity 4 if so how source code we be very helpful.


  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    12 Sep 2017
    18 Mar 2011
    Link to this post
    Hi Luke ,

    In 4.0 we use definition classes and the architecure is completely diferent from what you see in 3.x. In 4.0 we use RESTful services and client side binders. The data is persisted by Telerik Open Access which is responsible for database management.

    In the definition you have

    1. ListView - it is represented by MasterGridViewElement

    var moduleGridView = new MasterGridViewElement(backendContentView.ViewsConfig)
              {
                  ViewName = ModuleDefinitions.BackendListViewName,
                  ViewType = typeof(MasterGridView),
                  AllowPaging = true,
                  DisplayMode = FieldDisplayMode.Read,
                  ItemsPerPage = 50,
                  ResourceClassId = typeof(ModuleResources).Name,
                  ExtendedSearchFields = "Title",
                  SortExpression = "Title ASC",
                  Title = "Title",
                  WebServiceBaseUrl = "~/Sitefinity/Services/Content/ContentItemService.svc/"
              }

    This view is populated by a WCFRestful services that you should create to bind the items when you work with custom modules.

    2. Then you have a mode of the grid where you populate the client data like - status, author, title etc

    var gridMode = new GridViewModeElement(moduleGridView .ViewModesConfig)
           {
               Name = "Grid"
           };
           (moduleGridView .ViewModesConfig.Add(gridMode);
      
           DataColumnElement titleColumn = new DataColumnElement(gridMode.ColumnsConfig)
           {
               Name = "Title",
               HeaderText = Res.Get<Labels>().Title,
               HeaderCssClass = "sfTitleCol",
               ItemCssClass = "sfTitleCol",
               ClientTemplate = @"<a sys:href='javascript:void(0);' sys:{{ 'sf_binderCommand_edit sfItemTitle sf' + UIStatus.toLowerCase()}}"">
                   <strong>{{Title}}</strong>
                   <span class='sfStatusLocation'>{{Status}}</span></a>"
           };
           gridMode.ColumnsConfig.Add(titleColumn);
      
           var translationsColumn = new DynamicColumnElement(gridMode.ColumnsConfig)
           {
               Name = "Translations",
               HeaderText = Res.Get<LocalizationResources>().Translations,
               DynamicMarkupGenerator = typeof(LanguagesColumnMarkupGenerator),
               ItemCssClass = "sfLanguagesCol",
               HeaderCssClass = "sfLanguagesCol"
           };
           translationsColumn.GeneratorSettingsElement = new LanguagesColumnMarkupGeneratorElement(translationsColumn)
           {
               LanguageSource = LanguageSource.Frontend,
               ItemsInGroupCount = DefinitionsHelper.LanguageItemsPerRow,
               ContainerTag = "div",
               GroupTag = "div",
               ItemTag = "div",
               ContainerClass = string.Empty,
               GroupClass = string.Empty,
               ItemClass = string.Empty
           };
           gridMode.ColumnsConfig.Add(translationsColumn);
      
           ActionMenuColumnElement actionsColumn = new ActionMenuColumnElement(gridMode.ColumnsConfig)
           {
               Name = "Actions",
               HeaderText = Res.Get<Labels>().Actions,
               HeaderCssClass = "sfMoreActions",
               ItemCssClass = "sfMoreActions"
           };
           DefinitionsHelper.FillActionMenuItems(actionsColumn.MenuItems, actionsColumn, typeof(MyCustomResources).Name);
           gridMode.ColumnsConfig.Add(actionsColumn);
      
           DataColumnElement authorColumn = new DataColumnElement(gridMode.ColumnsConfig)
           {
               Name = "Author",
               HeaderText = Res.Get<Labels>().Author,
               ClientTemplate = "<span>{{Author}}</span>",
               HeaderCssClass = "sfRegular",
               ItemCssClass = "sfRegular"
           };
           gridMode.ColumnsConfig.Add(authorColumn);
      
           DataColumnElement dateColumn = new DataColumnElement(gridMode.ColumnsConfig)
           {
               ///.format('dd MMM, yyyy hh:mm:ss')
               Name = "Date",
               HeaderText = Res.Get<Labels>().Date,
               ClientTemplate = "<span>{{ (DateCreated) ? DateCreated.sitefinityLocaleFormat('dd MMM, yyyy hh:mm:ss'): '-' }}</span>",
               HeaderCssClass = "sfDate",
               ItemCssClass = "sfDate"
           };
           gridMode.ColumnsConfig.Add(dateColumn);


    3. You should have decision screen - create item, edit item which are equivalents of the views in 3.x

    DecisionScreenElement dsElement = new DecisionScreenElement((moduleGridView .DecisionScreensConfig)
     {
         Name = "NoItemsExistScreen",
         DecisionType = DecisionType.NoItemsExist,
         MessageType = MessageType.Neutral,
         Displayed = false,
         Title = "WhatDoYouWantToDoNow",
         MessageText = "NoItems",
         ResourceClassId = typeof((moduleResources).Name
     };
      
     CommandWidgetElement actionCreateNew = new CommandWidgetElement(dsElement.Actions)
     {
         Name = "Create",
         ButtonType = CommandButtonType.Create,
         CommandName = DefinitionsHelper.CreateCommandName,
         Text = "CreateItem",
         ResourceClassId = typeof(moduleResources).Name,
         CssClass = "sfCreateItem",
         PermissionSet = SecurityConstants.Sets.General.SetName,
         ActionName = SecurityConstants.Sets.General.Create
     };
     dsElement.Actions.Add(actionCreateNew);
      
      
    moduleGridView.DecisionScreensConfig.Add(dsElement);

    4. You need edit/insert form view

    var  EditDetailView = new DetailFormViewElement(backendContentView.ViewsConfig)
                {
                    Title = "EditItem",
                    ViewName = ModuleDefinitions.BackendEditViewName,
                    ViewType = typeof(DetailFormView),
                    ShowSections = true,
                    DisplayMode = FieldDisplayMode.Write,
                    ShowTopToolbar = true,
                    ResourceClassId = typeof(MyCustomResources).Name,
                    WebServiceBaseUrl = "~/Sitefinity/Services/Content/ContentItemService.svc/",
                    IsToRenderTranslationView = true,
                    AlternativeTitle = "CreateNewItem"
                };
      
                backendContentView.ViewsConfig.Add(EditDetailView );
      
             var InsertDetailView = new DetailFormViewElement(backendContentView.ViewsConfig)
                {
                    Title = "CreateNewItem",
                    ViewName = ModuleDefinitions.BackendInsertViewName,
                    ViewType = typeof(DetailFormView),
                    ShowSections = true,
                    DisplayMode = FieldDisplayMode.Write,
                    ShowTopToolbar = true,
                    ResourceClassId = typeof(moduleResources).Name,
                    WebServiceBaseUrl = "~/Sitefinity/Services/Content/ContentItemService.svc/",
                    IsToRenderTranslationView = false
                };
      
                backendContentView.ViewsConfig.Add(InsertDetailView);

    Each control is represented by DefinitionElement - Represents a configuration element within a configuration file for each field definition. For example TextFieldDefinitionElement - represents a configuration element for text fields, DateFieldElement - represents a configuration element that describes a date field.

    There is a base class DefinitionsHelper which implements the  action menu widget element and action menu command which are used in the module definition

    private static void CreateDialogs(ConfigElementCollection parent)
            {
                var parameters = string.Concat(
                    "?ControlDefinitionName=",
                    MyDefinition.BackendDefinitionName,
                    "&ViewName=",
                    MyDefinition.BackendInsertViewName);
                DialogElement createDialogElement = DefinitionsHelper.CreateDialogElement(
                    parent,
                    DefinitionsHelper.CreateCommandName,
                    "ContentViewInsertDialog",
                    parameters);
                parent.Add(createDialogElement);
    }

    public const string BackendDefinitionName = "MyModuleBackend";


    You call the CreateDialog when you

    #region Dialogs definition
                 
    MyDefinitions.CreateDialogs(myCustomGridView.DialogsConfig);
     
    var parameters = string.Concat("?TypeName=Telerik.Sitefinity.Samples.CustomDataItem&Title=", Res.Get<MyModuleResources>().MyDataFields, "&BackLabelText=", Res.Get<MyModuleResources>().BackToItems, "&ItemsName=", Res.Get<MyModuleResources>().PluralNameForMyObject);
    DialogElement moduleEditorDialogElement = DefinitionsHelper.CreateDialogElement(
        myGridView.DialogsConfig,
        DefinitionsHelper.ModuleEditor,
        "ModuleEditorDialog",
        parameters);
    myGridView.DialogsConfig.Add(moduleEditorDialogElement);
     
    #endregion
     
    #region Links definition
     
    myCustomGridView.LinksConfig.Add(new LinkElement(myGridView.LinksConfig)
    {
        Name = "viewComments",
        CommandName = DefinitionsHelper.CommentsCommandName,
        NavigateUrl = RouteHelper.CreateNodeReference(MyCutomModule.CommentsPageId)
    });
     
    myGridView.LinksConfig.Add(new LinkElement(myCustomGridView.LinksConfig)
    {
        Name = "viewSettings",
        CommandName = DefinitionsHelper.SettingsCommandName,
        NavigateUrl = RouteHelper.CreateNodeReference(SiteInitializer.AdvancedSettingsNodeId) + "/MyCustomModule"
    });
     
    DefinitionsHelper.CreateNotImplementedLink(myGridView);
     
    #endregion


    Most of the things above are just a configuration, as you can see there is no coding

    Please download a free trial and install the SDK Product samples module which shows this in details. I suggest that you should also check our online documentation.

    Greetings,
    Ivan Dimitrov
    the Telerik team
  3. Luke Durrant
    Luke Durrant avatar
    10 posts
    Registered:
    11 Sep 2009
    21 Mar 2011
    Link to this post
    Hmmm I see. I was afraid you were going to say that.
    Yes I have downloaded the Sitefinity 4.0 SP1.
    What happens if you want to modify the admin add and edit pages is it at all possible?
    For example:
    I have a Custom Module that I need to build that has a title and description field as well as an image, I also need to plot points on the image as hotspots.
    Previously I did this through by creating an object that stores the x and y points and the associated custom module ID.
    This was very easy to do in Sitefinity 3.7 and I have done a similar projects before however I'm struggling to find were I even start with doing it in 4.0. Like you said there's no coding to

    I've built numerous Sitefinity 3.x websites in the past and it seems the learning curve for Sitefinity 4.0 is quite steep, I hate to think what it's like for any newbies.
  4. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    12 Sep 2017
    21 Mar 2011
    Link to this post
    Hello Luke,

    When you create a new module it installs backend pages. This is done in InstallPages method. You can create backend pages from the UI as well.

    For title and description you can use TextFieldDefinitionElement - represents a configuration element for text fields. For the image - ImageFieldDefinition.

    Kind regards,
    Ivan Dimitrov
    the Telerik team
4 posts, 0 answered