Start a new topic

Hide ShortPoints from Inserter

If you have ever wanted to hide some ShortPoint elements from being shown up in the Inserter dialog, here's how you can do this using JavaScript, and ShortPoint APIs:


Step 1: Define a function that will contain our hooks


/**
 * hook method to be executed as soon as shortpoint
 * is available in the page
 */
function initHook() {

}

 


Step 2: Execute the hook function one ShortPoint is ready

  

// shortpoint not yet available in the page
// wait for shortpoint ready dom event
if( typeof shortpoint === 'undefined' ) {
	document.body.addEventListener( 'shortpoint-init', initHook );
} else {
	initHook();
}

 


Step 3: Execute hook function only when page in edit mode


  

function initHook() {
    
	// our inserting framework
	var inserter = window.shortPointInserter;

	// not edit mode, exit
	if( inserter == null ) {
	    return;
	} 

 


Step 4: Getting list of all ShortPoint elements in inserter


 

// ui binding framework ( knockout )
var ko = inserter.ko;
// list of all shortpoint elements in inserter
var oShortPointList = ko.$root.dashboard.oShortPointList();

 


Step 5: [ option 1 ] - remove an element from ShortPoint list

  

// remove button shortpoint for example
// Notes:
//  - oItem: shortpoint element object
//  - oItem.name: shortpoint ID
//  - oItem.label: shortpoint title that appear in UI
oShortPointList.remove(function(oItem) {
	return oItem.name === 'button'
});

   


Step 5: [ option 2 ] - remove a set of elements from ShortPoint list


 

// list contains all shortpoint
// that you wish to remove by their name
var aListToRemove = [
  'accordions',
  'tabs',
  'toggles'
];

// removing multipe shortpoints by name
oShortPointList.remove(function(oItem) {
  return aListToRemove.indexOf( oItem.name ) !== -1;
});

 


for the complete code snippet, you can check it on Github Gist on the following link:




1 person has this question
Login or Signup to post a comment