Home Cireson Uploads
image


IT Monkey will place code here as examples of what Cireson's consulting team has to offer as well as examples for public consumption to benefit the Microsoft System Center community as a whole.

DISCLAIMER

All files and projects located here come as is and without any warranty or support. We will attempt to improve the projects as time goes on based on customer and community demand. Comments and improvements are welcome as well as customization requests. Your use of these Cireson Uploads is subject to our Terms of Use.


Cireson's support team has no information on these projects outside of what you have available and will not provide support for these enhancements, extensions, and scripts.

Dont forget to checkout solutions uploaded by our customers, partners and community members here.

Request Stage Progress Bar

Geoff_RossGeoff_Ross Cireson Consultant O.G.
edited August 2018 in Cireson Uploads
Its nice to be able to see a quick overview of a Service or Change request process without having to dive into the full activity tree and see what's going on. This is especially useful for End Users who want to see the progress of their request but wouldn't understand the activity structure.

The following extension looks up the stage of all top level activities and display a nice progress bar on the page to indicate these and which one is currently in progress.



Its early stages for now, there's some work needs doing on the styling and a lot more testing, but please give it a go. If you download, please like.

Geoff

Comments

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭
    @Geoff_Ross - This is pretty slick!  I'm always a fan of highlighting things that ease confusion and frustration for the End User.
  • Adam_DzyackyAdam_Dzyacky Product Owner Contributor Monkey ✭✭✭✭✭
    Now that is one fantastic customization @Geoff_Ross .
  • Geoff_RossGeoff_Ross Cireson Consultant O.G.
    New Version

    Download updated on the original post. I'll move to GitHub soon.
    • Added better handling when there are no activities
    • Added extra pseudo 'Complete' stage
    • Added checks on completed Stages
    • Deals with Work Items with no 'In Progress' activity if you happen to load it between one completing and the next being in progress.

  • John_BeasleyJohn_Beasley Customer IT Monkey ✭
    I cant get this to work with the new version 8.9.4 portal. Is there anything special I need to do ?
  • Geoff_RossGeoff_Ross Cireson Consultant O.G.
    Hi John,

    Not that I can think of, just testing myself, what issue are you having?

    Geoff
  • John_BeasleyJohn_Beasley Customer IT Monkey ✭
    I can't get this to show up at all. I have done everything that I can think of. 
  • Geoff_RossGeoff_Ross Cireson Consultant O.G.
    Did you have it working before and it broke with an upgrade or have you just implemented?
    Are you setting any errors in the browser? Press F12 to get into the browser's console and check there.
    Does your Request have Activities with Stages?

  • Brian_WiestBrian_Wiest Customer Super IT Monkey ✭✭✭✭✭
    Have you got the GitHub repository yet? Pretty sure I found your user account but don't see this yet. Thanks.
  • Geoff_RossGeoff_Ross Cireson Consultant O.G.
    Not quite, its in my backlog. So many things, so little time.
    The zip file above is the latest code, did you want to contribute?
  • John_BeasleyJohn_Beasley Customer IT Monkey ✭
    Im just now trying to implement it. I dont see any errors in the browsers and I do have activities with stages. Not sure what I did wrong lol. 
  • Andreas_VoigtAndreas_Voigt Customer IT Monkey ✭
    Hi there, 
    first of all thats a great feature ! Thats really what my customers would love to have and it would relief the service-desk from a lot of questions regarding the status of the SR^s. 
    But now comes the problems-part...
    Although renaming the given Activity Stages via "Library/List/Activity Stage" the progress-bar somehow falls back to the "original-name".
    I also tried creating new Activity stages, but then the progress-bar -text just turns blank. 
    Please find attached screenshots

    Best regards

    Andreas














  • Geoff_RossGeoff_Ross Cireson Consultant O.G.
    Hi @Andreas_Voigt
    How long has it been since you renamed it. IT could be a caching issue?
    Or, I wonder if this is a language thing? You've only renamed it in one language but your portal is set to another language.

    But also, can I ask why you have renamed / re-purposed an out of the box enum? Its better practice to delete these and create your own enums in a custom management pack?

    Geoff
  • Andreas_VoigtAndreas_Voigt Customer IT Monkey ✭
    Hi @Geoff_Ross
    thanks for replying !
    The caching time was something I thougt about as well, I tried it "live". Changed it, went to the SR , refreshed Webpage and checked the result.
    Well, i renamed it because my custom-ones just turned out blank-text-fields. 
    So to test further I tried renaming existing ones.
    I´ll give it a try with the language and the caching-time over the weekend.

    Thanks in advance

    Andreas
  • Andreas_VoigtAndreas_Voigt Customer IT Monkey ✭
    @Geoff_Ross
    Update, after rebuilding numerous caches ( dont know which one did the trick ) it works now with my new custom stages. Thanks a lot
  • Andreas_VoigtAndreas_Voigt Customer IT Monkey ✭


    Hi there, unfortunalty I encountered another tricky Situation.
    As we are working with automated runbook invokes there are couple of situations where These runbooks create sequentiel activitys that include request activities. I already added stages in the script to set the correct stages to both the sequentiell activity and the request activitys.

    But then again the Progress bar doenst Display the "embedded" request actitvitys, but only Shows the wrapping sequentiell activitys stage.

    It would be great if you could give me a hint on how to get the Progress bar to "look" inside the sequentiell activitys, or if changing the existing runbooks and f.e. getting rid of the sequentiell actitivy Container would be the only way.

    Thanks in advance

    Andreas


  • Tom_HendricksTom_Hendricks Customer Super IT Monkey ✭✭✭✭✭
    Just a general thought, but this indicator would work very nicely (obviously at a smaller scale) as a widget in the new ticket headers, potentially.
  • Leigh_KildayLeigh_Kilday Member Ninja IT Monkey ✭✭✭✭
    This is very cool.

    In the latest portal with the flyout header, the stage bar overlaps the WI tabs.

    Is this an issue to be addressed in this code, or the portal header?
  • Geoff_RossGeoff_Ross Cireson Consultant O.G.
    Hi @Leigh_Kilday
    It will have to be address here as released code will always trump a community solution. I have already had a play and found the solution, I just need to update this along with a bunch of other updates waiting to happen. Should find time early Jan.
  • Mika_KosunenMika_Kosunen Customer IT Monkey ✭
    Hi, sorry for not undersanding how to implement this in to our portal :(

    Can someone help me with implementing this in to our portal?

    There are 3 files:
    Stages folder => Stages.js
    Add to Custom.js
    Script loader

    Where does Scrip Loader.js-file go? (And do I need to do any modification to the file?)

    Where does Stages.js-file go? I guess I just make folder Stages with stages.js-file in it to the CustomSpace folder but do I need to do any modification to the stages.js-file?

    Add to CustomJS.js-file I understand that it must be put in to custom.js-file, but should the syntax be 
    $.getScript("/CustomSpace/Stages/Stages.js",["/ServiceRequest/","/ChangeRequest/"]);
    instead loadScript("/CustomSpace/Stages/Stages.js",["/ServiceRequest/","/ChangeRequest/"]);

    Thank you very much,
    Mika from Finland

  • AJ_WittenbrinkAJ_Wittenbrink Customer Adept IT Monkey ✭✭
    Hi @Leigh_Kilday
    It will have to be address here as released code will always trump a community solution. I have already had a play and found the solution, I just need to update this along with a bunch of other updates waiting to happen. Should find time early Jan.
    This is a great feature, any chance you have had time to fix the stage covering up the tabs?
  • Leigh_KildayLeigh_Kilday Member Ninja IT Monkey ✭✭✭✭
    I've changed the last line of code to the following:

    $('.form-panel').prepend(html)
  • Geoff_RossGeoff_Ross Cireson Consultant O.G.
    @Leigh_Kilday

    That looks good. Nice one.
  • Leigh_KildayLeigh_Kilday Member Ninja IT Monkey ✭✭✭✭
    Does anybody know how to make this bar break appropriately on resize? On the multi-page RO forms, each stage is kept together and stacks vertically. On the WI forms, the row height stays the same and the text breaks.

    Ideally this would also resize / turn into numbers only when the screen resizes.
  • Ryan_LaneRyan_Lane Cireson Support Advanced IT Monkey ✭✭✭
    Great work @Geoff_Ross
    I have been playing around with some useful potential features to build on top of this:
    - Status icons vs numbers.
    - Context styling based on status (yellow for skipped, red for failed and gray for cancelled).
    - Dynamic Kendo view to handle refreshing content if activities change.
    - Title text attributes to help with shortened display names and status icons on hover.
    - Clicking on stage to go to its corresponding section in the Activities tab.


    Still brainstorming on:
    - How to handle container activities like PAs and SAs.
    - Displaying Completed state.
    - Updating CSS on page width changes to handle a column view.

    Getting some very positive feedback on the proof of concept at this point so thanks again for the inspiration!
  • Leigh_KildayLeigh_Kilday Member Ninja IT Monkey ✭✭✭✭
    @Ryan_Lane, that looks great! Are you able to share the code?
  • Mika_KosunenMika_Kosunen Customer IT Monkey ✭
    Please, what I do with Script Loader.js file?
  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭

    @Mika_Kosunen I believe the script in that file goes in your custom.js file unless another add-on put it in there already. I ignored it on my server but I already have a copy of the loadscript function in my custom.js from another mod.

  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭
    edited February 2020

    @Leigh_Kilday @Geoff_Ross

    I'm attempting to make this work in version 9.7 of the portal, but the form bar is still overlapping the form tabs even after making the change Leigh suggested. Does anyone have any ideas how to make this work properly?


    EDIT: Please disregard, turns out I was editing the file in my downloads folder and not the one installed in the portal :( Everything is working great on 9.7.0.

  • Robert_OsterbergRobert_Osterberg Customer Advanced IT Monkey ✭✭✭
    @Ryan_Lane
    Can you share the solution?
  • Craig_WatkinsCraig_Watkins Customer IT Monkey ✭

    Thanks for this @Geoff_Ross - It really makes working with CR's so much more transparent to the progress, especially to some of our approves who are less frequent users of the system.

    If anyone else is having issues (such as on 9.4 like us), adding the below to custom.jss should be a workaround.

    div.form-panel{ 

     padding-top: 40px;

    }

    @Ryan_Lane - Are those enhancements something you would be able to share? Could definately see a lot of value in all of your improvements!

Sign In or Register to comment.