Custom catalog item widget in portal without modifiying OOTB catalog widgets

[Juanjo]

Because i have received very much information from this comunity, y wish to share some content too.

I have see some posts in what people want load custom catalog items widgets, some sugestion are to modify the sc_category_page or other widgets. In order to achieve the same objective only modifying a page, you can do the following.

My particular case is that i need to load the standard Order Guide widget in some cases, and a custom order guide widget if the ordet guide is relate to a custom model created by me.

Procedure:
1- create a intermediate widget to decide what widget to load
2- replace the standar order guide widget from the page sc_cat_item_guide (in my case) and put the intermediate widget
3- enjoy... 🙂

The intemediate widge contet is this:

Template:

<div ng-if="data.mode=='workspace'">
	<widget id="sc_order_guide_workspace"></widget>
</div>
<div ng-if="data.mode=='order_guide'">
  <widget id="widget-sc-order-guide-v2"></widget>
</div>

Client script:

function($scope) {
  /* Attention, very complex code, i need to siplify it in the future, sorry */
  var c = $scope;
}

Server script:

(function() {
  var guideJS;
	data.sys_id = $sp.getParameter("sys_id");
	//data.sys_id = '31862ecc4f707300c999045e9310c7ab';
	
	var guideGr = new GlideRecord('sc_cat_item_guide');
	guideGr.get(data.sys_id);
	
	// Select the widget to show
	var modelType = guideGr.model.sys_class_name.toString();
	if (modelType == 'u_cmdb_workspace_product_model') {
		data.mode = 'workspace';
	} else {
		data.mode = 'order_guide';
	}

})();

Thats all.