We appreciate you taking the time to vote and add your suggestions to make our products awesome! Your request will be submitted to the community for review and inclusion into the backlog.

We recommend reviewing what is submitted before posting, in case your idea has already been submitted by another community member. If it has been submitted, vote for that existing feature request (by clicking the up arrow) to increase its opportunity of being added to Cireson solutions.

For more information around feature requests in the Cireson Community click here.

Alternate Service Catalog Layout Option based on Service Offering

Is it possible to have an Alternate Service Catalog Layout Option where you only see one big icon for each category (Service Offering). And that icon directs you to all the Request (Request offerings) in that category? User gets confused when there is too many Service Request icons on the front Home page.

29 votes

Submitted · Last Updated

Comments

  • Justin_ClarkeJustin_Clarke Customer Advanced IT Monkey ✭✭✭
    Definately would be great to have this. One of our developers posted the below when trying to get this going with no luck.
    https://community.cireson.com/discussion/679/displaying-service-offering-image#latest


  • Joe_BurrowsJoe_Burrows Cireson Devops Super IT Monkey ✭✭✭✭✭
    Hi Jais 
    It is possible and have seen custom stuff built by our services team as Brett mentions in https://community.cireson.com/discussion/679 

    Is this a feature request? If so ill convert to an "idea" so the voting options appear.
  • Jais_HyltoftJais_Hyltoft Partner Adept IT Monkey ✭✭

    Hi Joe

    Yes, please convert to an "idea" :-)

  • Joe_BurrowsJoe_Burrows Cireson Devops Super IT Monkey ✭✭✭✭✭
    Done and up voted :)
  • Sean_TerrySean_Terry Customer Advanced IT Monkey ✭✭✭
    This would be a good option for us as well.
  • MaryTMaryT Member IT Monkey ✭
    I agree - it would be a good option for us
  • Dieter_SaerensDieter_Saerens Partner IT Monkey ✭
    Any update about this from Cireson?
  • Ernest_FaccioliniErnest_Facciolini Customer IT Monkey ✭
    edited May 2
    I created a working proof of concept for just this type of functionality. To implement, just place the following code in your custom.js file. You will need to update the guid of your home page view, as indicated in the script, and then place a .png named with the guid of each of your service offerings in the "C:\Inetpub\ciresonportal\Images" folder. You can easily discover the guid of your service offerings in the Service Manager Console, or by using the developer tools to view the data-service attribute of the <div> for each service offering. I also have an alternative version which reads the base64 image data that is attached to  the Service Offering in the SCSM Console, which is below the first example.

    Note that in the code we are using some Timeouts to wait for specific elements to become available, as we are not modifying any existing code to raise additional events.

    Code: (sorry about formatting, it looks great in edit view!)

    $(function(){
    var pageURL = window.location.href
    if (pageURL.indexOf('94ecd540-714b-49dc-82d1-0b34bf11888f') > 0) //put your home page view guid here
    {
    runServiceCatalogCustomization();
    }
    });

    function runServiceCatalogCustomization(){

    if($('#servicecat-content').length > 0) {
    SetServiceOfferingImages();
    }else {
    setTimeout(runServiceCatalogCustomization, 50);
    }
    }


    function SetServiceOfferingImages() {

    if ( $("div.so-blocks").length > 0) {
    $("div.so-blocks").each(function() {
    var sccServiceID = $(this).attr('data-service')
    $(this).empty();
    $(this).prepend('<img src="/Images/' + sccServiceID + '.png" />');
    $(this).click(function() {
    $("span.link[data-service=" + sccServiceID + "]").click();
    });

    })
    $('#servicecat-content').one("DOMSubtreeModified",function(){
    SetServiceOfferingImages();
    });
    } else {
    setTimeout(SetServiceOfferingImages, 50);
    }
    }

    Alternate version, which uses the icon attached to the service offering:

    $(function(){
    var pageURL = window.location.href
    if (pageURL.indexOf('94ecd540-714b-49dc-82d1-0b34bf11888f') > 0)
    {
    runServiceCatalogCustomization();
    }
    });

    function runServiceCatalogCustomization(){

    if($('#servicecat-content').length > 0) {
    SetServiceOfferingImages();
    }else {
    setTimeout(runServiceCatalogCustomization, 50);
    }
    }


    function SetServiceOfferingImages() {
    if ( $("div.so-blocks").length > 0) {

    $.ajax({
    url: "/ServiceCatalog/GetServiceCatalog",
    type: "POST",
    dataType: "json",
    data: "{}",
    contentType: "application/json; charset=utf-8",
            success: function (data) {
    $.each(data.Data, function(index, value) {
    $("div.so-blocks[data-service=" + data.Data[index].ServiceOfferingId + "]").empty();
    $("div.so-blocks[data-service=" + data.Data[index].ServiceOfferingId + "]").prepend('<img src="data:image/png;base64,' + data.Data[index].ServiceImage64 + '" />');
    $("div.so-blocks[data-service=" + data.Data[index].ServiceOfferingId + "]").click(function() {
    $("span.link[data-service=" + $(this).attr('data-service') + "]").click();
    });

    })
    $('#servicecat-content').one("DOMSubtreeModified",function(){
    SetServiceOfferingImages();
    });
    },
    error: function (e) {
    alert(JSON.stringify(e));
    }
    });
    } else {
    setTimeout(SetServiceOfferingImages, 50);
    }
    }

  • Tom_HendricksTom_Hendricks Customer Super IT Monkey ✭✭✭✭✭
    This is a significant improvement on that catalog layout, @Ernest_Facciolini.  My personal favorite is the alternate version that loads the SO image but there is a great case to be made for both.  This should really be featured in the Community Uploads section of this site, IMO.
  • Joe_BurrowsJoe_Burrows Cireson Devops Super IT Monkey ✭✭✭✭✭
    Agree looks great - have posted here: https://community.cireson.com/discussion/3884 
  • Tom_HendricksTom_Hendricks Customer Super IT Monkey ✭✭✭✭✭
    The 8.6.2 portal update appears to have broken the second version.  :(

    the ServiceImage64 property is now null for all Service Offering images when using the /ServiceCatalog/GetServiceCatalog API, so all the images just get the broken picture treatment.
  • Gerhard_GoossensGerhard_Goossens Customer IT Monkey ✭
    edited June 25
    Yeah, I reported it on 21 June.

    https://support.cireson.com/Problem/Edit/PR75784/

    I applied the suggested fix and it resolved the issue. 
Sign In or Register to comment.