Skip to content

Instantly share code, notes, and snippets.

@stingray82
Created January 11, 2026 10:54
Show Gist options
  • Select an option

  • Save stingray82/c16227347449076b103210c7cbe03338 to your computer and use it in GitHub Desktop.

Select an option

Save stingray82/c16227347449076b103210c7cbe03338 to your computer and use it in GitHub Desktop.
Flowmattic MyCred
/* global FlowMatticWorkflow, FlowMatticWorkflowEvents, FlowMatticWorkflowApp, FlowMatticWorkflowSteps */
var FlowMatticWorkflow = FlowMatticWorkflow || {};
( function( $ ) {
jQuery( document ).ready( function() {
// Workflow Trigger Mycred View.
FlowMatticWorkflow.MycredView = Backbone.View.extend( {
template: FlowMatticWorkflow.template( jQuery( '#flowmattic-application-mycred-data-template' ).html() ),
actionTemplate: FlowMatticWorkflow.template( jQuery( '#flowmattic-application-mycred-action-data-template' ).html() ),
events: {
},
initialize: function() {
// Unset the previous captured data.
window.captureData = false;
// Listem to dynamic field popup, and append the custom data from API.
this.listenTo( FlowMatticWorkflowEvents, 'generateDynamicFieldsHTML', this.generateDynamicFieldsHTML );
},
render: function() {
var thisEl = this,
appAction = thisEl.model.get( 'action' ),
appActionTemplate;
if ( 'trigger' === thisEl.model.get( 'type' ) ) {
thisEl.$el.html( thisEl.template( thisEl.model.toJSON() ) );
thisEl.setTriggerOptions();
} else {
thisEl.$el.html( thisEl.actionTemplate( thisEl.model.toJSON() ) );
if ( jQuery( '#mycred-action-' + appAction + '-data-template' ).length ) {
appActionTemplate = FlowMatticWorkflow.template( jQuery( '#mycred-action-' + appAction + '-data-template' ).html() );
jQuery( thisEl.$el ).find( '.mycred-action-data' ).html( appActionTemplate( thisEl.model.toJSON() ) );
}
thisEl.setActionOptions();
}
thisEl.$el.find( 'select' ).selectpicker();
return this;
},
setTriggerOptions: function() {
var elements = jQuery( this.$el ).find( '.flowmattic-mycred-form-data' ),
currentFormAction = this.model.get( 'action' );
elements.hide();
if ( '' !== currentFormAction ) {
jQuery( this.$el ).find( '.flowmattic-mycred-form-data' ).show();
}
},
setActionOptions: function() {
var elements = jQuery( this.$el ).find( '.flowmattic-mycred-action-data' ),
currentAction = this.model.get( 'action' );
elements.hide();
if ( '' !== currentAction ) {
jQuery( this.$el ).find( '.flowmattic-mycred-action-data' ).show();
}
},
generateDynamicFieldsHTML: function( application, currentInput ) {
var badgesDropdownHTML = '',
badgesDropdownItems = '',
ranksDropdownHTML = '',
ranksDropdownItems = '';
// Normalize globals safely.
var mycred = window.flowmattic_mycred || {};
var badges = Array.isArray(mycred.badges) ? mycred.badges : [];
var ranks = Array.isArray(mycred.ranks) ? mycred.ranks : [];
// Normalize other globals that can be undefined.
window.dynamicFieldOptionsHTML = window.dynamicFieldOptionsHTML || '';
// Normalize currentInput access.
var inputName = (currentInput && currentInput[0] && currentInput[0].name) ? currentInput[0].name : '';
if (badges.length) {
_.each(badges, function( badge ) {
badgesDropdownItems +=
'<option value="' + badge.id + '" data-subtext="ID: ' + badge.id + '">' +
badge.title +
'</option>';
});
// Badges.
if (
application === this.model.get('application') &&
inputName === 'badge_id' &&
window.dynamicFieldOptionsHTML.indexOf('label="myCred Badges"') === -1
) {
badgesDropdownHTML = '<optgroup label="myCred Badges" data-max-options="1">' + badgesDropdownItems + '</optgroup>';
window.dynamicFieldOptionsHTML = badgesDropdownHTML + window.dynamicFieldOptionsHTML;
}
}
if (ranks.length) {
_.each(ranks, function( rank ) {
ranksDropdownItems +=
'<option value="' + rank.id + '" data-subtext="ID: ' + rank.id + '">' +
rank.title +
'</option>';
});
// Ranks.
if (
application === this.model.get('application') &&
inputName === 'rank_id' &&
window.dynamicFieldOptionsHTML.indexOf('label="myCred Ranks"') === -1
) {
ranksDropdownHTML = '<optgroup label="myCred Ranks" data-max-options="1">' + ranksDropdownItems + '</optgroup>';
window.dynamicFieldOptionsHTML = ranksDropdownHTML + window.dynamicFieldOptionsHTML;
}
}
}
} );
} );
}( jQuery ) );
public function enqueue_views() {
wp_enqueue_script(
'flowmattic-app-view-mycred',
FLOWMATTIC_APP_URL . '/mycred/view-mycred.js',
array( 'flowmattic-workflow-utils' ),
time(), // forces reload every page
true
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment