Looking similar ImageSelector for Document List

Posted by Community Admin on 04-Aug-2018 00:16

Looking similar ImageSelector for Document List

All Replies

Posted by Community Admin on 26-May-2011 00:00

Hi,

Is there any kind of "image selector" component for document list ? I need to provide a UI which allow the user to select any document that has been uploaded on document list. Anyway i could get the example code for that one ?

Many Thanks

Posted by Community Admin on 26-May-2011 00:00

Hello John,

You can use MediaContentSelector

www.sitefinity.com/.../image-selector-on-custom-controls.aspx

You should set ContentType to Telerik.Sitefinity.Libraries.Model.Document

Best wishes,
Ivan Dimitrov
the Telerik team

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 29-May-2011 00:00

I tried the example...but the disigner didn't show the item list on right window...only "Loading..." for ever.... i could see the document library i created on the left window..... whats wrong with my code ?


SelectorDesigner.ascx

<%@ Control Language="C#" %>
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI"
    TagPrefix="sitefinity" %>
<sitefinity:ResourceLinks ID="resourcesLinks" runat="server">
    <sitefinity:ResourceFile AssemblyInfo="SitefinityWebApp.Controls.Selector,SitefinityWebApp"
        Name="SitefinityWebApp.Resources.CSS.SelectorDesigner.css" Static="true" />
</sitefinity:ResourceLinks>
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Modules.Libraries.Web.UI.Designers" TagPrefix="sf" %>
<sf:MediaContentSelectorView
    id="selectorView"
    runat="server"
    ContentType="Telerik.Sitefinity.Libraries.Model.Document"
    ParentType="Telerik.Sitefinity.Libraries.Model.DocumentLibrary"
    LibraryBinderServiceUrl="~/Sitefinity/Services/Content/DocumentLibraryService.svc/"
    MediaContentBinderServiceUrl="~/Sitefinity/Services/Content/DocumentService.svc/"
    MediaContentItemsListDescriptionTemplate="Telerik.Sitefinity.Resources.Templates.Designers.Libraries.Images.ImageItemDescriptionTemplate.htm"
    DisplayResizingOptionsControl="false"
    ShowOpenOriginalSizeCheckBox="false">
</sf:MediaContentSelectorView>


SelectorDesigner.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Sitefinity.Web.UI;
using Telerik.Sitefinity.Web.UI.ControlDesign;
using Telerik.Sitefinity.Web.UI.Fields;
using Telerik.Sitefinity.Modules.Libraries.Web.UI.Designers;

namespace SitefinityWebApp.Resources.Designers

    public class SelectorDesigner : ControlDesignerBase
   
        protected override void InitializeControls(GenericContainer container)
       
            base.DesignerMode = ControlDesignerModes.Simple;
       

        protected override string LayoutTemplateName      
       
            get
           
                return "SitefinityWebApp.Resources.Designers.SelectorDesigner.ascx";
           
       

        protected override HtmlTextWriterTag TagKey
       
            get
           
                return HtmlTextWriterTag.Div;
           
       

        public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
       
            var scriptDescriptors = new List<ScriptDescriptor>(base.GetScriptDescriptors());
            var desc = (ScriptControlDescriptor)scriptDescriptors.Last();
            desc.AddComponentProperty("selectorView", SelectorView.ClientID);
            return scriptDescriptors.ToArray();
       

        public override IEnumerable<System.Web.UI.ScriptReference> GetScriptReferences()
            var res = new List<ScriptReference>(base.GetScriptReferences());
            var assemblyName = this.GetType().Assembly.GetName().ToString();
            res.Add(new ScriptReference("SitefinityWebApp.Resources.JS.SelectorDesigner.js", assemblyName));
            return res.ToArray();
       

        protected MediaContentSelectorView SelectorView
       
            get
           
                return Container.GetControl<MediaContentSelectorView>("selectorView", true);
           
       
   



SelectorDesigner.js

Type.registerNamespace("SitefinityWebApp");
Type.registerNamespace("SitefinityWebApp.Resources.Designers");


SitefinityWebApp.Resources.Designers.SelectorDesigner = function (element)
    this._selectorView = null;
    this._itemSelectDelegate = null;
    SitefinityWebApp.Resources.Designers.SelectorDesigner.initializeBase(this, [element]);


SitefinityWebApp.Resources.Designers.SelectorDesigner.prototype =

    initialize: function ()
        SitefinityWebApp.Resources.Designers.SelectorDesigner.callBaseMethod(this, 'initialize');
        this._itemSelectDelegate = Function.createDelegate(this, this._itemSelect);
        this.add_onItemSelectCommand(this._itemSelectDelegate);
    ,

    _itemSelect: function (sender, args)
        var dataItem = args.get_dataItem();
        this._selectedImageKey = args.get_key();
        var selectedElement = args.get_itemElement();
        this._highlightSelectedImage(selectedElement);

    ,

    _highlightSelectedImage: function (selectedElement)
        if (this.selectedImageElement)
            if (this.selectedImageElement != selectedElement)
                $(this.selectedImageElement).find(".imgSelect").removeClass("sfSelImgBorder");
                $(this.selectedImageElement).removeClass("sfSel");
            else
                $(this.selectedImageElement).addClass("sfSel");
           
       

        if (selectedElement)

            this.selectedImageElement = selectedElement;
            $(selectedElement).find(".imgSelect").addClass("sfSelImgBorder");

       

    ,

    add_onItemSelectCommand: function (delegate)
        this.get_events().addHandler('onItemSelectCommand', delegate);
    ,

    dispose: function ()
        SitefinityWebApp.Resources.Designers.SelectorDesigner.callBaseMethod(this, 'dispose');
        if (this._selectorView)
            this._selectorView.add_onItemSelectCommand(this._itemSelectDelegate);
       
    ,

    get_selectorView: function ()
        return this._selectorView;
    ,

    set_selectorView: function (value)
        this._selectorView = value;
    ,

    refreshUI: function ()
        var data = this._propertyEditor.get_control();
        $(this._propertyEditor.get_advancedModeButton()).hide();
    ,
    applyChanges: function ()
        var data = this._propertyEditor().get_control();
   



SitefinityWebApp.Resources.Designers.SelectorDesigner.registerClass('SitefinityWebApp.Resources.Designers.SelectorDesigner', Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesignerBase);
if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

Posted by Community Admin on 30-May-2011 00:00

Hi John,

Please modify the template as shown below

<sf:MediaContentSelectorView
    id="selectorView"
    runat="server"
    ContentType="Telerik.Sitefinity.Libraries.Model.Document"
    ParentType="Telerik.Sitefinity.Libraries.Model.DocumentLibrary"
    LibraryBinderServiceUrl="~/Sitefinity/Services/Content/DocumentLibraryService.svc/"
    MediaContentBinderServiceUrl="~/Sitefinity/Services/Content/DocumentService.svc/"
    MediaContentItemsListDescriptionTemplate="Telerik.Sitefinity.Resources.Templates.Designers.Libraries.Documents.DocumentItemDescriptionTemplate.htm"
    DisplayResizingOptionsControl="false"
    ShowOpenOriginalSizeCheckBox="false">
</sf:MediaContentSelectorView>


Greetings,
Ivan Dimitrov
the Telerik team
Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 02-Jun-2011 00:00

Can we use the same method to select page url as well ? i want to populate the list of pages  and let the user select which page that they want to attach to custom control i create to display blogs,news etc etc.

Posted by Community Admin on 02-Jun-2011 00:00

Hi John,

Take a look at this post

http://www.sitefinity.com/devnet/forums/sitefinity-4-x/sdk/how-to-add-page-selector-button-in-sitefinity-4-0-rc.aspx#1456140



Regards,
Ivan Dimitrov
the Telerik team
Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 05-Jun-2011 00:00

Is it possible to declare MediaContentSelectorView three times on the same control designers ? My scenario is like this:

One to select the image, one to select the pdf file from document library and one to select one of the pages url.

I saw the javascript but i am stuck with

    get_selectorView: function ()
        return this._selImageView;
    ,

    set_selectorView: function (value)
        this._selImageView = value;
    ,

i tried to create other two pairs of them for PDF and Pages View Selector but it didn't work:

    get_selectorDocView: function ()
        return this._selDocView;
    ,

    set_selectorDocView: function (value)
        this._selDocView = value;
    ,

    get_selectorPageView: function ()
        return this._selPageView;
    ,

    set_selectorPageView: function (value)
        this._selPageView = value;
    ,







Posted by Community Admin on 08-Jun-2011 00:00

Hello John,

Each controlhas its own client component, so you need to work with them separately. I haven't tested with multiple controls of the same type inside a single view of the designer, but there shouldn't be an issue.

Best wishes,
Ivan Dimitrov
the Telerik team

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 04-Aug-2011 00:00

Hi,

I've been trying for ages to implement this designer for selecting an Image.

I followed the above example but to no avail.

I create a usercontrol

using System;
using Telerik.Sitefinity.Web.UI.ControlDesign;
 
namespace SitefinityWebApp.Resources
    [ControlDesigner(typeof(SelectorDesigner))]
    public partial class FrontEnd : System.Web.UI.UserControl
    
        protected void Page_Load(object sender, EventArgs e)
        
 
        
    


and then add that control the the toolbox.
 
<tools>
<add enabled="True" type="~/Resources/FrontEnd.ascx" title="SelectorTest" description="Adding a user control" resourceClassId="" cssClass="" layoutTemplate="" moduleName="" visibilityMode="None" name="SelectorTest" />
</tools>

But when I edit the control in the admin area I get the attached error

Can you point where I am going wrong.

Thanks
Kieran


Posted by Community Admin on 08-Aug-2011 00:00

Hi Kieran,

What  is the code you have in SelectorDesigner class and its template? The problem is not in the control itself, but in its designer.

Best wishes,
Ivan Dimitrov
the Telerik team

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 02-Jan-2012 00:00

Hi,

I am having the same issue and stuck to have document selector Field. Please, can you send me the code so it will be help ful for me.

Regards,
Ishityaq Mohammed.

Posted by Community Admin on 02-Jan-2012 00:00

Hi,

You can take a look at this article. You only have to replace the types in it, so you will get document items.



All the best,
Ivan Dimitrov
the Telerik team

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 16-Jan-2012 00:00

Hi Ivan,

I was able to implement that control using both John and your threads.
I am having an issue actually retrieving what document the user actual selected.

applyChanges: function ()
       var controlData = this._propertyEditor.get_control();
       controlData.selectedDoc = ????????       
   

I have selectedDoc as a public variable.

Any help would be great

Kieran

Posted by Community Admin on 17-Jan-2012 00:00

Hello,

Please teke a look at this thread.

Kind regards,
Ivan Dimitrov
the Telerik team

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

This thread is closed