Ninja Forms – The Easy and Powerful Forms Builder

Version Description

(22 September 2021)

Bugs:

Ensure sanitized values enables spaces between classNames

Release Info

Developer	nahuelmahe
Plugin	Ninja Forms – The Easy and Powerful Forms Builder
Version	3.5.8.3
Comparing to
See all releases

Code changes from version 3.5.8.2 to 3.5.8.3

Files changed (2) hide show

assets/js/min/builder.js +3 -3
assets/js/min/builder.js.map +1 -1

assets/js/min/builder.js CHANGED Viewed

	@@ -3734,10 +3734,10 @@ define( 'views/app/drawer/itemSetting',['views/app/drawer/mergeTagsContent', 'vi
3734	changeSetting: function( e ) {
3735	//Check characters set in custom classes match sanitize_html_class
3736	if ( 'textbox' == this.model.get( 'type' ) && this.model.get('name').endsWith("_class" )) {
3737	- const regexp = /^[a-zA-Z0-9-_]+$/;
3738	- if(e.target.value.search(regexp) === -1){
3739	this.model.set('error', "HTML classes only allow - _ and alphanumeric characters." )
3740	- } else if(e.target.value.search(regexp) === 0){
3741	this.model.unset('error');
3742	}
3743	}


3734	changeSetting: function( e ) {
3735	//Check characters set in custom classes match sanitize_html_class
3736	if ( 'textbox' == this.model.get( 'type' ) && this.model.get('name').endsWith("_class" )) {
3737	+ const regexp = /^[a-zA-Z 0-9-_]+$/;
3738	+ if(e.target.value.search(regexp) === -1 && ''!== e.target.value){
3739	this.model.set('error', "HTML classes only allow - _ and alphanumeric characters." )
3740	+ } else if(e.target.value.search(regexp) === 0 \|\| ''=== e.target.value){
3741	this.model.unset('error');
3742	}
3743	}

assets/js/min/builder.js.map CHANGED Viewed

@@ -1 +1 @@

- {"version":3,"names":[],"mappings":"","sources":["main.js"],"sourcesContent":["(function () {\n/**\n * @license almond 0.3.1 Copyright (c) 2011-2014, The Dojo Foundation All Rights Reserved.\n * Available via the MIT or new BSD license.\n * see: http://github.com/jrburke/almond for details\n */\n//Going sloppy to avoid 'use strict' string cost, but strict practices should\n//be followed.\n/*jslint sloppy: true */\n/*global setTimeout: false */\n\nvar requirejs, require, define;\n(function (undef) {\n var main, req, makeMap, handlers,\n defined = {},\n waiting = {},\n config = {},\n defining = {},\n hasOwn = Object.prototype.hasOwnProperty,\n aps = [].slice,\n jsSuffixRegExp = /\\.js$/;\n\n function hasProp(obj, prop) {\n return hasOwn.call(obj, prop);\n }\n\n /**\n * Given a relative module name, like ./something, normalize it to\n * a real name that can be mapped to a path.\n * @param {String} name the relative name\n * @param {String} baseName a real name that the name arg is relative\n * to.\n * @returns {String} normalized name\n */\n function normalize(name, baseName) {\n var nameParts, nameSegment, mapValue, foundMap, lastIndex,\n foundI, foundStarMap, starI, i, j, part,\n baseParts = baseName && baseName.split(\"/\"),\n map = config.map,\n starMap = (map && map['*']) || {};\n\n //Adjust any relative paths.\n if (name && name.charAt(0) === \".\") {\n //If have a base name, try to normalize against it,\n //otherwise, assume it is a top-level require that will\n //be relative to baseUrl in the end.\n if (baseName) {\n name = name.split('/');\n lastIndex = name.length - 1;\n\n // Node .js allowance:\n if (config.nodeIdCompat && jsSuffixRegExp.test(name[lastIndex])) {\n name[lastIndex] = name[lastIndex].replace(jsSuffixRegExp, '');\n }\n\n //Lop off the last part of baseParts, so that . matches the\n //\"directory\" and not name of the baseName's module. For instance,\n //baseName of \"one/two/three\", maps to \"one/two/three.js\", but we\n //want the directory, \"one/two\" for this normalization.\n name = baseParts.slice(0, baseParts.length - 1).concat(name);\n\n //start trimDots\n for (i = 0; i < name.length; i += 1) {\n part = name[i];\n if (part === \".\") {\n name.splice(i, 1);\n i -= 1;\n } else if (part === \"..\") {\n if (i === 1 && (name[2] === '..' || name[0] === '..')) {\n //End of the line. Keep at least one non-dot\n //path segment at the front so it can be mapped\n //correctly to disk. Otherwise, there is likely\n //no path mapping for a path starting with '..'.\n //This can still fail, but catches the most reasonable\n //uses of ..\n break;\n } else if (i > 0) {\n name.splice(i - 1, 2);\n i -= 2;\n }\n }\n }\n //end trimDots\n\n name = name.join(\"/\");\n } else if (name.indexOf('./') === 0) {\n // No baseName, so this is ID is resolved relative\n // to baseUrl, pull off the leading dot.\n name = name.substring(2);\n }\n }\n\n //Apply map config if available.\n if ((baseParts || starMap) && map) {\n nameParts = name.split('/');\n\n for (i = nameParts.length; i > 0; i -= 1) {\n nameSegment = nameParts.slice(0, i).join(\"/\");\n\n if (baseParts) {\n //Find the longest baseName segment match in the config.\n //So, do joins on the biggest to smallest lengths of baseParts.\n for (j = baseParts.length; j > 0; j -= 1) {\n mapValue = map[baseParts.slice(0, j).join('/')];\n\n //baseName segment has config, find if it has one for\n //this name.\n if (mapValue) {\n mapValue = mapValue[nameSegment];\n if (mapValue) {\n //Match, update name to the new value.\n foundMap = mapValue;\n foundI = i;\n break;\n }\n }\n }\n }\n\n if (foundMap) {\n break;\n }\n\n //Check for a star map match, but just hold on to it,\n //if there is a shorter segment match later in a matching\n //config, then favor over this star map.\n if (!foundStarMap && starMap && starMap[nameSegment]) {\n foundStarMap = starMap[nameSegment];\n starI = i;\n }\n }\n\n if (!foundMap && foundStarMap) {\n foundMap = foundStarMap;\n foundI = starI;\n }\n\n if (foundMap) {\n nameParts.splice(0, foundI, foundMap);\n name = nameParts.join('/');\n }\n }\n\n return name;\n }\n\n function makeRequire(relName, forceSync) {\n return function () {\n //A version of a require function that passes a moduleName\n //value for items that may need to\n //look up paths relative to the moduleName\n var args = aps.call(arguments, 0);\n\n //If first arg is not require('string'), and there is only\n //one arg, it is the array form without a callback. Insert\n //a null so that the following concat is correct.\n if (typeof args[0] !== 'string' && args.length === 1) {\n args.push(null);\n }\n return req.apply(undef, args.concat([relName, forceSync]));\n };\n }\n\n function makeNormalize(relName) {\n return function (name) {\n return normalize(name, relName);\n };\n }\n\n function makeLoad(depName) {\n return function (value) {\n defined[depName] = value;\n };\n }\n\n function callDep(name) {\n if (hasProp(waiting, name)) {\n var args = waiting[name];\n delete waiting[name];\n defining[name] = true;\n main.apply(undef, args);\n }\n\n if (!hasProp(defined, name) && !hasProp(defining, name)) {\n throw new Error('No ' + name);\n }\n return defined[name];\n }\n\n //Turns a plugin!resource to [plugin, resource]\n //with the plugin being undefined if the name\n //did not have a plugin prefix.\n function splitPrefix(name) {\n var prefix,\n index = name ? name.indexOf('!') : -1;\n if (index > -1) {\n prefix = name.substring(0, index);\n name = name.substring(index + 1, name.length);\n }\n return [prefix, name];\n }\n\n /**\n * Makes a name map, normalizing the name, and using a plugin\n * for normalization if necessary. Grabs a ref to plugin\n * too, as an optimization.\n */\n makeMap = function (name, relName) {\n var plugin,\n parts = splitPrefix(name),\n prefix = parts[0];\n\n name = parts[1];\n\n if (prefix) {\n prefix = normalize(prefix, relName);\n plugin = callDep(prefix);\n }\n\n //Normalize according\n if (prefix) {\n if (plugin && plugin.normalize) {\n name = plugin.normalize(name, makeNormalize(relName));\n } else {\n name = normalize(name, relName);\n }\n } else {\n name = normalize(name, relName);\n parts = splitPrefix(name);\n prefix = parts[0];\n name = parts[1];\n if (prefix) {\n plugin = callDep(prefix);\n }\n }\n\n //Using ridiculous property names for space reasons\n return {\n f: prefix ? prefix + '!' + name : name, //fullName\n n: name,\n pr: prefix,\n p: plugin\n };\n };\n\n function makeConfig(name) {\n return function () {\n return (config && config.config && config.config[name]) || {};\n };\n }\n\n handlers = {\n require: function (name) {\n return makeRequire(name);\n },\n exports: function (name) {\n var e = defined[name];\n if (typeof e !== 'undefined') {\n return e;\n } else {\n return (defined[name] = {});\n }\n },\n module: function (name) {\n return {\n id: name,\n uri: '',\n exports: defined[name],\n config: makeConfig(name)\n };\n }\n };\n\n main = function (name, deps, callback, relName) {\n var cjsModule, depName, ret, map, i,\n args = [],\n callbackType = typeof callback,\n usingExports;\n\n //Use name if no relName\n relName = relName || name;\n\n //Call the callback to define the module, if necessary.\n if (callbackType === 'undefined' || callbackType === 'function') {\n //Pull out the defined dependencies and pass the ordered\n //values to the callback.\n //Default to [require, exports, module] if no deps\n deps = !deps.length && callback.length ? ['require', 'exports', 'module'] : deps;\n for (i = 0; i < deps.length; i += 1) {\n map = makeMap(deps[i], relName);\n depName = map.f;\n\n //Fast path CommonJS standard dependencies.\n if (depName === \"require\") {\n args[i] = handlers.require(name);\n } else if (depName === \"exports\") {\n //CommonJS module spec 1.1\n args[i] = handlers.exports(name);\n usingExports = true;\n } else if (depName === \"module\") {\n //CommonJS module spec 1.1\n cjsModule = args[i] = handlers.module(name);\n } else if (hasProp(defined, depName) ||\n hasProp(waiting, depName) ||\n hasProp(defining, depName)) {\n args[i] = callDep(depName);\n } else if (map.p) {\n map.p.load(map.n, makeRequire(relName, true), makeLoad(depName), {});\n args[i] = defined[depName];\n } else {\n throw new Error(name + ' missing ' + depName);\n }\n }\n\n ret = callback ? callback.apply(defined[name], args) : undefined;\n\n if (name) {\n //If setting exports via \"module\" is in play,\n //favor that over return value and exports. After that,\n //favor a non-undefined return value over exports use.\n if (cjsModule && cjsModule.exports !== undef &&\n cjsModule.exports !== defined[name]) {\n defined[name] = cjsModule.exports;\n } else if (ret !== undef || !usingExports) {\n //Use the return value from the function.\n defined[name] = ret;\n }\n }\n } else if (name) {\n //May just be an object definition for the module. Only\n //worry about defining if have a module name.\n defined[name] = callback;\n }\n };\n\n requirejs = require = req = function (deps, callback, relName, forceSync, alt) {\n if (typeof deps === \"string\") {\n if (handlers[deps]) {\n //callback in this case is really relName\n return handlers[deps](callback);\n }\n //Just return the module wanted. In this scenario, the\n //deps arg is the module name, and second arg (if passed)\n //is just the relName.\n //Normalize module name, if it contains . or ..\n return callDep(makeMap(deps, callback).f);\n } else if (!deps.splice) {\n //deps is a config object, not an array.\n config = deps;\n if (config.deps) {\n req(config.deps, config.callback);\n }\n if (!callback) {\n return;\n }\n\n if (callback.splice) {\n //callback is an array, which means it is a dependency list.\n //Adjust args if there are dependencies\n deps = callback;\n callback = relName;\n relName = null;\n } else {\n deps = undef;\n }\n }\n\n //Support require(['a'])\n callback = callback || function () {};\n\n //If relName is a function, it is an errback handler,\n //so remove it.\n if (typeof relName === 'function') {\n relName = forceSync;\n forceSync = alt;\n }\n\n //Simulate async callback;\n if (forceSync) {\n main(undef, deps, callback, relName);\n } else {\n //Using a non-zero value because of concern for what old browsers\n //do, and latest browsers \"upgrade\" to 4 if lower value is used:\n //http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-settimeout:\n //If want a value immediately, use require('id') instead -- something\n //that works in almond on the global level, but not guaranteed and\n //unlikely to work in other AMD implementations.\n setTimeout(function () {\n main(undef, deps, callback, relName);\n }, 4);\n }\n\n return req;\n };\n\n /**\n * Just drops the config on the floor, but returns req in case\n * the config return value is used.\n */\n req.config = function (cfg) {\n return req(cfg);\n };\n\n /**\n * Expose module registry for debugging and tooling\n */\n requirejs._defined = defined;\n\n define = function (name, deps, callback) {\n if (typeof name !== 'string') {\n throw new Error('See almond README: incorrect module build, no module name');\n }\n\n //This module may not have dependencies\n if (!deps.splice) {\n //deps is not an array, so probably means\n //an object literal or factory function for\n //the value. Adjust args.\n callback = deps;\n deps = [];\n }\n\n if (!hasProp(defined, name) && !hasProp(waiting, name)) {\n waiting[name] = [name, deps, callback];\n }\n };\n\n define.amd = {\n jQuery: true\n };\n}());\n\ndefine(\"../lib/almond\", function(){});\n\n/**\n * Renders an application menu item from a domain model.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/menuItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-app-menu-item',\n\n\t\tinitialize: function() {\n\t\t\t// Listen for domain changes and re-render when we detect one.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.render );\n\t\t\t// When we change the model (to disable it, for example), re-render.\n\t\t\tthis.model.on( 'change', this.render, this );\n\t\t},\n\n\t\t/**\n\t\t * When we render this view, remove the extra <div> tag created by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\t// Listen for clicks on our app menu.\n\t\tevents: {\n\t\t\t'click a': 'clickAppMenu'\n\t\t},\n\n\t\t/**\n\t\t * When we click on a menu item, fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * We pass this.model so that we know what item was clicked.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\te event\n\t\t * @return return\n\t\t */\n\t\tclickAppMenu: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:menu', e, this.model );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\t/**\n\t\t\t\t * If we have any dashicons in our model, render them.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDashicons: function() {\n\t\t\t\t\tif ( ! this.dashicons ) return '';\n\n\t\t\t\t\tvar icon = document.createElement( 'span' );\n\t\t\t\t\ticon.classList.add( 'dashicons' );\n\t\t\t\t\ticon.classList.add( this.dashicons );\n\n\t\t\t\t\treturn icon.outerHTML;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * Render classes for our menu item, including active.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = this.classes;\n\t\t\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tif ( currentDomain.get( 'id' ) == this.id ) {\n\t\t\t\t\t\tclasses += ' active';\n\t\t\t\t\t}\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its url.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderUrl: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t\t\t\treturn this.url + formModel.get( 'id' );\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '#';\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its target.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderTarget: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\treturn '_blank';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '_self';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t\t/**\n\t\t\t\t * If our menu item is disabled, output 'disabled'\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\tif ( this.disabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n\n/**\n * Collection view that takes our app menu items and renders an individual view for each.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/menu',['views/app/menuItem'], function( appMenuItemView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: appMenuItemView,\n\n\t\t/**\n\t\t * When we show this view, get rid of the extra <div> tag added by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).find( 'li:last' ).unwrap();\n\t\t}\n\t} );\n\n\treturn view;\n} );\n/**\n * Renders the action buttons to the right of the app menu. i.e. Publish\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/menuButtons',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'span',\n\t\ttemplate: '#tmpl-nf-app-header-action-button',\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes on the app 'clean' state. When it changes, re-render.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.render, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:loading', this.render, this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'response:updateDB', this.bounceIcon, this );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\n\t \t\t/**\n\t \t\t * Render our Publish button. If we're loading, render the loading version.\n\t \t\t *\n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\trenderPublish: function() {\n\t \t\t\tif ( that.publishWidth ) {\n\t \t\t\t\tthis.publishWidth = that.publishWidth + 'px';\n\t \t\t\t} else {\n\t \t\t\t\tthis.publishWidth = 'auto';\n\t \t\t\t}\n\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'loading' ) ) {\n\t \t\t\t\tvar template = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-add-header-publish-loading' );\n\t \t\t\t} else {\n\t \t\t\t\tvar template = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-app-header-publish-button' );\n\t \t\t\t}\n\t \t\t\treturn template( this );\n\t \t\t},\n\n\t \t\t/**\n\t \t\t * If our app state is clean, disable publish.\n\t \t\t * \n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\tmaybeDisabled: function() {\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t \t\t\t\treturn 'disabled';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t},\n\n\t \t\t/**\n\t \t\t * [DEPRECATED] If our app isn't clean, render our 'viewChanges' button.\n\t \t\t * @since version\n\t \t\t * @return {[type]} [description]\n\t \t\t */\n\t \t\tmaybeRenderCancel: function() {\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\n\t \t\trenderPublicLink: function() {\n\t\t\t\t\t\t// Don't show public link if the form has a temp ID\n\t\t\t\t\t\tvar formModel = Backbone.Radio.channel('app').request('get:formModel');\n\t\t\t\t\t\tif (isNaN(formModel.get('id'))) { return };\n\t\t\t\t\t\t// Otherwise, display normally\n\t \t\t\tvar publicLink = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-app-header-public-link' );\n\t \t\t\t\treturn publicLink( this );\n\t \t\t},\n\t\t\t};\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tvar publishEL = jQuery( this.el ).find( '.publish' );\n\t\t\t// this.publishWidth = jQuery( publishEL ).outerWidth( true );\n\t\t},\n\n\t\t/**\n\t\t * Listen for clicks on the Publish or view changes button.\n\t\t * @type {Object}\n\t\t */\n\t\tevents: {\n\t\t\t'click .publish': 'clickPublish',\n\t\t\t'click .viewChanges': 'clickViewChanges',\n\t\t\t'click .publicLink': 'clickPublicLink',\n\t\t},\n\n\t\t/**\n\t\t * When we click publish, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickPublish: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:publish', e );\n\t\t},\n\n\t\t/**\n\t\t * When we click view changes, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickViewChanges: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:viewChanges', e );\n\t\t},\n\n\t\tclickPublicLink: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:publicLink', e );\n\t\t},\n\n\t\tbounceIcon: function( changeModel ) {\n\t\t\tjQuery( this.el ).find( '.dashicons-backup' ).effect( 'bounce', { times: 3 }, 600 );\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n\n/**\n * Renders the action buttons to the right of the app menu. i.e. Publish\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/mobileMenuButton',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'span',\n\t\ttemplate: '#tmpl-nf-mobile-menu-button',\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes on the app 'clean' state. When it changes, re-render.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.render, this );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\t \t\t/**\n\t \t\t * If our app state is clean, disable button.\n\t \t\t * \n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\tmaybeDisabled: function() {\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t \t\t\t\treturn 'disabled';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t}\n\t\t\t};\n\t\t},\n\n\t\t/**\n\t\t * Listen for clicks on the mobile menu button.\n\t\t * @type {Object}\n\t\t */\n\t\tevents: {\n\t\t\t'click .nf-mobile-menu': 'clickMobileMenu'\n\t\t},\n\n\t\t/**\n\t\t * When we click publish, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickMobileMenu: function( e) {\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).toggleClass( 'nf-menu-expand' );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Main application header. Includes links to all of our domains.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/header',['views/app/menu', 'views/app/menuButtons', 'views/app/mobileMenuButton'], function( appMenuCollectionView, appMenuButtonsView, mobileMenuButtonView ) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-app-header',\n\n\t\tregions: {\n\t\t\t// Menu is our main app menu.\n\t\t\tmenu: '.nf-app-menu',\n\t\t\t// Buttons represents the 'view changes' and 'Publish' buttons.\n\t\t\tbuttons: '.nf-app-buttons',\n\t\t\tmobileMenuButton: '.nf-mobile-menu-button'\n\t\t},\n\n\t\t/**\n\t\t * Since this is a layout region, we need to fill the two areas: menu and buttons whenever we show this view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\t// Get our domains\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\t// show the menu area using the appropriate view, passing our domain collection.\n\t\t\tthis.menu.show( new appMenuCollectionView( { collection: appDomainCollection } ) );\n\t\t\tthis.buttons.show( new appMenuButtonsView() );\n\t\t\tthis.mobileMenuButton.show( new mobileMenuButtonView() );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click #nf-logo': 'clickLogo'\n\t\t},\n\n\t\tclickLogo: function( e ) {\n\t\t\t\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n/**\n * Renders our sub-header. i.e. add new field, add new action, etc.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header'\n\t});\n\n\treturn view;\n} );\n/**\n * Renders our builder header.\n *\n * This is a layout view and handles two regions:\n * app - menu/buttons\n * subapp - title, add new field, etc.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/builderHeader',[ 'views/app/header', 'views/app/subHeader' ], function( appHeaderView, appSubHeaderView ) {\n\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: \"div\",\n\t\ttemplate: \"#tmpl-nf-header\",\n\n\t\tregions: {\n\t\t\tapp: \"#nf-app-header\",\n\t\t\tformTitle: \"#nf-app-form-title\",\n\t\t\tappSub: \"#nf-app-sub-header\"\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.changeSubHeader );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tthis.app.show( new appHeaderView() );\n\n\t\t\tvar formData = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\tvar formSettings = formData.get( 'settings' );\n\n\t\t\tvar formTitleView = nfRadio.channel( 'views' ).request( 'get:formTitle' );\n\t\t\tthis.formTitle.show( new formTitleView( { model: formSettings } ) );\n\n\t\t\tthis.changeSubHeader();\n\t\t},\n\n\t\tchangeSubHeader: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar subHeaderView = currentDomain.get( 'getSubHeaderView' ).call( currentDomain );\n\t\t\tthis.appSub.show( subHeaderView );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Renders our builder.\n *\n * This is a layout view and handles three regions:\n * gutterLeft - gutter to the left of our main content area\n * body - main content area\n * gutterRight - gutter to the right of our main content area\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/main',[], function() {\n\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main',\n\t\tclassName: 'nf-main-test',\n\t\tmaybeDone: false,\n\n\t\toffsetRight: false,\n\t\toffsetLeft: false,\n\n\t\tregions: {\n\t\t\tgutterLeft: '#nf-main-gutter-left',\n\t\t\tbody: '#nf-main-body',\n\t\t\tgutterRight: '#nf-main-gutter-right'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.render );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:mainEl', this.getMainEl, this );\n\n\t\t\t/*\n\t\t\t * Make sure that our gutters resize to match our screen upon resize or drawer open/close.\n\t\t\t */\n\t\t\tjQuery( window ).on( 'resize', { context: this }, this.resizeBothGutters );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'before:open', this.setBothGuttersAbsolute );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.setBothGuttersFixed );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'before:close', this.setBothGuttersAbsolute );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.setBothGuttersFixed );\n\t\t\t// ... or Domain Change.\n this.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', function(){\n // @todo Using a timeout feels like a hack, but there may be a timing issue here.\n \tsetTimeout(function(){\n nfRadio.channel( 'app' ).request( 'update:gutters' );\n\t\t\t\t}, 300, this );\n\t\t\t}, this );\n\n\n\t\t\t/*\n\t\t\t * Reply to messages requesting that we resize our gutters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:gutters', this.updateGutters, this );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tnfRadio.channel( 'main' ).trigger( 'show:main', this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar bodyView = currentDomain.get( 'getMainContentView' ).call( currentDomain );\n\t\t\tthis.body.show( bodyView );\n\n\t\t\tvar gutterLeftView = currentDomain.get( 'getGutterLeftView' ).call( currentDomain );\n\t\t\tthis.gutterLeft.show( gutterLeftView );\n\n\t\t\tvar gutterRightView = currentDomain.get( 'getGutterRightView' ).call( currentDomain );\n\t\t\tthis.gutterRight.show( gutterRightView );\n\t\t\t\n\t\t\tnfRadio.channel( 'main' ).trigger( 'render:main' );\n\t\t},\n\n\t\tgetMainEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tonAttach: function() {\n\t\t\tthis.initialGutterResize();\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tjQuery( window ).off( 'resize', this.resize );\n\t\t},\n\n\t\tinitialGutterResize: function() {\n\t\t\tthis.resizeGutter( this.gutterLeft.el );\n\t\t\tthis.resizeGutter( this.gutterRight.el );\n\t\t\tthis.setBothGuttersFixed( this );\n\t\t},\n\n\t\tresizeBothGutters: function( e ) {\n\t\t\tvar context = ( e ) ? e.data.context : this;\n\n\t\t\tvar leftEl = context.gutterLeft.el;\n\t\t\tvar rightEl = context.gutterRight.el;\n\t\t\t\n\t\t\tcontext.resizeGutter( leftEl, context );\n\t\t\tcontext.resizeGutter( rightEl, context );\n\n\t\t\tcontext.setBothGuttersAbsolute( context );\n\n\t\t\t/*\n\t\t\t * Clear our timeout. If the timeout runs, it means we've stopped resizing.\n\t\t\t */\t\n\t\t\tclearTimeout( context.maybeDone );\n\t\t\t/*\n\t\t\t * Add our timeout.\n\t\t\t */\n\t\t\tcontext.maybeDone = setTimeout( context.setBothGuttersFixed, 100, context );\n\t\t},\n\n\t\tresizeGutter: function( el, context ) {\n\t\t\tvar top = jQuery( el ).offset().top;\n\t\t\tvar viewHeight = jQuery( window ).height();\n\t\t\tvar height = viewHeight - top;\n\t\t\tjQuery( el ).height( height );\n\t\t},\n\n\t\tsetBothGuttersFixed: function( context ) {\n\t\t\tcontext = context || this;\n\n\t\t\tvar offsetLeft = jQuery( context.gutterLeft.el ).offset();\n\t\t\tvar topLeft = offsetLeft.top;\n\t\t\tvar leftLeft = offsetLeft.left;\n\n\t\t\tjQuery( context.gutterLeft.el ).css( { position: 'fixed', left: leftLeft, top: topLeft } );\t\t\tvar offsetLeft = jQuery( context.gutterLeft.el ).offset();\n\t\t\t\n\t\t\tvar offsetRight = jQuery( context.gutterRight.el ).offset();\n\t\t\tvar topRight = offsetRight.top;\n\t\t\tvar leftRight = offsetRight.left;\n\n\t\t\tjQuery( context.gutterRight.el ).css( { position: 'fixed', left: leftRight, top: topRight } );\n\t\t},\n\n\t\tsetBothGuttersAbsolute: function( context ) {\n\t\t\tcontext = context || this;\n\n\t\t\tvar offsetLeft = jQuery( context.gutterLeft.el ).offset();\n\t\t\tvar offsetRight = jQuery( context.gutterRight.el ).offset();\n\n\t\t\tvar scrollTop = jQuery( '#nf-main' ).scrollTop();\n\n\t\t\tjQuery( context.gutterLeft.el ).css( { position: 'absolute', left: 0, top: scrollTop } );\n\t\t\tjQuery( context.gutterRight.el ).css( { position: 'absolute', top: scrollTop, right: 0, left: 'auto' } );\n\t\t},\n\n\t\tupdateGutters: function() {\n\t\t\tthis.resizeBothGutters();\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n\n/**\n * Renders an application menu item from a domain model.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/mobileMenuItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-mobile-menu-item',\n\n\t\t/**\n\t\t * When we render this view, remove the extra <div> tag created by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\t// Listen for clicks on our app menu.\n\t\tevents: {\n\t\t\t'click a': 'clickAppMenu'\n\t\t},\n\n\t\t/**\n\t\t * When we click on a menu item, fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * We pass this.model so that we know what item was clicked.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\te event\n\t\t * @return return\n\t\t */\n\t\tclickAppMenu: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:menu', e, this.model );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\t/**\n\t\t\t\t * If we have any dashicons in our model, render them.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDashicons: function() {\n\t\t\t\t\tif ( ! this.mobileDashicon ) return '';\n\n var icon = document.createElement( 'span' );\n icon.classList.add( 'dashicons' );\n icon.classList.add( this.mobileDashicon );\n\n return icon.outerHTML;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * Render classes for our menu item, including active.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = this.classes;\n\t\t\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tif ( currentDomain.get( 'id' ) == this.id ) {\n\t\t\t\t\t\tclasses += ' active';\n\t\t\t\t\t}\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its url.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderUrl: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t\t\t\treturn this.url + formModel.get( 'id' );\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '#';\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its target.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderTarget: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\treturn '_blank';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '_self';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t\t/**\n\t\t\t\t * If our menu item is disabled, output 'disabled'\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\tif ( this.disabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n\n/**\n * Single item view used for the menu drawer.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/mobileMenu',['views/app/mobileMenuItem'], function( mobileMenuItemView ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-mobile-menu',\n\t\tchildView: mobileMenuItemView,\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes on the app 'clean' state. When it changes, re-render.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.render, this );\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.secondary' ).append( childView.el );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\t/**\n\t \t\t * If our app state is clean, disable button.\n\t \t\t * \n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\tmaybeDisabled: function() {\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t \t\t\t\treturn 'disabled';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t}\n\t\t\t};\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-publish': 'clickPublish'\n\t\t},\n\n\t\t/**\n\t\t * When we click publish, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickPublish: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:publish', e );\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).toggleClass( 'nf-menu-expand' );\n\t\t},\n\t});\n\n\treturn view;\n} );\n/**\n * Empty drawer content view.\n * Called before we close the drawer.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-empty'\n\t});\n\n\treturn view;\n} );\n/**\n * Renders our drawer region\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer',['views/app/drawer/contentEmpty'], function( drawerEmptyView ) {\n\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer',\n\n\t\tregions: {\n\t\t\theader: '#nf-drawer-header',\n\t\t\tcontent: '#nf-drawer-content',\n\t\t\tfooter: '#nf-drawer-footer'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:drawerEl', this.getEl, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'load:drawerContent', this.loadContent, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'empty:drawerContent', this.emptyContent, this );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).parent().perfectScrollbar();\n\t\t},\n\n\t\tloadContent: function( drawerID, data ) {\n\t\t\tvar drawer = nfRadio.channel( 'app' ).request( 'get:drawer', drawerID );\n\t\t\tvar contentView = drawer.get( 'getContentView' ).call( drawer, data );\n\t\t\tvar headerView = drawer.get( 'getHeaderView' ).call( drawer, data );\n\t\t\tvar footerView = drawer.get( 'getFooterView' ).call( drawer, data );\n\n\t\t\tthis.header.show( headerView );\n\t\t\tthis.content.show( contentView );\n\t\t\tthis.footer.show( footerView );\n\n\t\t},\n\n\t\temptyContent: function() {\n\t\t\tthis.header.empty();\n\t\t\tthis.content.empty();\n\t\t\tthis.footer.empty();\n\t\t},\n\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-toggle-drawer': 'clickToggleDrawer'\n\t\t},\n\n\t\tclickToggleDrawer: function() {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:toggleDrawerSize' );\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Single item view used for merge tags.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'li',\n\n\t\ttemplate: '#tmpl-nf-merge-tags-item',\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:active', this.render );\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:active', this.render, this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click a': 'clickTag'\n\t\t},\n\n\t\tclickTag: function( e ) {\n\t\t\tnfRadio.channel( 'mergeTags' ).trigger( 'click:mergeTag', e, this.model );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tif ( this.active ) {\n\t\t\t\t\t\treturn 'active';\n\t\t\t\t\t}\n\t\t\t\t}\t\t\t\t\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Merge tags popup section\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagsSection',['views/app/drawer/mergeTagItem'], function( mergeTagItemView ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\ttagName: 'div',\n\t\tchildView: mergeTagItemView,\n\t\ttemplate: '#tmpl-nf-merge-tags-section',\n\n\t\tinitialize: function() {\n\t\t\tthis.collection = this.model.get( 'tags' );\n\t\t\tthis.model.on( 'change', this.render, this );\n\t\t\tif ( 'fields' == this.model.get( 'id' ) ) {\n\t\t\t\t// var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t\t// fieldCollection.on( 'all', this.updateFields, this );\n\t\t\t}\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change', this.render );\n\t\t\tif ( 'fields' == this.model.get( 'id' ) ) {\n\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t\tfieldCollection.off( 'all', this.updateFields, this );\n\t\t\t}\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.merge-tags' ).append( childView.el );\n\t\t},\n\n\t\tupdateFields: function() {\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\tthis.model.set( 'tags', fieldCollection );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Model that represents our merge tags.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/mergeTagModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tactive: false,\n\t\t\texclude: false\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collections of merge tags.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/mergeTagCollection',['models/app/mergeTagModel'], function( mergeTagModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: mergeTagModel\n\t} );\n\treturn collection;\n} );\n/**\n * Merge tags popup\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagsContent',['views/app/drawer/mergeTagsSection', 'models/app/mergeTagCollection'], function( mergeTagsSectionView, MergeTagCollection ) {\n\tvar view = Marionette.CollectionView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-merge-tags-content',\n\t\tchildView: mergeTagsSectionView,\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'get:view', this.getMergeTagsView, this );\n\t\t},\n\n\t\treRender: function( settingModel ) {\n\t\t\tvar mergeTagCollection = nfRadio.channel( 'mergeTags' ).request( 'get:collection' );\n\t\t\tvar defaultGroups = mergeTagCollection.where( { default_group: true } );\n\n\t\t\t/*\n\t\t\t * For the Actions Domain, Add Calc Merge Tags as a Default Group.\n\t\t\t */\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tif( 'actions' == currentDomain.get( 'id' ) ){\n\t\t\t\tvar calcMergeTagGroup = mergeTagCollection.where( { id: 'calcs' } );\n defaultGroups = defaultGroups.concat( calcMergeTagGroup );\n }\n\n\t\t\tthis.collection = new MergeTagCollection( defaultGroups );\n\t\t\tvar that = this;\n\t\t\tvar useMergeTags = settingModel.get( 'use_merge_tags' );\n\t\t\tif ( 'object' == typeof useMergeTags ) {\n\t\t\t\tif ( 'undefined' != typeof useMergeTags.exclude ) {\n\t\t\t\t\t_.each( useMergeTags.exclude, function( exclude ) {\n\t\t\t\t\t\tthat.collection.remove( exclude )\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\tif ( 'undefined' != typeof useMergeTags.include ) {\n\t\t\t\t\t_.each( mergeTagCollection.models, function( sectionModel ) {\n\t\t\t\t\t\tif ( -1 != useMergeTags.include.indexOf( sectionModel.get( 'id' ) ) ) {\n\t\t\t\t\t\t\t// console.log( sectionModel );\n\t\t\t\t\t\t\tthat.collection.add( sectionModel );\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.render();\n\t\t},\n\n\t\tgetMergeTagsView: function() {\n\t\t\treturn this;\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Builder view.\n *\n * This layout view has regions that represent our application areas:\n * header\n * main\n * menuDrawer - Mobile side-menu\n * drawer\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/builder',['views/app/builderHeader', 'views/app/main', 'views/app/mobileMenu', 'views/app/drawer', 'views/app/drawer/mergeTagsContent'], function( headerView, mainView, mobileMenuView, drawerView, mergeTagsContentView ) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: \"#tmpl-nf-builder\",\n\t\tel: '#nf-builder',\n\n\t\tregions: {\n\t\t\theader: \"#nf-header\",\n\t\t\tmain: \"#nf-main\",\n\t\t\tmenuDrawer: \"#nf-menu-drawer\",\n\t\t\tdrawer: \"#nf-drawer\",\n\t\t\tmergeTagsContent: '.merge-tags-content'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Respond to requests asking for the builder dom element.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:builderEl', this.getBuilderEl, this );\n\t\t\t// Respond to requests asking for the builder view\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:builderView', this.getBuilderView, this );\n\t\t\t// Layout views aren't self-rendering.\n\t\t\tthis.render();\n\t\t\tvar mergeTags = nfRadio.channel( 'mergeTags' ).request( 'get:collection' );\n\t\t\tvar mergeTagsClone = mergeTags.clone();\n\t\t\tthis.mergeTagsContent.show( new mergeTagsContentView( { collection: mergeTagsClone } ) );\n\t\t\t// Show our header.\n\t\t\tthis.header.show( new headerView() );\n\t\t\t// Show our main content.\n\t\t\tthis.main.show( new mainView() );\n\t\t\t// Show our mobile menu\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tthis.menuDrawer.show( new mobileMenuView( { collection: appDomainCollection } ) );\n\t\t\t// Show our drawer.\n\t\t\tthis.drawer.show( new drawerView() );\n\n\n\t\t},\n\n\t\tonRender: function() {\n\n\t\t},\n\n\t\tgetBuilderEl: function() {\n\t\t\treturn this.el;\n\t\t},\n\n\t\tgetBuilderView: function() {\n\t\t\treturn this;\n\t\t},\n\n\t\t// Listen for clicks\n\t\tevents: {\n\t\t\t'click .nf-open-drawer': 'openDrawer',\n\t\t\t'click .nf-change-domain': 'changeDomain',\n\t\t\t'click .nf-close-drawer': 'closeDrawer'\n\t\t},\n\n\t\t/**\n\t\t * Someone clicked to open a drawer, so fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \te \tevent\n\t\t * @return void\n\t\t */\n\t\topenDrawer: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:openDrawer', e );\n\t\t},\n\t\t/**\n\t\t * Someone clicked to close a drawer, so fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tcloseDrawer: function() {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:closeDrawer' );\n\t\t},\n\t\t/**\n\t\t * Someone clicked to change the domain, so fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \te \tevent\n\t\t * @return void\n\t\t */\n\t\tchangeDomain: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:menu', e );\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n\n\ndefine( 'controllers/app/remote',[], function() {\n return Marionette.Object.extend( {\n initialize: function() {\n this.listenTo( nfRadio.channel( 'setting' ), 'remote', this.addListener );\n },\n\n addListener: function( model, dataModel ) {\n\n var listenTo = model.get( 'remote' ).listen;\n\n // TODO: Change seems to be triggering twice on each update.\n this.listenTo( nfRadio.channel( 'fieldSetting-' + listenTo ), 'update:setting', this.updateSetting );\n this.listenTo( nfRadio.channel( 'actionSetting-' + listenTo ), 'update:setting', this.updateSetting );\n\n this.listenTo( nfRadio.channel( 'setting-type-' + model.get( 'type' ) ), 'click:extra', this.clickExtra );\n\n model.listenTo( nfRadio.channel( 'setting-remote' ), 'get:remote', this.getRemote, model );\n\n // Auto-trigger get:remote on drawer load.\n nfRadio.channel( 'setting-remote' ).trigger( 'get:remote', dataModel );\n },\n\n clickExtra: function( e, settingModel, dataModel, settingView ) {\n jQuery( e.srcElement ).addClass( 'spin' );\n nfRadio.channel( 'setting-remote' ).trigger( 'get:remote', dataModel );\n },\n\n updateSetting: function( dataModel, settingModel ) {\n nfRadio.channel( 'setting-remote' ).trigger( 'get:remote', dataModel );\n },\n\n getRemote: function( dataModel ) {\n\n var remote = this.get( 'remote' );\n\n var data = {\n parentValue: dataModel.get( remote.listen ),\n action: remote.action,\n security: ( remote.security ) ? remote.security : nfAdmin.ajaxNonce\n };\n\n // TODO: Disable setting and lock drawer while updating.\n var that = this;\n jQuery.post( ajaxurl, data, function( response ){\n var response = JSON.parse( response );\n\n if( 'textbox' == that.get( 'type' ) ) {\n dataModel.set( that.get('name'), response.value );\n }\n\n if( 'select' == that.get( 'type' ) ) {\n that.set( 'options', response.options );\n that.trigger( 'rerender' );\n }\n });\n },\n\n });\n} );\n/**\n * Handles opening and closing our drawer. This is where we display settings for fields, actions, and settings.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/drawer',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our drawer-related click events.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:openDrawer', this.clickOpenDrawer );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:closeDrawer', this.closeDrawer );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:toggleDrawerSize', this.toggleDrawerSize );\n\n\t\t\t// Reply to direct requests to open or close the drawer.\n\t\t\tnfRadio.channel( 'app' ).reply( 'open:drawer', this.openDrawer, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'close:drawer', this.closeDrawer, this );\n\n\t\t\t/*\n\t\t\t * When we close the drawer, we have to figure out what the right position should be.\n\t\t\t * This listens to requests from other parts of our app asking what the closed right position is.\n\t\t\t */\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:closedRightPos', this.getClosedDrawerPos, this );\n\t\t\t\n\t\t\t// Reply to requests to prevent our drawer from closing\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'prevent:close', this.preventClose, this );\n\t\t\t// Reply to requests to enable drawer closing\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'enable:close', this.enableClose, this );\n\t\t\t// Reply to requests for our disabled/enabled state.\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:preventClose', this.maybePreventClose, this );\n\n\t\t\t/*\n\t\t\t * Object that holds our array of 'prevent close' values.\n\t\t\t * We use an array so that registered requests can unregister and not affect each other.\n\t\t\t */\n\t\t\tthis.objPreventClose = {};\n\n\t\t\t/*\n\t\t\t * Listen to focus events on the filter and stop our interval when it happens.\n\t\t\t * This is to fix a bug that can cause the filter to gain focus every few seconds.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'filter:focused', this.filterFocused );\n\t\t},\n\n\t\t/**\n\t\t * Handles closing our drawer\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tcloseDrawer: function() {\n\t\t\t// Get our current domain.\n\t\t\tvar currentDrawer = nfRadio.channel( 'app' ).request( 'get:currentDrawer' );\n if ( ! currentDrawer || this.maybePreventClose() ) {\n return false;\n }\n\n\t\t\t// Triggers the before close drawer action on our current domain's drawer channel.\n\t\t\tnfRadio.channel( 'drawer-' + currentDrawer.get( 'id' ) ).trigger( 'before:closeDrawer' );\n\t\t\t/*\n\t\t\t * The 'before:closeDrawer' message is deprecated as of version 3.0 in favour of 'before:close'.\n\t\t\t * TODO: Remove this radio message in the future.\n\t\t\t */\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'before:closeDrawer' );\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'before:close' );\n\t\t\t// Send a message to our drawer to empty its contents.\n\t\t\tnfRadio.channel( 'drawer' ).request( 'empty:drawerContent' );\n\n\t\t\t// To close our drawer, we have to add our closed class to the builder and remove the opened class.\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).addClass( 'nf-drawer-closed' ).removeClass( 'nf-drawer-opened' );\n\t\t\tjQuery( builderEl ).removeClass( 'disable-main' );\n\n\t\t\t// Get the right position of our closed drawer. Should be container size in -px.\n\t\t\tvar rightClosed = this.getClosedDrawerPos();\n\n\t\t\t// Get our drawer element and give change the 'right' property to our closed position.\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tjQuery( drawerEl ).css( { 'right': rightClosed } );\n\n\t\t\t// In order to access properties in 'this' context in our interval below, we have to set it here.\t\n\t\t\tvar that = this;\n\n\t\t\t/*\n\t\t\t * Since jQuery can't bind to a CSS change, we poll every .15 seconds to see if we've closed the drawer.\n\t\t\t *\n\t\t\t * Once our drawer is closed, we:\n\t\t\t * clear our interval\n\t\t\t * request that the app change it's current drawer to false\n\t\t\t * trigger a drawer closed message\n\t\t\t */\n\t\t\tthis.checkCloseDrawerPos = setInterval( function() {\n\t \tif ( rightClosed == jQuery( drawerEl ).css( 'right' ) ) {\n\t \t\tclearInterval( that.checkCloseDrawerPos );\n\t\t \t\tnfRadio.channel( 'app' ).request( 'update:currentDrawer', false );\n\t\t \t\tnfRadio.channel( 'drawer' ).trigger( 'closed' );\n\t\t \t\t/*\n\t\t \t\t * Reset the add new button z-index to 98.\n\t\t \t\t */\n\t\t \t\tjQuery( '.nf-master-control' ).css( 'z-index', 98 );\n\t\t \t\t// jQuery( drawerEl ).scrollTop( 0 );\n\t \t}\n\t\t\t}, 150 );\n\t\t},\n\n\t\t/**\n\t\t * Click handler for our 'open drawer' event.\n\t\t * @since 3.0\n\t\t * @param e jQuery event\n\t\t * @return void\n\t\t */\n\t\tclickOpenDrawer: function( e ) {\n\t\t\tvar drawerID = jQuery( e.target ).data( 'drawerid' );\n\t\t\tthis.openDrawer( drawerID );\n\t\t},\n\n\t\t/**\n\t\t * Open our drawer.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string drawerID \tID of the drawer we want to open.\n\t\t * @param object data \tOptional data that we want to pass to the drawer.\n\t\t * @return void\n\t\t */\n\t\topenDrawer: function( drawerID, data ) {\n\t\t\tif ( this.maybePreventClose() ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t// If we haven't sent a data object, set the variable to an empty object.\n\t\t\tdata = data || {};\n\n\t\t\t/*\n\t\t\t * If we're dealing with something that has a model, set the proper active state.\n\t\t\t *\n\t\t\t * TODO: Make this more dynamic. I'm not sure that it fits in the drawer controller.\n\t\t\t */\n\t\t\tif ( 'undefined' != typeof data.model ) {\n\t\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\t\t\t\tnfRadio.channel( currentDomainID ).request( 'clear:editActive' );\n\t\t\t\tdata.model.set( 'editActive', true );\n\t\t\t\tthis.dataModel = data.model;\n\t\t\t}\n\n\t\t\t// Send out a message requesting our drawer view to load the content for our drawer ID.\n\t\t\tnfRadio.channel( 'drawer' ).request( 'load:drawerContent', drawerID, data );\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'before:open' );\n\t\t\t\n\t\t\t// To open our drawer, we have to add our opened class to our builder element and remove the closed class.\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).addClass( 'nf-drawer-opened' ).removeClass( 'nf-drawer-closed' );\n\t\t\t\n\t\t\t// To open our drawer, we have to set the right position of our drawer to 0px.\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tjQuery( drawerEl ).css( { 'right': '0px' } );\n\t\t\t\n\t\t\t// In order to access properties in 'this' context in our interval below, we have to set it here.\t\n\t\t\tvar that = this;\n\n\t\t\t/*\n\t\t\t * Since jQuery can't bind to a CSS change, we poll every .15 seconds to see if we've opened the drawer.\n\t\t\t *\n\t\t\t * Once our drawer is opened, we:\n\t\t\t * clear our interval\n\t\t\t * focus our filter\n\t\t\t * request that the app update its current drawer to the one we opened\n\t\t\t * trigger a drawer opened message\n\t\t\t */\n\t\t\tthis.hasFocus = false;\n\n\t\t\t/*\n\t\t\t * Set our add new button z-index to 0;\n\t\t\t */\n\t\t\tjQuery( '.nf-master-control' ).css( 'z-index', 0 );\n\n\t\t\tthis.checkOpenDrawerPos = setInterval( function() {\n\t \tif ( '0px' == jQuery( drawerEl ).css( 'right' ) ) {\n\t \t\tclearInterval( that.checkOpenDrawerPos );\n\t\t\t\t\tif ( ! that.hasFocus ) {\n\t\t \t\tthat.focusFilter();\n\t\t\t\t\t\tthat.hasFocus = true;\n\t\t\t \t\tnfRadio.channel( 'app' ).request( 'update:currentDrawer', drawerID );\n\t\t\t \t\tjQuery( drawerEl ).scrollTop( 0 );\n\t\t\t \t\tnfRadio.channel( 'drawer' ).trigger( 'opened' );\n\t\t\t\t\t} \t\t\n\t \t}\n\t\t\t}, 150 );\n\t\t},\n\n\t\t/**\n\t\t * Toggle the drawer from half to full screen and vise-versa\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\ttoggleDrawerSize: function() {\n\t\t\t// Get our drawer element.\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\t// toggle our drawer size class.\n\t\t\tjQuery( drawerEl ).toggleClass( 'nf-drawer-expand' );\n\t\t},\n\n\t\t/**\n\t\t * Focus our filter\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n focusFilter: function() {\n \t// Get our filter element\n \tvar filterEl = nfRadio.channel( 'drawer' ).request( 'get:filterEl' );\n \t// Focus\n \tjQuery( filterEl ).focus();\n },\n\n /**\n * Get the CSS right position (in px) of the closed drawer element.\n * This is calculated by:\n * getting the width of the builder element\n * add 300 pixels\n * make it negative\n * \n * @since 3.0\n * @return void\n */\n getClosedDrawerPos: function() {\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tvar closedPos = jQuery( builderEl ).width() + 300;\n\t\t\treturn '-' + closedPos + 'px';\n },\n\n /**\n * Check to see if anything has registered a prevent close key.\n * \n * @since 3.0\n * @return boolean\n */\n maybePreventClose: function() {\n \tif ( 0 == Object.keys( this.objPreventClose ).length ) {\n \t\treturn false;\n \t} else {\n \t\treturn true;\n \t}\n },\n\n /**\n * Register a prevent close key.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent close' setting.\n * @return void\n */\n preventClose: function( key ) {\n \tthis.objPreventClose[ key ] = true;\n \t/*\n \t * When we disable closing the drawer, add the disable class.\n \t */\n \t// Get our current drawer.\n\t\t\tthis.dataModel.set( 'drawerDisabled', true );\n },\n\n /**\n * Remove a previously registered prevent close key.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent close' setting.\n * @return void\n */\n enableClose: function( key ) {\n \tdelete this.objPreventClose[ key ];\n \t /*\n \t * When we remove all of our disables preventing closing the drawer, remove the disable class.\n \t */\n \tif ( ! this.maybePreventClose() && 'undefined' != typeof this.dataModel ) {\n\t \t// Get our current drawer.\n\t\t\t\tthis.dataModel.set( 'drawerDisabled', false ); \t\t\n \t}\n },\n\n /**\n * When we focus our filter, make sure that our open drawer interval is cleared.\n * \n * @since 3.0\n * @return void\n */\n filterFocused: function() {\n \tclearInterval( this.checkOpenDrawerPos );\n },\n\n getPreventClose: function() {\n \treturn this.objPreventClose;\n }\n\t});\n\n\treturn controller;\n} );\n/**\n * Default drawer header.\n *\n * Includes our filter/search and 'Done' button.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerDefault',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-default',\n\n\t\tinitialize: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\t// Listen for our drawer being disabled.\n\t\t\t\tthis.model.on( 'change:drawerDisabled', this.render, this );\t\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When we render, remove the extra div added by backbone and add listeners related to our filter.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\t// Remove extra wrapping div.\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t\t// Respond to requests related to our filter.\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'clear:filter', this.clearFilter, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'blur:filter', this.blurFilter, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:filterEl', this.getEl, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\tthis.model.off( 'change:drawerDisabled', this.render );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'keyup .nf-filter'\t: 'maybeChangeFilter',\n\t\t\t'input .nf-filter'\t: 'changeFilter',\n\t\t\t'focus input'\t\t: 'getFocus'\n\t\t},\n\n\t\t/**\n\t\t * When the filter text is changed, trigger an event on our current drawer.\n\t\t * This lets us keep the logic separate from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tchangeFilter: function( e ) {\n\t\t\tvar currentDrawer = nfRadio.channel( 'app' ).request( 'get:currentDrawer' );\n\t\t\tnfRadio.channel( 'drawer-' + currentDrawer.get( 'id' ) ).trigger( 'change:filter', e.target.value, e );\n\t\t},\n\n\t\t/**\n\t\t * The user pressed a key. If it's the enter key, then run the change filter function.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tmaybeChangeFilter: function( e ) {\n\t\t\tif ( 13 == e.keyCode ) {\n\t\t\t\te.addObject = true;\n\t\t\t\tthis.changeFilter( e );\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Clear our filter.\n\t\t *\n\t\t * This triggers 'input' on the field, which will trigger a change if necessary.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tclearFilter: function() {\n\t\t\tvar filterEl = jQuery( this.el ).find( '.nf-filter' );\n\t\t\tif ( '' != jQuery.trim( filterEl.val() ) ) {\n\t\t\t\tfilterEl.val('');\n\t\t\t\tfilterEl.trigger( 'input' );\n\t\t\t\tfilterEl.focus();\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Fire the 'blur' event on our filter. Used to force a change event when the user tabs.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tblurFilter: function() {\n\t\t\tjQuery( this.el ).find( '.nf-filter' ).blur();\n\t\t},\n\n\t\t/**\n\t\t * Return our filter dom element.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).find( '.nf-filter' );\n\t\t},\n\n\t\tgetFocus: function() {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'filter:focused' );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\t// Get our current domain.\n\t\t\t\t\tif ( this.drawerDisabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Default drawer footer\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/footerDefault',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-empty'\n\t});\n\n\treturn view;\n} );\ndefine( 'models/app/drawerModel',['views/app/drawer/headerDefault', 'views/app/drawer/footerDefault'], function( defaultHeaderView, defaultFooterView ) {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tgetHeaderView: function( data ) {\n\t\t\t\treturn new defaultHeaderView( data );\n\t\t\t},\n\n\t\t\tgetFooterView: function( data ) {\n\t\t\t\treturn new defaultFooterView( data );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds all of our drawer models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/drawerCollection',['models/app/drawerModel'], function( drawerModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: drawerModel\n\t} );\n\treturn collection;\n} );\ndefine( 'views/fields/drawer/stagedField',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-staged-field',\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .dashicons-dismiss': 'removeStagedField'\n\t\t},\n\n\t\tremoveStagedField: function( el ) {\n\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'click:removeStagedField', el, this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/fields/drawer/stagingEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-staged-fields-empty',\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/drawer/stagingCollection',['views/fields/drawer/stagedField', 'views/fields/drawer/stagingEmpty'], function( stagedFieldView, stagedFieldsEmptyView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: stagedFieldView,\n\t\temptyView: stagedFieldsEmptyView,\n\n\t\tactiveClass: 'nf-staged-fields-active', // CSS Class for showing the reservoir.\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:stagedFieldsEl', this.getStagedFieldsEl, this );\n\t\t},\n\n\t\tonShow: function() {\n\n\t\t\tthis.$el = jQuery( this.el ).parent();\n\t\t\tjQuery( this.$el ).find( 'span:first' ).unwrap();\n\t\t\tthis.setElement( this.$el );\n\n\t\t\tvar that = this;\n\n\t\t\tjQuery( this.el ).sortable( {\n\t\t\t\tplaceholder: 'nf-staged-fields-sortable-placeholder',\n\t\t\t\thelper: 'clone',\n\t\t\t\ttolerance: 'pointer',\n\t\t\t\tover: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'over:stagedFields', e, ui );\n\t\t\t\t},\n\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'out:stagedFields', ui );\n\t\t\t\t},\n\n\t\t\t\treceive: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'receive:stagedFields', ui );\n\t\t\t\t},\n\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:staging' );\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'start:stagedFields', ui );\n\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'stop:stagedFields', ui );\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tjQuery( this.el ).parent().draggable( {\n\t\t\t\topacity: 0.9,\n\t\t\t\tconnectToSortable: '.nf-field-type-droppable',\n\t\t\t\tappendTo: '#nf-main',\n\t\t\t\trefreshPositions: true,\n\t\t\t\tgrid: [ 3, 3 ],\n\t\t\t\ttolerance: 'pointer',\n\n\t\t\t\thelper: function( e ) {\n\t\t\t\t\tvar width = jQuery( e.target ).parent().width();\n\t\t\t\t\tvar height = jQuery( e.target ).parent().height();\n\t\t\t\t\tvar element = jQuery( e.target ).parent().clone();\n\t\t\t\t\tvar left = width / 4;\n\t\t\t\t\tvar top = height / 2;\n\t\t\t\t\tjQuery( this ).draggable( 'option', 'cursorAt', { top: top, left: left } );\n\t\t\t\t\tjQuery( element ).css( 'z-index', 1000 );\n\t\t\t\t\treturn element;\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'startDrag:fieldStaging', this, ui );\n\t\t\t\t},\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'stopDrag:fieldStaging', this, ui );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tgetStagedFieldsEl: function() {\n\t\t\treturn jQuery( this.el );\n\t\t},\n\n\t\tonAddChild: function() {\n\t\t\tjQuery( this.el ).addClass( this.activeClass );\n\t\t},\n\n\t\tonRemoveChild: function() {\n\t\t\tif( this.hasStagedFields() ) return;\n\t\t\tjQuery( this.el ).removeClass( this.activeClass );\n\t\t},\n\n\t\thasStagedFields: function() {\n\t\t\treturn 0 != this.collection.length;\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n/**\n * Model for our staged field.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/stagingModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection of staged fields.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/stagingCollection',['models/fields/stagingModel'], function( stagingModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: stagingModel,\n\t\tcomparator: 'order'\n\t} );\n\treturn collection;\n} );\ndefine( 'views/fields/drawer/typeSection',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-field-type-section',\n\n\t\tinitialize: function() {\n\t\t\t_.bindAll( this, 'render' );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:typeSection', this.getTypeSection, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\n\t\t\tthis.dragging = false;\n\t\t\tvar that = this;\n\t\t\t/*\n\t\t\t * If we're on a mobile device, we don't want to enable dragging for our field type buttons.\n\t\t\t */\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( this.el ).find( 'div.nf-field-type-draggable' ).draggable( {\n\t\t\t\t\topacity: 0.9,\n\t\t\t\t\ttolerance: 'pointer',\n\t\t\t\t\tconnectToSortable: '.nf-field-type-droppable',\n\t\t\t\t\trefreshPositions: true,\n\t\t\t\t\tgrid: [ 5, 5 ],\n\t\t\t\t\tappendTo: '#nf-builder',\n\n\t\t\t\t\thelper: function( e ) {\n\t\t\t\t\t\tvar width = jQuery( e.target ).parent().width();\n\t\t\t\t\t\tvar height = jQuery( e.target ).parent().height();\n\t\t\t\t\t\tvar element = jQuery( e.target ).parent().clone();\n\t\t\t\t\t\tvar left = width / 4;\n\t\t\t\t\t\tvar top = height / 2;\n\t\t\t\t\t\tjQuery( this ).draggable( 'option', 'cursorAt', { top: top, left: left } );\n\t\t\t\t\t\tjQuery( element ).css( 'z-index', 1000 );\n\t\t\t\t\t\treturn element;\n\t\t\t\t\t},\n\n\t\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = true;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'startDrag:type', this, ui );\n\t\t\t\t\t},\n\n\t\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = false;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'stopDrag:type', this, ui );\n\t\t\t\t\t},\n\n\t\t\t\t\tdrag: function(e, ui) {\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'drag:type', this, ui, e );\t\n\t\t\t\t\t}\n\n\t\t\t\t} ).disableSelection();\n\n\t\t\t\tjQuery( this.el ).find( '.nf-item' ).focus( function() {\n\t\t\t \tjQuery( this ).addClass( 'active' );\n\t\t\t } ).blur( function() {\n\t\t\t \tjQuery( this ).removeClass( 'active' );\n\t\t\t } );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-item': 'clickFieldType',\n\t\t\t'keydown .nf-item': 'maybeClickFieldType',\n\t\t\t'mousedown .nf-item': 'mousedownFieldType'\n\t\t},\n\n\t\tclickFieldType: function( e ) {\n\t\t\tif ( ! this.dragging ) {\n\t\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:fieldType', e );\n\t\t\t}\n\t\t},\n\n\t\tmousedownFieldType: function( e ) {\n\t\t\tjQuery( e.target).addClass( 'clicked' );\n\t\t\tsetTimeout( function() {\n\t\t\t\tjQuery( e.target ).removeClass( 'clicked' );\n\t\t\t}, 1500 );\n\t\t},\n\n\t\tmaybeClickFieldType: function( e ) {\n\t\t\tif ( 13 == e.keyCode ) {\n\t\t\t\tthis.clickFieldType( e );\n\t\t\t\tnfRadio.channel( 'drawer' ).request( 'clear:filter' );\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderFieldTypes: function() {\n\t\t\t var html = document.createElement( 'span' );\n\t\t\t var that = this;\n\t\t\t _.each( this.fieldTypes, function( id ) {\n\t\t\t var type = nfRadio.channel( 'fields' ).request( 'get:type', id );\n\t\t\t var nicename = type.get( 'nicename' );\n\t\t\t var icon = type.get( 'icon' );\n\t\t\t var renderType = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-drawer-field-type-button' );\n\t\t\t var templateHTML = renderType( { id: id, nicename: nicename, icon: icon, type: type, savedField: that.savedField } );\n var htmlFragments = document.createRange().createContextualFragment( templateHTML );\n html.appendChild( htmlFragments );\n\t\t\t } );\n\t\t\t return html.innerHTML;\n\t\t\t\t},\n\n\t\t\t\tsavedField: function() {\n\t\t\t\t\tif( this.type.get( 'savedField' ) ) {\n\t\t\t\t\t\treturn 'nf-saved';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tgetTypeSection: function() {\n\t\t\treturn this.el;\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/fields/drawer/typeSectionCollection',['views/fields/drawer/typeSection'], function( fieldTypeSectionView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: fieldTypeSectionView,\n\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).find( '.nf-settings' ).unwrap();\n\t\t\tnfRadio.channel( 'fields' ).request( 'clear:editActive' );\n\t\t}\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/fields/drawer/addField',['views/fields/drawer/stagingCollection', 'models/fields/stagingCollection', 'views/fields/drawer/typeSectionCollection'], function( drawerStagingView, StagingCollection, fieldTypeSectionCollectionView ) {\n\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer-content-add-field',\n\n\t\tregions: {\n\t\t\tstaging: '#nf-drawer-staging .nf-reservoir',\n\t\t\tprimary: '#nf-drawer-primary',\n\t\t\tsecondary: '#nf-drawer-secondary'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'filter:fieldTypes', this.filterFieldTypes );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'clear:filter', this.removeFieldTypeFilter );\n\n\t\t\tthis.savedCollection = nfRadio.channel( 'fields' ).request( 'get:savedFields' );\n\t\t\tthis.primaryCollection = this.savedCollection;\n\n\t\t\tthis.fieldTypeSectionCollection = nfRadio.channel( 'fields' ).request( 'get:typeSections' );\n\t\t\tthis.secondaryCollection = this.fieldTypeSectionCollection;\n\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tvar stagingCollection = nfRadio.channel( 'fields' ).request( 'get:staging' );\n\t\t\tthis.staging.show( new drawerStagingView( { collection: stagingCollection } ) );\n\n\t\t\tthis.primary.show( new fieldTypeSectionCollectionView( { collection: this.primaryCollection } ) );\n\t\t\tthis.secondary.show( new fieldTypeSectionCollectionView( { collection: this.secondaryCollection } ) );\n\t\t},\n\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tfilterFieldTypes: function( filteredSectionCollection ) {\n\t\t\tthis.primary.reset();\n\t\t\tthis.secondary.reset();\n\t\t\tthis.filteredSectionCollection = filteredSectionCollection;\n\t\t\tthis.primary.show( new fieldTypeSectionCollectionView( { collection: this.filteredSectionCollection } ) );\n\t\t},\n\n\t\tremoveFieldTypeFilter: function () {\n\t\t\tthis.primary.show( new fieldTypeSectionCollectionView( { collection: this.savedCollection } ) );\n\t\t\tthis.secondary.show( new fieldTypeSectionCollectionView( { collection: this.fieldTypeSectionCollection } ) );\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSettingCollection',[], function() {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.childViewOptions = { dataModel: data.dataModel };\n\t\t},\n\n\t\tgetChildView: function( model ) {\n\t\t\treturn nfRadio.channel( 'app' ).request( 'get:settingChildView', model );\n\t\t}\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSettingGroup',['views/app/drawer/itemSettingCollection'], function( itemSettingCollectionView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-field-setting-group',\n\t\t\n\t\tregions: {\n\t\t\tsettings: '.nf-field-settings'\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.model.on( 'change', this.render, this );\n\t\t\tthis.dataModel = data.dataModel;\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change', this.render );\n\t\t},\n\n\t\tonRender: function() {\n\n\t\t\tthis.settings.show( new itemSettingCollectionView( { collection: this.model.get( 'settings' ), dataModel: this.dataModel } ) );\n\n\t\t\tif(!nfAdmin.devMode) {\n\t\t\t\t// Only check if not for calculations.\n\t\t\t\tif(0 == this.$el.find('.calculations').length){\n\t\t\t\t\tvar visibleSettings = false;\n\t\t\t\t\tthis.$el.find('.nf-setting').each(function(index, setting) {\n\t\t\t\t\t\tif( 'none' !== setting.style.display ){\n\t\t\t\t\t\t\tvisibleSettings = true;\n\t\t\t\t\t\t\treturn false; //Exit jQuery each loop.\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tif(!visibleSettings) {\n\t\t\t\t\t\tthis.$el.hide();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( this.model.get( 'display' ) ) {\n\t\t\t\t// ...\n\t\t\t} else {\n\t\t\t\tthis.settings.empty();\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'render:settingGroup', this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .toggle': 'clickToggleGroup'\n\t\t},\n\n\t\tclickToggleGroup: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:toggleSettingGroup', e, this.model );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderLabel: function() {\n\t\t\t\t\tif ( '' != this.label ) {\n\t\t\t\t\t\tvar groupLabel = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-drawer-content-edit-setting-group-label' );\n\t\t\t\t\t\treturn groupLabel( this );\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t\trenderArrowDir: function() {\n\t\t\t\t\tif ( this.display ) {\n\t\t\t\t\t\treturn 'down';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn 'right';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSettingGroupCollection',['views/app/drawer/itemSettingGroup'], function( itemSettingGroupView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: itemSettingGroupView,\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.childViewOptions = { dataModel: data.dataModel };\n\t\t}\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/editSettings',['views/app/drawer/itemSettingGroupCollection'], function( itemSettingGroupCollectionView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-settings',\n\n\t\tregions: {\n\t\t\tsettingTitle: '.nf-setting-title',\n\t\t\tsettingGroups: '.nf-setting-groups'\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.dataModel = data.model;\n\t\t\tthis.groupCollection = data.groupCollection;\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar titleView = currentDomain.get( 'getSettingsTitleView' ).call( currentDomain, { model: this.model } );\n\n\t\t\tthis.settingTitle.show( titleView );\n\t\t\tthis.settingGroups.show( new itemSettingGroupCollectionView( { collection: this.groupCollection, dataModel: this.dataModel } ) );\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\tmaybeRenderTitle: function() {\n\t \t\t\tif ( 'undefined' !== typeof this.type ) {\n\t \t\t\t\tvar title = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-drawer-content-edit-settings-title' );\n\t \t\t\t\treturn title( this );\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t},\n\n\t \t\trenderTypeNicename: function() {\n\t \t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tvar domainID = currentDomain.get( 'id' );\n\t \t\t\tvar type = nfRadio.channel( domainID ).request( 'get:type', this.type );\n\t \t\t\treturn type.get( 'nicename' );\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\t});\n\n\treturn view;\n} );\n/**\n * Edit Settings drawer header.\n *\n * Includes our 'Done' button.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerEditSettings',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-edit-settings',\n\n\t\tinitialize: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\t// Listen for our drawer being disabled.\n\t\t\t\tthis.model.on( 'change:drawerDisabled', this.render, this );\t\t\t\t\n\t\t\t}\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\tthis.model.off( 'change:drawerDisabled', this.render );\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\t// Get our current domain.\n\t\t\t\t\tif ( this.drawerDisabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Button to add an action to the form.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/drawer/typeButton',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-action-type-button',\n\n\t\tonRender: function() {\n\t\t\t\n\t\t\tjQuery( this.el ).disableSelection();\n\t\t\t\n\t\t\tif ( 'installed' == this.model.get( 'section') ) {\n\t\t\t\tvar that = this;\n\t\t\t\tjQuery( this.el ).draggable( {\n\t\t\t\t\topacity: 0.9,\n\t\t\t\t\ttolerance: 'intersect',\n\t\t\t\t\tscroll: false,\n\t\t\t\t\thelper: 'clone',\n\n\t\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = true;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addAction' ).trigger( 'startDrag:type', this, ui );\n\t\t\t\t\t},\n\n\t\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = false;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addAction' ).trigger( 'stopDrag:type', this, ui );\n\t\t\t\t\t}\n\n\t\t\t\t} );\n\t\t\t}\n\t\t\t\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-item': 'clickAddAction'\n\t\t},\n\n\t\tclickAddAction: function( e ) {\n\t\t\tif ( ! this.dragging ) {\n\t\t\t\tif ( 'installed' == this.model.get( 'section' ) ) { // Is this an installed action?\n\t\t\t\t\tnfRadio.channel( 'actions' ).trigger( 'click:addAction', this.model );\n\t\t\t\t} else { // This isn't an installed action\n\t\t\t\t\tvar modalContent = this.model.get( 'modal_content' );\n\n\t\t\t\t\tvar actionModal = new jBox( 'Modal', {\n\t\t\t\t\t content: modalContent,\n\t\t\t\t\t zIndex:99999999,\n\t\t\t\t\t closeButton: 'box',\n\t\t\t\t\t overlay: true,\n\t\t\t\t\t width: 600,\n\t\t\t\t\t repositionOnOpen: true,\n\t\t\t\t\t reposition: true\n\t\t\t\t\t});\n\n\t\t\t\t\tactionModal.open();\n\t\t\t\t\t// window.open( this.model.get( 'link' ), '_blank' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = 'nf-item';\n\t\t\t\t\tif ( '' != jQuery.trim( this.image ) ) {\n\t\t\t\t\t\tclasses += ' nf-has-img';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( 'installed' == this.section ) {\n\t\t\t\t\t\tclasses += ' nf-action-type';\n\t\t\t\t\t}\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderStyle: function() {\n\t\t\t\t\tif ( '' != jQuery.trim( this.image ) ) {\n\n\t\t\t\t\t\t// This is being used in a template, so carefully consider the order of double/single quotes.\n\t\t\t\t\t\treturn \"background-image: url('\" + jQuery.trim( this.image ) + \"')\";\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/actions/drawer/typeCollection',['views/actions/drawer/typeButton'], function( actionTypeButtonView ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer-action-type-section',\n\t\tchildView: actionTypeButtonView,\n\n\t\ttemplateHelpers: function() {\n\t\t\tvar that = this;\n\t\t\treturn {\n\t\t\t\thasContents: function() {\n\t\t\t\t\treturn that.collection.length > 0;\n\t\t\t\t},\n\n\t\t\t\trenderNicename: function() {\n\t\t\t\t\treturn that.collection.nicename;\n\t\t\t\t},\n\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\treturn that.collection.slug;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.action-types' ).append( childView.el );\n\t\t}\n\t} );\n\n\treturn view;\n} );\n/**\n * Model that represents our setting.\n *\n * When the model is created, we trigger the init event in two radio channels.\n *\n * This lets specific types of settings modify the model before anything uses it.\n *\n * Fieldset, for instance, uses this hook to instantiate its settings as a collection.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tsettings: false,\n\t\t\thide_merge_tags: false,\n\t\t\terror: false\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Send out two messages saying that we've initialized a setting model.\n\t\t\tnfRadio.channel( 'app' ).trigger( 'init:settingModel', this );\n\t\t\tnfRadio.channel( this.get( 'type' ) ).trigger( 'init:settingModel', this );\n\t\t\tnfRadio.channel( 'setting-name-' + this.get( 'name' ) ).trigger( 'init:settingModel', this );\n\t\t\tthis.on( 'change:error', this.maybePreventUI, this );\n\n\t\t\t/*\n\t\t\t * If we have an objectType set on our collection, then we're creating a model for the generic settings collection.\n\t\t\t * If we're using merge tags in this setting\n\t\t\t */\n\t\t\tif( 'undefined' == typeof this.collection ) return;\n\n\t\t\tif ( this.get( 'use_merge_tags' ) && 'undefined' != typeof this.collection.options.objectType ) {\n\t\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'update:fieldKey', this.updateKey );\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When a field key is updated, send out a radio message requesting that this setting be checked for the old key.\n\t\t * We want to send the message on the objectType channel.\n\t\t * This means that if this setting is for fields, it will trigger on the fields channel, actions, etc.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Backbone.Model \tkeyModel data model representing the field for which the key just changed\n\t\t * @return void\n\t\t */\n\t\tupdateKey: function( keyModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'fire:updateFieldKey', keyModel, this );\n\t\t},\n\n\t\tmaybePreventUI: function() {\n\t\t\tif ( this.get( 'error' ) ) {\n\t\t\t\tnfRadio.channel( 'drawer' ).request( 'prevent:close', 'setting-' + this.get( 'name' ) + '-error' );\n\t\t\t\tnfRadio.channel( 'app' ).request( 'prevent:changeDomain', 'setting-' + this.get( 'name' ) + '-error' );\t\t\t\t\n\t\t\t} else {\n\t\t\t\tnfRadio.channel( 'drawer' ).request( 'enable:close', 'setting-' + this.get( 'name' ) + '-error' );\n\t\t\t\tnfRadio.channel( 'app' ).request( 'enable:changeDomain', 'setting-' + this.get( 'name' ) + '-error' );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collections of settings for each field type.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingCollection',['models/app/settingModel'], function( settingModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: settingModel,\n\n\t\tinitialize: function( models, options ) {\n\t\t\tthis.options = options || {};\n\t\t}\n\t} );\n\treturn collection;\n} );\n/**\n * Model that represents our type settings groups.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingGroupModel',[ 'models/app/settingCollection' ], function( SettingCollection ) {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tdisplay: false\n\t\t},\n\n\t\tinitialize: function( options ) {\n\t\t\tif ( false == this.get( 'settings' ) instanceof Backbone.Collection ) {\n\t\t\t\tthis.set( 'settings', new SettingCollection( this.get( 'settings' ) ) );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection of our type settings groups.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingGroupCollection',['models/app/settingGroupModel'], function( settingGroupModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: settingGroupModel\n\t} );\n\treturn collection;\n} );\n/**\n * Model for our field type\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/typeModel',[ 'models/app/settingGroupCollection' ], function( SettingGroupCollection ) {\n\tvar model = Backbone.Model.extend( {\n\t\tinitialize: function() {\n\t\t\tif ( false === this.get( 'settingGroups' ) instanceof Backbone.Collection ) {\n\t\t\t\tthis.set( 'settingGroups', new SettingGroupCollection( this.get( 'settingGroups' ) ) );\n\t\t\t}\n\t\t\t\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'init:typeModel', this );\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our field type models. \n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/typeCollection',['models/app/typeModel'], function( typeModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: typeModel,\n\t\ttype: false,\n\n\t\tinitialize: function( models, options ) {\n\t\t\t_.each( options, function( option, key ) {\n\t\t\t\tthis[ key ] = option;\n\t\t\t}, this );\n\t\t}\n\t} );\n\treturn collection;\n} );\n/**\n * Add action drawer.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/drawer/addAction',['views/actions/drawer/typeCollection', 'models/app/typeCollection'], function( actionTypeCollectionView, actionTypeCollection ) {\n\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer-content-add-action',\n\n\t\tregions: {\n\t\t\tprimary: '#nf-drawer-primary',\n\t\t\t\n\t\t\tpayments: '#nf-drawer-secondary-payments',\n\t\t\tmarketing: '#nf-drawer-secondary-marketing',\n\t\t\tmanagement: '#nf-drawer-secondary-management',\n\t\t\tworkflow: '#nf-drawer-secondary-workflow',\n\t\t\tnotifications: '#nf-drawer-secondary-notifications',\n\t\t\tmisc: '#nf-drawer-secondary-misc',\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'filter:actionTypes', this.filteractionTypes );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'clear:filter', this.removeactionTypeFilter );\n\t\t\n\t\t\tthis.installedActions = nfRadio.channel( 'actions' ).request( 'get:installedActions' );\n\t\t\tthis.primaryCollection = this.installedActions;\n\n\t\t\tthis.availableActions = nfRadio.channel( 'actions' ).request( 'get:availableActions' );\n\t\t\tthis.updateAvailableActionGroups();\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tthis.primary.show( new actionTypeCollectionView( { collection: this.primaryCollection } ) );\n\n\t\t\tthis.payments.show( new actionTypeCollectionView( { collection: this.paymentsCollection } ) );\n\t\t\tthis.marketing.show( new actionTypeCollectionView( { collection: this.marketingCollection } ) );\n\t\t\tthis.management.show( new actionTypeCollectionView( { collection: this.managementCollection } ) );\n\t\t\tthis.workflow.show( new actionTypeCollectionView( { collection: this.workflowCollection } ) );\n\t\t\tthis.notifications.show( new actionTypeCollectionView( { collection: this.notificationsCollection } ) );\n\t\t\tthis.misc.show( new actionTypeCollectionView( { collection: this.miscCollection } ) );\t\t\n\t\t},\n\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tfilteractionTypes: function( filteredInstalled, filteredAvailable ) {\n\t\t\tthis.primary.reset().show( new actionTypeCollectionView( { collection: filteredInstalled } ) );\n\n\t\t\tthis.availableActions = filteredAvailable;\n\t\t\tthis.updateAvailableActionGroups();\n\t\t\tthis.payments.reset().show( new actionTypeCollectionView( { collection: this.paymentsCollection } ) );\n\t\t\tthis.marketing.reset().show( new actionTypeCollectionView( { collection: this.marketingCollection } ) );\n\t\t\tthis.management.reset().show( new actionTypeCollectionView( { collection: this.managementCollection } ) );\n\t\t\tthis.workflow.reset().show( new actionTypeCollectionView( { collection: this.workflowCollection } ) );\n\t\t\tthis.notifications.reset().show( new actionTypeCollectionView( { collection: this.notificationsCollection } ) );\n\t\t\tthis.misc.reset().show( new actionTypeCollectionView( { collection: this.miscCollection } ) );\t\n\t\t\t\n\t\t},\n\n\t\tremoveactionTypeFilter: function () {\n\t\t\tthis.primary.show( new actionTypeCollectionView( { collection: this.primaryCollection } ) );\n\n\t\t\tthis.availableActions = nfRadio.channel( 'actions' ).request( 'get:availableActions' );\n\t\t\tthis.updateAvailableActionGroups();\n\t\t\tthis.payments.show( new actionTypeCollectionView( { collection: this.paymentsCollection } ) );\n\t\t\tthis.marketing.show( new actionTypeCollectionView( { collection: this.marketingCollection } ) );\n\t\t\tthis.management.show( new actionTypeCollectionView( { collection: this.managementCollection } ) );\n\t\t\tthis.workflow.show( new actionTypeCollectionView( { collection: this.workflowCollection } ) );\n\t\t\tthis.notifications.show( new actionTypeCollectionView( { collection: this.notificationsCollection } ) );\n\t\t\tthis.misc.show( new actionTypeCollectionView( { collection: this.miscCollection } ) );\n\t\t},\n\n\t\tupdateAvailableActionGroups: function() {\n\t\t\tthis.paymentsCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'payments'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'payments',\n\t\t\t\t\tnicename: nfi18n.paymentsActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.marketingCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'marketing'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'marketing',\n\t\t\t\t\tnicename: nfi18n.marketingActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.managementCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'management'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'management',\n\t\t\t\t\tnicename: nfi18n.managementActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.workflowCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'workflow'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'workflow',\n\t\t\t\t\tnicename: nfi18n.workflowActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.notificationsCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'notifications'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'notifications',\n\t\t\t\t\tnicename: nfi18n.notificationsActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.miscCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'misc'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'misc',\n\t\t\t\t\tnicename: nfi18n.miscActionNicename\n\t\t\t\t} \n\t\t\t);\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n/**\n * Individual change item.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentViewChangesItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-view-changes-item',\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:disabled', this.render, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:disabled', this.render );\n\t\t},\n\n\t\t/**\n\t\t * When we render this element, remove the extra wrapping <div> that backbone creates.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .undoSingle': 'undoSingle'\n\t\t},\n\n\t\tundoSingle: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:undoSingle', this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Changes collection view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentViewChanges',['views/app/drawer/contentViewChangesItem'], function( viewChangesItem ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'table',\n className: 'nf-changes',\n\t\tchildView: viewChangesItem\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles clicks on the 'view changes' button in the header.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerViewChanges',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-view-changes',\n\n\t\tevents: {\n\t\t\t'click .undoChanges': 'clickUndoChanges'\n\t\t},\n\n\t\tclickUndoChanges: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:undoChanges' );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Error view used for settings.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/settingError',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-edit-setting-error'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSetting',['views/app/drawer/mergeTagsContent', 'views/app/drawer/settingError'], function( mergeTagsContentView, settingErrorView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-edit-setting-wrap',\n\n\t\tregions: {\n\t\t\terror: '.nf-setting-error'\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.dataModel = data.dataModel;\n\t\t\t/*\n\t\t\t * Send out a request on the setting-type-{type} channel asking if we should render on dataModel change.\n\t\t\t * Defaults to false.\n\t\t\t * This lets specific settings, like RTEs, say that they don't want to be re-rendered when their data model changes.\n\t\t\t */\n\t\t\tvar renderOnChange = ( 'undefined' == typeof nfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).request( 'renderOnChange' ) ) ? false : nfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).request( 'renderOnChange' );\n\t\t\t\n\t\t\tif ( renderOnChange ) {\n\t\t\t\tthis.dataModel.on( 'change:' + this.model.get( 'name' ), this.render, this );\n\t\t\t}\n\n\t\t\tthis.model.on( 'change:error', this.renderError, this );\n\t\t\tthis.model.on( 'change:warning', this.renderWarning, this );\n\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\t// If we don't have a 'settings' property, this is a legacy depdency setup.\n\t\t\t\tif ( 'undefined' == typeof deps.settings ) {\n\t\t\t\t\tdeps.settings = [];\n\t\t\t\t\t_.each(deps, function(dep, name){\n\t\t\t\t\t\tif( 'settings' !== name ) {\n\t\t\t\t\t\t\tdeps.settings.push( { name: name, value: dep } );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tdeps.match = 'all';\n\t\t\t\t}\n\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.on( 'change:' + name, this.render, this );\n\t\t\t\t}\n\t\t\t}\n\n /**\n\t\t\t * For settings that require a remote refresh\n\t\t\t * add an \"update\"/refresh icon to the label.\n */\n var remote = this.model.get( 'remote' );\n\t\t\tif( remote ) {\n if( 'undefined' != typeof remote.refresh || remote.refresh ) {\n\t\t\t\t\tvar labelText, updateIcon, updateLink, labelWrapper;\n\n labelText = document.createTextNode( this.model.get('label') );\n\n updateIcon = document.createElement( 'span' );\n updateIcon.classList.add( 'dashicons', 'dashicons-update' );\n\n updateLink = document.createElement( 'a' );\n updateLink.classList.add( 'extra' );\n updateLink.appendChild( updateIcon );\n\n // Wrap the label text and icon/link in a parent element.\n labelWrapper = document.createElement( 'span' );\n labelWrapper.appendChild( labelText );\n labelWrapper.appendChild( updateLink );\n\n // The model expects a string value.\n this.model.set('label', labelWrapper.innerHTML );\n }\n\n\t\t\t\tnfRadio.channel( 'setting' ).trigger( 'remote', this.model, this.dataModel, this );\n\t\t\t\tthis.model.on( 'rerender', this.render, this );\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * When our drawer opens, send out a radio message on our setting type channel.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.drawerOpened );\n\n\t\t\t/*\n\t\t\t * When our drawer closes, send out a radio message on our setting type channel.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.drawerClosed );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.dataModel.off( 'change:' + this.model.get( 'name' ), this.render );\n\t\t\tthis.model.off( 'change:error', this.renderError );\n\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.off( 'change:' + name, this.render );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif( this.model.get( 'remote' ) ) {\n\t\t\t\tthis.model.off( 'rerender', this.render, this );\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'destroy:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'destroy:setting', this.model, this.dataModel, this );\n\t\t\n\t\t\t/*\n\t\t\t * Unescape any HTML being saved if we are a textbox.\n\t\t\t */\n\t\t\tif ( 'textbox' == this.model.get( 'type' ) ) {\n\t\t\t\tvar setting = this.model.get( 'name' );\n\t\t\t\tvar value = this.dataModel.get( setting );\n\t\t\t\tthis.dataModel.set( setting, _.unescape( value ), { silent: true } );\n\t\t\t}\n\n\t\t},\n\n\t\tonBeforeRender: function() {\n\t\t\t/*\n\t\t\t * We want to escape any HTML being output if we are a textbox.\n\t\t\t */\n\t\t\tif ( 'textbox' == this.model.get( 'type' ) ) {\n\t\t\t\tvar setting = this.model.get( 'name' );\n\t\t\t\tvar value = this.dataModel.get( setting );\n\t\t\t\tthis.dataModel.set( setting, _.escape( value ), { silent: true } );\n\t\t\t}\n\t\t\t\n\t\t\tnfRadio.channel( 'app' ).trigger( 'before:renderSetting', this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.mergeTagsContentView = false;\n\t\t\tvar that = this;\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\n\t\t\tjQuery( this.el ).find( '.nf-help' ).each(function() {\n\t\t\t\tvar content = jQuery(this).next('.nf-help-text');\n\t\t\t\tjQuery( this ).jBox( 'Tooltip', {\n\t\t\t\t\tcontent: content,\n\t\t\t\t\tmaxWidth: 200,\n\t\t\t\t\ttheme: 'TooltipBorder',\n\t\t\t\t\ttrigger: 'click',\n\t\t\t\t\tcloseOnClick: true\n\t\t\t\t})\n\t\t });\n\t\t\t\n\t\t if ( this.model.get( 'use_merge_tags' ) ) {\n\t\t \tnfRadio.channel( 'mergeTags' ).request( 'init', this );\n\t\t }\n\n\t\t\t/*\n\t\t\t * Apply Setting Field Masks\n\t\t\t */\n\t\t\tvar mask = this.model.get( 'mask' );\n\n\t\t\tif( typeof mask != \"undefined\" ){\n\n\t\t\t\tvar input = jQuery( this.$el ).find( 'input' );\n\t\t\t\tjQuery( input ).attr( 'contentEditable', true );\n\t\t\t\tswitch( mask.type ){\n\t\t\t\t\tcase 'numeric':\n\t\t\t\t\t\tinput.autoNumeric({\n\t\t\t\t\t\t\taSep: thousandsSeparator,\n\t\t\t\t\t\t\taDec: decimalPoint\n\t\t\t\t\t\t});\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'currency':\n\n\t\t\t\t\t\tvar currency = nfRadio.channel( 'settings' ).request( 'get:setting', 'currency' );\n\t\t\t\t\t\tvar currencySymbol = nfAdmin.currencySymbols[ currency ] || '';\n\n\t\t\t\t\t\tinput.autoNumeric({\n\t\t\t\t\t\t\taSign: jQuery('<div />').html(currencySymbol).text(),\n\t\t\t\t\t\t\taSep: thousandsSeparator,\n\t\t\t\t\t\t\taDec: decimalPoint\n\t\t\t\t\t\t});\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'custom':\n\t\t\t\t\t\tif( mask.format ) input.mask( mask.format );\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tdefault:\n\t\t\t\t\t\t// TODO: Error Logging.\n\t\t\t\t\t\tconsole.log( 'Notice: Mask type of \"' + mask.type + '\" is not supported.' );\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t\tthis.renderError();\n\t\t},\n\n\t\tonShow: function() {\t\t\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'show:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'show:setting', this.model, this.dataModel, this );\n\t\t},\n\n\t\tonAttach: function() {\t\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t},\n\n\t\trenderError: function() {\n\t\t\tif ( this.model.get( 'error' ) ) {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting' ).addClass( 'nf-error' );\n\t\t\t\tthis.error.show( new settingErrorView( { model: this.model } ) );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting' ).removeClass( 'nf-error' );\n\t\t\t\tthis.error.empty();\n\t\t\t}\n\t\t},\n\n renderWarning: function() {\n if ( this.model.get( 'warning' ) ) {\n jQuery( this.el ).find( '.nf-setting' ).addClass( 'nf-warning' );\n this.error.show( new settingErrorView( { model: this.model } ) );\n } else {\n jQuery( this.el ).find( '.nf-setting' ).removeClass( 'nf-warning' );\n this.error.empty();\n }\n },\n\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\n\t \t\trenderVisible: function() {\n\n\t\t\t\t\tif(!nfAdmin.devMode){\n\t\t\t\t\t\tif('Action' == that.dataModel.get('objectType') && 'email' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('cc' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('bcc' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('from_name' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('from_address' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('email_format' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\tif('Action' == that.dataModel.get('objectType') && 'save' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('submitter_email' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('label_pos' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit_type' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit_msg' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('help_text' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('disable_input' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('disable_browser_autocomplete' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('mask' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('custom_mask' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('custom_name_attribute' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('personally_identifiable' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\n\t\t\t\t\t\t// \"administration\" settings\n\t\t\t\t\t\tif('key' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('admin_label' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('num_sort' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('user_state' == this.name) return 'style=\"display:none;\"';\n\n\t\t\t\t\t\t\n\t\t\t\t\t\tif('checkbox' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('checked_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('unchecked_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('checked_calc_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('unchecked_calc_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('starrating' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('default' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('listmultiselect' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('box_size' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('date' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('year_range_start' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('year_range_end' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'check:deps', this, that );\n\t \t\t},\n\n\t \t\trenderSetting: function(){\n\t \t\t\tif ( 'undefined' != typeof that.dataModel.get( this.name ) ) {\n\t \t\t\t\tthis.value = that.dataModel.get( this.name );\n\t \t\t\t} else if ( 'undefined' == typeof this.value ) {\n\t \t\t\t\tthis.value = '';\n\t \t\t\t}\n\t \t\t\tvar setting = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-' + this.type );\n\t\t\t\t\treturn setting( this );\n\t\t\t\t},\n\n\t\t\t\trenderLabelClasses: function() {\n\t\t\t\t\tvar classes = '';\n\t\t\t\t\tif ( this.use_merge_tags ) {\n\t\t\t\t\t\tclasses += ' has-merge-tags';\n\t\t\t\t\t}\n\t\t\t\t\tif ( 'rte' == this.type ) {\n\t\t\t\t\t\tclasses += ' rte';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = 'nf-setting ';\n\t\t\t\t\tif ( 'undefined' != typeof this.width ) {\n\t\t\t\t\t\tclasses += 'nf-' + this.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclasses += ' nf-one-half';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\tclasses += ' nf-error';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderTooltip: function() {\n\t\t\t\t\tif ( ! this.help ) return '';\n\t\t\t\t\tvar helpText, helpTextContainer, helpIcon, helpIconLink, helpTextWrapper;\n\n\t\t\t\t\thelpText = document.createElement( 'div' );\n\t\t\t\t\thelpText.innerHTML = this.help;\n\t\t\t\t\t\n\t\t\t\t\thelpTextContainer = document.createElement( 'div' );\n\t\t\t\t\thelpTextContainer.classList.add( 'nf-help-text' );\n\t\t\t\t\thelpTextContainer.appendChild( helpText );\n\n\t\t\t\t\thelpIcon = document.createElement( 'span' );\n\t\t\t\t\thelpIcon.classList.add( 'dashicons', 'dashicons-admin-comments' );\n helpIconLink = document.createElement( 'a' );\n helpIconLink.classList.add( 'nf-help' );\n helpIconLink.setAttribute( 'href', '#' );\n helpIconLink.setAttribute( 'tabindex', '-1' );\n helpIconLink.appendChild( helpIcon );\n\n helpTextWrapper = document.createElement( 'span' );\n helpTextWrapper.appendChild( helpIconLink );\n helpTextWrapper.appendChild( helpTextContainer );\n\n // The template expects a string value.\n\t\t\t\t\treturn helpTextWrapper.innerHTML;\n\t\t\t\t},\n\n\t\t\t /*\n\t\t\t * Render a select element with only the email fields on the\n\t\t\t * form\n\t\t\t */\n\t\t\t renderEmailFieldOptions: function() {\n\t\t\t\t var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n\t\t\t\t initialOption = document.createElement( 'option' );\n\t\t\t\t initialOption.value = '';\n\t\t\t\t initialOption.label = '--';\n\t\t\t\t initialOption.innerHTML = '--';\n\n\t\t\t\t var select_value = '';\n\t\t\t\t var select = document.createElement( 'select' );\n\t\t\t\t select.classList.add( 'setting' );\n\t\t\t\t select.setAttribute( 'data-id', 'my_seledt' );\n\t\t\t\t select.appendChild( initialOption );\n\n\t\t\t\t var index = 0;\n\t\t\t\t var that = this;\n\t\t\t\t fields.each( function( field ) {\n\t\t\t\t\t // Check for the field type in our lookup array and...\n\t\t\t\t\t if( 'email' != field.get( 'type' ) ) {\n\t\t\t\t\t\t // Return if the type is in our lookup array.\n\t\t\t\t\t\t return '';\n\t\t\t\t\t }\n\n\t\t\t\t\t var option = document.createElement( 'option' );\n\n\t\t\t\t\t option.value = field.get( 'key' );\n\t\t\t\t\t option.innerHTML = field.get( 'label' );\n\t\t\t\t\t option.label = field.get( 'label' );\n\t\t\t\t\t \n\t\t\t\t\t if( that.value === field.get( 'key' ) ) {\n\t\t\t\t\t\t option.setAttribute( 'selected', 'selected' );\n\t\t\t\t\t }\n\t\t\t\t\t select.appendChild( option );\n\t\t\t\t\t index = index + 1;\n\t\t\t\t });\n\n\t\t\t\t label = document.createElement( 'label' );\n\t\t\t\t label.classList.add( 'nf-select' );\n\n\t\t\t\t label.appendChild( select );\n\n\t\t\t\t // Select Lists need an empty '<div></div>' for styling purposes.\n\t\t\t\t emptyContainer = document.createElement( 'div' );\n\t\t\t\t label.appendChild( emptyContainer );\n\n\t\t\t\t // The template requires a string.\n\t\t\t\t return label.innerHTML;\n\t\t\t },\n\n\t\t\t\trenderMergeTags: function() {\n\t\t\t\t\tif ( this.use_merge_tags && ! this.hide_merge_tags ) {\n\t\t\t\t\t\treturn '<span class=\"dashicons dashicons-list-view merge-tags\"></span>';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t /**\n\t\t\t * Renders min and/or max attributes for the number input\n\t\t\t *\n\t\t\t * @returns {string}\n\t\t\t */\n\t\t\t renderMinMax: function() {\n\t\t\t\t\tvar minMaxStr = '';\n\t\t\t\t\t// if we have a min value set, then output it\n\t\t\t\t\tif( 'undefined' != typeof this.min_val && null != this.min_val && jQuery.isNumeric( this.min_val ) ) {\n\t\t\t\t\t\tminMaxStr = minMaxStr + \"min='\" + this.min_val + \"'\";\n\t\t\t\t\t}\n\n\t\t\t\t\t// if we have a max value set, then output it\n\t\t\t\t if( 'undefined' != typeof this.max_val && '' != this.max_val && jQuery.isNumeric( this.max_val ) ) {\n\t\t\t\t\t minMaxStr = minMaxStr + \" max='\" + this.max_val + \"'\";\n\t\t\t\t }\n\n\t\t\t\t // if we have a step size set, then output it\n\t\t\t\t if( 'undefined' != typeof this.step && '' != this.step && jQuery.isNumeric( this.step ) ) {\n\t\t\t\t\t minMaxStr = minMaxStr + \" step='\" + this.step + \"'\";\n\t\t\t\t }\n\n\t\t\t\t return minMaxStr;\n\t\t\t },\n\n\t\t\t /**\n\t\t\t * Returns a string to let the user know the min and/or max\n\t\t\t * value for the field\n\t\t\t *\n\t\t\t * @returns {string}\n\t\t\t */\n\t\t\t renderMinMaxHelper: function() {\n\t\t\t\t var minMaxHelperStr = '';\n\t\t\t\t // if we have a min value output it to the helper text\n\t\t\t\t if( 'undefined' != typeof this.min_val && null != this.min_val && jQuery.isNumeric( this.min_val ) ) {\n\t\t\t\t \t// empty string? then add '('\n\t\t\t\t \tif( 0 == minMaxHelperStr.length ) {\n\t\t\t\t \t\tminMaxHelperStr = \"(\";\n\t\t\t\t\t }\n\t\t\t\t\t minMaxHelperStr = minMaxHelperStr + nfi18n.minVal + \": \" + this.min_val;\n\t\t\t\t }\n\n\t\t\t\t // if we have a max value output it to the helper text\n\t\t\t\t if( 'undefined' != typeof this.max_val && '' != this.max_val && jQuery.isNumeric( this.max_val ) ) {\n\t\t\t\t\t // empty string? then add '('\n\t\t\t\t\t if( 0 == minMaxHelperStr.length ) {\n\t\t\t\t\t\t minMaxHelperStr = \"(\";\n\t\t\t\t\t } else {\n\t\t\t\t\t \t// else, we know we have a min so add a comma\n\t\t\t\t\t \tminMaxHelperStr = minMaxHelperStr + \", \";\n\t\t\t\t\t }\n\t\t\t\t\t minMaxHelperStr = minMaxHelperStr + nfi18n.maxVal + \": \" + this.max_val;\n\t\t\t\t }\n\n\t\t\t\t // if not an empty string, then add ')'\n\t\t\t\t if( 0 < minMaxHelperStr.length ) {\n\t\t\t\t\t minMaxHelperStr = minMaxHelperStr + \")\";\n\t\t\t\t }\n\n\t\t\t\t return minMaxHelperStr;\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'change .setting': 'changeSetting',\n\t\t\t'keyup .setting': 'keyUpSetting',\n\t\t\t'click .setting': 'clickSetting',\n\t\t\t'click .extra': 'clickExtra'\n\t\t},\n\n\t\tchangeSetting: function( e ) {\n\t\t\t//Check characters set in custom classes match sanitize_html_class\n\t\t\tif ( 'textbox' == this.model.get( 'type' ) && this.model.get('name').endsWith(\"_class\" )) {\n\t\t\t\tconst regexp = /^[a-zA-Z0-9-_]+$/;\n\t\t\t\tif(e.target.value.search(regexp) === -1){\n\t\t\t\t\tthis.model.set('error', \"HTML classes only allow - _ and alphanumeric characters.\" )\n\t\t\t\t} else if(e.target.value.search(regexp) === 0){\n\t\t\t\t\tthis.model.unset('error');\n\t\t\t\t}\n\t\t\t}\n\t\t\tnfRadio.channel( 'app' ).trigger( 'change:setting', e, this.model, this.dataModel );\n\t\t},\n\n\t\tkeyUpSetting: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'keyup:setting', e, this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'keyup:setting', e, this.model, this.dataModel );\n\t\t},\n\n\t\tclickSetting: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:setting', e, this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'click:setting', e, this.model, this.dataModel, this );\n\t\t},\n\n\t\tclickExtra: function( e ) {\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'click:extra', e, this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'name' ) ).trigger( 'click:extra', e, this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-name-' + this.model.get( 'name' ) ).trigger( 'click:extra', e, this.model, this.dataModel, this );\n\t\t},\n\n\t\tdrawerOpened: function() {\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'drawer:opened', this.model, this.dataModel, this );\n\t\t},\n\n\t\tdrawerClosed: function() {\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'drawer:closed', this.model, this.dataModel, this );\n\t\t}\n\t});\n\n\treturn view;\n} );\n\n/**\n * Changes collection view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentPublicLink',['views/app/drawer/itemSetting'], function( itemSettingView) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttagName: 'div',\n template: '#tmpl-nf-drawer-content-public-link',\n \n\t\tregions: {\n embedForm: '.embed-form',\n\t\t\tenablePublicLink: '.enable-public-link',\n copyPublicLink: '.copy-public-link',\n },\n\n\t\tonRender: function() {\n var formModel = Backbone.Radio.channel('app').request('get:formModel');\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n\n var allowPublicLinkSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'allow_public_link' );\n this.enablePublicLink.show( new itemSettingView( { model: allowPublicLinkSettingModel, dataModel: formSettingsDataModel } ) );\n \n var embedForm = \"[ninja_form id='{FORM_ID}']\".replace('{FORM_ID}', formModel.get('id'));\n formSettingsDataModel.set('embed_form', embedForm);\n\n var embedFormSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'embed_form' );\n this.embedForm.show( new itemSettingView( { model: embedFormSettingModel, dataModel: formSettingsDataModel } ) );\n\n var public_link_key = formSettingsDataModel.get('public_link_key');\n \n /**\n * Generate a public link key which is follows the format:\n * Form Id + 4 consecutive base 36 numbers\n */\n if (!public_link_key) {\n public_link_key = nfRadio.channel('app').request('generate:publicLinkKey');\n }\n\n // apply public link url to settings (ending with key)\n var publicLink = nfAdmin.publicLinkStructure.replace('[FORM_ID]', public_link_key);\n formSettingsDataModel.set('public_link', publicLink);\n \n // Display public link\n var publicLinkSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'public_link' );\n this.copyPublicLink.show(new itemSettingView( { model: publicLinkSettingModel, dataModel: formSettingsDataModel } ));\n },\n\n\t\tevents: {\n\t\t\t'click #embed_form + .js-click-copytext': 'copyFormEmbedHandler',\n\t\t\t'click #public_link + div > .js-click-copytext': 'copyPublicLinkHandler',\n\t\t\t'click #public_link + div > .js-click-resettext': 'confirmResetPublicLinkHandler',\n\t\t\t'click #public_link + div > .js-click-confirm': 'resetPublicLinkHandler',\n\t\t\t'click #public_link + div > .js-click-cancel': 'cancelResetPublicLinkHandler'\n\t\t},\n\n\t\tcopyFormEmbedHandler: function( e ) {\n\n document.getElementById('embed_form').select();\n document.execCommand('copy');\n\n e.target.innerHTML = 'Copied!';\n setTimeout(function(){ e.target.innerHTML = 'Copy'; }, 1500);\n\t\t},\n\n\t\tcopyPublicLinkHandler: function( e ) {\n\n document.getElementById('public_link').select();\n document.execCommand('copy');\n\n e.target.innerHTML = 'Copied!';\n setTimeout(function(){ e.target.innerHTML = 'Copy'; }, 1500);\n },\n \n confirmResetPublicLinkHandler: function( e ) {\n _.each( e.target.parentNode.children, function( node ) {\n if ( node.classList.contains( 'js-click-copytext' ) || node.classList.contains( 'js-click-resettext' ) ) {\n node.style.display = 'none';\n } else {\n node.style.display = 'inline-block';\n }\n } );\n },\n\n resetPublicLinkHandler: function ( e ) {\n // Generate a new link.\n var public_link_key = nfRadio.channel('app').request('generate:publicLinkKey');\n var publicLink = nfAdmin.publicLinkStructure.replace('[FORM_ID]', public_link_key);\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n formSettingsDataModel.set('public_link', publicLink);\n // Reset the buttons.\n this.cancelResetPublicLinkHandler( e );\n _.each( e.target.parentNode.children, function( node ) {\n if ( node.classList.contains( 'js-click-resettext' ) ) {\n node.style.display = 'inline-block';\n node.classList.add('primary');\n node.classList.remove('secondary');\n node.innerHTML = 'Link Reset!';\n setTimeout(function(){\n node.classList.add('secondary');\n node.classList.remove('primary');\n node.innerHTML = 'Reset';\n }, 1500);\n } else {\n node.style.display = 'none';\n }\n if ( node.classList.contains( 'js-click-copytext' ) ) {\n setTimeout(function(){\n node.style.display = 'inline-block';\n }, 1500);\n }\n } );\n // Update the visible public link.\n jQuery('#public_link').val( publicLink );\n },\n\n cancelResetPublicLinkHandler: function ( e ) {\n _.each( e.target.parentNode.children, function( node ) {\n if ( node.classList.contains( 'js-click-cancel' ) || node.classList.contains( 'js-click-confirm' ) ) {\n node.style.display = 'none';\n } else {\n node.style.display = 'inline-block';\n }\n } );\n }\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles clicks on the 'view changes' button in the header.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerPublicLink',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-public-link'\n\t});\n\n\treturn view;\n} );\n/**\n * Changes collection view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentNewForm',['views/app/drawer/itemSetting'], function( itemSettingView) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-new-form',\n\n\t\tregions: {\n\t\t\tformName: '.new-form-name',\n\t\t\tformSubmit: '.new-form-submit'\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar titleSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'title' );\n\t\t\tvar addSubmitSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'add_submit' );\n\t\t\tvar dataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n\t\t\tthis.formName.show( new itemSettingView( { model: titleSettingModel, dataModel: dataModel } ) );\n\t\t\t/*\n\t\t\t * If we don't have any submit buttons on the form, prompt the user to add one on publish.\n\t\t\t */\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\tvar submitButtons = fieldCollection.findWhere( { type: 'submit' } );\n\t\t\tif ( 'undefined' == typeof submitButtons ) {\n\t\t\t\tthis.formSubmit.show( new itemSettingView( { model: addSubmitSettingModel, dataModel: dataModel } ) );\n\t\t\t} else {\n\t\t\t\tdataModel.set( 'add_submit', 0 );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .publish': 'clickPublish'\n\t\t},\n\n\t\tclickPublish: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:confirmPublish', e );\n\t\t}\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles clicks on the 'view changes' button in the header.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerNewForm',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-new-form'\n\t});\n\n\treturn view;\n} );\n/**\n * Config file for our app drawers.\n *\n * this.collection represents all of our registered drawers.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/drawerConfig',[\n\t'models/app/drawerCollection',\n\t'views/fields/drawer/addField',\n\t'views/app/drawer/editSettings',\n\t'views/app/drawer/headerEditSettings',\n\t'views/actions/drawer/addAction',\n\t'views/app/drawer/contentViewChanges',\n\t'views/app/drawer/headerViewChanges',\n\t'views/app/drawer/contentPublicLink',\n\t'views/app/drawer/headerPublicLink',\n\t'views/app/drawer/contentNewForm',\n\t'views/app/drawer/headerNewForm'\n\t], function(\n\t\tdrawerCollection,\n\t\taddFieldView,\n\t\teditSettingsView,\n\t\teditSettingsHeaderView,\n\t\taddActionView,\n\t\tviewChangesView,\n\t\tviewChangesHeaderView,\n\t\tpublicLinkView,\n\t\tpublicLinkHeaderView,\t\t\n\t\tnewFormView,\n\t\tnewFormHeaderView,\n\t\tmobileItemControlsView\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\n\t\t\tthis.collection = new drawerCollection( [\n\t\t\t\t{\n\t\t\t\t\tid: 'addField',\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new addFieldView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'addAction',\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new addActionView( data );\n\t\t\t\t\t}\n\t\t\t\t},\t\t\t\t\n\t\t\t\t{\n\t\t\t\t\tid: 'editSettings',\n\n\t\t\t\t\t/*\n\t\t\t\t\t * TODO: Add filtering when editing settings. For now, removing them from settings.\n\t\t\t\t\t */\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Get a custom setting header view if one is set.\n\t\t\t\t\t\t * TODO: Currently, this only works for advanced settings.\n\t\t\t\t\t\t * This could be used to replace the need for a single config file.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tif ( 'undefined' != typeof data.typeModel ) {\n\t\t\t\t\t\t\tvar view = nfRadio.channel( data.typeModel.get( 'id' ) ).request( 'get:drawerHeaderView' ) || editSettingsHeaderView;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tvar view = editSettingsHeaderView;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn new view( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new editSettingsView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'viewChanges',\n\n\t\t\t\t\t// getHeaderView() is defined by default, but we need to override it for the viewChanges drawer.\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\treturn new viewChangesHeaderView( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new viewChangesView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'publicLink',\n\n\t\t\t\t\t// getHeaderView() is defined by default, but we need to override it for the publicLink drawer.\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\treturn new publicLinkHeaderView( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new publicLinkView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'newForm',\n\n\t\t\t\t\t// getHeaderView() is defined by default, but we need to override it for the newForm drawer.\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\treturn new newFormHeaderView( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new newFormView( data );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t] );\n\n\t\t\t// Listen for requests for our drawer collection.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:drawerCollection', this.getDrawerCollection, this );\n\t\t\t// Listen for requests for specific drawer models.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:drawer', this.getDrawer, this );\n\t\t},\n\n\t\tgetDrawerCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tgetDrawer: function( id ) {\n\t\t\treturn this.collection.get( id );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Default settings title view.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/defaultSettingsTitle',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-settings-title-default',\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderTypeNicename: function() {\n\t \t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tvar domainID = currentDomain.get( 'id' );\n\t \t\t\tvar type = nfRadio.channel( domainID ).request( 'get:type', this.type );\n\t \t\t\tif ( 'undefined' != typeof type ) {\n\t \t\t\t\treturn type.get( 'nicename' );\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\t});\n\n\treturn view;\n} );\n/**\n * Empty view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/empty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-empty'\n\t});\n\n\treturn view;\n} );\n/**\n * Model for our individual domains.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/domainModel',[ 'views/app/drawer/defaultSettingsTitle', 'views/app/empty' ], function( DefaultSettingsTitleView, EmptyView ) {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tdashicons: '',\n\t\t\tclasses: '',\n\t\t\tactive: false,\n\t\t\turl: '',\n\t\t\thotkeys: false,\n\t\t\tdisabled: false,\n\n\t\t\tgetSettingsTitleView: function( data ) {\n\t\t\t\treturn new DefaultSettingsTitleView( data );\n\t\t\t},\n\n\t\t\tgetDefaultSettingsTitleView: function( data ) {\n\t\t\t\treturn new DefaultSettingsTitleView( data );\n\t\t\t},\n\n\t\t\tgetGutterLeftView: function( data ) {\n\t\t\t\t/*\n\t\t\t\t * Return empty view\n\t\t\t\t */\n\t\t\t\treturn new EmptyView();\n\t\t\t},\n\n\t\t\tgetGutterRightView: function( data ) {\n\t\t\t\t/* \n\t\t\t\t * Return empty view\n\t\t\t\t */\n\t\t\t\treturn new EmptyView();\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Holds all of our domain models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/domainCollection',['models/app/domainModel'], function( domainModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: domainModel\n\t} );\n\treturn collection;\n} );\ndefine( 'views/fields/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header-fields'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/mainContentFieldCollection',[], function() {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\treorderOnSort: true,\n\n\t\tgetChildView: function() {\n\t\t\treturn nfRadio.channel( 'views' ).request( 'get:fieldItem' );\n\t\t},\n\n\t\tgetEmptyView: function() {\n\t\t\treturn nfRadio.channel( 'views' ).request( 'get:mainContentEmpty' );\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:sortableEl', this.getSortableEl, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'init:sortable', this.initSortable, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'destroy:sortable', this.destroySortable, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif ( this.collection.models.length > 0 ) {\n\t\t\t\tjQuery( this.el ).addClass( 'nf-field-type-droppable' ).addClass( 'nf-fields-sortable' );\n\t\t\t\tvar that = this;\n\t\t\t\t/* TODO: There's a bug with some Android phones and chrome. The fix below hasn't been implement.\n\n\t\t\t\t * Instantiate our sortable field list, but only if we aren't on a mobile device.\n\t\t\t\t *\n\t\t\t\t * On Android, our sortable list isn't scrollable if it's instantiated at render.\n\t\t\t\t * Instead, for mobile, we need to instantiate our sortable when the user tapholds and then\n\t\t\t\t * destroy it when the drag stops.\n\t\t\t\t */\n\t\t\t\t// if ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\t\tthis.initSortable();\n\t\t\t\t// }\n\t\t\t}\n\t\t\tnfRadio.channel( 'app' ).trigger( 'render:fieldsSortable', this );\n\t\t},\n\n\t\tgetSortableEl: function() {\n\t\t\treturn this.el;\n\t\t},\n\n\t\tinitSortable: function() {\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tvar tolerance = 'pointer';\n\t\t\t} else {\n\t\t\t\tvar tolerance = 'intersect';\n\t\t\t}\n\n\t\t\tjQuery( this.el ).sortable( {\n\t\t\t\tcontainment: 'parent',\n\t\t\t\thelper: 'clone',\n\t\t\t\tcancel: '.nf-item-controls',\n\t\t\t\tplaceholder: 'nf-fields-sortable-placeholder',\n\t\t\t\topacity: 0.95,\n\t\t\t\tgrid: [ 5, 5 ],\n\t\t\t\t// scroll: false,\n\t\t\t\tappendTo: '#nf-main',\n\t\t\t\tscrollSensitivity: 10,\n\t\t\t\t//connectWith would allow drag and drop between fields already in the builder and the repeatable fieldset ( this is currently an issue until we deal with existing data stored)\n\t\t\t\t//connectWith: '.nf-fields-sortable', \n\n\t\t\t\treceive: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping || jQuery(ui.item).hasClass(\"nf-over-repeater\") ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'receive:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tover: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'over:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'out:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'start:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:fieldsSortable', ui, this );\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'stop:fieldsSortable', ui );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tdestroySortable: function() {\n\t\t\tjQuery( this.el ).sortable( 'destroy' );\n\t\t},\n\n\t\tonAddChild: function( childView ) {\n\t\t\tif ( nfRadio.channel( 'fields' ).request( 'get:adding' ) ) {\n\t\t\t\tchildView.$el.hide().show( 'clip' );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'set:adding', false );\n\t\t\t}\n\t\t}\n\t\t\n\t} );\n\n\treturn view;\n} );\n\ndefine( 'views/fields/drawer/addSavedField',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-add-saved-field',\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:addSavedLoading', this.renderAddButton, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.renderAddButton();\n\t\t},\n\n\t\trenderAddButton: function() {\n\t\t\tif ( this.model.get( 'addSavedLoading' ) ) {\n\t\t\t\tvar button = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-add-saved-field-loading' );\n\t\t\t} else {\n\t\t\t\tvar button = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-add-saved-field-button' );\n\t\t\t}\n\t\t\tjQuery( this.el ).find( '.add-button' ).html( button( this ) );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:addSavedLoading', this.render );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-button': 'clickAddSavedField'\n\t\t},\n\n\t\tclickAddSavedField: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:addSavedField', e, this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n\n/**\n * Fields settings title view.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/fields/drawer/settingsTitle',['views/fields/drawer/addSavedField'], function( addSavedFieldView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-settings-title-fields',\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:saved', this.render, this );\n\t\t\tthis.model.on( 'change:label', this.renderjBoxContent, this );\n\t\t},\n\n\t\tregions: {\n\t\t\taddSaved: '.nf-add-saved-field'\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:saved', this.render );\n\t\t\tthis.addSavedjBox.destroy();\n\t\t\tthis.model.unset( 'jBox', { silent: true } );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.renderjBoxContent();\n\t\t\tvar that = this;\n\t\t\tthis.addSavedjBox = new jBox( 'Tooltip', {\n\t\t\t\ttrigger: 'click',\n\t\t\t\ttitle: 'Add to Favorite Fields',\n\t\t\t\tposition: {\n\t\t\t\t\tx:'left',\n\t\t\t\t\ty:'center'\n\t\t\t\t},\n\t\t\t\toutside:'x',\n\t\t\t\tcloseOnClick: 'body',\n\n\t\t\t\tonCreated: function() {\n\t\t\t\t\tthis.setContent( jQuery( that.el ).find( '.nf-add-saved-field' ) );\n\t\t\t\t}\n\t\t\t} );\n\t\t\tthis.addSavedjBox.attach( jQuery( this.el ).find( '.dashicons') );\n\t\t\tthis.model.set( 'jBox', this.addSavedjBox, { silent: true } );\n\t\t},\n\n\t\trenderjBoxContent: function() {\n\t\t\tif ( this.addSaved ) {\n\t\t\t\tthis.addSaved.show( new addSavedFieldView( { model: this.model } ) );\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderTypeNicename: function() {\n\t \t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tvar domainID = currentDomain.get( 'id' );\n\t \t\t\tvar type = nfRadio.channel( domainID ).request( 'get:type', this.type );\n\t \t\t\tvar displayName = type.get( 'nicename' );\n\n\t \t\t\tif ( this.saved ) {\n\t \t\t\t\tvar realType = nfRadio.channel( domainID ).request( 'get:type', type.get( 'type' ) );\n\t \t\t\t\tdisplayName += ' - ' + realType.get( 'nicename' );\n\t \t\t\t}\n\t \t\t\treturn displayName;\n\t\t\t\t},\n\t\t\t\t\n\t\t\t\trenderSavedStar: function() {\n\t\t\t\t\tif ( this.saved ) {\n\t\t\t\t\t\tvar star = 'filled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\tvar star = 'empty';\n\t\t\t\t\t}\n\t\t\t\t\treturn '<span class=\"dashicons dashicons-star-' + star + '\"></span>'\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Add main header.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/mainHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-header-actions',\n\n\t\tinitialize: function() {\n\t\t\tvar actionCollection = nfRadio.channel( 'actions' ).request( 'get:collection' );\n\t\t\tthis.listenTo( actionCollection, 'add', this.render );\n\t\t\tthis.listenTo( actionCollection, 'remove', this.render );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar actionCollection = nfRadio.channel( 'actions' ).request( 'get:collection' );\n\t\t\tif ( actionCollection.models.length == 0 ) {\n\t\t\t\tjQuery( this.el ).hide();\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).show();\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Actions subheader view.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header-actions'\n\t});\n\n\treturn view;\n} );\n/**\n * Renders an application menu item from a domain model.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/itemControls',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-item-controls',\n\n\t\tinitialize: function() {\n\t\t\t// Listen for domain changes and re-render when we detect one.\n\t\t\t// this.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.render );\n\t\t},\n\n\t\t/**\n\t\t * When we render this view, remove the extra <div> tag created by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\t\t\t// \n\t\t\tthis.currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t},\n\n\t\tevents: {\n\t\t\t'mouseover .nf-item-control': 'mouseoverItemControl',\n\t\t\t'click .nf-edit-settings': 'clickEdit',\n\t\t\t'singletap .nf-item-control': 'singleTapEdit',\n\t\t\t'click .nf-item-delete': 'clickDelete',\n\t\t\t'click .nf-item-duplicate': 'clickDuplicateField'\n\t\t},\n\n\t\tclickEdit: function( e ) {\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tsingleTapEdit: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t},\n\n\t\tclickDelete: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:delete', e, this.model );\n\t\t},\n\n\t\tclickDuplicateField: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:duplicate', e, this.model );\n\t\t},\n\n\t\tmouseoverItemControl: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'mouseover:itemControl', e, this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Single action table row\n *\n * TODO: make dynamic\n *\n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/actionItem',['views/app/itemControls'], function( itemControlsView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'tr',\n\t\ttemplate: '#tmpl-nf-action-item',\n\n\t\tregions: {\n\t\t\titemControls: '.nf-item-controls'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.template = nfRadio.channel( 'actions' ).request( 'get:actionItemTemplate' ) || this.template;\n\t\t\tthis.model.on( 'change:label', this.render, this );\n\t\t\tthis.model.on( 'change:editActive', this.render, this );\n\t\t\tthis.model.on( 'change:active', this.maybeDeactivate, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:label', this.render );\n\t\t\tthis.model.off( 'change:editActive', this.render );\n\t\t\tthis.model.off( 'change:active', this.maybeDeactivate );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif ( this.model.get( 'editActive' ) ) {\n\t\t\t\tjQuery( this.el ).addClass( 'active' );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).removeClass( 'active' );\n\t\t\t}\n\n\t\t\tthis.maybeDeactivate();\n\n\t\t\tthis.itemControls.show( new itemControlsView( { model: this.model } ) );\n\t\t},\n\n\t\tmaybeDeactivate: function() {\n\t\t\tif ( 0 == this.model.get( 'active' ) ) {\n\t\t\t\tjQuery( this.el ).addClass( 'deactivated' );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).removeClass( 'deactivated' );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'change input': 'changeToggle',\n\t\t\t'click': 'maybeClickEdit'\n\t\t},\n\n\t\tmaybeClickEdit: function( e ) {\n\t\t\tif ( 'TR' == jQuery( e.target ).parent().prop( 'tagName' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tchangeToggle: function( e ) {\n\t\t\tvar setting = jQuery( e.target ).data( 'setting' );\n\t\t\tvar settingModel = nfRadio.channel( 'actions' ).request( 'get:settingModel', setting );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:setting', e, settingModel, this.model );\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderToggle: function( settingName ) {\n\t\t\t\t\tthis.settingName = settingName || 'active';\n\t\t\t\t\tvar actionLabel = this.label;\n\t\t\t\t\tthis.label = '';\n\t\t\t\t\tthis.value = this[ this.settingName ];\n\t\t\t\t\tthis.name = this.id + '-' + this.settingName;\n\t\t\t\t\tvar html = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-toggle' );\n\t\t\t\t\thtml = html( this );\n\t\t\t\t\tthis.label = actionLabel;\n\t\t\t\t\treturn html;\n\t\t\t\t},\n\n\t\t\t\trenderTypeNicename: function() {\n\t\t\t\t\tvar type = nfRadio.channel( 'actions' ).request( 'get:type', this.type );\n\t\t\t\t\tif ( 'undefined' == typeof type ) return;\n\n\t\t\t\t\treturn type.get( 'nicename' );\n\t\t\t\t},\n\n /**\n\t\t\t\t * [Deprecated] Tooltips are not currently implemented in the context of the action list.\n\t\t\t\t * However, the template uses a nested template which requires the helper method.\n * @returns {string}\n */\n\t\t\t\trenderTooltip: function() {\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\n\t\t\t\trenderMergeTags: function() {\n\t\t\t\t\tif ( this.use_merge_tags ) {\n\t\t\t\t\t\treturn '<span class=\"dashicons dashicons-list-view merge-tags\"></span>';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/actions/mainContentEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-content-actions-empty',\n\n\t\tonBeforeDestroy: function() {\n\t\t\tjQuery( this.el ).parent().parent().removeClass( 'nf-actions-empty' );\n\t\t\t// jQuery( this.el ).parent().removeClass( 'nf-fields-empty-droppable' ).droppable( 'destroy' );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).parent().parent().addClass( 'nf-actions-empty' );\n\t\t\t// if ( jQuery( this.el ).parent().hasClass( 'ui-sortable' ) ) {\n\t\t\t// \tjQuery( this.el ).parent().sortable( 'destroy' );\n\t\t\t// }\n\t\t\t// jQuery( this.el ).parent().addClass( 'nf-fields-empty-droppable' );\n\t\t\t// jQuery( this.el ).parent().droppable( {\n\t\t\t// \taccept: function( draggable ) {\n\t\t\t// \t\tif ( jQuery( draggable ).hasClass( 'nf-stage' ) || jQuery( draggable ).hasClass( 'nf-field-type-button' ) ) {\n\t\t\t// \t\t\treturn true;\n\t\t\t// \t\t}\n\t\t\t// \t},\n\t\t\t// \thoverClass: 'nf-droppable-hover',\n\t\t\t// \ttolerance: 'pointer',\n\t\t\t// \tover: function( e, ui ) {\n\t\t\t// \t\tui.item = ui.draggable;\n\t\t\t// \t\tnfRadio.channel( 'app' ).request( 'over:fieldsSortable', ui );\n\t\t\t// \t},\n\t\t\t// \tout: function( e, ui ) {\n\t\t\t// \t\tui.item = ui.draggable;\n\t\t\t// \t\tnfRadio.channel( 'app' ).request( 'out:fieldsSortable', ui );\n\t\t\t// \t},\n\t\t\t// \tdrop: function( e, ui ) {\n\t\t\t// \t\tui.item = ui.draggable;\n\t\t\t// \t\tnfRadio.channel( 'app' ).request( 'receive:fieldsSortable', ui );\n\t\t\t// \t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t// \t\tfieldCollection.trigger( 'reset', fieldCollection );\n\t\t\t// \t},\n\t\t\t// } );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Main content view for our actions.\n *\n * TODO: make dynamic\n *\n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/mainContent',['views/actions/actionItem', 'views/actions/mainContentEmpty'], function( actionView, emptyView ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\ttemplate: '#tmpl-nf-action-table',\n\t\tchildView: actionView,\n\t\temptyView: emptyView,\n\n\t\tinitialize: function() {\n\t\t\tthis.template = nfRadio.channel( 'actions' ).request( 'get:mainContentTemplate' ) || this.template;\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tjQuery( this.el ).droppable( {\n\t\t\t\taccept: '.nf-action-type-draggable',\n\t\t\t\tactiveClass: 'nf-droppable-active',\n\t\t\t\thoverClass: 'nf-droppable-hover',\n\t\t\t\tdrop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'drop:actionType', e, ui );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tif ( 'undefined' == typeof nfRadio.channel( 'actions' ).request( 'get:type', childView.model.get( 'type' ) ) ) return;\n\n\t\t\tjQuery( collectionView.el ).find( 'tbody' ).append( childView.el );\n\t\t},\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/advanced/mainHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-header-settings'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/advanced/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header-settings'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/advanced/settingItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-form-setting-type',\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:editActive', this.updateActiveClass );\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:editActive', this.updateActiveClass, this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click': 'clickEdit'\n\t\t},\n\n\t\tclickEdit: function( e ) {\n\t\t\tnfRadio.channel( 'settings' ).trigger( 'click:edit', e, this.model );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = 'nf-setting-wrap ' + this.id;\n\t \t\t\tif ( this.editActive ) {\n\t \t\t\t\tclasses += ' active';\n\t \t\t\t}\n\t \t\t\treturn classes;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tupdateActiveClass: function() {\n\t\t\tif ( this.model.get( 'editActive' ) ) {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting-wrap' ).addClass( 'active' );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting-wrap' ).removeClass( 'active' );\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/advanced/mainContent',['views/advanced/settingItem'], function( settingItem ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\tchildView: settingItem,\n\t\ttemplate: '#tmpl-nf-advanced-main-content',\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.child-view-container' ).append( childView.el );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Model that represents our form fields.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/fieldModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tobjectType: 'Field',\n\t\t\tobjectDomain: 'fields',\n\t\t\teditActive: false,\n\t\t\torder: 999,\n\t\t\tidAttribute: 'id'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tvar type = this.get('type');\n\t\t\tif ( 'undefined' == typeof type ) return;\n\n\t\t\t// Listen for model attribute changes\n\t\t\tthis.on( 'change', this.changeSetting, this );\n\n\t\t\t// Get our parent field type.\n\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', this.get( 'type' ) );\n\t\t\tvar parentType = fieldType.get( 'parentType' );\n\n\t\t\t// Loop through our field type \"settingDefaults\" and add any default settings.\n\t\t\t_.each( fieldType.get( 'settingDefaults' ), function( val, key ) {\n\t\t\t\tif ( 'undefined' == typeof this.get( key ) ) {\n\t\t\t\t\tthis.set( key, val, { silent: true } );\n\t\t\t\t}\n\t\t\t}, this );\n\n\t\t\t/*\n\t\t\t * If our field type is a saved field, set our field type to the actual field type\n\t\t\t */\n\t\t\tif ( 'saved' == fieldType.get( 'section' ) ) {\n\t\t\t\tthis.set( 'type', fieldType.get( 'type' ) );\n\t\t\t}\n\n\t\t\tif (type === 'listimage') {\n\t\t\t\tthis.get = this.listimageGet;\n\t\t\t\tthis.set = this.listimageSet;\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * Trigger an init event on three channels:\n\t\t\t * \n\t\t\t * fields\n\t\t\t * fields-parentType\n\t\t\t * field-type\n\t\t\t *\n\t\t\t * This lets specific field types modify model attributes before anything uses them.\n\t\t\t */ \n\t\t\tnfRadio.channel( 'fields' ).trigger( 'init:fieldModel', this );\n\t\t\tnfRadio.channel( 'fields-' + parentType ).trigger( 'init:fieldModel', this );\n\t\t\tnfRadio.channel( 'fields-' + this.get( 'type' ) ).trigger( 'init:fieldModel', this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'fire:updateFieldKey', this.updateFieldKey );\n\t\t},\n\n\t\tlistimageGet: function(attr) {\n if(attr === 'options') {\n\t\t\t\t\tattr = 'image_options';\n\t\t\t}\n\n return Backbone.Model.prototype.get.call(this, attr);\n\t\t},\n\t\t\n\t\tlistimageSet: function(attributes, options) {\n\t\t\tif ('options' === attributes) {\n\t\t\t\tattributes = 'image_options';\n\t\t\t}\n\t\t\treturn Backbone.Model.prototype.set.call(this, attributes, options);\n\t\t},\n\n\t\t/**\n\t\t * Fires an event on the fieldSetting-{name} channel saying we've updated a setting.\n\t\t * When we change the model attributes, fire an event saying we've changed something.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tchangeSetting: function( model, options ) {\n\t\t\tnfRadio.channel( 'fieldSetting-' + _.keys( model.changedAttributes() )[0] ).trigger( 'update:setting', this, options.settingModel ) ;\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'update:setting', this, options.settingModel );\n\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', this, options.settingModel );\n\t\t},\n\n\t\tupdateFieldKey: function( keyModel, settingModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'replace:fieldKey', this, keyModel, settingModel );\n\t\t},\n \n /**\n * Function used to get the formatted lable of the fieldModel.\n * \n * @since 3.3.3\n * @return String\n */\n formatLabel: function() {\n // Try to use admin label.\n var label = this.get( 'admin_label' );\n // If our admin label is empty...\n if ( '' == label ) {\n // Use the field label instead.\n label = this.get( 'label' );\n }\n return label;\n }\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our field models.\n * This is the actual field data created by the user.\n *\n * We listen to the add and remove events so that we can push the new id to either the new fields or removed fields property.\n *\n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/fieldCollection',['models/fields/fieldModel'], function( fieldModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: fieldModel,\n\t\tcomparator: function( model ){\n\t\t\treturn parseInt( model.get( 'order' ) );\n\t\t},\n\t\ttmpNum: 1,\n\n\t\tinitialize: function() {\n\t\t\tthis.on( 'add', this.addField, this );\n\t\t\tthis.on( 'remove', this.removeField, this );\n\n\t\t\tthis.listenTo( this, 'add:field', this.addNewField );\n\t\t\tthis.listenTo( this, 'append:field', this.appendNewField );\n\t\t\tthis.listenTo( this, 'remove:field', this.removeFieldResponse );\n\t\t\tthis.newIDs = [];\n\t\t},\n\n\t\t/**\n\t\t * When we add a field, push the id onto our new fields property.\n\t\t * This lets us tell the server that this is a new field to be added rather than a field to be updated.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param void\n\t\t */\n\t\taddField: function( model ) {\n\t\t\tthis.newIDs.push( model.get( 'id' ) );\n\t\t},\n\n\t\t/**\n\t\t * When we remove a field, push the id onto our removed fields property.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param void\n\t\t */\n\t\tremoveField: function( model ) {\n\t\t\tthis.removedIDs = this.removedIDs || {};\n\t\t\tthis.removedIDs[ model.get( 'id' ) ] = model.get( 'id' );\n\t\t},\n\n\t\taddNewField: function( model ) {\n\t\t\tthis.add( model );\n\t\t},\n\n\t\tappendNewField: function( model ) {\n\t\t\tif ( 0 == this.length ) {\n\t\t\t\tvar order = 0;\n\t\t\t} else {\n\t\t\t\tvar order = this.at( this.length -1 ).get( 'order' ) + 1;\n\t\t\t}\n\n\t\t\tmodel.set( 'order', order, { silent: true } );\n\t\t\tthis.add( model );\n\t\t},\n\n\t\tremoveFieldResponse: function( model ) {\n\t\t\tthis.remove( model );\n\t\t},\n\n\t\tfieldExists: function( fieldModel ) {\n\t\t\treturn -1 != this.indexOf( fieldModel );\n\t\t}\n\t} );\n\treturn collection;\n} );\n\n/**\n * Config file for our app domains.\n * \n * this.collection represents all of our app domain (fields, actions, settings) information.\n *\n * This doesn't store the current domain, but rather all the data about each.\n * \n * This data includes:\n * hotkeys\n * header view\n * subheader view\n * content view\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/domainConfig',[\n\t// Require our domain collection\n\t'models/app/domainCollection',\n\t// Require our fields domain files\n\t'views/fields/subHeader',\n\t'views/fields/mainContentFieldCollection',\n\t'views/fields/drawer/settingsTitle',\n\t// Require our actions domain files\n\t'views/actions/mainHeader', \n\t'views/actions/subHeader',\n\t'views/actions/mainContent',\n\t// Require our settings domain files\n\t'views/advanced/mainHeader',\n\t'views/advanced/subHeader',\n\t'views/advanced/mainContent',\n\t// Empty View\n\t'views/app/empty',\n\t// FieldCollection: used by the default formContentData filter\n\t'models/fields/fieldCollection'\n\t], \n\tfunction( \n\t\tappDomainCollection,\n\t\tfieldsSubHeaderView,\n\t\tFieldsMainContentFieldCollectionView,\n\t\tfieldsSettingsTitleView,\n\t\tactionsMainHeaderView,\n\t\tactionsSubHeaderView,\n\t\tactionsMainContentView,\n\t\tsettingsMainHeaderView,\n\t\tsettingsSubHeaderView,\n\t\tsettingsMainContentView,\n\t\tEmptyView,\n\t\tFieldCollection\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Add our default formContentView filter.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).request( 'add:viewFilter', this.defaultFormContentView, 10, this );\n\t\t\t\n\t\t\t/*\n\t\t\t * Add our default formContentData filter.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).request( 'add:loadFilter', this.defaultFormContentLoad, 10, this );\n\n\t\t\t/*\n\t\t\t * Add our default formContentGutterView filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContentGutters' ).request( 'add:leftFilter', this.defaultFormContentGutterView, 10, this );\n\t\t\tnfRadio.channel( 'formContentGutters' ).request( 'add:rightFilter', this.defaultFormContentGutterView, 10, this );\n\n\t\t\t// Define our app domains\n\t\t\tthis.collection = new appDomainCollection( [\n\t\t\t\t{\n\t\t\t\t\tid: 'fields',\n\t\t\t\t\tnicename: nfi18n.domainFormFields,\n\t\t\t\t\thotkeys: {\n\t\t\t\t\t\t'Esc'\t\t\t\t: 'close:drawer',\n\t\t\t\t\t\t'Ctrl+Shift+n'\t\t: 'add:newField',\n\t\t\t\t\t\t'Ctrl+Shift+a'\t\t: 'changeDomain:actions',\n\t\t\t\t\t\t'Ctrl+Shift+s'\t\t: 'changeDomain:settings',\n\t\t\t\t\t\t'Alt+Ctrl+t'\t\t: 'open:mergeTags',\n\t\t\t\t\t\t'up'\t\t\t\t: 'up:mergeTags',\n\t\t\t\t\t\t'down'\t\t\t\t: 'down:mergeTags',\n\t\t\t\t\t\t'Shift+return'\t\t: 'return:mergeTags'\n\t\t\t\t\t},\n\t\t\t\t\tmobileDashicon: 'dashicons-menu',\n\n\t\t\t\t\tgetSubHeaderView: function() {\n\t\t\t\t\t\treturn new fieldsSubHeaderView();\n\t\t\t\t\t},\n\n\t\t\t\t\t/**\n\t\t\t\t\t * Get the formContent view that should be used in our builder.\n\t\t\t\t\t * Uses two filters:\n\t\t\t\t\t * 1) One for our formContentData\n\t\t\t\t\t * 2) One for our formContentView\n\t\t\t\t\t *\n\t\t\t\t\t * If we don't have any view filters, we use the default formContentView.\n\t\t\t\t\t * \n\t\t\t\t\t * @since 3.0\n\t\t\t\t\t * @return formContentView backbone view.\n\t\t\t\t\t */\n\t\t\t\t\tgetMainContentView: function( collection ) {\n\t\t\t\t\t\tvar formContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'formContentData' );\n\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * As of version 3.0, 'fieldContentsData' has deprecated in favour of 'formContentData'.\n\t\t\t\t\t\t * If we don't have this setting, then we check for this deprecated value.\n\t\t\t\t\t\t * \n\t\t\t\t\t\t * Set our fieldContentsData to our form setting 'fieldContentsData'\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * TODO: Remove this backwards compatibility eventually.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tif ( ! formContentData ) {\n\t\t\t\t\t\t\tformContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'fieldContentsData' );\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * If we don't have a filter for our formContentData, default to fieldCollection.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar formContentLoadFilters = nfRadio.channel( 'formContent' ).request( 'get:loadFilters' );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( formContentLoadFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tformContentData = callback( formContentData, nfRadio.channel( 'app' ).request( 'get:formModel' ), true );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Check our fieldContentViewsFilter to see if we have any defined.\n\t\t\t\t\t\t * If we do, overwrite our default with the view returned from the filter.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar formContentViewFilters = nfRadio.channel( 'formContent' ).request( 'get:viewFilters' );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( formContentViewFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tformContentView = callback();\n\n\t\t\t\t\t\tnfRadio.channel( 'settings' ).request( 'update:setting', 'formContentData', formContentData, true );\n\t\t\t\t\t\treturn new formContentView( { collection: formContentData } );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetSettingsTitleView: function( data ) {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * If we are dealing with a field model, return the fields settings view, otherwise, return the default.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tif ( 'fields' == data.model.get( 'objectDomain' ) ) {\n\t\t\t\t\t\t\treturn new fieldsSettingsTitleView( data );\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn this.get( 'getDefaultSettingsTitleView' ).call( this, data );\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t},\n\n\t\t\t\t\tgetGutterLeftView: function( data ) {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Check our fieldContentViewsFilter to see if we have any defined.\n\t\t\t\t\t\t * If we do, overwrite our default with the view returned from the filter.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar gutterFilters = nfRadio.channel( 'formContentGutters' ).request( 'get:leftFilters' );\n\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( gutterFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tgutterView = callback();\n\n\t\t\t\t\t\treturn new gutterView(); \n\t\t\t\t\t},\n\n\t\t\t\t\tgetGutterRightView: function() {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Check our fieldContentViewsFilter to see if we have any defined.\n\t\t\t\t\t\t * If we do, overwrite our default with the view returned from the filter.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar gutterFilters = nfRadio.channel( 'formContentGutters' ).request( 'get:rightFilters' );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( gutterFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tgutterView = callback();\n\n\t\t\t\t\t\treturn new gutterView(); \n\t\t\t\t\t}\n\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'actions',\n\t\t\t\t\tnicename: nfi18n.domainActions,\n\t\t\t\t\thotkeys: {\n\t\t\t\t\t\t'Esc'\t\t\t\t: 'close:drawer',\n\t\t\t\t\t\t'Ctrl+Shift+n'\t\t: 'add:newAction',\n\t\t\t\t\t\t'Ctrl+Shift+f'\t\t: 'changeDomain:fields',\n\t\t\t\t\t\t'Ctrl+Shift+s'\t\t: 'changeDomain:settings',\n\t\t\t\t\t\t'Alt+Ctrl+t'\t\t: 'open:mergeTags',\n\t\t\t\t\t\t'up'\t\t\t\t: 'up:mergeTags',\n\t\t\t\t\t\t'down'\t\t\t\t: 'down:mergeTags',\n\t\t\t\t\t\t'Shift+return'\t\t: 'return:mergeTags'\n\t\t\t\t\t},\n\t\t\t\t\tmobileDashicon: 'dashicons-external',\n\n\t\t\t\t\tgetSubHeaderView: function() {\n\t\t\t\t\t\treturn new actionsSubHeaderView();\n\t\t\t\t\t},\n\t\t\t\t\t\n\t\t\t\t\tgetMainContentView: function() {\n\t\t\t\t\t\tvar collection = nfRadio.channel( 'actions' ).request( 'get:collection' );\n\t\t\t\t\t\treturn new actionsMainContentView( { collection: collection } );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'settings',\n\t\t\t\t\tnicename: nfi18n.domainAdvanced,\n\t\t\t\t\thotkeys: {\n\t\t\t\t\t\t'Esc'\t\t\t\t: 'close:drawer',\n\t\t\t\t\t\t'Ctrl+Shift+f'\t\t: 'changeDomain:fields',\n\t\t\t\t\t\t'Ctrl+Shift+a'\t\t: 'changeDomain:actions',\n\t\t\t\t\t\t'Alt+Ctrl+t'\t\t: 'open:mergeTags',\n\t\t\t\t\t\t'up'\t\t\t\t: 'up:mergeTags',\n\t\t\t\t\t\t'down'\t\t\t\t: 'down:mergeTags',\n\t\t\t\t\t\t'Shift+return'\t\t: 'return:mergeTags'\n\t\t\t\t\t},\n\t\t\t\t\tmobileDashicon: 'dashicons-admin-generic',\n\n\t\t\t\t\tgetSubHeaderView: function() {\n\t\t\t\t\t\treturn new settingsSubHeaderView();\n\t\t\t\t\t},\n\t\t\t\t\t\n\t\t\t\t\tgetMainContentView: function() {\n\t\t\t\t\t\tvar collection = nfRadio.channel( 'settings' ).request( 'get:typeCollection' );\n\t\t\t\t\t\treturn new settingsMainContentView( { collection: collection } );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'preview',\n\t\t\t\t\tnicename: 'Preview Form',\n\t\t\t\t\tclasses: 'preview',\n\t\t\t\t\tdashicons: 'dashicons-visibility',\n\t\t\t\t\tmobileDashicon: 'dashicons-visibility',\n\t\t\t\t\turl: nfAdmin.previewurl\n\t\t\t\t}\n\t\t\t] );\n\n\t\t\t/*\n\t\t\t * Send out a radio message with our domain config collection.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).trigger( 'init:domainCollection', this.collection );\n\n\t\t\t/*\n\t\t\t * Respond to requests to get the app domain collection.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:domainCollection', this.getDomainCollection, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:domainModel', this.getDomainModel, this );\n\t\t},\n\n\t\tgetDomainCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tgetDomainModel: function( id ) {\n\t\t\treturn this.collection.get( id );\n\t\t},\n\n\t\tdefaultFormContentView: function( formContentData ) {\n\t\t\treturn FieldsMainContentFieldCollectionView;\n\t\t},\n\n\t\tdefaultFormContentLoad: function( formContentData ) {\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t/*\n\t\t\t * If we only have one load filter, we can just return the field collection.\n\t\t\t */\n\t\t\tvar formContentLoadFilters = nfRadio.channel( 'formContent' ).request( 'get:loadFilters' );\n\t\t\tvar sortedArray = _.without( formContentLoadFilters, undefined );\n\n\t\t\tif ( 1 == sortedArray.length || 'undefined' == typeof formContentData || true === formContentData instanceof Backbone.Collection ) return fieldCollection;\n\n\t\t\t/*\n\t\t\t * If another filter is registered, we are calling this from somewhere else.\n\t\t\t */\n\n \tvar fieldModels = _.map( formContentData, function( key ) {\n \t\treturn fieldCollection.findWhere( { key: key } );\n \t}, this );\n\n \treturn new FieldCollection( fieldModels );\n\t\t},\n\n\t\tdefaultFormContentGutterView: function( formContentData ) {\n\t\t\treturn EmptyView;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Model for our app data.\n * Listens for changes to the 'clean' attribute and triggers a radio message when the state changes.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/appModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tloading: false\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes to our 'clean' attribute.\n\t\t\tthis.on( 'change:clean', this.changeStatus, this );\n\t\t},\n\n\t\tchangeStatus: function() {\n\t\t\t// Send out a radio message when the 'clean' attribute changes.\n\t\t\tnfRadio.channel( 'app' ).trigger( 'change:clean', this.get( 'clean' ) );\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Creates and stores a model that represents app-wide data. i.e. current domain, current drawer, clean, etc.\n *\n * clean is a boolean that represents whether or not changes have been made.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/data',['models/app/appModel'], function( appModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Get the collection that represents all the parts of our application.\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\t// Setup our initial model.\n\t\t\tthis.model = new appModel( {\n\t\t\t\tcurrentDrawer: false,\n\t\t\t\tcurrentDomain: appDomainCollection.get( 'fields' ),\n\t\t\t\tclean: true\n\t\t\t} );\n\n\t\t\t/*\n\t\t\t * Set the mobile setting used to track whether or not we're on a mobile device.\n\t\t\t */\n\t\t\tvar mobile = ( 1 == nfAdmin.mobile ) ? true : false;\n\t\t\tthis.model.set( 'mobile', mobile );\n\n\t\t\t/*\n\t\t\t * Respond to requests to see if we are on mobile.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'is:mobile', this.isMobile, this );\n\n\t\t\t/*\n\t\t\t * Respond to app channel requests for information about the state of our app.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:data', this.getData, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:setting', this.getSetting, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:currentDomain', this.getCurrentDomain, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:currentDrawer', this.getCurrentDrawer, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:current', this.getCurrentDrawer, this );\n\n\t\t\t/*\n\t\t\t * Respond to app channel requests to update app settings.\n\t\t\t */\t\t\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:currentDomain', this.updateCurrentDomain, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:currentDrawer', this.updateCurrentDrawer, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:setting', this.updateSetting, this );\n\n\t\t\tnfRadio.channel( 'settings' ).reply( 'check:deps', this.checkDeps, this );\n\n\t\t},\n\t\t\n\t\t/**\n\t\t * A more robust settings dependency system.\n\t\t * This allows you to have a setting only show when X AND Y are met or when X OR Y are met.\n\t\t * \n\t\t * @since \n\t\t * @param {object} setting Setting object\n\t\t * @param {object} context Object context for where this is being called.\n\t\t * @return {bool}/{string}\n\t\t */\n\t\tcheckDeps: function( setting, context ) {\n\t\t\tif ( ! setting.deps ) {\n\t\t\t\treturn '';\n\t\t\t}\n\n\t\t\t// If we do have a \"settings\" property, then this is a new dependency format.\n\t\t\tlet deps_settings = setting.deps.settings;\n\t\t\tlet match = setting.deps.match;\n\t\t\t\n\t\t\tlet hide = false;\n\t\t\t\n\t\t\tfor (var i = deps_settings.length - 1; i >= 0; i--) {\n\t\t\t\tlet name = deps_settings[i].name;\n\t\t\t\tlet value = deps_settings[i].value;\n\n\t\t\t\t// Use == here instead of === in order to avoid string => int comparison.\n\t\t\t if ( context.dataModel.get( name ) == value ) {\n\t\t \t// If we're looking for \"any\" match, we can go ahead and return here. \n\t\t \tif ( 'any' == match ) {\n\t\t \t\thide = false;\n\t\t \t\tbreak;\n\t\t \t}\n\t\t } else {\n\t \t\thide = true;\n\t\t }\n\t\t\t}\n\n\t\t\tif ( hide ) {\n\t\t\t\treturn 'style=\"display:none;\"';\n\t\t\t}\n\t\t\t\n\t\t\treturn '';\n\t\t},\n\n\t\tupdateCurrentDomain: function( model ) {\n\t\t\tthis.updateSetting( 'currentDomain', model );\n\t\t},\n\n\t\tupdateSetting: function( setting, value ) {\n\t\t\tthis.model.set( setting, value );\n\t\t\treturn true;\n\t\t},\n\n\t\tgetSetting: function( setting ) {\n\t\t\treturn this.model.get( setting );\n\t\t},\n\n\t\tgetData: function() {\n\t\t\treturn this.model;\n\t\t},\n\n\t\tgetCurrentDomain: function() {\n\t\t\treturn this.model.get( 'currentDomain' );\n\t\t},\n\n\t\tupdateCurrentDrawer: function( drawerID ) {\n\t\t\tthis.updateSetting( 'currentDrawer', drawerID );\n\t\t\treturn true;\n\t\t},\n\n\t\tgetCurrentDrawer: function() {\n\t\t\tvar currentDrawerID = this.model.get( 'currentDrawer' );\n\t\t\treturn nfRadio.channel( 'app' ).request( 'get:drawer', currentDrawerID );\n\t\t},\n\n\t\tisMobile: function() {\n\t\t\treturn this.model.get( 'mobile' );\n\t\t}\n\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens for click events to expand/collapse setting groups.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/drawerToggleSettingGroup',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for click events on our settings group.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:toggleSettingGroup', this.toggleSettingGroup );\n\t\t},\n\n\t\t/**\n\t\t * Set the 'display' attribute of our group model to true or false to toggle.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \tgroup setting model\n\t\t * @return void\n\t\t */\n\t\ttoggleSettingGroup: function( e, model ) {\n\t\t\tif ( model.get( 'display' ) ) {\n\t\t\t\t/*\n\t\t\t\t * Make sure that none of our settings have errors\n\t\t\t\t */\n\t\t\t\tvar errors = false;\n\t\t\t\t_.each( model.get( 'settings' ).models, function( setting ) {\n\t\t\t\t\tif ( setting.get( 'error' ) ) {\n\t\t\t\t\t\terrors = true;\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\tif ( ! errors ) {\n\t\t\t\t\tmodel.set( 'display', false );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tmodel.set( 'display', true );\n\t\t\t}\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Updates our database with our form data.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/updateDB',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\n\t\tinitialize: function() {\n\t\t\t// Listen for the closing of the drawer and update when it's closed.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.updateDB );\n\t\t\t// Respond to requests to update the database.\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:db', this.updateDB, this );\n\t\t\t/*\n\t\t\t * Register our default formContent save filter.\n\t\t\t * This converts our collection into an array of keys.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).request( 'add:saveFilter', this.defaultSaveFilter, 10, this );\n\t\t},\n\n\t\t/**\n\t\t * Update our database.\n\t\t * If action isn't specified, assume we're updating the preview.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string \taction preview or publish\n\t\t * @return void\n\t\t */\n\t\tupdateDB: function( action ) {\n\n\t\t\t// If our app is clean, dont' update.\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t// Default action to preview.\n\t\t\taction = action || 'preview';\n\n\t\t\t// Setup our ajax actions based on the action we're performing\n\t\t\tif ( 'preview' == action ) {\n\t\t\t\tvar jsAction = 'nf_preview_update';\n\t\t\t} else if ( 'publish' == action ) {\n\t\t\t\tvar jsAction = 'nf_save_form';\n\t\t\t\t// now using a different ajax action\n\t\t\t\t// var jsAction = 'nf_batch_process';\n\t\t\t}\n\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\n\t\t\t/*\n\t\t\t * There are pieces of data that are only needed for the builder and not for the front-end.\n\t\t\t * We need to unset those.\n\t\t\t * TODO: Make this more dynamic/filterable.\n\t\t\t */\n\t\t\t_.each( formModel.get( 'fields' ).models, function( fieldModel, index ) {\n\t\t\t\tfieldModel.unset( 'jBox', { silent: true } );\n\t\t\t} );\n\n\t\t\t/*\n\t\t\t * The main content of our form is called the formContent.\n\t\t\t * In this next section, we check to see if any add-ons want to modify that contents before we save.\n\t\t\t * If there aren't any filters found, we default to the field collection.\n\t\t\t * \n\t\t\t */\n\t\t\t\n\t\t\tvar formContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'formContentData' );\n\t\t\t/*\n\t\t\t * As of version 3.0, 'fieldContentsData' has deprecated in favour of 'formContentData'.\n\t\t\t * If we don't have this setting, then we check for this deprecated value.\n\t\t\t * \n\t\t\t * Set our fieldContentsData to our form setting 'fieldContentsData'\n\t\t\t *\n\t\t\t * TODO: Remove this backwards compatibility eventually.\n\t\t\t */\n\t\t\tif ( ! formContentData ) {\n\t\t\t\tformContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'fieldContentsData' );\n\t\t\t}\n\n\t\t\tvar formContentSaveDataFilters = nfRadio.channel( 'formContent' ).request( 'get:saveFilters' );\n\t\t\t\t\t\t\n\t\t\t/* \n\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t*/\n\t\t\tvar sortedArray = _.without( formContentSaveDataFilters, undefined );\n\t\t\tvar callback = _.first( sortedArray );\n\t\t\t/*\n\t\t\t * Set our formContentData to the callback specified in the filter, passing our current formContentData.\n\t\t\t */\n\t\t\tformContentData = callback( formContentData );\n\t\t\t\n\t\t\tif ( 'publish' == action && formModel.get( 'show_publish_options' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'newForm' );\n\t\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\t\tjQuery( builderEl ).addClass( 'disable-main' );\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t// Get our form data\n\t\t\tvar formData = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\n\t\t\t// Turn our formData model into an object\n\t\t\tvar data = JSON.parse( JSON.stringify( formData ) );\n\t\t\tdata.settings.formContentData = formContentData;\n\n\t\t\t/**\n\t\t\t * Prepare fields for submission.\n\t\t\t */\n\t\t\t\n\t\t\t// Get the field IDs that we've deleted.\n\t\t\tvar removedIDs = formData.get( 'fields' ).removedIDs;\n\n\t\t\t/*\n\t\t\t * data.fields is an array of objects like:\n\t\t\t * field.label = blah\n\t\t\t * field.label_pos = blah\n\t\t\t * etc.\n\t\t\t *\n\t\t\t * And we need that format to be:\n\t\t\t * field.settings.label = blah\n\t\t\t * field.settings.label_pos = blah\n\t\t\t *\n\t\t\t * So, we loop through our fields and create a field.settings object.\n\t\t\t */\n\t\t\t_.each( data.fields, function( field ) {\n\t\t\t\tvar id = field.id;\n\t\t\t\t// We dont' want to update id or parent_id\n\t\t\t\tdelete field.id;\n\t\t\t\tdelete field.parent_id;\n\t\t\t\tvar settings = {};\n\t\t\t\t// Loop through all the attributes of our fields\n\t\t\t\tfor (var prop in field) {\n\t\t\t\t if ( field.hasOwnProperty( prop ) ) {\n\t\t\t\t \t// If our field property isn't null, then...\n if ( null !== field[ prop ] ) {\n // Set our settings.prop value.\n settings[prop] = field[prop];\n }\n // Delete the property from the field.\n delete field[ prop ];\n }\n\t\t\t\t}\n\n\t\t\t\tfor( var setting in settings ){\n\t\t\t\t\tif( null === settings[ setting ] ) {\n\t\t\t\t\t\tdelete settings[setting];\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Update our field object.\n\t\t\t\tfield.settings = settings;\n\t\t\t\tfield.id = id;\n\t\t\t} );\n\n\t\t\t// Set our deleted_fields object so that we can know which fields were removed.\n\t\t\tdata.deleted_fields = removedIDs;\n\n\t\t\t/**\n\t\t\t * Prepare actions for submission.\n\t\t\t */\n\t\t\t\n\t\t\t// Get the action IDs that we've deleted.\n\t\t\tvar removedIDs = formData.get( 'actions' ).removedIDs;\n\n\t\t\t/*\n\t\t\t * data.actions is an array of objects like:\n\t\t\t * action.label = blah\n\t\t\t * action.label_pos = blah\n\t\t\t * etc.\n\t\t\t *\n\t\t\t * And we need that format to be:\n\t\t\t * action.settings.label = blah\n\t\t\t * action.settings.label_pos = blah\n\t\t\t *\n\t\t\t * So, we loop through our actions and create a field.settings object.\n\t\t\t */\n\t\t\t_.each( data.actions, function( action ) {\n\t\t\t\tvar id = action.id;\n\t\t\t\t// We dont' want to update id or parent_id\n\t\t\t\tdelete action.id;\n\t\t\t\tdelete action.parent_id;\n\t\t\t\tvar settings = {};\n\t\t\t\t// Loop through all the attributes of our actions\n\t\t\t\tfor (var prop in action) {\n\t\t\t\t if ( action.hasOwnProperty( prop ) ) {\n\t\t\t\t \t//Removing null values\n\t\t\t\t\t if( null !== action[ prop ] ) {\n\t\t\t\t\t\t // Set our settings.prop value.\n\t\t\t\t\t\t settings[ prop ] = action[ prop ];\n\t\t\t\t\t }\n\t\t\t\t // Delete the property from the action.\n\t\t\t\t delete action[ prop ];\n\t\t\t\t }\n\t\t\t\t}\n\t\t\t\t// Update our action object.\n\t\t\t\taction.settings = settings;\n\t\t\t\taction.id = id;\n\t\t\t} );\n\n\t\t\tfor ( var setting in data.settings ) {\n\t\t\t\tif ( null === data.settings[ setting ] ) {\n\t\t\t\t\tdelete data.settings[ setting ];\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Set our deleted_actions object so that we can know which actions were removed.\n\t\t\tdata.deleted_actions = removedIDs;\n\n\t\t\t// Turn our object into a JSON string.\n\t\t\tdata = JSON.stringify( data );\n\n\t\t\t// Run anything that needs to happen before we update.\n\t\t\tnfRadio.channel( 'app' ).trigger( 'before:updateDB', data );\n\n\t\t\tif ( 'publish' == action ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'loading', true );\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'change:loading' );\t\n\n\t\t\t\t// If we're on mobile, show a notice that we're publishing\n\t\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\t\tnfRadio.channel( 'notices' ).request( 'add', 'publishing', 'Your Changes Are Being Published', { autoClose: false } );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( 'nf_save_form' === jsAction ) {\n\t\t\t\t// if the form string is long than this, chunk it\n\t\t\t\tvar chunk_size = 100000;\n\t\t\t\tvar data_chunks = [];\n\n\t\t\t\t// Let's chunk this\n\t\t\t\tif( chunk_size < data.length ) {\n\t\t\t\t\tdata_chunks = data.match(new RegExp('.{1,' + chunk_size + '}', 'g'));\n\t\t\t\t}\n\t\t\t\t// if we have chunks send them via the step processor\n\t\t\t\tif( 1 < data_chunks.length ) {\n\t\t\t\t\t// this function will make the ajax call for chunks\n\t\t\t\t\tthis.saveChunkedForm(\n\t\t\t\t\t\tdata_chunks,\n\t\t\t\t\t\t0,\n\t\t\t\t\t\t'nf_batch_process',\n\t\t\t\t\t\taction,\n\t\t\t\t\t\tformModel.get('id'),\n\t\t\t\t\t\ttrue\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\t// otherwise send it the regular way.\n\t\t\t\t\tvar context = this;\n\t\t\t\t\tvar responseData = null;\n\n\t\t\t\t\tjQuery.post( ajaxurl,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\taction: jsAction,\n\t\t\t\t\t\t\tform: data,\n\t\t\t\t\t\t\tsecurity: nfAdmin.ajaxNonce\n\t\t\t\t\t\t},\n\t\t\t\t\t\tfunction( response ) {\n\t\t\t\t\t\t\tresponseData = response;\n\t\t\t\t\t\t\tcontext.handleFinalResponse( responseData, action );\n\t\t\t\t\t\t}\n\t\t\t\t\t).fail( function( xhr, status, error ) {\n\t\t\t\t\t\tcontext.handleFinalFailure( xhr, status, error, action )\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t} else if ( 'nf_preview_update' === jsAction ) {\n\t\t\t\tvar context = this;\n\t\t\t\tvar responseData = null;\n\t\t\t\tjQuery.post( ajaxurl,\n\t\t\t\t\t{\n\t\t\t\t\t\taction: jsAction,\n\t\t\t\t\t\tform: data,\n\t\t\t\t\t\tsecurity: nfAdmin.ajaxNonce\n\t\t\t\t\t},\n\t\t\t\t\tfunction( response ) {\n\t\t\t\t\t\tresponseData = response;\n\t\t\t\t\t\tcontext.handleFinalResponse( responseData, action );\n\t\t\t\t\t}\n\t\t\t\t).fail( function( xhr, status, error ) {\n\t\t\t\t\tcontext.handleFinalFailure( xhr, status, error, action )\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Function to recursively send chunks until all chunks have been sent\n\t\t *\n\t\t * @param chunks\n\t\t * @param currentIndex\n\t\t * @param currentChunk\n\t\t * @param jsAction\n\t\t * @param action\n\t\t */\n\t\tsaveChunkedForm: function( chunks, currentChunk, jsAction, action, formId, new_publish ) {\n\t\t\tvar total_chunks = chunks.length;\n\t\t\tvar postObj = {\n\t\t\t\taction: jsAction,\n\t\t\t\tbatch_type: 'chunked_publish',\n\t\t\t\tdata: {\n\t\t\t\t\tnew_publish: new_publish,\n\t\t\t\t\tchunk_total: total_chunks,\n\t\t\t\t\tchunk_current: currentChunk,\n\t\t\t\t\tchunk: chunks[ currentChunk ],\n\t\t\t\t\tform_id: formId\n\t\t\t\t},\n\t\t\t\tsecurity: nfAdmin.batchNonce\n\t\t\t};\n\n\t\t\tvar that = this;\n\t\t\tjQuery.post( ajaxurl, postObj )\n\t\t\t\t.then( function ( response ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tvar res = JSON.parse(response);\n\t\t\t\t\t\tif ( 'success' === res.last_request && ! res.batch_complete) {\n\t\t\t\t\t\t\tconsole.log('Chunk ' + currentChunk + ' processed');\n\n\t\t\t\t\t\t\t// send the next chunk\n\t\t\t\t\t\t\tthat.saveChunkedForm(chunks, res.requesting, jsAction, action, formId, false);\n\t\t\t\t\t\t} else if ( res.batch_complete ) {\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * We need to respond with data to make the\n\t\t\t\t\t\t\t * publish button return to gray\n */\n\t\t\t\t\t\t\tthat.handleFinalResponse(response, action);\n\t\t\t\t\t\t}\n\t\t\t\t\t} catch ( exception ) {\n\t\t\t\t\t\tconsole.log( 'There was an error in parsing the' +\n\t\t\t\t\t\t\t' response');\n\t\t\t\t\t\tconsole.log( exception );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t).fail( function( xhr, status, error ) {\n\t\t\t\t\tconsole.log( 'There was an error sending form data' );\n\t\t\t\t\tconsole.log( error );\n\t\t\t\t\tthat.handleFinalFailure( xhr, status, error, action );\n\t\t\t\t});\n\t\t},\n\n\t\thandleFinalResponse: function( response, action ) {\n\t\t\ttry {\n\t\t\t\tresponse = JSON.parse( response );\n\t\t\t\tresponse.action = action;\n\n\t\t\t\t// Run anything that needs to happen after we update.\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'response:updateDB', response );\n\t\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) && 'preview' == action ) {\n\t\t\t\t\t// nfRadio.channel( 'notices' ).request( 'add', 'previewUpdate', 'Preview Updated'\t);\n\t\t\t\t}\n\t\t\t} catch( exception ) {\n\t\t\t\tconsole.log( 'Something went wrong!' );\n\t\t\t\tconsole.log( exception );\n\t\t\t}\n\t\t},\n\n\t\thandleFinalFailure: function( xhr, status, error, action ) {\n\t\t\t// For previews, only log to the console.\n\t\t\tif( 'preview' == action ) {\n\t\t\t\tconsole.log( error );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// @todo Convert alert to jBox Modal.\n\t\t\talert(xhr.status + ' ' + error + '\\r\\n' + 'An error on the server caused your form not to publish.\\r\\nPlease contact Ninja Forms Support with your PHP Error Logs.\\r\\nhttps://ninjaforms.com/contact');\n\t\t},\n\n\t\tdefaultSaveFilter: function( formContentData ) {\n\t\t\treturn formContentData.pluck( 'key' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Model that represents our form data.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/formModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tinitialize: function() {\n\t\t\tif ( ! jQuery.isNumeric( this.get( 'id' ) ) ) {\n\t\t\t\tthis.set( 'show_publish_options', true, { silent: true } );\n\t\t\t} else {\n\t\t\t\tthis.set( 'show_publish_options', false, { silent: true } );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Stores our form data and responds to requests for it.\n * Form data stores fields, actions, and settings.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/formData',['models/app/formModel'], function( formModel) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Instantiate Form Model\n\t\t\tthis.model = new formModel( { id: preloadedFormData.id } );\n\t\t\t// Set our field collection\n\t\t\tthis.model.set( 'fields', nfRadio.channel( 'fields' ).request( 'get:collection' ) );\n\t\t\t// Set our actions collection\n\t\t\tthis.model.set( 'actions', nfRadio.channel( 'actions' ).request( 'get:collection' ) );\n\t\t\t// Set our settings collection\n\t\t\tthis.model.set( 'settings', nfRadio.channel( 'settings' ).request( 'get:settings' ) );\n\t\t\t// Respond to requests for form data.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:formModel', this.getFormModel, this );\n\t\t},\n\n\t\t/**\n\t\t * Return form data model.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return backbone.model\n\t\t */\n\t\tgetFormModel: function() {\n\t\t\treturn this.model;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles changing our preview link when we change the 'clean' state of our app.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/previewLink',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for events that would change our preview link\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'before:sendChanges', this.disablePreview, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'response:sendChanges', this.enablePreview, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.changePreviewNicename, this );\n\t\t},\n\n\t\t/**\n\t\t * Disable our preview link before we send data to update our preview.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tdisablePreview: function() {\n\t\t\t// Get our preview domain\n\t\t\tvar appDomains = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar preview = appDomains.get( 'preview' );\n\t\t\t// Set disabled to true. This will trigger the preview link view to redraw.\n\t\t\tpreview.set( 'disabled', true );\n\t\t},\n\n\t\t/**\n\t\t * Change the preview link text from \"Preview Form\" to \"Preview Changes\" or vice-versa\n\t\t * \n\t\t * @since 3.0\n\t\t * @param boolean \tclean app data state\n\t\t * @return void\n\t\t */\n\t\tchangePreviewNicename: function( clean ) {\n\t\t\t// Get our preview domain\n\t\t\tvar appDomains = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar preview = appDomains.get( 'preview' );\n\n\t\t\t// If we have unsaved changes, set our text to 'changes' otherwise, set it to 'form'\n\t\t\tif ( ! clean ) {\n\t\t\t\tvar nicename = 'Preview Changes';\n\t\t\t} else {\n\t\t\t\tvar nicename = 'Preview Form';\n\t\t\t}\n\n\t\t\tpreview.set( 'nicename', nicename );\n\t\t},\n\n\t\t/**\n\t\t * Enable our preview button.\n\t\t * This is triggered when we get a response from our preview update.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tenablePreview: function() {\n\t\t\t// Get our preview domain\n\t\t\tvar appDomains = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar preview = appDomains.get( 'preview' );\n\t\t\t// Set disabled to false. This will trigger the preview link view to redraw.\n\t\t\tpreview.set( 'disabled', false );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for requests to change the current domain.\n *\n * The app menu and the main submenu both contain clickable links that change the current domain.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/menuButtons',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:publish', this.publish );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:viewChanges', this.viewChanges );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:publicLink', this.publicLink );\n\t\t},\n\n\t\tpublish: function() {\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db', 'publish' );\n\t\t},\n\n\t\tviewChanges: function() {\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'viewChanges', { collection: changeCollection } );\n\t\t},\n\n\t\tpublicLink: function() {\n\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'publicLink' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Model that represents our change data.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/changeModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tdisabled: false\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Holds all of our change models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/changeCollection',['models/app/changeModel'], function( domainModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: domainModel,\n\n\t\tcomparator: function( model ) {\n\t\t\tvar id = parseInt( model.cid.replace( 'c', '' ) );\n\t\t\treturn -id;\n\t\t}\n\t} );\n\treturn collection;\n} );\n/**\n * Track settings changes across our app.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/trackChanges',['models/app/changeCollection', 'models/app/changeModel'], function( changeCollection, ChangeModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.collection = new changeCollection();\n\t\t\t// Respond to any requests to add a change directly.\n\t\t\tnfRadio.channel( 'changes' ).reply( 'register:change', this.registerChange, this );\n\t\t\t// Respond to requests for the change collection\n\t\t\tnfRadio.channel( 'changes' ).reply( 'get:collection', this.getCollection, this );\n\t\t\t// Listen for changes in our clean state. If it goes to clean, clear our collection.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.maybeResetCollection );\n\t\t},\n\n\t\tregisterChange: function( action, model, changes, label, data ) {\n\t\t\tvar data = typeof data !== 'undefined' ? data : {};\n\t\t\tif ( 'undefined' == typeof label.dashicon ) {\n\t\t\t\tlabel.dashicon = 'admin-generic';\n\t\t\t}\n\t\t\tvar changeModel = new ChangeModel({\n\t\t\t\taction: action,\n\t\t\t\tmodel: model,\n\t\t\t\tchanges: changes,\n\t\t\t\tlabel: label,\n\t\t\t\tdata: data\t\t\n\t\t\t} );\n\t\t\tthis.collection.add( changeModel );\n\n\t\t\t//loop through repeater fields to reset active state if needed\n\t\t\tnfRadio.channel( 'fields-repeater' ).trigger( 'clearEditActive', model );\n\t\t\t\n\t\t\treturn changeModel;\n\t\t},\n\n\t\tgetCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tmaybeResetCollection: function( clean ) {\n\t\t\tif ( clean ) {\n\t\t\t\tthis.collection.reset();\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\ndefine( 'controllers/app/undoChanges',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:undoChanges', this.undoChanges, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:undoSingle', this.undoSingle, this );\n\t\t},\n\n\t\tundoChanges: function() {\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tchangeCollection.sort();\n\t\t\tvar that = this;\n\t\t\t_.each( changeCollection.models, function( change ) {\n\t\t\t\tthat.undoSingle( change, true );\n\t\t\t} );\n\t\t\tchangeCollection.reset();\n\t\t\t// Update preview.\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\t\t\t\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', true );\n\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n this.dispatchClick();\n\t\t},\n\n\t\tundoSingle: function( change, undoAll ) {\n\t\t\tnfRadio.channel( 'changes' ).request( 'undo:' + change.get( 'action' ), change, undoAll );\n this.dispatchClick();\n\t\t},\n \n dispatchClick: function() {\n // If we already have a cookie, exit.\n if ( document.cookie.includes( 'nf_undo' ) ) return;\n // Otherwise, prepare our cookie.\n var cname = \"nf_undo\";\n var d = new Date();\n // Set expiration at 1 week.\n d.setTime( d.getTime() + ( 7*24*60*60*1000 ) );\n var expires = \"expires=\"+ d.toUTCString();\n // Bake the cookie.\n document.cookie = cname + \"=1;\" + expires + \";path=/\";\n var data = {\n action: 'nf_undo_click',\n security: nfAdmin.ajaxNonce\n }\n // Make our AJAX call.\n jQuery.post( ajaxurl, data );\n }\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens for our update:db response and replaces tmp ids with new ids if we were performing the publish action.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/publishResponse',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our app channel for the updateDB response.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'response:updateDB', this.publishResponse );\n\t\t},\n\n\t\tpublishResponse: function( response ) {\n\t\t\t// If we aren't performing a publish action, bail.\n\t\t\tif ( 'publish' !== response.action ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\t\n\t\t\t// Check to see if we have any new ids. \n\t\t\tif ( 'undefined' != typeof response.data.new_ids ) {\n\n\t\t\t\t// If we have any new fields, update their models with the new id.\n\t\t\t\tif ( 'undefined' != typeof response.data.new_ids.fields ) {\n\t\t\t\t\t_.each( response.data.new_ids.fields, function( newID, oldID ) {\n\t\t\t\t\t\tvar field = nfRadio.channel( 'fields' ).request( 'get:field', oldID );\n\t\t\t\t\t\tif ( field ) {\n\t\t\t\t\t\t\tfield.set( 'id', newID );\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tfield = nfRadio.channel( 'fields-repeater' ).request( 'get:childField', oldID, null, newID );\n\t\t\t\t\t\t\tfield.set( 'id', newID );\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// If we have any new actions, update their models with the new id.\n\t\t\t\tif ( 'undefined' != typeof response.data.new_ids.actions ) {\n\t\t\t\t\t_.each( response.data.new_ids.actions, function( newID, oldID ) {\n\t\t\t\t\t\tvar action = nfRadio.channel( 'actions' ).request( 'get:action', oldID );\n\t\t\t\t\t\tif ( action ) {\n\t\t\t\t\t\t\taction.set( 'id', newID );\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// If we have a new form id, update the model with the new id.\n\t\t\t\tif ( 'undefined' != typeof response.data.new_ids.forms ) {\n\t\t\t\t\t_.each( response.data.new_ids.forms, function( newID, oldID ) {\n\t\t\t\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t\t\t\tformModel.set( 'id', newID );\n\t\t\t\t\t\thistory.replaceState( '', '', 'admin.php?page=ninja-forms&form_id=' + newID );\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'loading', false );\n\t\t\tnfRadio.channel( 'app' ).trigger( 'change:loading' );\n\n\t\t\t// If we're on mobile, show a notice that we're publishing\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tnfRadio.channel( 'notices' ).request( 'close', 'publishing' );\n\t\t\t}\n\t\t\t// Add a notice that we've published.\n//\t\t\tnfRadio.channel( 'notices' ).request( 'add', 'published', 'Changes Published' );\n\t\t\tnfRadio.channel( 'app' ).trigger( 'app:published', response );\n\n\t\t\t// Mark our app as clean. This will disable the publish button and fire anything else that cares about the state.\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', true );\n\t\t}\n\t\t\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for requests to change the current domain.\n *\n * The app menu and the main submenu both contain clickable links that change the current domain.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/changeDomain',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for both menu and submenu clicks.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:menu', this.changeAppDomain );\n\t\t\t// Reply to specific requests to change the domain\n\t\t\tnfRadio.channel( 'app' ).reply( 'change:currentDomain', this.changeAppDomain, this );\n\n\t\t\t// Reply to requests to prevent our drawer from closing\n\t\t\tnfRadio.channel( 'app' ).reply( 'prevent:changeDomain', this.preventChange, this );\n\t\t\t// Reply to requests to enable drawer closing\n\t\t\tnfRadio.channel( 'app' ).reply( 'enable:changeDomain', this.enableChange, this );\n\n\t\t\t/*\n\t\t\t * Object that holds our array of 'prevent change' values.\n\t\t\t * We use an array so that registered requests can unregister and not affect each other.\n\t\t\t */\n\t\t\tthis.objPreventChange = {};\n\t\t},\n\n\t\tchangeAppDomain: function( e, model ) {\n\t\t\t/*\n\t\t\t * If we have disabled movement between domains, return false.\n\t\t\t */\n\t\t\tif ( this.maybePreventChange() ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * If we are passed a model, use that model.\n\t\t\t * Otherwise, get the domain from the event target data.\n\t\t\t */ \n\t\t\tif ( 'undefined' == typeof model ) {\n\t\t\t\tvar domainID = jQuery( e.target ).data( 'domain' );\n\t\t\t\tvar model = nfRadio.channel( 'app' ).request( 'get:domainModel', domainID );\n\t\t\t}\n\t\t\t// If a drawer is open, close it.\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'get:currentDrawer' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t}\n\t\t\t/*\n\t\t\t * If we aren't dealing with an external url (such as preview), update our app data\n\t\t\t * and trigger a radio message saying we've changed the domain.\n\t\t\t */ \n\t\t\tif ( 0 == model.get( 'url' ).length ) {\n\t\t\t\tvar mainEl = nfRadio.channel( 'app' ).request( 'get:mainEl' );\n\t\t\t\tnfRadio.channel( 'app' ).request( 'update:currentDomain', model );\n\t\t\t\tjQuery( mainEl ).scrollTop( 0 );\t\t\t\t\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'change:currentDomain', model );\n\t\t\t}\n\t\t},\n\n\t\t/**\n * Check to see if anything has registered a key to prevent changing the domain.\n * \n * @since 3.0\n * @return boolean\n */\n maybePreventChange: function() {\n \tif ( 0 == Object.keys( this.objPreventChange ).length ) {\n \t\treturn false;\n \t} else {\n \t\treturn true;\n \t}\n },\n\n /**\n * Register a key to prevent changing the domain.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent change domain' setting.\n * @return void\n */\n preventChange: function( key ) {\n \tthis.objPreventChange[ key ] = true;\n },\n\n /**\n * Remove a previously registered key that is preventing our domain from changing.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent change domain' setting.\n * @return void\n */\n enableChange: function( key ) {\n \tdelete this.objPreventChange[ key ];\n },\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Modify the user's browser history when they click on a domain\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/pushstate',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.changePushState );\n\t\t},\n\n\t\tchangePushState: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\thistory.pushState( null, null, window.location.href + '&domain=' + currentDomain.get( 'id' ) );\n\t\t\tvar reExp = /domain=\\\\d+/;\n\t\t\tvar url = window.location.toString();\n\t\t\tvar newUrl = url.replace( reExp, '' );\n\t\t\tconsole.log( newUrl );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles our hotkey execution. Needs to be cleaned up and made more programmatic.\n * \n * Our hotkeys are defined by the domain that we're currently viewing. In each domain's model, there is a hotkey object.\n * \n * Currently too much hotkey data is hard-coded here.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/hotkeys',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// When we change our domain, change the hotkeys to those within that object.\n\t\t\tthis.listenTo( nfRadio.channel( 'main' ), 'render:main', this.changeHotkeys );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.changeHotkeys );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'render:settingGroup', this.changeHotkeys );\n\t\t\t// Currently, these are the functions that run when the new field or new action hotkey is pressed.\n\t\t\t// TODO: move these into a config module or into something more programmatic and scalable.\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'add:newField', this.addNewField );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'add:newAction', this.addNewAction );\n\t\t\t// Same as above, these functions need to be moved into a more modular/programmatic solution.\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'changeDomain:fields', this.changeDomainFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'changeDomain:actions', this.changeDomainActions );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'changeDomain:settings', this.changeDomainSettings );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'close:drawer', this.closeDrawer );\n\t\t},\n\n\t\tchangeHotkeys: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tjQuery( document ).off( '.nfDomainHotkeys' );\n\t\t\tjQuery( 'input' ).off( '.nfDomainHotkeys' );\n\t\t\tif ( currentDomain.get( 'hotkeys' ) ) {\n\t\t\t\tjQuery.each( currentDomain.get( 'hotkeys' ), function( hotkey, msg ) {\n\t\t\t\t\tjQuery( document ).on( 'keydown.nfDomainHotkeys', null, hotkey, function( e ) {\n\t\t\t\t\t\tnfRadio.channel( 'hotkeys' ).trigger( msg, e );\n\t\t\t\t\t} );\n\t\t\t\t\tjQuery( 'input' ).on( 'keydown.nfDomainHotkeys', null, hotkey, function( e ) {\n\t\t\t\t\t\tnfRadio.channel( 'hotkeys' ).trigger( msg, e );\n\t\t\t\t\t} );\n\t\t\t\t\tjQuery( 'textarea' ).on( 'keydown.nfDomainHotkeys', null, hotkey, function( e ) {\n\t\t\t\t\t\tnfRadio.channel( 'hotkeys' ).trigger( msg, e );\n\t\t\t\t\t} );\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\n\t\taddNewField: function() {\n\t\t\tif ( 'addField' != nfRadio.channel( 'app' ).request( 'get:currentDrawer' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'addField' );\n\t\t\t} else {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t}\n\t\t\t\n\t\t},\n\n\t\taddNewAction: function() {\n\t\t\tif ( 'addAction' != nfRadio.channel( 'app' ).request( 'get:currentDrawer' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'addAction' );\n\t\t\t} else {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t}\n\t\t},\n\n\t\tchangeDomainFields: function() {\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar fieldsDomain = appDomainCollection.get( 'fields' );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:currentDomain', {}, fieldsDomain );\n\t\t},\n\n\t\tchangeDomainActions: function() {\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar actionsDomain = appDomainCollection.get( 'actions' );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:currentDomain', {}, actionsDomain );\n\t\t},\n\n\t\tchangeDomainSettings: function() {\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar settingsDomain = appDomainCollection.get( 'settings' );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:currentDomain', {}, settingsDomain );\n\t\t},\n\n\t\tcloseDrawer: function() {\n\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Change the clean state of our app when settings are changed.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/cleanState',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Set an array of field model attributes to ignore.\n\t\t\t * This list will be filtered just before we ignore anything.\n\t\t\t */ \n\t\t\tthis.ignoreAttributes = [\n\t\t\t\t'editActive'\n\t\t\t];\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'update:setting', this.setAppClean );\n\t\t},\n\n\t\tsetAppClean: function( model ) {\n\t\t\tfor( var attr in model.changedAttributes() ) {\n\t\t\t\tvar changedAttr = attr;\n\t\t\t\tvar after = model.changedAttributes()[ attr ];\n\t\t\t}\n\n\t\t\tvar ignoreAttributes = nfRadio.channel( 'undo-' + model.get( 'type' ) ).request( 'ignore:attributes', this.ignoreAttributes ) || this.ignoreAttributes;\n\t\t\t\n\t\t\tif ( -1 != this.ignoreAttributes.indexOf( attr ) ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\n\t\t\t//loop through repeater fields to reset active state if needed\n\t\t\tnfRadio.channel( 'fields-repeater' ).trigger( 'clearEditActive', model );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * All of the core undo functions. Listens on the 'changes' channel for an undo request.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/coreUndo',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:changeSetting', this.undoChangeSetting, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:addObject', this.undoAddObject, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:removeObject', this.undoRemoveObject, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:duplicateObject', this.undoDuplicateObject, this );\n\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:sortFields', this.undoSortFields, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:addListOption', this.undoAddListOption, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:removeListOption', this.undoRemoveListOption, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:sortListOptions', this.undoSortListOptions, this );\n\t\t},\n\n\t\t/**\n\t\t * Undo settings that have been changed.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoChangeSetting: function( change, undoAll ) {\n\t\t\tvar fieldModel = change.get( 'model' );\n\t\t\tvar changes = change.get( 'changes' );\n\t\t\tvar attr = changes.attr;\n\t\t\tvar before = changes.before;\n\t\t\tfieldModel.set( attr, before );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * Undo adding a field or an action.\n\t\t * Loops through our change collection and removes any change models based upon the one we're removing.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoAddObject: function( change, undoAll ) {\n\t\t\tvar objectModel = change.get( 'model' );\n\t\t\tvar collection = change.get( 'data' ).collection;\n\n\t\t\tif ( 'undefined' != typeof collection.newIDs ) {\n\t\t\t\tdelete collection.newIDs[ objectModel.get( 'id' ) ];\n\t\t\t}\n\t\t\t\t\t\t\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: objectModel } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tchangeCollection.remove( model );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\t\t\t\n\t\t\tcollection.remove( objectModel );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\t\t\n\n\t\t/**\n\t\t * Undo adding a field or an action.\n\t\t * Loops through our change collection and removes any change models based upon the one we're removing.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoDuplicateObject: function( change, undoAll ) {\n\t\t\tvar objectModel = change.get( 'model' );\n\t\t\tvar objectCollection = change.get( 'data' ).collection;\n\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: objectModel } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tchangeCollection.remove( model );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tobjectCollection.remove( objectModel );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * Undo removing a field or an action.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoRemoveObject: function( change, undoAll ) {\n\t\t\tvar dataModel = change.get( 'model' );\n\t\t\tvar collection = change.get( 'data' ).collection;\n\n\t\t\tnfRadio.channel( dataModel.get( 'objectDomain' ) ).request( 'add', dataModel );\n\n\t\t\tdelete collection.removedIDs[ dataModel.get( 'id' ) ];\n\t\t\t\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: dataModel } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tmodel.set( 'disabled', false );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\n\t\t\t// Trigger a reset on our field collection so that our view re-renders\n\t\t\tcollection.trigger( 'reset', collection );\n\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * Undo field sorting.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoSortFields: function( change, undoAll ) {\n\t\t\tvar data = change.get( 'data' );\n\t\t\tvar fields = data.fields;\n\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t_.each( fields, function( changeModel ) {\n\t\t\t\tvar before = changeModel.before;\n\t\t\t\tvar fieldModel = changeModel.model;\n\t\t\t\tfieldModel.set( 'order', before );\n\t\t\t\t// console.log( 'set ' + fieldModel.get( 'label' ) + ' to ' + before );\n\t\t\t} );\n\t\t\t// console.log( fieldCollection.where( { label: 'Name' } ) );\n\t\t\t// console.log( fieldCollection.where( { label: 'Email' } ) );\n\n\n\t\t\tfieldCollection.sort();\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\tundoAddListOption: function( change, undoAll ) {\n\t\t\tvar model = change.get( 'model' );\n\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: model } );\n\n\t\t\t\t_.each( results, function( changeModel ) {\n\t\t\t\t\tif ( changeModel !== change ) {\n\t\t\t\t\t\tchangeCollection.remove( changeModel );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\n\t\t\tmodel.collection.remove( model );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\tundoRemoveListOption: function( change, undoAll ) {\n\t\t\tvar model = change.get( 'model' );\n\t\t\tvar collection = change.get( 'data' ).collection;\n\t\t\tcollection.add( model );\n\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: model } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tmodel.set( 'disabled', false );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\tundoSortListOptions: function( change, undoAll ) {\n\t\t\tvar data = change.get( 'data' );\n\t\t\tvar collection = data.collection;\n\t\t\t\n\t\t\tvar objModels = data.objModels;\n\n\t\t\t_.each( objModels, function( changeModel ) {\n\t\t\t\tvar before = changeModel.before;\n\t\t\t\tvar optionModel = changeModel.model;\n\t\t\t\toptionModel.set( 'order', before );\n\t\t\t} );\t\t\t\t\n\n\n\t\t\tcollection.sort();\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * If our undo action was requested to 'remove' the change from the collection, remove it.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tremove \tshould we remove this item from our change collection\n\t\t * @return void\n\t\t */\n\t\tmaybeRemoveChange: function( change, undoAll ) {\t\t\t\n\t\t\tvar undoAll = typeof undoAll !== 'undefined' ? undoAll : false;\n\t\t\tif ( ! undoAll ) {\n\t\t\t\t// Update preview.\n\t\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tchangeCollection.remove( change );\n\t\t\t\tif ( 0 == changeCollection.length ) {\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', true );\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns a clone of a backbone model with all the attributes looped through so that collections contained within are propely cloned.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/cloneModelDeep',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'clone:modelDeep', this.cloneModelDeep, this );\n\t\t},\n\n\t\tcloneModelDeep: function( model ) {\n\t\t\t// Temporary value used to store any new collections.\n\t\t\tvar replace = {};\n\t\t\t// Loop over every model attribute and if we find a collection, clone each model and instantiate a new collection.\n\t\t\t_.each( model.attributes, function( val, key ) {\n\t\t\t\tif( val instanceof Backbone.Collection ) { // Is this a backbone collection?\n\t\t\t\t\tvar clonedCollection = nfRadio.channel( 'app' ).request( 'clone:collectionDeep', val );\n\t\t\t\t\treplace[ key ] = clonedCollection;\n\t\t\t\t} else if ( val instanceof Backbone.Model ) { // Is this a backbone model?\n\t\t\t\t\treplace[ key ] = this.cloneModelDeep( val );\n\t\t\t\t}\n\t\t\t}, this );\n\n\t\t\t// Clone our original model\n\t\t\tvar newModel = model.clone();\n\t\t\t// Overwrite any collections we created above.\n\t\t\t_.each( replace, function( val, key ) {\n\t\t\t\tnewModel.set( key, val );\n\t\t\t} );\n\n\t\t\treturn newModel;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns the appropriate child view for our settings drawer.\n *\n * This enables settings types to register custom childviews for their settings.\n * The option-repeater setting for the list field is an example.\n * \n * @package Ninja Forms builder\n * @subpackage App - Edit Settings Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/getSettingChildView',['views/app/drawer/itemSetting'], function( itemSettingView ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for field settings child views.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n\t\t},\n\n\t\t/**\n\t\t * Return the appropriate child setting view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param backbone.model\tmodel \tField setting\n\t\t * @return backbone.view\n\t\t */\n\t\tgetSettingChildView: function( model ) {\n\t\t\t// Get our setting type.\n\t\t\tvar type = model.get( 'type' );\n\t\t\t// Request a setting childview from our setting type channel. (Setting type, not field type)\n\t\t\tvar settingChildView = nfRadio.channel( type ).request( 'get:settingChildView', model ) || itemSettingView;\n\t\t\t\n\t\t\treturn settingChildView\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Updates our model when the user changes a setting.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/changeSettingDefault',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests to update settings.\n\t\t\tnfRadio.channel( 'app' ).reply( 'change:setting', this.changeSetting, this );\n\n\t\t\t// Listen on our app channel for the change setting event. Fired by the setting view.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:setting', this.changeSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * When we change our setting, update the model.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tsettingModel model that holds our field type settings info\n\t\t * @param backbone.model \tdataModel model that holds our field settings\n\t\t * @return void\n\t\t */\n\t\tchangeSetting: function( e, settingModel, dataModel, value ) {\n\t\t\tvar name = settingModel.get( 'name' );\n\t\t\tvar before = dataModel.get( name );\n\t\t\tvar value = value || null;\n\t\t\tif ( ! value ) {\n\t\t\t\t// Sends out a request on the fields-type (fields-text, fields-checkbox, etc) channel to see if that field type needs to return a special value for saving.\n\t\t\t\tvalue = nfRadio.channel( settingModel.get( 'type' ) ).request( 'before:updateSetting', e, dataModel, name, settingModel );\n\t\t\t}\n\n\t\t\tif( 'undefined' == typeof value ){\n\t\t\t value = jQuery( e.target ).val();\n }\n\t\t\t\n\t\t\t// Update our field model with the new setting value.\n\t\t\tdataModel.set( name, value, { settingModel: settingModel } );\n\t\t\tnfRadio.channel( 'setting-' + name ).trigger( 'after:updateSetting', dataModel, settingModel );\n\t\t\t// Register our setting change with our change tracker\n\t\t\tvar after = value;\n\t\t\t\n\t\t\tvar changes = {\n\t\t\t\tattr: name,\n\t\t\t\tbefore: before,\n\t\t\t\tafter: after\n\t\t\t}\n\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Changed ' + settingModel.get( 'label' ) + ' from ' + before + ' to ' + after\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'changeSetting', dataModel, changes, label );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\ndefine( 'views/app/drawer/typeSettingFieldset',['views/app/drawer/itemSetting'], function( itemSettingView ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-edit-setting-wrap',\n\t\tchildView: itemSettingView,\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.collection = this.model.get( 'settings' );\n\t\t\tthis.childViewOptions = { dataModel: data.dataModel };\n\t\t\tthis.dataModel = data.dataModel;\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\t// If we don't have a 'settings' property, this is a legacy depdency setup.\n\t\t\t\tif ( 'undefined' == typeof deps.settings ) {\n\t\t\t\t\tdeps.settings = [];\n\t\t\t\t\t_.each(deps, function(dep, name){\n\t\t\t\t\t\tif( 'settings' !== name ) {\n\t\t\t\t\t\t\tdeps.settings.push( { name: name, value: dep } );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tdeps.match = 'all';\n\t\t\t\t}\n\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.on( 'change:' + name, this.render, this );\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.model.on( 'rerender', this.render, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tname = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.off( 'change:' + name, this.render );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tonBeforeRender: function() {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'before:renderSetting', this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\t \t\trenderVisible: function() {\n\n\t\t\t\t\tif(!nfAdmin.devMode){\n\t\t\t\t\t\tif('help' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('classes' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit_set' == this.name) return 'style=\"display:none;\"';\n\n\t\t\t\t\t\tif('checkbox' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('checkbox_values' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('date' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('year_range' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'check:deps', this, that );\n\t \t\t},\n\t \t\trenderSetting: function(){\n\t \t\t\tvar setting = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-' + this.type );\n\t\t\t\t\treturn setting( this );\n\t\t\t\t},\n\t\t\t\t\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = '';\n\t\t\t\t\tif ( 'undefined' != typeof this.width ) {\n\t\t\t\t\t\tclasses += this.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclasses += ' one-half';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\tclasses += ' nf-error';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderError: function() {\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\treturn this.error;\n\t\t\t\t\t}\n\t\t\t\t\treturn '';\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.nf-field-sub-settings' ).append( childView.el );\n\t\t}\n\t} );\n\n\treturn view;\n} );\n/**\n * Handles actions related to field settings that use a fieldset\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/fieldset',['views/app/drawer/typeSettingFieldset','models/app/settingCollection'], function( fieldsetView, settingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'fieldset' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n\t\t\t// When a list type field is initialized, create an option collection.\n\t\t\tthis.listenTo( nfRadio.channel( 'fieldset' ), 'init:settingModel', this.createSettingsCollection );\n\t\t},\n\n\t\tgetSettingChildView: function( model ) {\n\t\t\treturn fieldsetView;\n\t\t},\n\n\t\t/**\n\t\t * Instantiate settings collection when a fieldset type is initialized.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \tfield model being initialized\n\t\t * @return void\n\t\t */\n\t\tcreateSettingsCollection: function( model ) {\n\t\t\tmodel.set( 'settings', new settingCollection( model.get( 'settings' ) ) );\n\t\t},\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to our toggle field.\n * When we change the toggle, the setting value will be 'on' or ''.\n * We need to change this to 1 or 0.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/toggleSetting',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// We don't want the RTE setting to re-render when the value changes.\n\t\t\tnfRadio.channel( 'setting-type-toggle' ).reply( 'renderOnChange', function(){ return false } );\n\n\t\t\t// Respond to requests for field setting filtering.\n\t\t\tnfRadio.channel( 'toggle' ).reply( 'before:updateSetting', this.updateSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * Return either 1 or 0, depending upon the toggle position.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tfieldModel field model\n\t\t * @param string \t\t\tname setting name\n\t\t * @param backbone.model \tsettingTypeModel field type model\n\t\t * @return int 1 or 0\n\t\t */\n\t\tupdateSetting: function( e, fieldModel, name, settingTypeModel ) {\n\t\t\tif ( jQuery( e.target ).prop( 'checked' ) ) {\n\t\t\t\tvar value = 1;\n\t\t\t} else {\n\t\t\t\tvar value = 0;\n\t\t\t}\n\n\t\t\treturn value;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to our toggle field.\n * When we change the toggle, the setting value will be 'on' or ''.\n * We need to change this to 1 or 0.\n *\n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/buttonToggleSetting',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// We don't want the RTE setting to re-render when the value changes.\n\t\t\tnfRadio.channel( 'setting-type-button-toggle' ).reply( 'renderOnChange', function(){ return false; } );\n\n\t\t\t// Respond to requests for field setting filtering.\n\t\t\tnfRadio.channel( 'button-toggle' ).reply( 'before:updateSetting', this.updateSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * Return either 1 or 0, depending upon the toggle position.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tfieldModel field model\n\t\t * @param string \t\t\tname setting name\n\t\t * @param backbone.model \tsettingTypeModel field type model\n\t\t * @return int 1 or 0\n\t\t */\n\t\tupdateSetting: function( e, fieldModel, name, settingTypeModel ) {\n\t\t\treturn e.target.value;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to number field settings.\n *\n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/numberSetting',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for field setting filtering.\n\t\t\tnfRadio.channel( 'number' ).reply( 'before:updateSetting', this.updateSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * Resets value if user enters value below min value or above max value\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tfieldModel field model\n\t\t * @param string \t\t\tname setting name\n\t\t * @param backbone.model \tsettingTypeModel field type model\n\t\t * @return int 1 or 0\n\t\t */\n\t\tupdateSetting: function( e, fieldModel, name, settingTypeModel ) {\n\t\t\tvar minVal = settingTypeModel.get( 'min_val' );\n\t\t\tvar maxVal = settingTypeModel.get( 'max_val' );\n\n\t\t\t/*\n\t\t\t * if we gave a min value set, revert to that if the user enters\n\t\t\t * a lower number\n\t\t\t*/\n\t\t\tif( 'undefined' != typeof minVal && null !== minVal ){\n\t\t\t\tif ( e.target.value < minVal ) {\n\t\t\t\t\tfieldModel.set('value', minVal);\n\t\t\t\t\te.target.value = minVal;\n\t\t\t\t}\n\t\t\t}\n\t\t\t/*\n\t\t\t * if we gave a max value set, revert to that if the user enters\n\t\t\t * a higher number\n\t\t\t*/\n\t\t\tif( 'undefined' != typeof maxVal && null !== maxVal ){\n\t\t\t\tif ( e.target.value > maxVal ) {\n\t\t\t\t\tfieldModel.set('value', maxVal);\n\t\t\t\t\te.target.value = maxVal;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn e.target.value;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n\ndefine( 'controllers/app/radioSetting',[], function() {\n var controller = Marionette.Object.extend({\n initialize: function () {\n // Respond to requests for field setting filtering.\n\n console.log( nfRadio.channel( 'radio' ) );\n nfRadio.channel('radio').reply( 'before:updateSetting', this.updateSetting, this);\n },\n\n\n updateSetting: function( e, fieldModel, name, settingTypeModel ) {\n console.log( 'test' );\n }\n });\n return controller;\n} );\n/**\n * Listens for clicks on our action item action buttons.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Main Sortable\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/itemControls',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\n\t\tdeleting: false, // block edit functionality while deleting field\n\n\t\tinitialize: function() {\n\t\t\t// Listen for clicks to edit, delete, duplicate actions.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:edit', this.clickEdit );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:delete', this.maybeDelete );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:duplicate', this.clickDuplicate );\n\n\t\t\t// Listen for our drawer close and remove our active edit state\n\t\t},\n\n\t\t/**\n\t\t * Open a drawer with our action model for editing settings.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tclickEdit: function( e, model ) {\n\t\t\t// if we are deleting a field, we don't want to the edit drawer to open\n\t\t\tif( ! this.deleting ) {\n\t\t\t\tvar currentDomain = nfRadio.channel('app').request('get:currentDomain');\n\t\t\t\tvar currentDomainID = currentDomain.get('id');\n\t\t\t\tvar type = nfRadio.channel(currentDomainID).request('get:type', model.get('type'));\n\t\t\t\tnfRadio.channel('app').request('open:drawer', 'editSettings', {\n\t\t\t\t\tmodel: model,\n\t\t\t\t\tgroupCollection: type.get('settingGroups')\n\t\t\t\t});\n\t\t\t\t//loop through repeater fields to reset active state if needed\n\t\t\t\tnfRadio.channel( 'fields-repeater' ).trigger( 'clearEditActive', model );\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Let user know that all data will be lost before actually deleting\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tmaybeDelete: function( e, dataModel ) {\n\t\t\t// we set deleting to true, so the edit event doesn't open drawer\n\t\t\tthis.deleting = true;\n\t\t\tvar modelID = dataModel.get( 'id' );\n\t\t\tvar modelType = dataModel.get( 'objectType' );\n\n\t\t\t// Build a lookup table for fields that we don't save\n\t\t\tvar nonSaveFields = [ 'html', 'submit', 'hr',\n\t\t\t\t'recaptcha', 'spam', 'creditcard', 'creditcardcvc',\n\t\t\t\t'creditcardexpiration', 'creditcardfullname',\n\t\t\t\t'creditcardnumber', 'creditcardzip' ];\n\n\t\t\t/*\n\t\t\t* If this is a new field that hasn't been saved, then we don't\n\t\t\t * need to check for data\n\t\t\t */\n\t\t\tif( 'field' != modelType.toLowerCase() ) {\n\t\t\t\tthis.clickDelete( e, dataModel );\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t* If the field has been saved, then we need to check for\n\t\t\t\t * submission data for this field\n\t\t\t\t */\n\t\t\t\tif( 'tmp' === modelID.toString().substring( 0, 3 )\n\t\t\t\t\t|| -1 != jQuery.inArray( dataModel.get( 'type' ), nonSaveFields ) ) {\n\t\t\t\t\t// not a saved field so proceed as normal\n\t\t\t\t\tthis.clickDelete( e, dataModel );\n\t\t\t\t} else {\n\t\t\t\t\t// need the form id\n\t\t\t\t\tvar formModel = Backbone.Radio.channel('app').request('get:formModel');\n\t\t\t\t\tvar data = {\n\t\t\t\t\t\t'action': 'nf_maybe_delete_field',\n\t\t\t\t\t\t'security': nfAdmin.ajaxNonce,\n\t\t\t\t\t\t'formID': formModel.get('id'),\n\t\t\t\t\t\t'fieldKey': dataModel.get('key'),\n\t\t\t\t\t\t'fieldID': modelID\n\t\t\t\t\t};\n\t\t\t\t\tvar that = this;\n\n\t\t\t\t\t// make call to see if field has submission data\n\t\t\t\t\tjQuery.post(ajaxurl, data)\n\t\t\t\t\t\t.done(function (response) {\n\t\t\t\t\t\t\tvar res = JSON.parse(response);\n\n\t\t\t\t\t\t\tif (res.data.hasOwnProperty('errors')) {\n\t\t\t\t\t\t\t\tvar errors = res.data.errors;\n\t\t\t\t\t\t\t\tvar errorMsg = '';\n\n\t\t\t\t\t\t\t\tif (Array.isArray(errors)) {\n\t\t\t\t\t\t\t\t\terrors.forEach(function(error) {\n\t\t\t\t\t\t\t\t\t\terrors += error + \"\\n\";\n\t\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\terrors = errors;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconsole.log('Maybe Delete Field Errors: ', errors);\n\t\t\t\t\t\t\t\talert(errors);\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (res.data.field_has_data) {\n\t\t\t\t\t\t\t\t// if it does, show warning modal\n\t\t\t\t\t\t\t\tthat.doDeleteFieldModal(e, dataModel);\n\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t// if not, proceed like normal\n\t\t\t\t\t\t\t\tthat.clickDelete(e, dataModel);\n\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Create the field delete warning modal\n\t\t *\n\t\t * @param e\n\t\t * @param dataModel\n\t\t */\n\t\tdoDeleteFieldModal: function( e, dataModel ) {\n\t\t\t// Build warning modal to warn user a losing all data related to field\n var that = this;\n var modalData = {\n width: 400,\n closeOnClick: false,\n closeOnEsc: true,\n content: nfi18n.fieldDataDeleteMsg,\n btnPrimary: {\n text: nfi18n.delete,\n callback: function() {\n // close and destory modal.\n deleteModal.toggleModal( false );\n deleteModal.destroy();\n // proceed as normal, data will be deleted in backend on publish\n that.clickDelete( e, dataModel );\n }\n },\n btnSecondary: {\n text: nfi18n.cancel,\n callback: function() {\n // close and destory modal\n deleteModal.toggleModal( false );\n deleteModal.destroy();\n // set deleting to false so edit can work as normal\n that.deleting = false;\n }\n }\n };\n var deleteModal = new NinjaModal( modalData );\n\t\t},\n\n\t\t/**\n\t\t * Delete a action model from our collection\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tclickDelete: function( e, dataModel ) {\n\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', dataModel );\n\n\t\t\t// Add our action deletion to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Removed',\n\t\t\t\tdashicon: 'dismiss'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: dataModel.collection\n\t\t\t};\n\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tvar results = changeCollection.where( { model: dataModel } );\n\n\t\t\t_.each( results, function( changeModel ) {\n\t\t\t\tvar data = changeModel.get( 'data' );\n\t\t\t\tif ( 'undefined' != typeof data.fields ) {\n\t\t\t\t\t_.each( data.fields, function( field, index ) {\n\t\t\t\t\t\tif ( field.model == dataModel ) {\n\t\t\t\t\t\t\tdata.fields[ index ].model = newModel;\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tchangeModel.set( 'data', data );\n\t\t\t\tchangeModel.set( 'model', newModel );\n\t\t\t\tchangeModel.set( 'disabled', true );\n\t\t\t} );\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'removeObject', newModel, null, label, data );\n\t\t\t\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\t\t\tnfRadio.channel( currentDomainID ).request( 'delete', dataModel );\n\t\t\tthis.deleting = false;\n\t\t},\n\n\t\t/**\n\t\t * Duplicate a action within our collection, adding the word \"copy\" to the label.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tclickDuplicate: function( e, model ) {\n\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', model );\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\n\t\t\t// Change our label.\n\t\t\t// Make sure this update is silent to avoid triggering key change events down the waterfall.\n\t\t\tnewModel.set( 'label', newModel.get( 'label' ) + ' Copy', {silent: true} );\n\t\t\t// Update our ID to the new tmp id.\n\t\t\tvar tmpID = nfRadio.channel( currentDomainID ).request( 'get:tmpID' );\n\t\t\tnewModel.set( 'id', tmpID );\n\t\t\t// Add new model.\n\t\t\t// Params are: model, silent, renderTrigger, action\n\t\t\tnfRadio.channel( currentDomainID ).request( 'add', newModel, false, false, 'duplicate' );\n\t\t\t\n\t\t\t// Add our action addition to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: model.get( 'objectType' ),\n\t\t\t\tlabel: model.get( 'label' ),\n\t\t\t\tchange: 'Duplicated',\n\t\t\t\tdashicon: 'admin-page'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: nfRadio.channel( currentDomainID ).request( 'get:collection' )\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'duplicateObject', newModel, null, label, data );\n\t\t\t\n\t\t\tmodel.trigger( 'change:label', model );\n\n\t\t\t// Update preview.\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Config file for our merge tags.\n *\n * this.collection represents all of our registered merge tags.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/mergeTags',[\n\t'models/app/mergeTagCollection'\n\t], function(\n\tmergeTagCollection\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.tagSectionCollection = new mergeTagCollection();\n\t\t\tvar that = this;\n\t\t\t_.each( mergeTags, function( tagSection ) {\n\t\t\t\tif ( tagSection.tags ) {\n\t\t\t\t\tvar tags = new mergeTagCollection( tagSection.tags );\n\t\t\t\t} else {\n\t\t\t\t\tvar tags = '';\n\t\t\t\t}\n\n\t\t\t\tthat.tagSectionCollection.add( {\n\t\t\t\t\tid: tagSection.id,\n\t\t\t\t\tlabel: tagSection.label,\n\t\t\t\t\ttags: tags,\n\t\t\t\t\tdefault_group: tagSection.default_group\n\t\t\t\t} );\n\t\t\t} );\n\n\t\t\tvar fieldTags = this.tagSectionCollection.get( 'fields').get( 'tags' );\n\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t_.each( fieldCollection.models, function( field ) {\n\t\t\t\t// TODO: Make this dynamic\n\t\t\t\tif ( 'submit' !== field.get( 'type' ) ) {\n\t\t\t\t\tfieldTags.add( {\n\t\t\t\t\t\tid: field.get( 'id' ),\n\t\t\t\t\t\tlabel: field.get( 'label' ),\n\t\t\t\t\t\ttag: that.getFieldKeyFormat( field.get( 'key' ) )\n\t\t\t\t\t} );\t\t\t\t\t\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tvar calcTags = new mergeTagCollection();\n\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\tvar calcCollection = formModel.get( 'settings' ).get( 'calculations' );\n\t\t\t_.each( calcCollection.models, function( calcModel ) {\n\t\t\t\tcalcTags.add( {\n\t\t\t\t\tlabel: calcModel.get( 'name' ),\n\t\t\t\t\ttag: '{calc:' + calcModel.get( 'name' ) + '}'\n\t\t\t\t} );\n\t\t\t} );\n\n\t\t\tthis.tagSectionCollection.get( 'calcs' ).set( 'tags', calcTags );\n\n\t\t\tthis.currentElement = {};\n\t\t\tthis.settingModel = {};\n\t\t\tthis.open = false;\n\n\t\t\t// Unhook jBox Merge Tag stuff.\n\t\t\t// nfRadio.channel( 'mergeTags' ).reply( 'init', this.initMergeTags, this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'mergeTags' ), 'click:mergeTag', this.clickMergeTag );\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'add:field', this.addFieldTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'delete:field', this.deleteFieldTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater-calculations' ), 'update:option', this.updateCalcTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater-calculations' ), 'remove:option', this.updateCalcTags );\n\n\t\t\t\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'update:currentElement', this.updateCurrentElement, this );\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'update:currentSetting', this.updateCurrentSetting, this );\n\n\t\t\t// Listen for requests for our mergeTag collection.\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'get:collection', this.getCollection, this );\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'get:mergeTag', this.getSectionModel, this );\n\n\t\t\t// When a field's ID is changed (ie from a tmpID), update the merge tag.\n this.listenTo( nfRadio.channel( 'fieldSetting-id' ), 'update:setting', this.updateID );\n\n\t\t\t// When we edit a key, check for places that key might be used.\n\t\t\tthis.listenTo( nfRadio.channel( 'fieldSetting-key' ), 'update:setting', this.updateKey );\n\n\t\t\t// Reply to requests to check a data model for a field key when one is updated.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'replace:fieldKey', this.replaceFieldKey );\n\n\t\t\t// Reply to requests to check a data model for a field key when one is updated.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:fieldKeyFormat', this.getFieldKeyFormat, this );\n\n\t\t\t/*\n\t\t\t * TODO: Hotkey support for adding tags.\n\t\t\t *\n\t\t\t\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'open:mergeTags', this.openMergeTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'up:mergeTags', this.upMergeTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'down:mergeTags', this.downMergeTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'return:mergeTags', this.returnMergeTags );\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'update:open', this.updateOpen, this );\n\t\t\t*/\n\t\t},\n\n\t\t/**\n\t\t * Init merge tags within the passed view.\n\t\t * @since 3.0\n\t\t * @param backbone.view view to be searched for merge tags.\n\t\t * @return void\n\t\t */\n\t\tinitMergeTags: function( view ) {\n\t\t\tvar mergeTagsView = nfRadio.channel( 'mergeTags' ).request( 'get:view' );\n\t\t\tvar that = this;\n\t\t\t/*\n\t\t\t * Apply merge tags jQuery plugin.\n\t\t\t *\n\t\t\t * Prevent jBox from being called multiple times on the same element\n\t\t\t */\n\t\t\tthis.jBoxes = {};\n\t\t\tvar that = this;\n\n\t\t\tjQuery( view.el ).find( '.merge-tags' ).each(function() {\n\t\t\t\tif ( 'undefined' == typeof jQuery( this ).data( 'jBox-id' ) ) {\n\t\t\t\t\tvar jBox = jQuery( this ).jBox( 'Tooltip', {\n\t\t\t\t\t\ttitle: 'Insert Merge Tag',\n\t\t\t\t\t\ttrigger: 'click',\n\t\t\t\t\t\tposition: {\n\t\t\t\t\t\t\tx: 'center',\n\t\t\t\t\t\t\ty: 'bottom'\n\t\t\t\t\t\t},\n\t\t\t\t\t\tcloseOnClick: 'body',\n\t\t\t\t\t\tcloseOnEsc: true,\n\t\t\t\t\t\ttheme: 'TooltipBorder',\n\t\t\t\t\t\tmaxHeight: 200,\n\n\t\t\t\t\t\tonOpen: function() {\n\t\t\t\t\t\t\tmergeTagsView.reRender( view.model );\n\t\t\t\t\t\t\tthis.setContent( jQuery( '.merge-tags-content' ) );\n\t\t\t\t\t\t\tvar currentElement = jQuery( this.target ).prev( '.setting' );\n\t\t\t\t\t\t\tif ( 0 == currentElement.length ) {\n\t\t\t\t\t\t\t\tcurrentElement = jQuery( view.el ).find( '.setting' );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\tthat.updateCurrentSetting( view.model );\n\t\t\t\t\t\t\tthat.updateCurrentElement( currentElement );\n\t\t\t\t\t\t\t// nfRadio.channel( 'drawer' ).request( 'prevent:close', 'merge-tags' );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonClose: function() {\n\t\t\t\t\t\t\t// nfRadio.channel( 'drawer' ).request( 'enable:close', 'merge-tags' );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\t\n\t\t\t\t\tjQuery( this ).data( 'jBox-id', jBox.id );\t\t\t\t\t\n\t\t\t\t}\n\t\t });\n\t\t},\n\n\t\tclickMergeTag: function( e, tagModel ) {\n\t\t\t/*\n\t\t\t * TODO: Make this more dynamic.\n\t\t\t * Currently, the RTE is the only section that modifies how merge tags work,\n\t\t\t * but another type of setting might need to do this in the future.\n\t\t\t */\n\n\t\t\tif( 'undefined' != typeof this.settingModel.get( 'settingModel' ) && 'calculations' == this.settingModel.get( 'settingModel' ).get( 'name' ) ) {\n\n\t\t\t\tconsole.log( tagModel );\n\n\t\t\t\tvar currentValue = jQuery( this.currentElement ).val();\n\t\t\t\tvar currentPos = jQuery( this.currentElement ).caret();\n\t\t\t\tvar newPos = currentPos + tagModel.get( 'tag' ).length;\n\n\t\t\t\tvar tag = ( 'undefined' != typeof tagModel.get( 'calcTag' ) ) ? tagModel.get( 'calcTag' ) : tagModel.get( 'tag' );\n\n\t\t\t\tcurrentValue = currentValue.substr( 0, currentPos ) + tag + currentValue.substr( currentPos );\n\t\t\t\tjQuery( this.currentElement ).val( currentValue ).caret( newPos ).trigger( 'change' );\n\t\t\t} else if( 'rte' == this.settingModel.get( 'type' ) ) {\n\t\t\t\tjQuery( this.currentElement ).summernote( 'insertText', tagModel.get( 'tag' ) );\n\t\t\t} else {\n\t\t\t\tvar currentValue = jQuery( this.currentElement ).val();\n\t\t\t\tvar currentPos = jQuery( this.currentElement ).caret();\n\t\t\t\tvar newPos = currentPos + tagModel.get( 'tag' ).length;\n\t\t\t\tcurrentValue = currentValue.substr( 0, currentPos ) + tagModel.get( 'tag' ) + currentValue.substr( currentPos );\n\t\t\t\tjQuery( this.currentElement ).val( currentValue ).caret( newPos ).trigger( 'change' );\n\t\t\t}\n\t\t},\n\n\t\taddFieldTags: function( fieldModel ) {\n\t\t\t// TODO: Make this dynamic\n\t\t\tif ( 'submit' !== fieldModel.get( 'type' ) ) {\n\t\t\t\tthis.tagSectionCollection.get( 'fields' ).get( 'tags' ).add( {\n\t\t\t\t\tid: fieldModel.get( 'id' ),\n\t\t\t\t\tlabel: fieldModel.get( 'label' ),\n\t\t\t\t\ttag: this.getFieldKeyFormat( fieldModel.get( 'key' ) ),\n\t\t\t\t\tcalcTag: this.getFieldKeyFormatCalc( fieldModel.get( 'key' ) )\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\n\t\tdeleteFieldTags: function( fieldModel ) {\n\t\t\tvar fieldID = fieldModel.get( 'id' );\n\t\t\tvar tagModel = this.tagSectionCollection.get( 'fields' ).get( 'tags' ).get( fieldID );\n\t\t\tthis.tagSectionCollection.get( 'fields' ).get( 'tags' ).remove( tagModel );\n\t\t},\n\n\t\tupdateCalcTags: function( optionModel ) {\n\t\t\tvar calcTags = new mergeTagCollection();\n\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\tvar calcCollection = formModel.get( 'settings' ).get( 'calculations' );\n\n\t\t\t_.each( calcCollection.models, function( calc ) {\n\t\t\t\tcalcTags.add( {\n\t\t\t\t\tlabel: calc.get( 'name' ),\n\t\t\t\t\ttag: '{calc:' + calc.get( 'name' ) + '}'\n\t\t\t\t} );\n\t\t\t} );\n\n\t\t\tthis.tagSectionCollection.get( 'calcs' ).set( 'tags', calcTags );\n\t\t},\n\n\t\topenMergeTags: function( e ) {\n\t\t\tif ( 'TEXTAREA' == jQuery( e.target )[0].tagName || 'INPUT' == jQuery( e.target )[0].tagName ) {\n\t\t\t\tjQuery( e.target ).parent().find( '.merge-tags' ).click();\n\t\t\t}\n\t\t},\n\n\t\treturnMergeTags: function( e ) {\n\t\t\tif ( this.open ) {\n\t\t\t\te.preventDefault();\n\t\t\t\tvar currentModel = this.fields.where( { 'active': true } )[0];\n\t\t\t\tif ( currentModel ) {\n\t\t\t\t\tthis.clickMergeTag( e, currentModel );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tupMergeTags: function( e ) {\n\t\t\tif ( this.open ) {\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.changeActiveTag( 'up' );\n\t\t\t}\n\t\t},\n\n\t\tdownMergeTags: function( e ) {\n\t\t\tif ( this.open ) {\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.changeActiveTag( 'down' );\n\t\t\t}\n\t\t},\n\n\t\tchangeActiveTag: function( dir ) {\n\t\t\tif ( 'down' == dir ) {\n\t\t\t\tvar inc = 1;\n\t\t\t} else {\n\t\t\t\tvar inc = -1\n\t\t\t}\n\t\t\t// First, check to see if a field is currently active.\n\t\t\tif( 0 < this.fields.where( { 'active': true } ).length ) {\n\t\t\t\tvar currentModel = this.fields.where( { 'active': true } )[0];\n\t\t\t\tvar currentIndex = this.fields.indexOf( currentModel );\n\t\t\t\tcurrentModel.set( 'active', false );\n\n\t\t\t\tvar nextModel = this.fields.models[ currentIndex + inc ];\n\t\t\t\tif ( nextModel ) {\n\t\t\t\t\tnextModel.set( 'active', true );\n\t\t\t\t} else {\n\n\t\t\t\t}\n\t\t\t\t\n\t\t\t} else if ( 0 < this.fields.where( { 'active': true } ) ) { // There aren't any active fields. Check for active system tags.\n\t\t\t\tconsole.log( 'system' );\n\t\t\t} else if ( 0 < this.userInfo.where( { 'active': true } ) ) { // No active user info LIs.\n\t\t\t\tconsole.log( 'userinfo' );\n\t\t\t} else { // No active LIs. We haven't made any active yet, or we've gotten to the bottom of the list.\n\t\t\t\t// Make sure that we have fields\n\t\t\t\tif ( 0 < this.fields.models.length ) {\n\t\t\t\t\t// Set our first field to active.\n\t\t\t\t\tthis.fields.models[0].set( 'active', true );\n\t\t\t\t} else {\n\t\t\t\t\t// Set our first system model to active.\n\t\t\t\t\tthis.system.models[0].set( 'active', true );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tupdateCurrentElement: function( element ) {\n\t\t\tthis.currentElement = element;\n\t\t},\n\n\t\tupdateCurrentSetting: function( settingModel ) {\n\t\t\tthis.settingModel = settingModel;\n\t\t},\n\n\t\tgetCollection: function() {\n\t\t\treturn this.tagSectionCollection;\n\t\t},\n\n\t\tgetSectionModel: function( id ) {\n\t\t\treturn this.tagSectionCollection.get( id );\n\t\t},\n\n\t\tupdateOpen: function( open ) {\n\t\t\tthis.open = open;\n\t\t\t_.each( this.tagSectionCollection.get( 'fields' ).models, function( model ) {\n\t\t\t\tmodel.set( 'active', false );\n\t\t\t} );\n\t\t},\n\n\t\t// When a field is published, update the merge tag with the newly assigned ID (as opposed to the tmpID).\n updateID: function( fieldModel ) {\n\n\t\t\t// Get the formatted merge tag for comparison.\n\t\t\tvar targetTag = this.getFieldKeyFormat( fieldModel.get( 'key' ) );\n\n\t\t\t// Search the field tags for the matching merge tag to be updated.\n\t\t\tvar oldTag = this.tagSectionCollection.get( 'fields' ).get( 'tags' ).find( function( fieldMergeTag ){\n return targetTag == fieldMergeTag.get( 'tag' );\n });\n\n\t\t\t// If no matching tag is found, return early.\n\t\t\tif( 'undefined' == typeof oldTag ) return;\n\n\t\t\t// Update the merge tag with the \"published\" field ID.\n\t\t\toldTag.set( 'id', fieldModel.get( 'id' ) );\n\t\t},\n\n\t\tupdateKey: function( fieldModel ) {\n\t\t\tvar newKey = fieldModel.get( 'key' );\n\t\t\tvar oldTag = this.tagSectionCollection.get( 'fields' ).get( 'tags' ).get( fieldModel.get( 'id' ) );\n\t\t\tif ( 'undefined' != typeof oldTag ) {\n\t\t\t\toldTag.set( 'tag', this.getFieldKeyFormat( newKey ) );\t\t\t\t\n\t\t\t}\n\n\t\t},\n\n\t\tgetFieldKeyFormat: function( key ) {\n\t\t\treturn '{field:' + key + '}';\n\t\t},\n\n\t\tgetFieldKeyFormatCalc: function( key ) {\n\t\t\treturn '{field:' + key + ':calc}';\n\t\t},\n\n\t\treplaceFieldKey: function( dataModel, keyModel, settingModel ) {\n var oldKey = this.getFieldKeyFormat( keyModel._previousAttributes[ 'key' ] );\n\t\t\tvar newKey = this.getFieldKeyFormat( keyModel.get( 'key' ) );\n\t\t\tvar settingName = settingModel.get( 'name' );\n\t\t\tvar oldVal = dataModel.get( settingName );\n if(settingName == 'calculations' && 'undefined' != typeof(dataModel.get('calculations'))) {\n var calcModel = dataModel.get( 'calculations' );\n calcModel.each( function( model ) {\n var oldCalcKey = oldKey.slice( 0, (oldKey.length - 1) ) + ':calc}';\n var newCalcKey = newKey.slice( 0, (newKey.length - 1 ) ) + ':calc}';\n oldVal = model.get( 'eq' );\n if ( 'string' == typeof( oldVal ) ) {\n var re = new RegExp( oldCalcKey, 'g' );\n var newVal = oldVal.replace( re, newCalcKey );\n re = new RegExp( oldKey, 'g' );\n // TODO: We won't need this second replace when we no longer\n // have to append :calc to merge tags.\n newVal = newVal.replace( re, newKey );\n model.set( 'eq', newVal );\n }\n } );\n return false;\n }\n\t\t\tif ( 'string' == typeof oldVal ) {\n\t\t\t\tvar re = new RegExp( oldKey, 'g' );\n\t\t\t\tnewVal = oldVal.replace( re, newKey );\n\t\t\t\tdataModel.set( settingName, newVal );\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/mergeTagLookupCollection',['models/app/mergeTagModel'], function( mergeTagModel ) {\n var collection = Backbone.Collection.extend( {\n model: mergeTagModel\n } );\n return collection;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTag',[], function() {\n var view = Marionette.ItemView.extend({\n tagName: 'li',\n template: '#tmpl-nf-merge-tag-box-tag',\n\n events: {\n \"click\": \"insertTag\"\n },\n\n insertTag: function() {\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', this.model.get( 'tag' ) );\n }\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagList',[ 'views/app/drawer/mergeTag' ], function( mergeTagView ) {\n var view = Marionette.CollectionView.extend({\n tagName: 'ul',\n childView: mergeTagView,\n calc: false,\n\n initialize: function() {\n nfRadio.channel( 'merge-tags' ).reply( 'update:taglist', this.sectionFilter, this );\n nfRadio.channel( 'merge-tags' ).reply( 'filtersearch', this.searchFilter, this );\n },\n\n filter: function( child, index, collection ){\n return 'fields' == child.get( 'section' );\n },\n\n sectionFilter: function( section, calc ){\n this.filter = function( child, index, collection ){\n return section == child.get( 'section' );\n }\n\n if ( calc ) {\n this.calc = true;\n }\n\n if ( this.calc ) {\n var fieldsToRemove = this.excludeFromCalcs();\n\n /**\n * Filters our merge tags.\n * Make sure that we're in the right section, and then check to see if the merge tag is in our remove tracker.\n */\n this.filter = function( child, index, collection ) {\n return section == child.get( 'section' ) && -1 == fieldsToRemove.indexOf( child.get( 'tag' ) );\n }\n }\n\n this.render();\n nfRadio.channel( 'merge-tags' ).trigger( 'after:filtersearch', section );\n },\n\n searchFilter: function( term ){\n if ( this.calc ) {\n var fieldsToRemove = this.excludeFromCalcs();\n }\n\n this.filter = function( child, index, collection ){\n var label = child.get( 'label' ).toLowerCase().indexOf( term.toLowerCase().replace( ':', '' ) ) >= 0;\n var tag = child.get( 'tag' ).toLowerCase().indexOf( term.toLowerCase() ) >= 0;\n // If we are in a calculation setting and this tag is in our remove tracker, early return false.\n if ( this.calc && -1 != fieldsToRemove.indexOf( child.get( 'tag' ) ) ) {\n return false;\n }\n return label || tag;\n }\n\n this.render();\n nfRadio.channel( 'merge-tags' ).trigger( 'after:filtersearch' );\n\n },\n\n /**\n * TODO: This is a wonky fix for removing Product and Quantity fields from calcuation merge tags.\n * Merge tags don't respect the \"exclude\" merge tag settings.\n * Ultimately, the fix might include updating merge tags to respect those settings.\n */\n excludeFromCalcs: function(){\n /**\n * Remove any unwanted fields if we are in a calculation.\n * Get a list of all fields, then filter out unwanted fields.\n */\n var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n // Stores the keys of unwanted fields.\n var fieldsToRemove = [];\n // Declare blacklisted field types.\n var blacklist = ['product', 'quantity', 'total', 'shipping', 'date'];\n // Remove them from the merge tag selection box.\n _.each( fieldCollection.models, function( model ) {\n if ( -1 != blacklist.indexOf( model.get('type') ) ) {\n fieldsToRemove.push( '{field:' + model.get( 'key' ) + '}' );\n }\n });\n return fieldsToRemove;\n }\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagGroup',[], function() {\n var view = Marionette.ItemView.extend({\n tagName: 'li',\n template: '#tmpl-nf-merge-tag-box-section',\n events: {\n \"click\": \"onClick\"\n },\n\n initialize: function () {\n this.listenTo( nfRadio.channel( 'merge-tags' ), 'after:filtersearch', this.updateActive );\n },\n\n onClick: function(){\n this.updateTags();\n },\n\n updateTags: function() {\n nfRadio.channel( 'merge-tags' ).request( 'update:taglist', this.model.get( 'id' ) );\n },\n\n updateActive: function( section ) {\n this.$el.removeClass( 'active' );\n\n if ( section == this.model.get( 'id' ) ) {\n this.$el.addClass( 'active' );\n }\n },\n\n setActive: function(){\n this.$el.addClass( 'active' );\n this.$el.siblings().removeClass( 'active' );\n },\n\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagGroupList',[ 'views/app/drawer/mergeTagGroup' ], function( mergeTagGroupView ) {\n var view = Marionette.CollectionView.extend({\n tagName: 'ul',\n childView: mergeTagGroupView,\n\n initialize: function(){\n this.listenTo( nfRadio.channel( 'merge-tags' ), 'open', this.render, this );\n },\n\n // TODO: Update filter when a new tag is added. ie Calculations.\n filter: function( child, index, collection ){\n return 0 < child.get( 'tags' ).length;\n },\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagFilter',[], function() {\n var view = Marionette.ItemView.extend({\n template: '#tmpl-nf-merge-tag-box-filter',\n events: {\n \"keyup input\": \"updateFilter\",\n },\n updateFilter: function( event ) {\n\n if( /* ENTER */ 13 == event.keyCode ){ // Copied from Keyup Callback.\n // Get top listed merge tag.\n var firstFilteredTag = jQuery( '#merge-tags-box .merge-tag-list ul li span' ).first().data( 'tag' );\n\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', firstFilteredTag );\n\n // COPIED FROM BELOW\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n return;\n }\n var value = this.$el.find( 'input' ).val();\n nfRadio.channel( 'merge-tags' ).request( 'filtersearch', value );\n }\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagBox',[], function() {\n var view = Marionette.LayoutView.extend({\n el: '#merge-tags-box',\n template: \"#tmpl-nf-merge-tag-box\",\n\n regions: {\n filter: '.merge-tag-filter',\n sections: '.merge-tag-sections',\n tags: '.merge-tag-list'\n },\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage Merge Tag Box\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1\n */\n\ndefine( 'controllers/app/mergeTagBox',[\n 'models/app/mergeTagModel',\n 'models/app/mergeTagLookupCollection',\n 'views/app/drawer/mergeTag',\n 'views/app/drawer/mergeTagList',\n 'views/app/drawer/mergeTagGroup',\n 'views/app/drawer/mergeTagGroupList',\n 'views/app/drawer/mergeTagFilter',\n 'views/app/drawer/mergeTagBox'\n], function(\n MergeTagModel,\n MergeTagLookupCollection,\n MergeTagView,\n MergeTagListView,\n MergeTagGroupView,\n MergeTagGroupListView,\n MergeTagFilterView,\n MergeTagBoxLayout\n) {\n var controller = Marionette.Object.extend( {\n\n caret: 0, // Track the caret position of the current setting's input.\n old: '', // THe old merge tag that will be replaced.\n\n initialize: function(){\n\n this.listenTo( nfRadio.channel( 'drawer' ), 'render:settingGroup', function(){\n jQuery( '.merge-tags' ).off( 'click' );\n jQuery( '.merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n });\n\n this.listenTo( nfRadio.channel( 'app' ), 'after:appStart', this.afterAppStart );\n this.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n this.listenTo( nfRadio.channel( 'drawer' ), 'before:close', this.beforeDrawerClose );\n\n var that = this;\n nfRadio.channel( 'mergeTags' ).reply( 'set:caret', function( position ){\n that.caret = position;\n });\n nfRadio.channel( 'mergeTags' ).reply( 'get:caret', function(){\n return that.caret;\n });\n\n var that = this;\n nfRadio.channel( 'mergeTags' ).reply( 'set:old', function( value ){\n that.old = value;\n });\n nfRadio.channel( 'mergeTags' ).reply( 'get:old', function(){\n return that.old;\n });\n\n nfRadio.channel( 'mergeTags' ).reply( 'insert:tag', this.insertTag.bind( this ) );\n\n /** OPTION REPEATER */\n this.listenTo( nfRadio.channel( 'option-repeater' ), 'add:option', function( model ){\n var selector = '#' + model.cid + ' .has-merge-tags input.setting';\n jQuery( selector ).on( 'focus', function( event ){\n that.focusCallback( event, selector, 'option-repeater' );\n });\n jQuery( selector ).on( 'keyup', function( event ){\n that.keyupCallback( event, selector, 'option-repeater' );\n });\n jQuery( selector ).siblings( '.nf-list-options .merge-tags' ).off( 'click' );\n jQuery( selector ).siblings( '.nf-list-options .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', function(){\n jQuery( '.nf-list-options .merge-tags' ).off( 'click' );\n jQuery( '.nf-list-options .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n /* CALCULATIONS */\n this.listenTo( nfRadio.channel( 'setting-calculations-option' ), 'render:setting', this.renderSetting );\n // this.listenTo( nfRadio.channel( 'setting-calculations-option' ), 'render:setting', function( settingModel, dataModel, view ){\n // view.$el.find( '.merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n // } );\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', function(){\n jQuery( '.nf-list-options.calculations .merge-tags' ).off( 'click' );\n jQuery( '.nf-list-options.calculations .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n /* SUMMERNOTE */\n this.listenTo( nfRadio.channel( 'summernote' ), 'focus', function( e, selector ) {\n that.focusCallback( false, selector, 'rte' );\n } );\n this.listenTo( nfRadio.channel( 'summernote' ), 'keydown', function( e, selector ){\n jQuery( selector ).closest( '.nf-setting' ).find( '.setting' ).summernote( 'saveRange' );\n } );\n this.listenTo( nfRadio.channel( 'summernote' ), 'keyup', function( e, selector ){\n that.keyupCallback( e, selector, 'rte' );\n } );\n\n // When an RTE setting is shown, make sure merge tags are hooked up.\n this.listenTo( nfRadio.channel( 'setting-type-rte' ), 'render:setting', function(){\n jQuery( '.note-editor .merge-tags' ).off( 'click' );\n jQuery( '.note-editor .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', function(){\n jQuery( '.note-editor .merge-tags' ).off( 'click' );\n jQuery( '.note-editor .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n jQuery( document ).on( 'keyup', function( event ){\n if( 27 == event.keyCode ){\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n // Copied from KeyupCallback.\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).blur();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n });\n\n /**\n * Listen to the Field Changes (add, delete, update) and update the Merge Tags.\n */\n this.listenTo( Backbone.Radio.channel( 'fields' ), 'add:field', this.afterAppStart );\n this.listenTo( Backbone.Radio.channel( 'fields' ), 'delete:field', this.afterAppStart );\n this.listenTo( Backbone.Radio.channel( 'fieldSetting-key' ), 'update:setting', this.afterAppStart );\n\n /** ... and Calc updates. */\n this.listenTo( Backbone.Radio.channel( 'calcs' ), 'update:calc', this.afterAppStart );\n\n this.listenTo( Backbone.Radio.channel( 'app' ), 'change:currentDomain', this.afterAppStart );\n },\n\n afterAppStart: function() {\n\n var currentDomain = Backbone.Radio.channel( 'app' ).request( 'get:currentDomain' );\n\n var mergeTagCollection = nfRadio.channel( 'mergeTags' ).request( 'get:collection' );\n var mergeTags = [];\n mergeTagCollection.each( function( section ){\n\n section.get( 'tags' ).each( function( tag ){\n\n if( 'fields' == currentDomain.get( 'id' ) && '{submission:sequence}' == tag.get( 'tag' ) ) return;\n\n mergeTags.push({\n label: tag.get( 'label' ),\n tag: tag.get( 'tag' ),\n section: section.get( 'id' )\n });\n });\n });\n var layout = new MergeTagBoxLayout();\n layout.render();\n var tagCollection = new MergeTagLookupCollection( mergeTags );\n var mergeTagListView = new MergeTagListView({\n collection: tagCollection\n });\n var mergeTagGroupListView = new MergeTagGroupListView({\n collection: mergeTagCollection\n });\n\n layout.getRegion('tags').show(mergeTagListView);\n layout.getRegion('sections').show(mergeTagGroupListView);\n layout.getRegion('filter').show(new MergeTagFilterView);\n },\n\n beforeRenderSetting: function( settingModel, dataModel ){\n if( 'undefined' == typeof settingModel.get( 'use_merge_tags' ) ) return;\n if( ! settingModel.get( 'use_merge_tags' ) ) return;\n var name = settingModel.get( 'name' );\n this.listenTo( nfRadio.channel( 'setting-' + name ), 'render:setting', this.renderSetting );\n },\n\n renderSetting: function( settingModel, dataModel, view ){\n\n view.$el.find( '.merge-tags' ).off( 'click' );\n view.$el.find( '.merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n\n if( 0 == jQuery( '#merge-tags-box' ).length ) this.afterAppStart();\n\n // Track Scrolling.\n jQuery( '#nf-drawer' ).on( 'scroll', function(){\n // COPIED AND MODIFIED FROM FOCUS\n if( 0 == jQuery( '.merge-tag-focus' ).length ) return;\n\n var rteEditor = jQuery( '.merge-tag-focus' ).closest( '.nf-setting' ).find( '.note-editor' );\n if( 0 != rteEditor.length ){\n var posY = rteEditor.offset().top - jQuery(window).scrollTop();\n var height = rteEditor.outerHeight();\n } else {\n var posY = jQuery('.merge-tag-focus').offset().top - jQuery(window).scrollTop();\n var height = jQuery('.merge-tag-focus').outerHeight();\n }\n\n\t // Find out if merge tag box will go below bottom of the page.\n\t var tagBoxY = posY + height;\n\t var windowHeight = window.innerHeight;\n\t var tagBoxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n\n\t // If merge tag box will render below the bottom of the page,\n\t // change it to render above the field\n\n\t if ( ( tagBoxY + tagBoxHeight ) > windowHeight ) {\n tagBoxY = posY - tagBoxHeight;\n }\n\n if ( 0 > tagBoxY ) {\n tagBoxY = posY;\n }\n\n jQuery( '#merge-tags-box' ).css( 'top', tagBoxY );\n\n var boxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n jQuery( '#nf-drawer' ).css( 'padding-bottom', boxHeight + 'px' );\n\n var repeaterRow = jQuery( '.merge-tag-focus' ).closest( '.nf-list-options-tbody' );\n if( 0 != repeaterRow.length ){\n var left = repeaterRow.offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', left );\n } else {\n var posX = jQuery( '.merge-tag-focus' ).closest( '.nf-settings' ).offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', posX );\n jQuery( '#merge-tags-box' ).css( 'width', jQuery( '.merge-tag-focus' ).closest( '.nf-settings' ).width() );\n }\n });\n\n // On input focus, move the Merge Tag Box into position.\n jQuery( view.el ).find( '.setting' ).on( 'focus', this.focusCallback );\n\n // TODO: Maybe move to view events.\n // On input keyup, maybe show Merge Tag Box.\n jQuery( view.el ).find( '.setting' ).on( 'keyup', this.keyupCallback );\n },\n\n // TODO: Maybe move to view class.\n beforeDrawerClose: function(){\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n // jQuery( 'body' ).append( jQuery( '#merge-tags-box' ) );\n },\n\n insertTag: function( tag ) {\n\n var $input = jQuery( '.merge-tag-focus' );\n\n if( 0 != $input.closest( '.nf-setting' ).first().find( '.note-editable' ).length ){\n $input = $input.closest( '.nf-setting' ).first().find( '.note-editable' );\n }\n\n if( 1 < $input.length ){ $input = $input.first(); }\n\n if( $input.hasClass( 'note-editable' ) ){\n var str = $input.closest( '.nf-setting' ).find( '.setting' ).summernote( 'code' );\n } else {\n var str = $input.val();\n }\n\n var find = nfRadio.channel( 'mergeTags' ).request( 'get:old' );\n var replace = tag;\n var caretPos = nfRadio.channel( 'mergeTags' ).request( 'get:caret' );\n\n var patt = /{([a-zA-Z0-9]|:|_||-})*/g;\n\n // Loop through matches to find insert/replace index range.\n // Reference: http://codepen.io/kjohnson/pen/36c3a782644dfff40fe3c1f05f8739d9?editors=0012\n while (match = patt.exec(str)) {\n if (find != match[0]) continue; // This isn't the match you are looking for...\n var string = str.slice(0, match.index) + replace + str.slice(patt.lastIndex); // Fancy replace for the specifc match, using the index/position.\n\n if( $input.hasClass( 'note-editable' ) ){\n $input.closest( '.nf-setting' ).find( '.setting' ).summernote( 'code', string );\n\n // Reposition the caret. http://stackoverflow.com/a/6249440 TODO: Determine the appropriate childNode.\n var el = $input;\n var childNode = null; // Default to first childNode.\n _.each( el[0].childNodes, function( node, index ){\n if( childNode ) return;\n if( ! node.nodeValue && ! node.innerHTML ) return;\n if( node.nodeValue ) {\n var value = node.nodeValue;\n } else if( node.innerHTML ){\n var value = node.innerHTML;\n }\n\n if( -1 == value.indexOf(replace) ) return; // Replace not found in this node.\n\n value = value.replace( / /g, ' ' );\n var position = value.indexOf(replace) + find.length;\n\n /*\n * If no caretPos, determine based on the node. ie Merge Tag Button context.\n * Note: We can't just check for '{', because they could just be inserting the first tag.\n */\n if( -1 == caretPos ){\n caretPos = value.indexOf( replace ) + 1;\n }\n\n if (caretPos == position) childNode = el[0].childNodes[index];\n });\n if( ! childNode ) childNode = el[0].childNodes[0];\n var offset = caretPos - find.length + replace.length;\n var range = document.createRange();\n var sel = window.getSelection();\n if( 0 != childNode.childNodes.length ) {\n try{\n range.setStart(childNode.childNodes[0], offset); \n } catch( err ) {\n console.log( childNode );\n console.log( 'error' );\n }\n \n } else {\n try {\n range.setStart(childNode, offset);\n } catch( err ) {\n console.log( 'error' );\n }\n \n }\n range.collapse(true);\n sel.removeAllRanges();\n sel.addRange(range);\n\n\n } else {\n $input.val(string); // Update input value with parsed string.\n $input.change(); // Trigger a change event after inserting the merge tag so that it saves to the model.\n $input.caret(caretPos - find.length + replace.length); // Update Carept Position.\n }\n\n }\n\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n $input.removeClass( 'merge-tag-focus' );\n $input.closest( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n },\n\n mergeTagsButtonClick: function( e ){\n var $this = jQuery( this );\n\n if ($this.hasClass('open-media-manager')) {\n return;\n }\n\n if( $this.siblings().hasClass( 'merge-tag-focus' ) ){\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n return;\n }\n\n if( 0 !== $this.closest( '.nf-setting, .nf-table-row' ).find( '.note-tools' ).length ){\n var $inputSetting = $this.closest( '.note-editor' ).siblings( '.setting' ).first();\n $this.closest( '.nf-setting' ).find( '.setting' ).summernote( 'insertText', '{' );\n // Since we haven't determined the caretPos, set to -1 as a flag to determine later.\n nfRadio.channel('mergeTags').request( 'set:caret', -1 );\n } else {\n var $inputSetting = $this.siblings( '.setting' ).first();\n var text = $inputSetting.val() || '';\n $inputSetting.val( text + '{' ).change();\n nfRadio.channel('mergeTags').request('set:caret', text.length + 1 );\n }\n\n if( $this.parent().hasClass( 'note-tools' ) ){\n // $this.closest( '.nf-setting' ).find( '.setting' ).summernote( 'insertText', '{' );\n }\n\n nfRadio.channel('mergeTags').request('set:old', '{' );\n\n $inputSetting.addClass( 'merge-tag-focus' );\n\n // Disable browser autocomplete.\n var autocomplete = $this.attr( 'autocomplete' );\n $this.attr( 'autocomplete', 'off' );\n $this.data( 'autocomplete', autocomplete );\n\n var $overlayElement = $this.closest( '.nf-setting, .nf-table-row' );\n if( 0 != $overlayElement.find( '.note-editor' ).length ){\n $overlayElement.find('.note-editor' ).addClass('merge-tag-focus-overlay');\n } else {\n $overlayElement.addClass('merge-tag-focus-overlay');\n }\n\n /**\n * TODO: This is a wonky work around for removing Product and Quantity fields from calculation merge tags.\n * The merge tag system doesn't currently respect \"exclude\" merge tag settings.\n *\n * If 'eq' is the textarea next to the merge tag icon, then we're in a calculation setting.\n */\n if ( 'eq' == jQuery( e.target ).prev( 'textarea' ).data( 'id' ) ) {\n var calc = true;\n } else {\n var calc = false;\n }\n\n // Request that our merge tag box update its tag list, passing whether or not we're in a calculation setting.\n nfRadio.channel( 'merge-tags' ).request( 'update:taglist', 'fields', calc );\n \n jQuery( '#merge-tags-box' ).css( 'display', 'block' );\n nfRadio.channel( 'drawer' ).request( 'prevent:close' );\n\n jQuery( '.merge-tag-focus-overlay' ).off( 'click' );\n jQuery( '.merge-tag-focus-overlay' ).on( 'click', function( e ) {\n if ( jQuery( e.target ).hasClass( 'note-editor' ) ) {\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n } );\n\n setTimeout(function(){\n jQuery( '#merge-tags-box' ).find( '.merge-tag-filter' ).find( 'input' ).focus();\n }, 500 );\n },\n\n focusCallback: function( e, target, type ){\n\n var type = type || 'setting';\n var $this = ( 'undefined' == typeof target ) ? jQuery( this ) : jQuery( target );\n\n jQuery( '.merge-tag-focus' ).each(function(index, el){\n if( this == el ) return;\n el.removeClass( 'merge-tag-focus' );\n });\n\n if( 'rte' == type ) {\n var posY = $this.closest( '.nf-setting' ).find( '.note-editor' ).offset().top - jQuery(window).scrollTop();\n var height = $this.closest( '.nf-setting' ).find( '.note-editor' ).outerHeight();\n } else {\n var posY = $this.offset().top - jQuery(window).scrollTop();\n var height = $this.outerHeight();\n }\n\n // Find out if merge tag box will go below bottom of the page.\n\t var tagBoxY = posY + height;\n\t var windowHeight = window.innerHeight;\n\t var tagBoxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n\n\t // If merge tag box will render below the bottom of the page,\n // change it to render above the field\n\n\t if ( ( tagBoxY + tagBoxHeight ) > windowHeight ) {\n\t\t tagBoxY = posY - tagBoxHeight;\n\t }\n\n if ( 0 > tagBoxY ) {\n tagBoxY = posY;\n }\n\n jQuery( '#merge-tags-box' ).css( 'top', tagBoxY );\n\n var repeaterRow = $this.closest( '.nf-list-options-tbody' );\n if( 0 != repeaterRow.length ) {\n var left = repeaterRow.offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', left );\n } else if( 'rte' == type ) {\n var posX = $this.closest( '.nf-setting' ).find( '.note-editor' ).offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', posX );\n jQuery( '#merge-tags-box' ).css( 'width', $this.closest( '.nf-setting' ).find( '.note-editor' ).width() );\n }\n else\n {\n var posX = jQuery( this ).closest( '.nf-settings' ).offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', posX );\n jQuery( '#merge-tags-box' ).css( 'width', $this.closest( '.nf-settings' ).width() );\n }\n\n var dataID = jQuery( this ).data( 'id' );\n if( dataID && 'eq' != dataID ) return;\n\n // var offset = jQuery( view.el ).find( '.setting' ).parent().outerHeight();\n // jQuery( view.el ).find( '.setting' ).parent().append( jQuery( '#merge-tags-box' ) );\n // jQuery( '#merge-tags-box' ).css( 'top', offset );\n },\n\n keyupCallback: function( event, target, type ){\n var type = type || 'setting';\n\n if( /* ENTER */ 13 == event.keyCode ){\n\n // Get top listed merge tag.\n var firstFilteredTag = jQuery( '#merge-tags-box .merge-tag-list ul li span' ).first().data( 'tag' );\n\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', firstFilteredTag );\n\n // COPIED FROM BELOW\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n\n return;\n }\n\n // Get the value.\n // var value = jQuery( summernote ).summernote( 'code' );\n // Update the value.\n // jQuery( summernote ).closest( '.nf-setting' ).find( '.note-editable' ).html( value );\n\n if( 'undefined' != typeof target ) {\n var $this = jQuery(target);\n } else {\n var $this = jQuery( this );\n }\n\n // TODO: Disable Browser Autocomplete\n // $this.attr()\n\n\n var dataID = jQuery( this ).data( 'id' );\n if( dataID && 'eq' == dataID ) return;\n\n // Store the current caret position.\n if( 'rte' == type ){\n var range = $this.summernote('createRange');\n if( range ) {\n var caretPos = range.so; // or .eo?\n } else {\n var caretPos = 0;\n }\n $this.closest( '.nf-setting' ).find( '.setting' ).summernote( 'saveRange' );\n } else {\n var caretPos = $this.caret();\n }\n nfRadio.channel( 'mergeTags' ).request( 'set:caret', caretPos );\n\n // Find merge tags.\n if( 'rte' == type ) {\n var mergetags = $this.summernote( 'code' ).match(new RegExp(/{([a-zA-Z0-9]|:|_|-|})*/g));\n } else {\n var mergetags = $this.val().match(new RegExp(/{([a-zA-Z0-9]|:|_|-|})*/g));\n }\n\n // Filter out closed merge tags.\n mergetags = _.filter(mergetags, function(mergetag) {\n return -1 == mergetag.indexOf( '}' ); // Filter out \"closed\" merge tags.\n });\n\n // If an open merge tag is found, show the Merge Tag Box, else hide.\n if( 0 !== mergetags.length ) {\n\n nfRadio.channel( 'mergeTags' ).request( 'set:old', mergetags[0] );\n \n jQuery('#merge-tags-box').css( 'display', 'block' );\n nfRadio.channel( 'drawer' ).request( 'prevent:close' );\n $this.addClass('merge-tag-focus');\n\n var boxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n jQuery( '#nf-drawer' ).css( 'padding-bottom', boxHeight + 'px' );\n\n // Disable browser autocomplete.\n var autocomplete = $this.attr( 'autocomplete' );\n $this.attr( 'autocomplete', 'off' );\n $this.data( 'autocomplete', autocomplete );\n\n var $overlayElement = $this.closest( '.nf-setting, .nf-table-row' );\n if( 0 != $overlayElement.find( '.note-editor' ).length ){\n $overlayElement.find('.note-editor' ).addClass('merge-tag-focus-overlay');\n } else {\n $overlayElement.addClass('merge-tag-focus-overlay');\n }\n\n $overlayElement.off( 'click' );\n $overlayElement.on( 'click', function( event ){\n var elementClasses = jQuery( event.target ).attr( 'class' ) || [];\n if( -1 !== elementClasses.indexOf( 'merge-tag-focus-overlay' ) ){\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n });\n\n var value = mergetags[0].replace( '{', '' );\n } else {\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n }\n\n } );\n\n return controller;\n} );\n\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're about to render a setting model that's a select and has 'fields' as the 'fill' setting, add all our field models to its options.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/itemSettingFill',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for messages that are fired before a setting view is rendered.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n\t\t},\n\n\t\tbeforeRenderSetting: function( settingModel, dataModel ) {\n\t\t\tif ( 'fields' == settingModel.get( 'fill' ) ) {\n\t\t\t\t\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Modify the user's browser history when they click on a domain\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/confirmPublish',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:confirmPublish', this.confirmPublish );\n\t\t},\n\n\t\tconfirmPublish: function() {\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t// Check to see if we need to add a submit button.\n\t\t\tif ( 1 == formModel.get( 'settings' ).get( 'add_submit' ) ) {\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'add', { type: 'submit', label: 'Submit', order: 9999 } );\n\t\t\t}\n\t\t\tformModel.set( 'show_publish_options', false );\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db', 'publish' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to settings that utilise the Rich Text Editor\n *\n * @package Ninja Forms builder\n * @subpackage App - Settings Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/rte',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// We don't want the RTE setting to re-render when the value changes.\n\t\t\tnfRadio.channel( 'setting-type-rte' ).reply( 'renderOnChange', function(){ return false } );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'rte' ), 'init:settingModel', this.initSettingModel );\n\n\t\t\t// When an RTE setting is shown, re-render RTE.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-type-rte' ), 'render:setting', this.renderSetting );\n\n\t\t\t// When an RTE setting view is destroyed, remove our RTE.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-type-rte' ), 'destroy:setting', this.destroySetting );\n\n\t\t\t// When an element within the RTE is clicked, check to see if we should insert a link.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-type-rte' ), 'click:extra', this.clickExtra );\n\n\t\t\t// Instantiates the variable that holds the media library frame.\n\t\t\tthis.meta_image_frame;\n\n\t\t\tjQuery.summernote.options.icons = {\n\t\t 'align': 'dashicons dashicons-editor-alignleft',\n\t\t 'alignCenter': 'dashicons dashicons-editor-aligncenter',\n\t\t 'alignJustify': 'dashicons dashicons-editor-justify',\n\t\t 'alignLeft': 'dashicons dashicons-editor-alignleft',\n\t\t 'alignRight': 'dashicons dashicons-editor-alignright',\n\t\t 'indent': 'dashicons dashicons-editor-indent',\n\t\t 'outdent': 'dashicons dashicons-editor-outdent',\n\t\t // 'arrowsAlt': 'dashicons fa-arrows-alt',\n\t\t 'bold': 'dashicons dashicons-editor-bold',\n\t\t 'caret': 'dashicons dashicons-arrow-down',\n\t\t // 'circle': 'dashicons fa-circle',\n\t\t 'close': 'dashicons dashicons-dismiss',\n\t\t 'code': 'dashicons dashicons-editor-code',\n\t\t 'eraser': 'dashicons dashicons-editor-removeformatting',\n\t\t // 'font': 'dashicons fa-font',\n\t\t // 'frame': 'dashicons fa-frame',\n\t\t 'italic': 'dashicons dashicons-editor-italic',\n\t\t 'link': 'dashicons dashicons-admin-links',\n\t\t 'unlink': 'dashicons dashicons-editor-unlink',\n\t\t 'magic': 'dashicons dashicons-editor-paragraph',\n\t\t // 'menuCheck': 'dashicons fa-check',\n\t\t 'minus': 'dashicons dashicons-minus',\n\t\t 'orderedlist': 'dashicons dashicons-editor-ol',\n\t\t // 'pencil': 'dashicons fa-pencil',\n\t\t // 'picture': 'dashicons fa-picture-o',\n\t\t // 'question': 'dashicons fa-question',\n\t\t 'redo': 'dashicons dashicons-redo',\n\t\t 'square': 'dashicons fa-square',\n\t\t // 'strikethrough': 'dashicons fa-strikethrough',\n\t\t // 'subscript': 'dashicons fa-subscript',\n\t\t // 'superscript': 'dashicons fa-superscript',\n\t\t 'table': 'dashicons dashicons-editor-table',\n\t\t // 'textHeight': 'dashicons fa-text-height',\n\t\t // 'trash': 'dashicons fa-trash',\n\t\t 'underline': 'dashicons dashicons-editor-underline',\n\t\t 'undo': 'dashicons dashicons-undo',\n\t\t 'unorderedlist': 'dashicons dashicons-editor-ul',\n\t\t // 'video': 'dashicons fa-youtube-play'\n\t\t }\n\n\t\t this.currentContext = {};\n\t\t},\n\n\t\tinitSettingModel: function( settingModel ) {\n\t\t\tsettingModel.set( 'hide_merge_tags', true );\n\t\t},\n\n\t\tinitRTE: function( settingModel, dataModel, settingView ) {\n\t\t\t/*\n\t\t\t * Custom Button for links\n\t\t\t */\n\t\t\tvar that = this;\n\t\t\t// var linkButton = this.linkButton();\n\t\t\tvar linkButton = function( context ) {\n\t\t\t\treturn that.linkButton( context );\n\t\t\t}\n\t\t\tvar mediaButton = function( context ) {\n\t\t\t\treturn that.mediaButton( context );\n\t\t\t}\n\t\t\tvar mergeTags = this.mergeTags();\n\n\t\t\tvar toolbar = [\n\t\t\t\t[ 'paragraphStyle', ['style'] ],\n\t\t\t\t[ 'fontStyle', [ 'bold', 'italic', 'underline','clear' ] ],\n\t\t\t\t[ 'lists', [ 'ul', 'ol' ] ],\n\t\t\t [ 'paragraph', [ 'paragraph' ] ],\n\t\t\t [ 'customGroup', [ 'linkButton', 'unlink' ] ],\n\t\t\t [ 'table', [ 'table' ] ],\n\t\t\t [ 'actions', [ 'undo', 'redo' ] ],\n\t\t\t [ 'tools', [ 'mediaButton', 'mergeTags', 'codeview' ] ]\n\t\t\t];\n\n\t\t\tjQuery( settingView.el ).find( 'div.setting' ).summernote( {\n\t\t\t\ttoolbar: toolbar,\n\t\t\t\tbuttons: {\n\t\t\t\t\tlinkButton: linkButton,\n\t\t\t\t\tmergeTags: mergeTags,\n\t\t\t\t\tmediaButton: mediaButton\n\t\t\t\t},\n\t\t\t\theight: 150, //set editable area's height\n\t\t\t\tcodemirror: { // codemirror options\n\t\t\t\t theme: 'monokai',\n\t\t\t\t lineNumbers: true,\n lineWrapping: true,\n\t\t\t\t callbacks: {\n\t\t\t\t \tonBlur: function( editor ) {\n\t\t\t\t \t\tvar value = editor.getValue();\n\t\t\t\t \t\tthat.updateDataModel( settingModel, dataModel, value );\n\t\t\t\t \t}\n\t\t\t\t }\n\t\t\t\t},\n\t\t\t\tprettifyHtml: true,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tonBlur: function( e, context ) {\n\t\t\t\t\t\tvar value = jQuery( this ).summernote( 'code' );\n\t\t\t\t\t\tthat.updateDataModel( settingModel, dataModel, value );\n nfRadio.channel( 'summernote' ).trigger( 'blur', settingModel, dataModel, value );\n\t\t\t\t\t},\n onFocus: function( e, context ) {\n nfRadio.channel( 'summernote' ).trigger( 'focus', e, this, context );\n },\n onKeydown: function( e, context ) {\n nfRadio.channel( 'summernote' ).trigger( 'keydown', e, this, context );\n },\n onKeyup: function( e, context ) {\n nfRadio.channel( 'summernote' ).trigger( 'keyup', e, this, context );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tupdateDataModel: function( settingModel, dataModel, value ) {\n\t\t\tvar name = settingModel.get( 'name' );\n\t\t\tvar before = dataModel.get( name );\n\t\t\tvar after = value;\n\n\t\t\tvar changes = {\n\t\t\t\tattr: name,\n\t\t\t\tbefore: before,\n\t\t\t\tafter: after\n\t\t\t}\n\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Changed ' + settingModel.get( 'label' ) + ' from ' + before + ' to ' + after\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'changeSetting', dataModel, changes, label );\n\n\t\t\tdataModel.set( settingModel.get( 'name' ), after );\n\t\t},\n\n\t\trenderSetting: function( settingModel, dataModel, settingView ) {\n\t\t\tthis.initRTE( settingModel, dataModel,settingView );\n\t\t\tvar linkMenu = jQuery( settingView.el ).find( '.link-button' ).next( '.dropdown-menu' ).find( 'button' );\n\t\t\tlinkMenu.replaceWith(function () {\n\t\t\t return jQuery( '<div/>', {\n\t\t\t class: jQuery( linkMenu ).attr( 'class' ),\n\t\t\t html: this.innerHTML\n\t\t\t } );\n\t\t\t} );\n\t\t},\n\n\t\tdestroySetting: function( settingModel, dataModel, settingView ) {\n\t\t\tthis.removeRTE( settingModel, dataModel, settingView );\n\t\t},\n\n\t\tremoveRTE: function( settingModel, dataModel, settingView ) {\n\t\t\tjQuery( settingView.el ).find( 'div.setting' ).summernote( 'destroy' );\n\t\t},\n\n\t\tdrawerOpened: function( settingModel, dataModel, settingView ) {\n\t\t\tthis.initRTE( settingModel, dataModel, settingView );\n\t\t},\n\n\t\tlinkButton: function( context ) {\n\t\t\tvar that = this;\n\t\t\tvar ui = jQuery.summernote.ui;\n\t\t\tvar linkButton = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-link-button' );\n\t\t\tvar linkDropdown = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-link-dropdown' );\n\t\t\treturn ui.buttonGroup([\n\t\t\t\tui.button({\n\t className: 'dropdown-toggle link-button',\n\t contents: linkButton({}),\n\t tooltip: 'Insert Link',\n\t click: function( e ) {\n\t \tthat.clickLinkButton( e, context );\n\t },\n\t data: {\n\t toggle: 'dropdown'\n\t }\n\t }),\n\t\t\t\tui.dropdown([\n\t ui.buttonGroup({\n\t children: [\n\t ui.button({\n\t contents: linkDropdown({}),\n\t tooltip: ''\n\t }),\n\t ]\n\t })\n\t ])\n\t\t\t]).render();\n\t\t},\n\n\t\tmergeTags: function( context ) {\n\t\t\tvar ui = jQuery.summernote.ui;\n\t\t\tvar mergeTagsButton = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-merge-tags-button' );\n\t\t\treturn ui.button({\n\t\t\t\tclassName: 'dropdown-toggle merge-tags',\n\t\t\t\tcontents: mergeTagsButton({}),\n\t\t\t\ttooltip: 'Merge Tags'\n\t\t\t}).render();\n\t\t},\n\n\t\tmediaButton: function( context ) {\n\t\t\tvar that = this;\n\t\t\tvar ui = jQuery.summernote.ui;\n\t\t\tvar mediaButton = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-media-button' );\n\t\t\treturn ui.button({\n\t className: 'dropdown-toggle',\n\t contents: mediaButton({}),\n\t tooltip: 'Insert Media',\n\t click: function( e ) {\n\t \tthat.openMediaManager( e, context );\n\t }\n\t }).render();\n\t\t},\n\n\t\topenMediaManager: function( e, context ) {\n\t\t\tcontext.invoke( 'editor.createRange' );\n\t\t\tcontext.invoke( 'editor.saveRange' );\n\t\t\tthis.currentContext = context;\n\t\t\t\n\t\t\t// If the frame already exists, re-open it.\n\t\t\tif ( this.meta_image_frame ) {\n\t\t\t\tthis.meta_image_frame.open();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Sets up the media library frame\n\t\t\tthis.meta_image_frame = wp.media.frames.meta_image_frame = wp.media({\n\t\t\t\ttitle: 'Select a file',\n\t\t\t\tbutton: { text: 'insert' }\n\t\t\t});\n\n\t\t\tvar that = this;\n\n\t\t\t// Runs when an image is selected.\n\t\t\tthis.meta_image_frame.on('select', function(){\n\n\t\t\t\t// Grabs the attachment selection and creates a JSON representation of the model.\n\t\t\t\tvar media_attachment = that.meta_image_frame.state().get('selection').first().toJSON();\n\t\t\t\tthat.insertMedia( media_attachment, context );\n\t\t\t});\n\n\t\t\t// Opens the media library frame.\n\t\t\tthis.meta_image_frame.open();\n\t\t},\n\n\t\tclickLinkButton: function ( e, context ) {\n\t\t\tvar range = context.invoke( 'editor.createRange' );\n\t\t\tcontext.invoke( 'editor.saveRange' );\n\t\t\tvar text = range.toString()\n\t\t\tthis.currentContext = context;\n\n\t\t\tjQuery( e.target ).closest( '.note-customGroup > .note-btn-group' ).on ('hide.bs.dropdown', function ( e ) {\n\t\t\t\treturn false;\n\t\t\t});\n\n\t\t\tjQuery( e.target ).closest( '.note-customGroup > .note-btn-group' ).on ('shown.bs.dropdown', function ( e ) {\n\t\t\t\tjQuery( e.target ).parent().parent().find( '.link-text' ).val( text );\n\t\t\t\tjQuery( e.target ).parent().parent().find( '.link-url' ).focus();\n\t\t\t});\n\t\t},\n\n\t\tclickExtra: function( e, settingModel, dataModel, settingView ) {\n\t\t\tvar textEl = jQuery( e.target ).parent().find( '.link-text' );\n\t\t\tvar urlEl = jQuery( e.target ).parent().find( '.link-url' );\n\t\t\tvar isNewWindowEl = jQuery( e.target ).parent().find( '.link-new-window' );\n\t\t\tthis.currentContext.invoke( 'editor.restoreRange' );\n\t\t\tif ( jQuery( e.target ).hasClass( 'insert-link' ) ) {\n\t\t\t\tvar text = textEl.val();\n\t\t\t\tvar url = urlEl.val();\n\t\t\t\tvar isNewWindow = ( isNewWindowEl.prop( 'checked' ) ) ? true: false;\n\t\t\t\tif ( 0 != text.length && 0 != url.length ) {\n\t\t\t\t\tthis.currentContext.invoke( 'editor.createLink', { text:text, url: url, isNewWindow: isNewWindow } );\n\t\t\t\t}\n\t\t\t}\n\t\t\ttextEl.val( '' );\n\t\t\turlEl.val( '' );\n\t\t\tisNewWindowEl.prop( 'checked', false );\n\t\t\tjQuery( e.target ).closest( 'div.note-btn-group.open' ).removeClass( 'open' );\n\t\t},\n\n\t\tinsertMedia: function( media, context ) {\n\t\t\tthis.currentContext.invoke( 'editor.restoreRange' );\n\t\t\tif ( 'image' == media.type ) {\n\t\t\t\tthis.currentContext.invoke( 'editor.insertImage', media.url );\n\t\t\t} else {\n\t\t\t\tthis.currentContext.invoke( 'editor.createLink', {\n\t\t\t\t\ttext: media.title || media.filename,\n\t\t\t\t\turl: media.url\n\t\t\t\t} );\n\t\t\t}\n\n\t\t}\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/settingFieldSelect',[], function() {\n var controller = Marionette.Object.extend( {\n\n initialize: function() {\n\n // Bind field key listener to field-select setting type.\n this.listenTo( nfRadio.channel( 'field-select' ), 'init:settingModel', this.trackKeyChanges );\n\n // The first time settingModel and the dataModel meet.\n this.listenTo( nfRadio.channel( 'setting-type-field-select' ), 'before:renderSetting', this.beforeRender );\n\n // Add setting change listener only in drawers with a field-select setting.\n this.listenTo( nfRadio.channel( 'field-select' ), 'init:settingModel', function() {\n this.listenTo( nfRadio.channel( 'app' ), 'change:setting', this.maybeSwitchToFieldsDomain );\n });\n\n this.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.autoOpenDrawer );\n\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.filterDrawerContents );\n this.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.SwitchToFieldsDomain );\n },\n\n trackKeyChanges: function( settingModel ) {\n settingModel.listenTo( nfRadio.channel( 'app' ), 'update:fieldKey', settingModel.updateKey );\n\n // Update selected field if the selected field's key changes.\n this.listenTo( nfRadio.channel( 'app' ), 'replace:fieldKey', this.updateFieldMap );\n },\n\n updateFieldMap: function( dataModel, keyModel, settingModel ) {\n\n var oldKey = keyModel._previousAttributes[ 'key' ];\n var newKey = keyModel.get( 'key' );\n\n if( 'field-select' == settingModel.get( 'type' ) && dataModel.get( settingModel.get( 'name' ) ) == oldKey ) {\n\n dataModel.set( settingModel.get( 'name' ), newKey );\n }\n },\n\n beforeRender: function( settingModel, dataModel ) {\n\n var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n var fieldTypes = settingModel.get( 'field_types' );\n\n var options = [\n {\n label: '--',\n value: 0\n }\n ];\n _.each( fieldCollection.models, function( field ){\n\n if( dataModel.cid == field.cid ) return;\n\n if( 'undefined' != typeof fieldTypes && 0 != fieldTypes.length && ! _.contains( fieldTypes, field.get( 'type' ) ) ) return;\n\n var fieldFilter = settingModel.get( 'field_filter' );\n if( fieldFilter && 'undefined' != typeof fieldFilter[ field.get( 'type' ) ] ) {\n var bail = false;\n _.each( fieldFilter[ field.get( 'type' ) ], function( value, setting ){\n console.log( value + \":\" + field.get( setting ) );\n if( value != field.get( setting ) ) bail = true;\n } );\n if( bail ) return;\n }\n\n var value = field.get( 'key' );\n switch ( settingModel.get( 'field_value_format' ) ) {\n case 'key':\n value = field.get( 'key' );\n break;\n case 'merge_tag':\n default:\n value = '{field:' + field.get( 'key' ) + '}';\n }\n\n options.push({\n label: field.get( 'label' ),\n value: value\n });\n });\n\n if( 'undefined' != typeof fieldTypes && 0 != fieldTypes.length ) {\n _.each( fieldTypes, function( fieldType ){\n\n var fieldTypeModel = nfRadio.channel( 'fields' ).request( 'get:type', fieldType );\n\n options.push({\n label: '-- Add ' + fieldTypeModel.get( 'nicename' ) + ' Field',\n value: 'addField:' + fieldType,\n });\n } );\n }\n\n settingModel.set( 'options', options );\n },\n\n maybeSwitchToFieldsDomain: function( e, model, dataModel ) {\n\n if( 'field-select' != model.get( 'type' ) ) return;\n\n var name = model.get( 'name' );\n var value = dataModel.get( name );\n\n if( ! value ) return;\n\n var rubble = value.split( ':' );\n\n if( 'addField' != rubble[0] ) return;\n\n this.openDrawer = 'addField';\n this.filterDrawer = rubble[1];\n\n dataModel.set( name, '' );\n\n this.switchDomain = true;\n nfRadio.channel( 'app' ).request( 'close:drawer' );\n },\n\n SwitchToFieldsDomain: function() {\n if( this.switchDomain ) {\n var fieldDomainModel = nfRadio.channel( 'app' ).request( 'get:domainModel', 'fields' );\n nfRadio.channel('app').request('change:currentDomain', null, fieldDomainModel);\n this.switchDomain = null;\n }\n },\n\n autoOpenDrawer: function() {\n if( this.openDrawer ) {\n nfRadio.channel( 'app' ).request( 'open:drawer', this.openDrawer );\n this.openDrawer = null;\n }\n },\n\n filterDrawerContents: function() {\n if( this.filterDrawer ) {\n nfRadio.channel('drawer-addField').trigger('change:filter', this.filterDrawer);\n this.filterDrawer = null;\n }\n }\n });\n\n return controller;\n} );\n/**\n * The Field List setting is a container of settings (like the Fieldset setting), in which its children are instantiated.\n * Unlike the Fieldset setting, Field List settings are dynamically created based on the list of form fields.\n *\n * Note: Field references in the dynamic setting names are based on field keys, which may change.\n * Unlike regular field key tracking, a new setting needs to be created with the same value as the previous.\n *\n * @package Ninja Forms builder\n * @subpackage Action Settings\n * @copyright (c) 2016 WP Ninjas\n * @author Kyle B. Johnson\n * @since 3.0\n */\ndefine( 'controllers/app/settingFieldList',['views/app/drawer/typeSettingFieldset','models/app/settingCollection'], function( fieldsetView, settingCollection ) {\n return Marionette.Object.extend( {\n\n /**\n * A reference list of Field List setting models.\n */\n fieldListSettings: [],\n\n initialize: function() {\n this.listenTo( nfRadio.channel( 'field-list' ), 'init:settingModel', this.registerFieldListSettings );\n this.listenTo( nfRadio.channel( 'fields' ), 'update:setting', this.updateFieldListSettingKeys );\n nfRadio.channel( 'field-list' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n },\n\n /**\n * Build a reference list of Field List setting models for later reference.\n *\n * @param settingModel\n */\n registerFieldListSettings: function( settingModel ){\n this.fieldListSettings.push( settingModel.get( 'name' ) );\n },\n\n /**\n * Field List settings contain field keys in the setting names.\n * When a field key changes, so too must the Field List setting name.\n *\n * @param fieldModel\n */\n updateFieldListSettingKeys: function( fieldModel ){\n\n // We are only interested in field key changes.\n if( 'undefined' == typeof fieldModel.changed.key ) return;\n\n var oldKey = fieldModel._previousAttributes.key;\n var newKey = fieldModel.changed.key;\n\n /*\n * This is an absolute (functional) mess of nesting. I apologize to my future self, or Kenny.\n *\n * Each setting of each action model must be checked against each registered Field List setting.\n */\n var that = this;\n _.each( Backbone.Radio.channel( 'actions' ).request( 'get:collection' ).models, function( actionModel ) {\n _.each( actionModel.attributes, function( value, setting ) {\n var lastChanged = ''; // Used to avoid resetting the change with a duplicate call.\n _.each( that.fieldListSettings, function( prefix ) {\n if( setting != prefix + '-' + oldKey || lastChanged == oldKey ) return;\n var oldValue = actionModel.get( prefix + '-' + oldKey );\n actionModel.set( prefix + '-' + newKey, oldValue );\n actionModel.set( prefix + '-' + oldKey, 0 );\n lastChanged = oldKey;\n });\n });\n });\n },\n\n /**\n * Set the view for Field List sub-settings, just like the Fieldset setting.\n *\n * @param settingModel\n * @returns {*}\n */\n getSettingChildView: function( settingModel ) {\n\n /**\n * Dynamically build field-list settings as needed for the view.\n */\n\n // Filter fields based on the field_types setting property.\n var fields = _.filter( nfRadio.channel( 'fields' ).request( 'get:collection' ).models, function( field ) {\n return _.contains( settingModel.get( 'field_types' ), field.get( 'type' ) );\n });\n\n // Map fields into setting definitions.\n var settings = _.map( fields, function( field ) {\n return {\n name: settingModel.get( 'name' ) + '-' + field.get( 'key' ),\n type: 'toggle',\n label: field.get( 'label' ),\n width: 'full'\n };\n });\n\n settingModel.set( 'settings', new settingCollection( settings ) );\n\n // return the child view.\n return fieldsetView;\n },\n\n });\n} );\n\n/**\n * Listens to our app channel for settings views being rendered.\n *\n *\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/settingHTML',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n\n // The first time settingModel and the dataModel meet.\n this.listenTo( nfRadio.channel( 'setting-type-html' ), 'before:renderSetting', this.init );\n },\n\n init: function( settingModel, dataModel ) {\n\n if( 'undefined' == settingModel.get( 'mirror' ) ) return;\n\n // Listen to a setting change inside of the dataModel.\n dataModel.on( 'change:' + settingModel.get( 'mirror' ), this.update, settingModel );\n },\n\n update: function( dataModel, changedSettingValue ) {\n\n // Mirror the default value setting value.\n dataModel.set( this.get( 'name' ), changedSettingValue );\n }\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/settingColor',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n // We don't want to re-render this setting type when the data changes.\n nfRadio.channel( 'setting-type-color' ).reply( 'renderOnChange', this.setRenderFalse );\n // We want to close any color pickers before we close our styling tab or drawer.\n this.listenTo( nfRadio.channel( 'setting-type-color' ), 'destroy:setting', this.closeColorPickers );\n\n // The first time settingModel and the dataModel meet.\n this.listenTo( nfRadio.channel( 'setting-type-color' ), 'render:setting', this.initColorPicker );\n },\n\n initColorPicker: function( settingModel, dataModel, view ) {\n\n var name = settingModel.get( 'name' );\n var el = jQuery( view.el ).find( 'input' );\n\n jQuery( el ).wpColorPicker( {\n change: function( event, ui ){\n nfRadio.channel( 'app' ).request( 'change:setting', event, settingModel, dataModel, ui.color.toString() );\n }\n } );\n },\n\n setRenderFalse: function() {\n return false;\n },\n\n closeColorPickers: function( settingModel, dataModel, view ) {\n jQuery( view.el ).find( '.wp-color-picker' ).wpColorPicker( 'close' );\n }\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel for the app to start.\n *\n * If the form is a new form, then highlight the Add New submenu item.\n * Otherwise, append an Edit Form submenu for context.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/changeMenu',[], function() {\n var controller = Marionette.Object.extend({\n\n editFormText: '',\n\n initialize: function () {\n this.editFormText = nfAdmin.editFormText || 'Edit Form';\n this.listenTo(nfRadio.channel('app'), 'after:appStart', this.changeMenu);\n this.listenTo( nfRadio.channel( 'app' ), 'response:updateDB', this.formPublish );\n },\n\n changeMenu: function () {\n var form = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\n if ( this.isNewForm( form.id ) ) {\n this.highlightAddNew();\n } else {\n this.appendEditForm();\n }\n },\n\n isNewForm: function( form_id ) {\n return isNaN( form_id );\n },\n\n highlightAddNew: function() {\n jQuery( '.wp-submenu li' ).removeClass( 'current' );\n jQuery( 'a[href=\"admin.php?page=ninja-forms&form_id=new\"]' ).parent().addClass( 'current' );\n },\n\n /**\n * Append 'Edit Form'\n * When editing a form, add an 'Edit Form' submenu item to\n * the WordPress Admin Dashboard menu, specifically under\n * the Ninja Forms Menu Item and after the 'Add New' item.\n */\n appendEditForm: function() {\n // Singleton check. Only add this menu item one time.\n if ( jQuery( 'li a:contains(\"' + this.editFormText + '\")' ).length > 0 ) return;\n\n var editFormLinkText, editFormLink, editFormListItem;\n\n // Create the 'Edit Form' submenu item.\n editFormLinkText = document.createTextNode(this.editFormText);\n editFormLink = document.createElement(\"a\");\n editFormLink.appendChild(editFormLinkText);\n\n editFormListItem = document.createElement(\"li\");\n editFormListItem.appendChild(editFormLink);\n editFormListItem.classList.add(\"current\");\n\n // Remove the `current` class from any existing list items.\n jQuery( '.wp-submenu li' ).removeClass( 'current' );\n\n // Insert the 'Edit Form' item after the 'Add New' item;\n jQuery( 'a[href=\"admin.php?page=ninja-forms#new-form\"]' ).parent().after( editFormListItem );\n },\n\n formPublish: function( response ) {\n if ( 'publish' !== response.action ) return false;\n this.changeMenu();\n }\n });\n\n return controller;\n});\n\n/**\n * When we click on a domain link, close the mobile menu.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/mobile',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for clicks on our app menu.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:menu', this.closeMobileMenu );\n\t\t},\n\n\t\tcloseMobileMenu: function() {\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).removeClass( 'nf-menu-expand' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Add a jBox notice to the screen.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/notices',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'notices' ).reply( 'add', this.addNotice, this );\n\t\t\tnfRadio.channel( 'notices' ).reply( 'close', this.closeNotice, this );\n\t\t\tthis.notices = {};\n\t\t},\n\n\t\taddNotice: function( key, msg, options ) {\n\n\t\t\tvar appDefaults = {\n\t\t\t\tcontent: msg,\n\t\t\t\tcolor: 'green',\n\t\t\t\tzIndex:10000000,\n\t\t\t\tconstructOnInit: true,\n\t\t\t\tstack: true,\n\t\t\t\tanimation: {\n\t\t\t\t\topen: 'flip',\n\t\t\t\t\tclose: 'flip'\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tvar mobileDefaults = {\n\t\t\t\tposition: {\n\t\t\t\t\tx: 'center',\n\t\t\t\t\ty: 'top'\n\t\t\t\t},\n\t\t\t\tanimation: {\n\t\t\t\t\topen:'slide:top',\n\t\t\t\t\tclose:'slide:left'\n\t\t\t\t},\n\t\t\t\tautoClose: 2000,\n\t\t\t\toffset: {\n\t\t\t\t\tx: 0,\n\t\t\t\t\ty: 55\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tvar desktopDefaults = {\n\t\t\t\tattributes: {\n\t\t\t\t\tx: 'left',\n\t\t\t\t\ty: 'bottom'\n\t\t\t\t},\n\t\t\t\tautoClose: 4000\n\t\t\t};\n\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tvar defaults = mobileDefaults;\t\n\t\t\t} else {\n\t\t\t\tvar defaults = desktopDefaults;\n\t\t\t}\n\t\t\tdefaults = jQuery.extend( defaults, appDefaults );\n\n\t\t\tvar options = jQuery.extend( defaults, options );\n\t\t\t// console.log( options );\n\t\t\tthis.notices[ key ] = new jBox( 'Notice', options );\n\t\t},\n\n\t\tcloseNotice: function( key ) {\n\t\t\tif ( 'undefined' != typeof this.notices[ key ] ) {\n\t\t\t\tthis.notices[ key ].close();\n\t\t\t}\n\t\t},\n\n\t\topenNotice: function( key ) {\n\t\t\tif ( 'undefined' != typeof this.notices[ key ] ) {\n\t\t\t\tthis.notices[ key ].open();\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Prompt the user to save if they attempt to leave the page with unsaved changes.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/unloadCheck',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tjQuery( window ).bind( 'beforeunload', this.maybePrompt );\n\t\t},\n\n\t\tmaybePrompt: function( model ) {\n\t\t\t// If our app is clean, don't show a warning.\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t\t\t\treturn 'You have unsaved changes.';\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Before we save data to the database (on preview update or publish), we check to see if we have anyone\n * that wants to update the 'formContent' form setting. This setting is used on the front-end to allow\n * for custom display of form fields. i.e. layout rows.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/formContentFilters',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Init our formContent view filter array.\n\t\t\t */\n\t\t\tthis.viewFilters = [];\n\t\t\tthis.saveFilters = [];\n\t\t\tthis.loadFilters = [];\n\n\t\t\t/*\n\t\t * Listen for requests to add formContent filters.\n\t\t\t */\n\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'add:viewFilter', this.addViewFilter, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'add:saveFilter', this.addSaveFilter, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'add:loadFilter', this.addLoadFilter, this );\n\n\t\t\t/*\n\t\t\t * Listen for requests to get our formContent filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'get:viewFilters', this.getViewFilters, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'get:saveFilters', this.getSaveFilters, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'get:loadFilters', this.getLoadFilters, this );\n\t\t\t\n\t\t\t/*\n\t\t\t * -- DEPRECATED RADIO REPLIES --\n\t\t\t * \n\t\t\t * The 'fieldContents' channel has been deprecated as of 3.0 (it was present in the RC) in favour of 'formContent'.\n\t\t\t * Listen for requests to add new fieldContent filters.\n\t\t\t * \n\t\t\t * TODO: These radio listeners on the 'fieldContents' channels are here for backwards compatibility and should be removed eventually.\n\t\t\t */\n\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'add:viewFilter', this.addViewFilter, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'add:saveFilter', this.addSaveFilter, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'add:loadFilter', this.addLoadFilter, this );\n\n\t\t\t/*\n\t\t\t * Listen for requests to get our fieldContent filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'get:viewFilters', this.getViewFilters, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'get:saveFilters', this.getSaveFilters, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'get:loadFilters', this.getLoadFilters, this );\n\t\t\n\t\t\t/*\n\t\t\t * -- END DEPRECATED --\n\t\t\t */\n\t\t},\n\n\t\taddViewFilter: function( callback, priority ) {\n\t\t\tthis.viewFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetViewFilters: function() {\n\t\t\treturn this.viewFilters;\n\t\t},\n\n\t\taddSaveFilter: function( callback, priority ) {\n\t\t\tthis.saveFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetSaveFilters: function() {\n\t\t\treturn this.saveFilters;\n\t\t},\n\n\t\taddLoadFilter: function( callback, priority ) {\n\t\t\tthis.loadFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetLoadFilters: function() {\n\t\t\treturn this.loadFilters;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles filters for our main content gutter views.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/formContentGutterFilters',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Init our gutter view filter array.\n\t\t\t */\n\t\t\tthis.leftFilters = [];\n\t\t\tthis.rightFilters = [];\n\t\t\t/*\n\t\t * Listen for requests to add gutter filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'add:leftFilter', this.addLeftFilter, this );\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'add:rightFilter', this.addRightFilter, this );\n\n\t\t\t/*\n\t\t\t * Listen for requests to get our content gutter filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'get:leftFilters', this.getLeftFilters, this );\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'get:rightFilters', this.getRightFilters, this );\n\t\t},\n\n\t\taddLeftFilter: function( callback, priority ) {\n\t\t\tthis.leftFilters[ priority ] = callback;\n\t\t},\n\n\t\taddRightFilter: function( callback, priority ) {\n\t\t\tthis.rightFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetLeftFilters: function() {\n\t\t\treturn this.leftFilters;\n\t\t},\n\n\t\tgetRightFilters: function() {\n\t\t\treturn this.rightFilters;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns a clone of a backbone collection with all the models' attributes looped through so that collections contained within are propely cloned.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/cloneCollectionDeep',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'clone:collectionDeep', this.cloneCollectionDeep, this );\n\t\t},\n\n\t\tcloneCollectionDeep: function( collection ) {\n\t\t\tvar models = [];\n\t\t\t// Loop through every model in our collection, clone it, and add it to our model array\n\t\t\t_.each( collection.models, function( model ) {\n\t\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', model );\n\t\t\t\tmodels.push( newModel );\n\t\t\t} );\n\t\t\t// Create a new instance of our collection\n\t\t\treturn new collection.constructor( models, collection.options );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Tracks which keys have been pressed.\n * Currently only used by fields to see if they should duplicate or delete on click.\n * (Shift + D + click = delete) (Shift + C + click = duplicate)\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/trackKeyDown',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tkeys: [],\n\n\t\tinitialize: function() {\n\t\t\tvar that = this;\n\t\t\t/*\n\t\t\t * Track keydowns and store the keys pressed.\n\t\t\t */\n\t\t\t\n\t\t\tjQuery( document ).on( 'keydown', function( e ) {\n\t\t\t\tthat.keyDown( e, that );\n\t\t\t} );\n\n\t\t\tjQuery( document ).on( 'keyup', function( e ) {\n\t\t\t\tthat.keyUp( e, that );\n\t\t\t} );\n\n\t\t\t/*\n\t\t\t * Get the keys currently being pressed, if any\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:keydown', this.getKeyDown, this );\n\t\t},\n\n\t\tkeyDown: function( e, context ) {\n\t\t\t/*\n\t\t\t * Add our keycode to our keys array.\n\t\t\t */\n\t\t\tcontext.keys[ e.keyCode ] = e.keyCode;\n\t\t},\n\n\t\tkeyUp: function( e, context ) {\n\t\t\t/*\n\t\t\t * Remove our keycode from our keys array.\n\t\t\t */\n\t\t\tif ( -1 != context.keys.indexOf( e.keyCode ) ) {\n\t\t\t\tdelete context.keys[ e.keyCode ];\n\t\t\t}\n\t\t},\n\n\t\tgetKeyDown: function() {\n\t\t\treturn this.keys;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Initialize the perfectscroll jQuery plugin\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/perfectScroll',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tmovedPos: false,\n\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * When we init the main view, init our perfectscroll\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'main' ), 'show:main', this.initPerfectScroll );\n\n\t\t\t/*\n\t\t\t * When our drawer opens and closes, change the position of our scroll rail.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.moveRail );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'before:closeDrawer', this.resetRail );\n\t\t},\n\n\t\tinitPerfectScroll: function( view ) {\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( view.el ).parent().perfectScrollbar( {\n\t\t\t\t\tsuppressScrollX: true\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tjQuery( 'head' ).append( '<style id=\"ps-scrollbar-css\" type=\"text/css\"></style>' );\n\t\t},\n\n\t\tmoveRail: function() {\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tvar movedPos = jQuery( drawerEl ).outerWidth();\n\n\t\t\tjQuery( '#ps-scrollbar-css' ).text( '.ps-scrollbar-moved { right: ' + movedPos + 'px !important; } ' );\n\t\t\tjQuery( '#nf-main .ps-scrollbar-y-rail' ).addClass( 'ps-scrollbar-moved ' );\n\t\t\t\n\t\t},\n\n\t\tresetRail: function() {\n\t\t\tjQuery( '.ps-scrollbar-y-rail' ).removeClass( 'ps-scrollbar-moved ' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns a new setting group collection.\n * Used to settings drawers for custom data models (i.e. not fields, actions, or advanced)\n * \n * @package Ninja Forms builder\n * @subpackage App - Edit Settings Drawer\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/getNewSettingGroupCollection',[ 'models/app/settingGroupCollection' ], function( SettingGroupCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for a new setting group collection\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:settingGroupCollectionDefinition', this.getNewSettingGroupCollection, this );\n\t\t},\n\n\t\t/**\n\t\t * Return a new instance of the setting group collection.\n\t\t *\n\t\t * @since 3.0\n\t\t * @return backbone.collection\n\t\t */\n\t\tgetNewSettingGroupCollection: function() {\n\t\t\treturn SettingGroupCollection;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.0.30\n */\ndefine( 'controllers/app/settingMedia',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n // When the media button is clicked, open the media manager.\n this.listenTo( nfRadio.channel( 'setting-type-media' ), 'click:extra', this.clickExtra );\n },\n\n clickExtra: function( e, settingModel, dataModel, settingView ) {\n var textEl = jQuery( e.target ).parent().find( '.setting' );\n\n if ( jQuery( e.target ).hasClass( 'open-media-manager' ) ) {\n // If the frame already exists, re-open it.\n if ( this.meta_image_frame ) {\n this.meta_image_frame.open();\n return;\n }\n\n // Sets up the media library frame\n this.meta_image_frame = wp.media.frames.meta_image_frame = wp.media({\n title: 'Select a file',\n button: { text: 'insert' }\n });\n\n var that = this;\n\n // Runs when an image is selected.\n this.meta_image_frame.on('select', function(){\n // Grabs the attachment selection and creates a JSON representation of the model.\n var media_attachment = that.meta_image_frame.state().get('selection').first().toJSON();\n textEl.val( media_attachment.url ).change();\n });\n\n // Opens the media library frame.\n this.meta_image_frame.open();\n }\n },\n });\n\n return controller;\n} );\n/**\n * Handles changing our public link when we request a new one or when it's set improperly.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2019 WP Ninjas\n * @since UPDATE_VERSION_ON_MERGE\n */\ndefine( 'controllers/app/publicLink',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'after:appStart', this.validatePublicLink, this );\n nfRadio.channel( 'app' ).reply( 'generate:publicLinkKey', this.newPublicLinkKey, this );\n },\n \n newPublicLinkKey: function() {\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n var public_link_key = nfRadio.channel('app').request('get:formModel').get('id');\n for (var i = 0; i < 4; i++) {\n var char = Math.random().toString(36).slice(-1);\n public_link_key += char;\n };\n // Apply the public link key to form settings\n formSettingsDataModel.set('public_link_key', public_link_key);\n return public_link_key;\n },\n\n validatePublicLink: function() {\n var formID = nfRadio.channel('app').request('get:formModel').get('id');\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n if ( 'undefined' === typeof formSettingsDataModel.get('public_link_key') ) return false;\n if ( 0 === formSettingsDataModel.get( 'public_link_key' ).indexOf( formID ) ) return false;\n var public_link_key = this.newPublicLinkKey();\n var publicLink = nfAdmin.publicLinkStructure.replace('[FORM_ID]', public_link_key);\n formSettingsDataModel.set('public_link', publicLink);\n }\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Model that represents our field type section on the add new field drawer.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/typeSectionModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tclasses: ''\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our field models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/typeSectionCollection',['models/fields/typeSectionModel'], function( typeSectionModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: typeSectionModel\n\t} );\n\treturn collection;\n} );\n/**\n * Creates and stores a collection of field types. This includes all of the settings shown when editing a field.\n *\n * 1) Create our settings sections config\n * 2) Loops over our preloaded data and adds that to our field type collection\n *\n * Also responds to requests for data about field types\n *\n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/types',[\n\t\t'models/app/typeCollection',\n\t\t'models/fields/typeSectionCollection'\n\t],\n\tfunction(\n\t\tTypeCollection,\n\t\tSectionCollection\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Config for our settings sections\n\t\t\tthis.sections = new SectionCollection( fieldTypeSections );\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'init:typeModel', this.registerSection );\n\n\t\t\t// Create our field type collection\n\t\t\tthis.collection = new TypeCollection( fieldTypeData, { type: 'fields' } );\n\n\t\t\t// Respond to requests to get field type, collection, settings, and sections\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:type', this.getFieldType, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:typeCollection', this.getTypeCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:typeSections', this.getTypeSections, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:savedFields', this.getSavedFields, this );\n\n\t\t\t// Listen to clicks on field types\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:fieldType', this.addField );\n\t\t},\n\n\t\tregisterSection: function( typeModel ) {\n\t\t\tif ( 'fields' != typeModel.collection.type || ! typeModel.get( 'section' ) ) return;\n\n\t\t\tthis.sections.get( typeModel.get( 'section' ) ).get( 'fieldTypes' ).push( typeModel.get( 'id' ) );\n\t\t},\n\n\t\t/**\n\t\t * Return a field type by id\n\t\t *\n\t\t * @since 3.0\n\t\t * @param string \t\t\tid \tfield type\n\t\t * @return backbone.model \tfield type model\n\t\t */\n\t\tgetFieldType: function( id ) {\n \treturn this.collection.get( id );\n },\n\n /**\n * Return the entire field type collection\n *\n * @since 3.0\n * @param string \t\t\t\tid \t[description]\n * @return backbone.collection \tfield type collection\n */\n\t\tgetTypeCollection: function( id ) {\n \treturn this.collection;\n },\n\n /**\n * Add a field type to our fields sortable when the field type button is clicked.\n *\n * @since 3.0\n * @param Object e event\n * @return void\n */\n addField: function( e ) {\n\t\t\tvar type = jQuery( e.target ).data( 'id' );\n\n\t\t\tif( e.shiftKey ){\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'add:stagedField', type );\n\t\t\t\treturn;\n\t\t\t}\n\n \tvar fieldModel = nfRadio.channel( 'fields' ).request( 'add', {\n\t\t\t\ttype: type,\n\n\t\t\t\tlabel: nfRadio.channel( 'fields' ).request( 'get:type', type ).get( 'nicename' )\n\t\t\t});\n\n\t\t\tconsole.log( fieldModel );\n\n\t\t\tvar label = {\n\t\t\t\tobject: 'Field',\n\t\t\t\tlabel: fieldModel.get( 'label' ),\n\t\t\t\tchange: 'Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: nfRadio.channel( 'fields' ).request( 'get:collection' )\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', fieldModel, null, label, data );\n\n\t\t\t// Re-Draw the Field Collection\n\t\t\tnfRadio.channel( 'fields' ).request( 'redraw:collection' );\n },\n\n /**\n * Return our field type settings sections\n *\n * @since 3.0\n * @return backbone.collection field type settings sections\n */\n getTypeSections: function() {\n return this.sections;\n },\n\n /**\n * Return our saved fields\n *\n * @since 3.0\n * @return backbone.collection\n */\n getSavedFields: function() {\n \tthis.sections.get( 'saved' );\n }\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Handles the logic for our field type draggables.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldTypeDrag',[], function( ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our field type draggables and run the appropriate function.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:type', this.startDrag );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:type', this.stopDrag );\n\t\t\t/*\n\t\t\t * Respond to requests for our helper clone.\n\t\t\t * This is used by other parts of the application to modify what the user is dragging in real-time.\n\t\t\t */ \n\t\t\tnfRadio.channel( 'drawer-addField' ).reply( 'get:typeHelperClone', this.getCurrentDraggableHelperClone, this );\n\t\t},\n\n\t\t/**\n\t\t * When we start dragging:\n\t\t * get our drawer element\n\t\t * set its overflow property to visible !important -> forces the type drag element to be on at the top of the z-index.\n\t\t * get our main element\n\t\t * est its overflow propery to visible !important -> forces the type drag element to be on top of the z-index.\n\t\t * set our dragging helper clone\n\t\t * \n\t\t * @since 3.0\n\t\t * @param object context \tThis function is going to be called from a draggable. Context is the \"this\" reference to the draggable.\n\t\t * @param object ui \tObject sent by jQuery UI draggable.\n\t\t * @return void\n\t\t */\n\t\tstartDrag: function( context, ui ) {\n\t\t\tthis.drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tthis.mainEl = nfRadio.channel( 'app' ).request( 'get:mainEl' );\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\n\t\t\tthis.draggableHelperClone = jQuery( ui.helper ).clone();\n\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging, reset our overflow property to hidden !important.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param object context \tThis function is going to be called from a draggable. Context is the \"this\" reference to the draggable.\n\t\t * @param object ui \tObject sent by jQuery UI draggable.\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tstopDrag: function( context, ui ) {\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t},\n\n\t\tgetCurrentDraggableHelperClone: function() {\n\t\t\treturn this.draggableHelperClone;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles the dragging of our field staging area\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/stagingDrag',[], function( ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for the start and stop of our field staging dragging\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:fieldStaging', this.startDrag );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:fieldStaging', this.stopDrag );\n\t\t},\n\n\t\t/**\n\t\t * When the user starts dragging the staging area, we have to:\n\t\t * set the overflow property of the drawer to visible !important. If we don't, the button goes underneath the main section.\n\t\t * set the overflow proerty of the main to visible !important. If we don't, the dragged element goes underneath the drawer.\n\t\t * replace our helper with the stacked \"x fields\" template.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t context jQuery UI Draggable\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartDrag: function( context, ui ) {\n\t\t\tthis.drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tthis.mainEl = nfRadio.channel( 'app' ).request( 'get:mainEl' );\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\t\t\t// jQuery( this.mainEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\n\t\t\tvar stagedFields = nfRadio.channel( 'fields' ).request( 'get:staging' );\n\t\t\tvar html = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-staged-fields-drag' );\n\t\t\tjQuery( ui.helper ).html( html( { num: stagedFields.models.length } ) );\n\t\t\tjQuery( ui.helper ).prop( 'id', 'nf-staged-fields-drag' );\n\t\t\tjQuery( ui.item ).css( 'opacity', '0.7' );\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging the staging area, we have to set the overflow property to hidden !important\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t context jQuery UI Draggable\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopDrag: function( context, ui ) {\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t\t// jQuery( this.mainEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles most things related to our staging area:\n * 1) Creates a collection\n * 2) Listens for requests to CRUD items from the collection\n * 3) Adds our staged fields to the fields sortable when the drawer is closed\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/staging',['models/fields/stagingCollection'], function( stagingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Create our staged fields collection\n\t\t\tthis.collection = new stagingCollection();\n\t\t\t// Respond to requests related to our staging area.\n\t\t nfRadio.channel( 'fields' ).reply( 'add:stagedField', this.addStagedField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'remove:stagedField', this.removeStagedField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:staging', this.getStagingCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'sort:staging', this.sortStagedFields, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'clear:staging', this.clearStagedFields, this );\n\t\t\t// Listen to our remove staged field click event.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'click:removeStagedField', this.removeStagedField );\n\t\t\t// Listen to our event that fires just before a drawer is closed.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'before:closeDrawer', this.beforeCloseDrawer );\n\t\t},\n\n\t\tgetStagingCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\t/**\n\t\t * Add a field to our staging area\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string type Type of field we're adding\n\t\t * @return tmpID\n\t\t */\n\t\taddStagedField: function( type, silent ) {\n\t\t\tvar silent = silent || false;\n\t\t\t// Get our type model from the string.\n\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\t\t\t// Our tmp ID is a string with the time appended to make it unique.\n\t\t\tvar tmpID = 'nf-staged-field-' + jQuery.now();\n\t\t\t// Object that will be added to our staging collection.\n\t\t\tvar data = {\n\t\t\t\tid: tmpID,\n\t\t\t\t// i.e. firstname, textbox, etc.\n\t\t\t\tslug: fieldType.get( 'type' ),\n\t\t\t\t// i.e. First Name, Textbox, etc.\n\t\t\t\tnicename: fieldType.get( 'nicename' ),\n\t\t\t\t// i.e. calendar, envelope, etc.\n\t\t\t\ticon: fieldType.get( 'icon' )\n\t\t\t}\n\t\t\t// \n\t\t\tvar model = this.collection.add( data );\n\n\t\t\tif( ! silent ) nfRadio.channel( 'fields').trigger( 'add:stagedField', model );\n\n\t\t\treturn tmpID;\n\t\t},\n\n\t\t/**\n\t\t * Remove a field from staging\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \t\t\te \tEvent\n\t\t * @param Backbone.model \tmodel \tstaged field model to remove\n\t\t * @return void\n\t\t */\n\t\tremoveStagedField: function( e, model ) {\n\t\t\tthis.collection.remove( model );\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'remove:stagedField', model );\n\t\t},\n\n\t\t/**\n\t\t * Adds our staged fields to the main fields sortable before the drawer is closed.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tbeforeCloseDrawer: function() {\n\t\t\tif ( 0 != this.collection.models.length ) { // Make sure that we have models\n\t\t\t\t// Get our field collection.\n\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n\t\t\t\tvar fields = [];\n\t\t\t\t// Loop through our staging collection\n\t\t\t\t_.each( this.collection.models, function( model ) {\n\t\t\t\t\t// Get a tmp ID for our new field.\n\t\t\t\t\tvar tmpID = nfRadio.channel( 'fields' ).request( 'get:tmpID' );\n\t\t\t\t\t// Create an object that can be added as a model.\n\t\t\t\t\tvar tmpField = { id: tmpID, label: model.get( 'nicename' ), type: model.get( 'slug' ) };\n\t\t\t\t\t// Add our new field.\n\t\t\t\t\tvar newModel = nfRadio.channel( 'fields' ).request( 'add', tmpField, false );\n\t\t\t\t\t// Add our field addition to our change log.\n\t\t\t\t\tvar label = {\n\t\t\t\t\t\tobject: 'Field',\n\t\t\t\t\t\tlabel: newModel.get( 'label' ),\n\t\t\t\t\t\tchange: 'Added',\n\t\t\t\t\t\tdashicon: 'plus-alt'\n\t\t\t\t\t};\n\t\t\t\t\tvar data = {\n\t\t\t\t\t\tcollection: fieldCollection\n\t\t\t\t\t}\n\t\t\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', newModel, null, label, data );\n\t\t\t\n\t\t\t\t} );\n\t\t\t\t// Trigger a reset on our field collection so that our view re-renders\n\t\t\t\tfieldCollection.trigger( 'reset', fieldCollection );\n\t\t\t\t// Empty the staging collection\n\t\t\t\tthis.collection.reset();\n\t\t\t}\n\t\t\t// Sort our fields.\n\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields', null, null, false );\n\t\t},\n\n\t\t/**\n\t\t * Sort our staging area by the 'order' attribute.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tsortStagedFields: function() {\n\t\t\t// Get our staged fields sortable.\n\t\t\tvar sortableEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\t// Get the current order using jQuery sortable. Will be an array of IDs: [tmp-blah, tmp-blah]\n\t\t\tvar order = jQuery( sortableEl ).sortable( 'toArray' );\n\t\t\t// Loop through our models\n\t\t\t_.each( this.collection.models, function( field ) {\n\t\t\t\t// Search our order array for this field.\n\t\t\t\tvar search = field.get( 'id' );\n\t\t\t\tvar pos = order.indexOf( search );\n\t\t\t\t// Update our staged field model with the new order.\n\t\t\t\tfield.set( 'order', pos );\n\t\t\t} );\n\t\t\t// Sort our staging collection.\n\t\t\tthis.collection.sort();\n\t\t},\n\n\t\tclearStagedFields: function() {\n\t\t\tthis.collection.reset();\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to our staged fields sortable.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/stagingSortable',['models/fields/stagingCollection'], function( stagingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our field type draggables\n\t\t\t// this.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:type', this.addActiveClass );\n\t\t\t// this.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:type', this.removeActiveClass );\n\t\t\t// Listen to our sortable events\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'receive:stagedFields', this.receiveStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'over:stagedFields', this.overStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'out:stagedFields', this.outStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'start:stagedFields', this.startStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stop:stagedFields', this.stopStagedFields );\n\t\t},\n\n\t\t/**\n\t\t * Change our dropped field type helper so that it matches the other items in our sortable.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI item\n\t\t * @return void\n\t\t */\n\t\treceiveStagedFields: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) {\n\t\t\t\tvar type = jQuery( ui.item ).data( 'id' );\n\t\t\t\tvar tmpID = nfRadio.channel( 'fields' ).request( 'add:stagedField', type );\n\t\t\t\tjQuery( ui.helper ).prop( 'id', tmpID );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:staging' );\n\t\t\t\tjQuery( ui.helper ).remove();\n\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'drop:fieldType', type );\t\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add an active class to our sortable when a field type item is dragged\n\t\t * \n\t\t * @since 3.0\n\t\t */\n\t\taddActiveClass: function() {\n\t\t\tvar stagedFieldsEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\tjQuery( stagedFieldsEl ).addClass( 'nf-droppable-active' );\n\t\t},\n\n\t\t/**\n\t\t * Remove the active class from our sortable when the field type item is dropped.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tremoveActiveClass: function() {\n\t\t\tvar stagedFieldsEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\tjQuery( stagedFieldsEl ).removeClass( 'nf-droppable-active' );\n\t\t},\n\n\t\t/**\n\t\t * When the field type item is dragged over our sortable, we change the helper to match the sortable items.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @param Object \tui jQuery UI Element\n\t\t * @return void\n\t\t */\n\t\toverStagedFields: function( e, ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) {\n\t\t\t\tvar type = jQuery( ui.item ).data( 'id' );\n\t\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\t\t\t\tvar nicename = fieldType.get( 'nicename' );\n\t\t\t\tthis.currentHelper = ui.helper \n\t\t\t\tjQuery( ui.helper ).html( nicename + '<span class=\"dashicons dashicons-dismiss\"></span>' );\n\t\t\t\tjQuery( ui.helper ).removeClass( 'nf-field-type-button' ).addClass( 'nf-item-dock' ).css( { 'opacity': '0.8', 'width': '', 'height': '' } );\n\t\t\t\tvar sortableEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).addClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t},\n\n\t\t/**\n\t\t * When a field type item is moved away from our sortable, we change the helper to its previous appearance\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toutStagedFields: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) {\n\t\t\t\tvar helperClone = nfRadio.channel( 'drawer-addField' ).request( 'get:typeHelperClone' );\t\n\t\t\t\tjQuery( this.currentHelper ).html( jQuery( helperClone ).html() );\n\t\t\t\tjQuery( this.currentHelper ).removeClass( 'nf-item-dock' ).addClass( 'nf-field-type-button' );\n\t\t\t\tvar sortableEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\t\t\n\t\t},\n\n\t\t/**\n\t\t * When a user starts to drag a sortable item, we need to set a few properties on the item and the helper.\n\t\t * These keep the original item in place while dragging and changes the opacity of the helper.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartStagedFields: function( ui ) {\n\t\t\tjQuery( ui.item ).show();\n\t\t\tjQuery( ui.item ).css( { 'display': 'inline', 'opacity': '0.7' } );\n\t\t\tjQuery( ui.helper ).css( 'opacity', '0.5' );\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging a sortable item, remove our opacity setting and remove the helper item.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopStagedFields: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t\tjQuery( ui.helper ).remove();\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Filters our field type collection.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/filterTypes',['models/fields/typeSectionCollection'], function( fieldTypeSectionCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our change filter event.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'change:filter', this.filterFieldTypes );\n\t\t},\n\n\t\t/**\n\t\t * Filter our field types in the add new field drawer\n\t\t * \n\t\t * Takes a search string and finds any field types that match either the name or alias.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string\t search \tstring being searched for\n\t\t * @param object \t e \tKeyup event\n\t\t * @return void\n\t\t */\n\t\tfilterFieldTypes: function( search, e ) {\n\t\t\t// Make sure that we aren't dealing with an empty string.\n\t\t\tif ( '' != jQuery.trim( search ) ) {\n \t\tvar filtered = [];\n \t\t/**\n \t\t * Call the function that actually filters our collection,\n \t\t * and then loop through our collection, adding each model to our filtered array.\n \t\t */\n \t\t_.each( this.filterCollection( search ), function( model ) {\n \t\t\tfiltered.push( model.get( 'id' ) );\n \t\t} );\n\n \t\t// Create a new Field Type Section collection with the filtered array.\n \t\tvar filteredSectionCollection = new fieldTypeSectionCollection( [\n\t\t\t\t{ \n\t\t\t\t\tid: 'filtered',\n\t\t\t\t\tnicename: 'Filtered Fields',\n\t\t\t\t\tfieldTypes: filtered\n\t\t\t\t}\n\t\t\t\t] );\n \n // Declare array of fields to hide.\n\t\t\t\tvar hiddenFields = nfRadio.channel( 'app' ).request( 'update:hiddenFields' ) || [];\n\t\t\t\thiddenFields = hiddenFields.concat([\n\t\t\t\t\t'product',\n\t\t\t\t\t'quantity',\n\t\t\t\t\t'shipping',\n\t\t\t\t\t'total'\n\t\t\t\t]);\n\n // Search our results of hidden fields.\n for ( var i = filteredSectionCollection.models[ 0 ].get( 'fieldTypes' ).length -1; i >= 0; i-- ) {\n var target = hiddenFields.indexOf( filteredSectionCollection.models[ 0 ].get( 'fieldTypes' )[ i ] );\n // If we find any...\n if ( -1 < target ) {\n // Remove them from the collection.\n filteredSectionCollection.models[ 0 ].get( 'fieldTypes' ).splice( i, 1 );\n }\n }\n\n \t\t// Request that our field types filter be applied, passing the collection we created above.\n \t\tnfRadio.channel( 'drawer' ).trigger( 'filter:fieldTypes', filteredSectionCollection );\n \t\t// If we've pressed the 'enter' key, add the field to staging and clear the filter.\n \t\tif ( 'undefined' != typeof e && e.addObject ) {\n \t\t\tif ( 0 < filtered.length ) {\n \t\t\t\tnfRadio.channel( 'fields' ).request( 'add:stagedField', filtered[0] );\n \t\t\t\tnfRadio.channel( 'drawer' ).request( 'clear:filter' );\n \t\t\t}\n \t\t}\n \t} else {\n \t\t// Clear our filter if the search text is empty.\n \t\tnfRadio.channel( 'drawer' ).trigger( 'clear:filter' );\n \t}\n },\n\n /**\n * Search our field type collection for the search string.\n * \n * @since 3.0\n * @param string\t search \tstring being searched for\n * @return backbone.collection\n */\n filterCollection: function( search ) {\n \tsearch = search.toLowerCase();\n \t// Get our list of field types\n \tvar collection = nfRadio.channel( 'fields' ).request( 'get:typeCollection' );\n \t/*\n \t * Backbone collections have a 'filter' method that loops through every model,\n \t * waiting for you to return true or false. If you return true, the model is kept.\n \t * If you return false, it's removed from the filtered result.\n \t */\n\t\t\tvar filtered = collection.filter( function( model ) {\n\t\t\t\tvar found = false;\n\t\t\t\t\n\t\t\t\t// If we match either the ID or nicename, return true.\n\t\t\t\tif ( model.get( 'type' ).toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\tfound = true;\n\t\t\t\t} else if ( model.get( 'nicename' ).toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\tfound = true;\n\t\t\t\t}\n\n\t\t\t\t/*\n\t\t\t\t * TODO: Hashtag searching. Doesn't really do anything atm.\n\t\t\t\t */\n\t\t\t\tif ( model.get( 'tags' ) && 0 == search.indexOf( '#' ) ) {\n\t\t\t\t\t_.each( model.get( 'tags' ), function( tag ) {\n\t\t\t\t\t\tif ( search.replace( '#', '' ).length > 1 ) {\n\t\t\t\t\t\t\tif ( tag.toLowerCase().indexOf( search.replace( '#', '' ) ) != -1 ) {\n\t\t\t\t\t\t\t\tfound = true;\n\t\t\t\t\t\t\t}\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// If we match any of the aliases, return true.\n\t\t\t\tif ( model.get( 'alias' ) ) {\n\t\t\t\t\t_.each( model.get( 'alias' ), function( alias ) {\n\t\t\t\t\t\tif ( alias.toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\t\t\tfound = true;\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn found;\n\t\t\t} );\n\t\t\t// Return our filtered collection.\n\t\t\treturn filtered;\n }\n\t});\n\n\treturn controller;\n} );\ndefine( 'views/fields/preview/element',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-field-input',\n\n\t\tinitialize: function() {\n\t\t\t\n\t\t\tvar type = this.model.get('type');\n\n\t\t\tthis.model.set('value', this.model.get('default'));\n\t\t\t\n\t\t\tif('date' == type && this.model.get('date_default')){\n\t\t\t\tvar format = this.model.get('date_format');\n\t\t\t\tif('default' == format || '' == format) format = this.convertDateFormat(nfAdmin.dateFormat);\n\t\t\t\tthis.model.set('value', moment().format(format) );\n\t\t\t}\n\n\t\t\tif('phone' == type) type = 'tel';\n\t\t\tif('spam' == type) type = 'input';\n\t\t\t// if('date' == type) type = 'input';\n\t\t\tif('confirm' == type) type = 'input';\n\t\t\tif('password' == type) type = 'input';\n\t\t\tif('passwordconfirm' == type) type = 'input';\n\t\t\tif('quantity' == type) type = 'number';\n\t\t\tif('terms' == type) type = 'listcheckbox';\n\t\t\tif('liststate' == type) type = 'listselect';\n\t\t\tif('listcountry' == type) type = 'listselect';\n\t\t\tif('listmultiselect' == type) type = 'listselect';\n\t\t\tif('save' == type) type = 'submit';\n\n\t\t\t// If a builder-specific template exists for this type, use that.\n\t\t\tif ( 1 == jQuery( '#tmpl-nf-builder-field-' + type ).length ) {\n\t\t\t\tthis.template = '#tmpl-nf-builder-field-' + type;\n\t\t\t} else {\n\t\t\t\tthis.template = '#tmpl-nf-field-' + type;\n\t\t\t}\t\t\t\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif(this.model.get('container_class').includes('two-col-list')) {\n\t\t\t\tjQuery(this.el).find('> ul').css('display', 'grid');\n\t\t\t\tjQuery(this.el).find('> ul').css('grid-template-columns', 'repeat(2, 1fr)');\n\t\t\t}\n\t\t\tif(this.model.get('container_class').includes('three-col-list')) {\n\t\t\t\tjQuery(this.el).find('> ul').css('display', 'grid');\n\t\t\t\tjQuery(this.el).find('> ul').css('grid-template-columns', 'repeat(3, 1fr)');\n\t\t\t}\n\t\t\tif(this.model.get('container_class').includes('four-col-list')) {\n\t\t\t\tjQuery(this.el).find('> ul').css('display', 'grid');\n\t\t\t\tjQuery(this.el).find('> ul').css('grid-template-columns', 'repeat(4, 1fr)');\n\t\t\t}\n\t\t},\n \n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderClasses: function() {\n\t \t\t\t// ...\n },\n renderPlaceholder: function() {\n if('undefined' == typeof this.placeholder) return;\n\t\t\t\t\treturn 'placeholder=\"' + jQuery.trim( this.placeholder ) + '\"';\n },\n maybeDisabled: function() {\n if('undefined' == typeof this.disable_input) return;\n if(!this.disable_input) return;\n return 'disabled=\"disabled\"';\n },\n maybeRequired: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\tmaybeInputLimit: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\tmaybeDisableAutocomplete: function() {\n\t\t\t\t\t// ..\n\t\t\t\t},\n\t\t\t\tmaybeChecked: function() {\n\t\t\t\t\tif('checked' == this.default_value) return ' checked=\"checked\"';\n\t\t\t\t},\n\t\t\t\trenderOptions: function() {\n\t\t\t\t\tswitch(this.type) {\n\t\t\t\t\t\tcase 'terms':\n\n\t\t\t\t\t\t\tif( ! this.taxonomy ){\n\t\t\t\t\t\t\t\treturn '(No taxonomy selected)';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tvar taxonomyTerms = fieldTypeData.find(function(typeData){\n\t\t\t\t\t\t\t\treturn 'terms' == typeData.id;\n\t\t\t\t\t\t\t}).settingGroups.find(function(settingGroup){\n\t\t\t\t\t\t\t\treturn 'primary' == settingGroup.id;\n\t\t\t\t\t\t\t}).settings.find(function(setting){\n\t\t\t\t\t\t\t\treturn 'taxonomy_terms' == setting.name;\n\t\t\t\t\t\t\t}).settings;\n\n\t\t\t\t\t\t\tvar attributes = Object.keys(this);\n\t\t\t\t\t\t\tvar enabledTaxonomyTerms = attributes.filter(function(attribute){\n\t\t\t\t\t\t\t\treturn 0 == attribute.indexOf('taxonomy_term_') && this[attribute];\n\t\t\t\t\t\t\t}.bind(this));\n\n\t\t\t\t\t\t\tif(0 == enabledTaxonomyTerms.length) {\n\t\t\t\t\t\t\t\treturn '(No available terms selected)';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn enabledTaxonomyTerms.reduce(function(html, enabledTaxonomyTerm) {\n\t\t\t\t\t\t\t\tvar term = taxonomyTerms.find(function(terms){\n\t\t\t\t\t\t\t\t\treturn enabledTaxonomyTerm == terms.name;\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\tif( 'undefined' == typeof term ) return html;\n\t\t\t\t\t\t\t\treturn html += '<li><input type=\"checkbox\"><div>' + term.label + '</div></li>';\n\t\t\t\t\t\t\t}.bind(this), '');\n\t\t\t\t\t\tcase 'liststate':\n\t\t\t\t\t\tcase 'listselect':\n\n\t\t\t\t\t\t\t// Check if there are any options.\n\t\t\t\t\t\t\tif(0 == this.options.models.length) return '';\n\n\t\t\t\t\t\t\t// Filter by :selected\" options.\n\t\t\t\t\t\t\tvar options = this.options.models.filter(function(option){\n\t\t\t\t\t\t\t\treturn option.get('selected');\n\t\t\t\t\t\t\t});\n\n\t\t\t\t\t\t\t// If no option set as \"selected\", then reset the previous filter.\n\t\t\t\t\t\t\tif(0 == options.length) options = this.options.models;\n\n\t\t\t\t\t\t\t// Set the first option to display in the field preview.\n\t\t\t\t\t\t\treturn '<option>' + options[0].get('label') + '</option>';\n\t\t\t\t\t\tcase 'listmultiselect':\n\t\t\t\t\t\t\treturn this.options.models.reduce(function(html, option) {\n\t\t\t\t\t\t\t\tvar selected = (option.get('selected')) ? ' selected=\"selected\"' : '';\n\t\t\t\t\t\t\t\treturn html += '<option' + selected + '>' + option.get('label') + '</option>';\n\t\t\t\t\t\t\t}, '');\n\t\t\t\t\t\tcase 'listcheckbox':\n\t\t\t\t\t\t\treturn this.options.models.reduce(function(html, option) {\n\t\t\t\t\t\t\t\tvar checked = (option.get('selected')) ? ' checked=\"checked\"' : '';\n\t\t\t\t\t\t\t\treturn html += '<li><input type=\"checkbox\"' + checked + '><div>' + option.get('label') + '</div></li>';\n\t\t\t\t\t\t\t}, '');\n\t\t\t\t\t\tcase 'listradio':\n\t\t\t\t\t\t\tvar checked = false; // External flag to only select one radio item.\n\t\t\t\t\t\t\treturn this.options.models.reduce(function(html, option) {\n\t\t\t\t\t\t\t\tchecked = (option.get('selected') && !checked) ? ' checked=\"checked\"' : '';\n\t\t\t\t\t\t\t\treturn html += '<li><input type=\"radio\"' + checked + '><div>' + option.get('label') + '</div></li>';\n\t\t\t\t\t\t\t}, '');\n\t\t\t\t\t\tcase 'listcountry':\n\t\t\t\t\t\t\tvar defaultValue = this.default;\n\t\t\t\t\t\t\tvar defaultOption = window.fieldTypeData.find(function(data) {\n\t\t\t\t\t\t\t\treturn 'listcountry' == data.id;\n\t\t\t\t\t\t\t}).settingGroups.find(function(group){\n\t\t\t\t\t\t\t\treturn 'primary' == group.id;\n\t\t\t\t\t\t\t}).settings.find(function(setting){\n\t\t\t\t\t\t\t\treturn 'default' == setting.name;\n\t\t\t\t\t\t\t}).options.find(function(option) {\n\t\t\t\t\t\t\t\treturn defaultValue == option.value;\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tvar optionLabel = ('undefined' !== typeof defaultOption ) ? defaultOption.label : '--';\n\t\t\t\t\t\t\treturn '<option>' + optionLabel + '</option>';\n\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\trenderOtherAttributes: function() {\n\t\t\t\t\tvar attributes = [];\n\t\t\t\t\tif('listmultiselect' == this.type) {\n\t\t\t\t\t\tattributes.push('multiple');\n\n\t\t\t\t\t\tvar multi_size = this.multi_size || '5';\n\t\t\t\t\t\tattributes.push('size=\"' + multi_size + '\"');\n\t\t\t\t\t}\n\n\t\t\t\t\treturn attributes.join(' ');\n\t\t\t\t},\n\t\t\t\trenderProduct: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\trenderNumberDefault: function() {\n\t\t\t\t\treturn this.value;\n\t\t\t\t},\n\t\t\t\trenderCurrencyFormatting: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\trenderRatings: function() {\n\t\t\t\t\tvar ratingOutput = '';\n\t\t\t\t\tfor (var i = 0; i < this.number_of_stars; i++) {\n\t\t\t\t\t\tratingOutput += '<i class=\"fa fa-star\" aria-hidden=\"true\"></i> ';\n\t\t\t\t\t }\n\t\t\t\t\treturn ratingOutput;\n\t\t\t\t},\n\t\t\t\trenderHourOptions: function() {\n html = '';\n let hours = 12;\n\n if ( 'undefined' != typeof this.hours_24 && 1 == this.hours_24 ) {\n hours = 24;\n }\n\n for (var i = 0; i < hours; i++) {\n let value = label = i;\n\n if ( i < 10 ) {\n value = label = '0' + i;\n }\n html += '<option value=\"' + value + '\">' + label + '</option>';\n i = i++;\n }\n\n return html;\n },\n\n renderMinuteOptions: function() {\n var html = '';\n let minute_increment = 5;\n\n if ( 'undefined' != typeof this.minute_increment ) {\n minute_increment = this.minute_increment;\n }\n\n let i = 0;\n\n while( i < 60 ) {\n let value = label = i;\n\n if ( i < 10 ) {\n value = label = '0' + i;\n }\n html += '<option value=\"' + value + '\">' + label + '</option>';\n i = i + minute_increment;\n }\n\n return html;\n },\n\n maybeRenderAMPM: function() {\n if ( 'undefined' == typeof this.hours_24 || 1 == this.hours_24 ) {\n return;\n }\n\n return '<div style=\"float:left;\"><select class=\"ampm\" style=\"float:left;\"><option value=\"am\">AM</option><option value=\"pm\">PM</option></select></div>'\n },\n \t\t\t\tmaybeRenderTime: function() {\n\t\t\t\t\tif ( 'time_only' == this.date_mode || 'date_and_time' == this.date_mode ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\t},\n\n }\n\t\t},\n\t\t\n convertDateFormat: function( dateFormat ) {\n // http://php.net/manual/en/function.date.php\n // https://github.com/dbushell/Pikaday/blob/master/README.md#formatting\n // Note: Be careful not to add overriding replacements. Order is important here.\n\n /** Day */\n dateFormat = dateFormat.replace( 'D', 'ddd' ); // @todo Ordering issue?\n dateFormat = dateFormat.replace( 'd', 'DD' );\n dateFormat = dateFormat.replace( 'l', 'dddd' );\n dateFormat = dateFormat.replace( 'j', 'D' );\n dateFormat = dateFormat.replace( 'N', '' ); // Not Supported\n dateFormat = dateFormat.replace( 'S', '' ); // Not Supported\n dateFormat = dateFormat.replace( 'w', 'd' );\n dateFormat = dateFormat.replace( 'z', '' ); // Not Supported\n\n /** Week */\n dateFormat = dateFormat.replace( 'W', 'W' );\n\n /** Month */\n dateFormat = dateFormat.replace( 'M', 'MMM' ); // \"M\" before \"F\" or \"m\" to avoid overriding.\n dateFormat = dateFormat.replace( 'F', 'MMMM' );\n dateFormat = dateFormat.replace( 'm', 'MM' );\n dateFormat = dateFormat.replace( 'n', 'M' );\n dateFormat = dateFormat.replace( 't', '' ); // Not Supported\n\n // Year\n dateFormat = dateFormat.replace( 'L', '' ); // Not Supported\n dateFormat = dateFormat.replace( 'o', 'YYYY' );\n dateFormat = dateFormat.replace( 'Y', 'YYYY' );\n dateFormat = dateFormat.replace( 'y', 'YY' );\n\n // Time - Not supported\n dateFormat = dateFormat.replace( 'a', '' );\n dateFormat = dateFormat.replace( 'A', '' );\n dateFormat = dateFormat.replace( 'B', '' );\n dateFormat = dateFormat.replace( 'g', '' );\n dateFormat = dateFormat.replace( 'G', '' );\n dateFormat = dateFormat.replace( 'h', '' );\n dateFormat = dateFormat.replace( 'H', '' );\n dateFormat = dateFormat.replace( 'i', '' );\n dateFormat = dateFormat.replace( 's', '' );\n dateFormat = dateFormat.replace( 'u', '' );\n dateFormat = dateFormat.replace( 'v', '' );\n\n // Timezone - Not supported\n dateFormat = dateFormat.replace( 'e', '' );\n dateFormat = dateFormat.replace( 'I', '' );\n dateFormat = dateFormat.replace( 'O', '' );\n dateFormat = dateFormat.replace( 'P', '' );\n dateFormat = dateFormat.replace( 'T', '' );\n dateFormat = dateFormat.replace( 'Z', '' );\n\n // Full Date/Time - Not Supported\n dateFormat = dateFormat.replace( 'c', '' );\n dateFormat = dateFormat.replace( 'r', '' );\n dateFormat = dateFormat.replace( 'u', '' );\n\n return dateFormat;\n }\n\n\t});\n\n\treturn view;\n} );\n/**\n * This is a copy of the 'views/fields/mainContentEmpty.js' file.\n * It is also the file that handles dropping new field types on our repeater field.\n * \n */\n\ndefine( 'views/fields/preview/repeaterElementEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-repeater-content-fields-empty',\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.repeaterFieldModel = data.repeaterFieldModel;\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tjQuery( this.el ).parent().removeClass( 'nf-fields-empty-droppable' ).droppable( 'destroy' );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tif ( jQuery( this.el ).parent().hasClass( 'ui-sortable' ) ) {\n\t\t\t\tjQuery( this.el ).parent().sortable( 'destroy' );\n\t\t\t}\n\t\t\tjQuery( this.el ).parent().addClass( 'nf-fields-empty-droppable' );\n\t\t\tlet that = this;\n\t\t\tjQuery( this.el ).parent().droppable( {\n\t\t\t\taccept: function( draggable ) {\n\t\t\t\t\tif ( jQuery( draggable ).hasClass( 'nf-stage' ) || jQuery( draggable ).hasClass( 'nf-field-type-button' ) ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\tactiveClass: 'nf-droppable-active',\n\t\t\t\thoverClass: 'nf-droppable-hover',\n\t\t\t\ttolerance: 'pointer',\n\n\t\t\t\tover: function( e, ui ) {\t\n\t\t\t\t\t\n\t\t\t\t\tui.item = ui.draggable;\n\t\t\t\t\tjQuery(ui.item).addClass(\"nf-over-repeater\");\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'over:fieldsSortable', ui );\n\t\t\t\t},\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\n\t\t\t\t\tui.item = ui.draggable;\n\t\t\t\t\tjQuery(ui.item).removeClass(\"nf-over-repeater\");\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'out:fieldsSortable', ui );\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * Handles the dropping of items into our EMPTY repeater field.\n\t\t\t\t * \n\t\t\t\t */\n\t\t\t\tdrop: function( e, ui ) {\n\t\t\t\t\tui.item = null != ui.item ? ui.item : ui.draggable;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'add:childField', ui, that, e );\n\t\t\t\t},\n\t\t\t} );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Collection View that outputs our repeater field collection to the screen.\n */\ndefine( 'views/fields/preview/repeaterElementCollection',[ 'views/fields/preview/repeaterElementEmpty' ], function( emptyView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\temptyView: emptyView,\n\n\t\tgetChildView: function() {\n\t\t\tlet view = nfRadio.channel( 'views' ).request( 'get:fieldItem' );\n\t\t\treturn view;\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.emptyViewOptions = {\n\t\t\t\trepeaterFieldModel: data.repeaterFieldModel,\n\t\t\t};\n\t\t\tthis.repeaterFieldModel = data.repeaterFieldModel;\n\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'init:sortable', this.initSortable, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'get:sortableEl', this.getSortableEl, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'get:repeaterFieldsCollection', this.getRepeaterFieldsCollection, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif ( this.collection.models.length > 0 ) {\n\t\t\t\tjQuery( this.el ).addClass( 'nf-field-type-droppable' );\n\t\t\t\tvar that = this;\n\t\t\t\tthis.initSortable();\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * This sortable is a copy with modifications of the main field list sortable.\n\t\t * \n\t\t * @since version\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tinitSortable: function() {\n\t\t\t// If the sortable has already been instantiated, return early.\n\t\t\tif ( 'undefined' != typeof jQuery( this.el ).sortable( 'instance' ) ) return false;\n\n\t\t\tjQuery( this.el ).addClass( 'nf-field-type-droppable' ).addClass( 'nf-fields-sortable' );\n\n\t\t\tlet that = this;\n\t\t\tjQuery( this.el ).sortable( {\n\t\t\t\tcontainment: 'parent',\n\t\t\t\thelper: 'clone',\n\t\t\t\tcancel: '.nf-item-controls',\n\t\t\t\tplaceholder: 'nf-fields-sortable-placeholder',\n\t\t\t\topacity: 0.95,\n\t\t\t\tgrid: [ 5, 5 ],\n\t\t\t\tappendTo: '#nf-main',\n\t\t\t\tscrollSensitivity: 10,\n\t\t\t\t//connectWith would allow drag and drop between fields already in the builder and the repeatable fieldset ( this is currently an issue until we deal with existing data stored)\n\t\t\t\t//connectWith: '.nf-fields-sortable', \n\n\t\t\t\treceive: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'receive:fields', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tover: function( e, ui ) {\n\t\t\t\t\tjQuery(ui.item).addClass(\"nf-over-repeater\");\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'over:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\tjQuery(ui.item).removeClass(\"nf-over-repeater\");\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'out:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'start:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tremove: function( e, ui ) {\n\t\t\t\t\t// The field is removed from repeater Fields collection and a new one is created for main Fields collection from controllers/fields/sortable/js\n\t\t\t\t\tlet droppedFieldID = jQuery( ui.item ).data( 'id' );\n\t\t\t\t\tlet collection = that.repeaterFieldModel.get( 'fields' );\n\t\t\t\t\tlet droppedFieldModel = collection.get( droppedFieldID );\n\t\t\t\t\t\n\t\t\t\t\t// Remove the field from the repeater field collection making sure we alert the user the field data is being deleted\n\t\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:delete', e, droppedFieldModel );\n\t\t\t\t},\n\t\t\t\t\n\t\t\t\t// When we update the sort order of our repeater field children, run our sort function.\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'update:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'stop:repeaterField', ui, that, e );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tdestroySortable: function() {\n\t\t\tjQuery( this.el ).sortable( 'destroy' );\n\t\t},\n\n\t\t/**\n\t\t * When we add our first child, we need to init the sortable.\n\t\t * \n\t\t * @since version\n\t\t * @param {[type]} childView [description]\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tonAddChild: function( childView ) {\n\t\t\tif ( nfRadio.channel( 'fields' ).request( 'get:adding' ) ) {\n\t\t\t\tchildView.$el.hide().show( 'clip' );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'set:adding', false);\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Get Element holding child fields\n\t\t */\n\t\tgetSortableEl: function() {\n\t\t\treturn this.el;\n\t\t},\n\n\t\t/**\n\t\t * Getter for the repeater Fields collection\n\t\t */\n\t\tgetRepeaterFieldsCollection: function() {\n\t\t\treturn this.repeaterFieldModel.get( 'fields' );\n\t\t}\n\t\t\n\t} );\n\n\treturn view;\n} );\n\ndefine( 'views/fields/preview/repeaterElementLayout',[ 'views/fields/preview/repeaterElementCollection' ], function( previewRepeaterElementCollectionView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-field-repeater',\n\n\t\tregions: {\n\t\t\tfields: '.nf-repeater-fieldsets',\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.collection = data.collection;\n\t\t\tthis.model = data.model;\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t// Populate the fields region with our collection view.\n\t\t\tthis.fields.show( new previewRepeaterElementCollectionView( { collection: this.collection, repeaterFieldModel: this.model } ) );\n\t\t},\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/preview/label',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-field-label',\n\n\t\tinitialize: function( data ) {\n\t\t\t// this.$el = jQuery( data.itemView.el ).find( '.nf-realistic-field--label' );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t// ...\n\t\t\t// console.log( jQuery( this.$el ) );\n\t\t},\n \n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderLabelClasses: function() {\n // ...\n },\n maybeRenderHelp: function() {\n // ...\n }\n }\n }\n\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/fieldItem',['views/app/itemControls', 'views/fields/preview/element', 'views/fields/preview/repeaterElementLayout', 'views/fields/preview/label'], function( itemControlsView, previewElementView, previewRepeaterElementView, previewLabelView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-content-field',\n\t\tdoingShortcut: false,\n\n\t\tregions: {\n\t\t\titemControls: '.nf-item-controls',\n\t\t\tpreviewLabel: '.nf-realistic-field--label',\n\t\t\tpreviewElement: '.nf-realistic-field--element',\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:editActive', this.render, this );\n\t\t\tthis.model.on( 'change:label', this.render, this );\n\t\t\tthis.model.on( 'change:required', this.render, this );\n\t\t\tthis.model.on( 'change:id', this.render, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:editActive', this.render );\n\t\t\tthis.model.off( 'change:label', this.render );\n\t\t\tthis.model.off( 'change:required', this.render );\n\t\t\tthis.model.off( 'change:id', this.render );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\n\t\t\tthis.itemControls.show( new itemControlsView( { model: this.model } ) );\n\t\t\tjQuery( this.el ).disableSelection();\n\n\t\t\tvar type = this.model.get('type');\n\t\t\tif('phone' == type) type = 'tel';\n\t\t\tif('spam' == type) type = 'input';\n\t\t\t// if('date' == type) type = 'input';\n\t\t\tif('confirm' == type) type = 'input';\n\t\t\tif('password' == type) type = 'input';\n\t\t\tif('passwordconfirm' == type) type = 'input';\n\t\t\tif('quantity' == type) type = 'number';\n\t\t\tif('terms' == type) type = 'listcheckbox';\n\t\t\tif('liststate' == type) type = 'listselect';\n\t\t\tif('listcountry' == type) type = 'listselect';\n\t\t\tif('listmultiselect' == type) type = 'listselect';\n\t\t\tif('save' == type) type = 'submit';\n\n\t\t\t// Only show preview / realisitic fields when not `html`, `hidden`, `note`, or `recaptcha`.\n\t\t\tvar previewFieldTypeBlacklist = ['html', 'hidden', 'note', 'recaptcha'];\n\t\t\tvar isFieldTypeTemplateAvailable = jQuery('#tmpl-nf-field-' + type).length;\n\t\t\tif(-1 == previewFieldTypeBlacklist.indexOf(this.model.get('type')) && isFieldTypeTemplateAvailable) {\n\t\t\t\t\n\t\t\t\t// If we have a repeater field, then we have to load a specific collection view.\n\t\t\t\tif ( 'repeater' == type ) {\n\t\t\t\t\tthis.previewElement.show( new previewRepeaterElementView( { collection: this.model.get( 'fields' ), model: this.model } ) );\n\t\t\t\t} else {\n\t\t\t\t\tthis.previewElement.show( new previewElementView( { model: this.model } ) );\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t// Only show the preview label when not `submit`, or `hr`.\n\t\t\t\tvar showLabelFieldTypeBlacklist = ['submit', 'save', 'hr'];\n\t\t\t\tif(-1 == showLabelFieldTypeBlacklist.indexOf(this.model.get('type'))) {\n\t\t\t\t\tthis.previewLabel.show( new previewLabelView( { model: this.model, itemView: this } ) );\n\t\t\t\t}\n\n\t\t\t\tjQuery( this.el ).find('.nf-placeholder-label').hide();\n\t\t\t}\n\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( this.el ).on( 'taphold', function( e, touch ) {\n\t\t\t\t\tif ( ! jQuery( e.target ).hasClass( 'nf-edit-settings' ) ) {\n\t\t\t\t\t\tjQuery( this ).addClass( 'ui-sortable-helper drag-selected' );\n\t\t\t\t\t\tjQuery( this ).ClassyWiggle( 'start', { degrees: ['.65', '1', '.65', '0', '-.65', '-1', '-.65', '0'], delay: 50 } );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'fields-' + type ).trigger( 'render:itemView', this );\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderClasses: function() {\n\t \t\t\tvar classes = 'nf-field-wrap ' + this.type;\n\t \t\t\tif ( this.editActive ) {\n\t \t\t\t\tclasses += ' active';\n\t \t\t\t}\n\t \t\t\treturn classes;\n\t \t\t},\n\t \t\trenderRequired: function() {\n\t \t\t\tif ( 1 == this.required ) {\n\t \t\t\t\treturn '<span class=\"required\">*</span>';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t},\n\t \t\tgetFieldID: function() {\n\t\t\t\t\tif ( jQuery.isNumeric( this.id ) ) {\n\t\t\t\t\t\treturn 'field-' + this.id;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn this.id;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\trenderIcon: function() {\n\t \t\t\tvar type, icon;\n\n\t\t\t\t\ttype = nfRadio.channel( 'fields' ).request( 'get:type', this.type );\n\n\t\t\t\t\ticon = document.createElement( 'span' );\n\t\t\t\t\ticon.classList.add( 'fa', 'fa-' + type.get( 'icon' ) );\n\n\t\t\t\t\treturn icon.outerHTML;\n\t\t\t\t},\n\t\t\t\tlabelPosition: function() {\n\t\t\t\t\treturn this.label_pos;\n\t\t\t\t},\n\t\t\t\trenderDescriptionText: function() {\n\t\t\t\t\treturn jQuery.trim(this.desc_text);\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\n\t\tevents: {\n\t\t\t'mouseover .nf-item-control': 'mouseoverItemControl',\n\t\t\t'mousedown': 'maybeShortcut',\n\t\t\t'click': 'maybeClickEdit',\n\t\t\t'singletap': 'maybeTapEdit',\n\t\t\t'swipeleft': 'swipeLeft',\n\t\t\t'swiperight': 'swipeRight',\n\t\t\t'tapend': 'tapend'\n\t\t},\n\n\t\tmaybeClickEdit: function( e ) {\n\t\t\tif ( this.doingShortcut ) {\n\t\t\t\tthis.doingShortcut = false;\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\tif ( ( jQuery( e.target ).parent().hasClass( 'nf-fields-sortable' ) || jQuery( e.target ).parent().hasClass( 'nf-field-wrap' ) || jQuery( e.target ).hasClass( 'nf-field-wrap' ) ) && ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( ':focus' ).blur();\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tmaybeShortcut: function( e ) {\n\t\t\tvar keys = nfRadio.channel( 'app' ).request( 'get:keydown' );\n\t\t\t/*\n\t\t\t * If the shift key isn't held down, return.\n\t\t\t */\n\t\t\tif ( -1 == keys.indexOf( 16 ) ) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\t/*\n\t\t\t * If we are pressing D, delete this field.\n\t\t\t */\n\t\t\tif ( -1 != keys.indexOf( 68 ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:delete', e, this.model );\n\t\t\t\tthis.doingShortcut = true;\n\t\t\t\treturn false;\n\t\t\t} else if ( -1 != keys.indexOf( 67 ) ) {\n\t\t\t\tthis.doingShortcut = true;\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:duplicate', e, this.model );\n\t\t\t\treturn false;\n\t\t\t}\n\t\t},\n\n\t\tmaybeTapEdit: function( e ) {\n\t\t\tif ( jQuery( e.target ).parent().hasClass( 'nf-fields-sortable' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tswipeLeft: function( e, touch ) {\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-duplicate' ).show();\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-delete' ).show();\n\t\t},\n\n\t\tswipeRight: function( e, touch ) {\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-duplicate' ).hide();\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-delete' ).hide();\n\t\t},\n\n\t\ttapend: function( e, touch ) {\n\t\t\tjQuery( this.el ).ClassyWiggle( 'stop' );\n\t\t\tjQuery( this.el ).removeClass( 'ui-sortable-helper drag-selected' );\n\t\t},\n\n\t\tremove: function(){\n\t\t\tif ( nfRadio.channel( 'fields' ).request( 'get:removing' ) ) {\n\t\t\t\tthis.$el.hide( 'clip', function(){\n\t\t\t\t\tjQuery( this ).remove();\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tthis.$el.remove();\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'fields' ).request( 'set:removing', false );\n\t\t},\n\n\t\tmouseoverItemControl: function( e ) {\n\t\t\tjQuery( this.el ).find( '.nf-item-control' ).css( 'display', '' );\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n/**\n * Handles all the actions/functions related to our main field sortable.\n * All of the actual logic for our sortable is held here; the view just calls it using nfRadio.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/sortable',['models/fields/fieldModel', 'views/fields/fieldItem'], function(FieldModel, FieldItemView) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// When our field type buttons are dragged, we need to add or remove the active (blue) class.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:type', this.addActiveClass );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:type', this.removeActiveClass );\n\t\t\t// When our field staging is dragged, we need to add or remove the active (blue) class.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:fieldStaging', this.addActiveClass );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:fieldStaging', this.removeActiveClass );\n\t\t\t\n\t\t\t/*\n\t\t\t * Handles all the events fired by our sortable:\n\t\t\t * receive - dropped from type button or staging\n\t\t\t * over - dragging within or over the sortable\n\t\t\t * out - leaving the sortable\n\t\t\t * stop - stopped sorting/dragging\n\t\t\t * start - started sorting/dragging\n\t\t\t * update - stopped sorting/dragging and order has changed\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'receive:fieldsSortable', this.receiveFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'over:fieldsSortable', this.overfieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'out:fieldsSortable', this.outFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'stop:fieldsSortable', this.stopFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'start:fieldsSortable', this.startFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:fieldsSortable', this.updateFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'receive:repeaterField', this.receiveRepeaterField, this );\n\t\t},\n\n\t\t/**\n\t\t * Add the active class to our sortable so that its border is blue.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\taddActiveClass: function() {\n\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\tjQuery( sortableEl ).addClass( 'nf-droppable-active' );\t\n\t\t},\n\n\t\t/**\n\t\t * Remove the active class from our sortable\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tremoveActiveClass: function() {\n\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-active' );\n\t\t},\n\n\t\t/**\n\t\t * Fires when we drop a field type button or staging onto our sortable\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\treceiveFieldsSortable: function( ui ) {\n\t\t\t//Check for fields coming from a repeater field\n\t\t\tui = this.receiveRepeaterField(ui);\n\t\t\t/*\n\t\t\t * We have to do different things if we're dealing with a field type button or staging area.\n\t\t\t */ \n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type Button\n\t\t\t\t// Get our type string\n\t\t\t\tvar type = jQuery( ui.item ).data( 'id' );\n\t\t\t\t// Add a field (returns the tmp ID )\n\t\t\t\tvar tmpID = this.addField( type, false );\n\t\t\t\t/*\n\t\t\t\t * Update our helper id to the tmpID.\n\t\t\t\t * We do this so that when we sort, we have the proper ID.\n\t\t\t\t */ \n\t\t\t\tjQuery( ui.helper ).prop( 'id', tmpID );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields' );\n\t\t\t\t// Remove the helper. Gets rid of a weird type artifact.\n\t\t\t\tjQuery( ui.helper ).remove();\n\t\t\t\t// Trigger a drop field type event.\n\t\t\t\tnfRadio.channel( 'fields' ).trigger( 'drop:fieldType', type, tmpID );\n\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// Later, we want to reference 'this' context, so we define it here.\n\t\t\t\tvar that = this;\n\t\t\t\t// Make sure that our staged fields are sorted properly.\t\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:staging' );\n\t\t\t\t// Grab our staged fields.\n\t\t\t\tvar stagedFields = nfRadio.channel( 'fields' ).request( 'get:staging' );\n\t\t\t\t// Get our current field order.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\t\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) { // Sortable isn't empty\n\t\t\t\t\t// If we're dealing with a sortable that isn't empty, get the order.\n\t\t\t\t\tvar order = jQuery( sortableEl ).sortable( 'toArray' );\n\t\t\t\t} else { // Sortable is empty\n\t\t\t\t\t// Sortable is empty, all we care about is our staged field draggable.\n\t\t\t\t\tvar order = ['nf-staged-fields-drag'];\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t// Get the index of our droped element.\n\t\t\t\tvar insertedAt = order.indexOf( 'nf-staged-fields-drag' );\n\n\t\t\t\t// Loop through each staged fields model and insert a field.\n\t\t\t\tvar tmpIDs = [];\n\t\t\t\t_.each( stagedFields.models, function( field, index ) {\n\t\t\t\t\t// Add our field.\n\t\t\t\t\tvar tmpID = that.addField( field.get( 'slug' ) );\n\t\t\t\t\t// Add this newly created field to our order array.\n\t\t\t\t\torder.splice( insertedAt + index, 0, tmpID );\n\t\t\t\t} );\n\n\t\t\t\t// Remove our dropped element from our order array.\n\t\t\t\tvar insertedAt = order.indexOf( 'nf-staged-fields-drag' );\n\t\t\t\torder.splice( insertedAt, 1 );\n\t\t\t\t// Sort our fields\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields', order );\n\t\t\t\t// Clear our staging\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'clear:staging' );\n\t\t\t\t// Remove our helper. Fixes a weird artifact.\n\t\t\t\tjQuery( ui.helper ).remove();\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add a field.\n\t\t * Builds the object necessary to add a field to the field model collection.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string \ttype field type\n\t\t * @param boolean \tsilent add silently\n\t\t * @return string \ttmpID\n\t\t */\n\t\taddField: function( type, silent ) {\n\t\t\t// Default to false\n\t\t\tsilent = silent || false;\n\t\t\t// Get our field type model\n\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type ); \n\t\t\t// Get our tmp ID\n\t\t\tvar tmpID = nfRadio.channel( 'fields' ).request( 'get:tmpID' );\n\t\t\t// Add our field\n\t\t\tvar newModel = nfRadio.channel( 'fields' ).request( 'add', { id: tmpID, label: fieldType.get( 'nicename' ), type: type }, silent );\n\t\t\t// Add our field addition to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: 'Field',\n\t\t\t\tlabel: newModel.get( 'label' ),\n\t\t\t\tchange: 'Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: nfRadio.channel( 'fields' ).request( 'get:collection' )\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', newModel, null, label, data );\n\n\t\t\treturn tmpID;\n\t\t},\n\n\t\t/**\n\t\t * When the user drags a field type or staging over our sortable, we need to modify the helper.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toverfieldsSortable: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type\n\t\t\t\t// String type\n\t\t\t\tvar type = jQuery( ui.helper ).data( 'id' );\n\t\t\t\t// Get our field type model.\n\t\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\t\t\t\t// Get our field type nicename.\n\t\t\t\tvar label = fieldType.get( 'nicename' );\n\t\t\t\t// Get our sortable element.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\t// Get our fieldwidth.\n\t\t\t\tvar fieldWidth = jQuery( sortableEl ).width();\n\t\t\t\t// Set our currentHelper to an object var so that we can access it later.\n\t\t\t\tthis.currentHelper = ui.helper;\n\n\t\t\t\t// Render a fieldItemView using a mock fieldModel.\n\t\t\t\tvar fieldModel = new FieldModel({ label: fieldType.get( 'nicename' ), type: type });\n\t\t\t\tvar fieldItemView = new FieldItemView({model:fieldModel});\n\t\t\t\tvar renderedFieldItemView = fieldItemView.render();\n\t\t\t\tvar fieldTypeEl = renderedFieldItemView.$el[0];\n\t\t\t\tjQuery( ui.helper ).html( fieldTypeEl.outerHTML );\n\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// Get our sortable, and if it's initialized add our hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).addClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When the user moves a draggable outside of the sortable, we need to change the helper.\n\t\t * This returns the item to its pre-over state.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toutFieldsSortable: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type\n\t\t\t\t/*\n\t\t\t\t * Get our helper clone.\n\t\t\t\t * This will let us access the previous label and classes of our helper.\n\t\t\t\t */ \n\t\t\t\tvar helperClone = nfRadio.channel( 'drawer-addField' ).request( 'get:typeHelperClone' );\n\t\t\t\t// Set our helper label, remove our sortable class, and add the type class back to the type draggable.\n\t\t\t\tjQuery( this.currentHelper ).html( jQuery( helperClone ).html() );\n\t\t\t\tjQuery( this.currentHelper ).removeClass( 'nf-field-wrap' ).addClass( 'nf-field-type-button' ).css( { 'width': '', 'height': '' } );\n\t\t\t\t// Get our sortable and if it has been intialized, remove the droppable hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// If we've initialized our sortable, remove the droppable hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging in the sortable:\n\t\t * remove our opacity setting\n\t\t * remove our ui helper\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopFieldsSortable: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t\tjQuery( ui.helper ).remove();\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'sortable:stop', ui );\n\t\t},\n\n\t\t/**\n\t\t * When we start dragging in the sortable:\n\t\t * add an opacity setting of 0.5\n\t\t * show our item (jQuery hides the original item by default)\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartFieldsSortable: function( ui ) {\n\t\t\t// If we aren't dragging an item in from types or staging, update our change log.\n\t\t\tif( ! jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) && ! jQuery( ui.item ).hasClass( 'nf-stage' ) ) { \n\t\t\t\t\n\t\t\t\t// Maintain origional visibility during drag/sort.\n\t\t\t\tjQuery( ui.item ).show();\n\n\t\t\t\t// Determine helper based on builder/layout type.\n\t\t\t\tif(jQuery(ui.item).hasClass('nf-field-wrap')){\n\t\t\t\t\tvar newHelper = jQuery(ui.item).clone();\n\t\t\t\t} else if(jQuery(ui.item).parent().hasClass('layouts-cell')) {\n\t\t\t\t\tvar newHelper = $parentHelper.clone();\n\t\t\t\t} else {\n\t\t\t\t\tvar newHelper = jQuery(ui.item).clone();\n\t\t\t\t}\n\n\t\t\t\t// Remove unecessary item controls from helper.\n\t\t\t\tnewHelper.find('.nf-item-controls').remove();\n\n\t\t\t\t// Update helper with clone's content.\n\t\t\t\tjQuery( ui.helper ).html( newHelper.html() );\n\n\t\t\t\tjQuery( ui.helper ).css( 'opacity', '0.5' );\n\t\t\t\t\n\t\t\t\t// Add de-emphasize origional.\n\t\t\t\tjQuery( ui.item ).css( 'opacity', '0.25' );\n\t\t\t}\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'sortable:start', ui );\n\t\t},\n\n\t\t/**\n\t\t * Sort our fields when we change the order.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tupdateFieldsSortable: function( ui, sortable ) {\n\t\t\t\n\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields' );\n\n\t\t\t// If we aren't dragging an item in from types or staging, update our change log.\n\t\t\tif( ! jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) && ! jQuery( ui.item ).hasClass( 'nf-stage' ) ) { \n\n\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t\tvar dragFieldID = jQuery( ui.item ).prop( 'id' ).replace( 'field-', '' );\n\t\t\t\tvar dragModel = fieldCollection.get( dragFieldID );\n\n\t\t\t\t// Add our change event to the change tracker.\n\t\t\t\tvar data = { fields: [] };\n\t\t\t\t_.each( fieldCollection.models, function( field ) {\n\t\t\t\t\tvar oldPos = field._previousAttributes.order;\n\t\t\t\t\tvar newPos = field.get( 'order' );\n\t\t\t\t\t\n\t\t\t\t\tdata.fields.push( {\n\t\t\t\t\t\tmodel: field,\n\t\t\t\t\t\tattr: 'order',\n\t\t\t\t\t\tbefore: oldPos,\n\t\t\t\t\t\tafter: newPos\n\t\t\t\t\t} );\n\n\t\t\t\t} );\n\n\t\t\t\tvar label = {\n\t\t\t\t\tobject: 'Field',\n\t\t\t\t\tlabel: dragModel.get( 'label' ),\n\t\t\t\t\tchange: 'Re-ordered from ' + dragModel._previousAttributes.order + ' to ' + dragModel.get( 'order' ),\n\t\t\t\t\tdashicon: 'sort'\n\t\t\t\t};\n\n\t\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'sortFields', dragModel, null, label, data );\n\t\t\t}\n\n\t\t},\n\n\t\treceiveRepeaterField: function( ui ){\n\t\t\t//If the field was already saved as a Repeater child field we'll delete it and create a new one for the main collection\n\t\t\tif( String( jQuery( ui.item ).data('id') ).indexOf('.') !== -1){\n\t\t\t\tjQuery( ui.item ).removeClass('nf-field-wrap');\n\t\t\t\tlet type = jQuery( ui.item ).attr('class');\n\t\t\t\tjQuery( ui.item ).data('id', type);\n\t\t\t\tjQuery( ui.item ).addClass('nf-field-type-draggable');\n\t\t\t}\n\n\t\t\treturn ui;\n\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles interactions with our field collection.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/data',['models/fields/fieldCollection', 'models/fields/fieldModel'], function( fieldCollection, fieldModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tadding: false,\n\t\tremoving: false,\n\t\t\n\t\tinitialize: function() {\n\t\t\t// Load our field collection from our localized form data\n\t\t\tthis.collection = new fieldCollection( preloadedFormData.fields );\n\t\t\t// Set our removedIDs to an empty object. This will be populated when a field is removed so that we can add it to our 'deleted_fields' object.\n\t\t\tthis.collection.removedIDs = {};\n\n\t\t\t// Respond to requests for data about fields and to update/change/delete fields from our collection.\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:collection', this.getFieldCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:field', this.getField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'redraw:collection', this.redrawFieldCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:tmpID', this.getTmpFieldID, this );\n\n\t\t\tnfRadio.channel( 'fields' ).reply( 'add', this.addField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'delete', this.deleteField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'sort:fields', this.sortFields, this );\n\n\t\t\t/*\n\t\t\t * Respond to requests to set our 'adding' and 'removing' state. This state is used to track whether or not\n\t\t\t * we should run animations in our fields collection.\n\t\t\t */\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:adding', this.getAdding, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'set:adding', this.setAdding, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:removing', this.getRemoving, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'set:removing', this.setRemoving, this );\n\t\t},\n\n\t\tgetFieldCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tredrawFieldCollection: function() {\n\t\t\tthis.collection.trigger( 'reset', this.collection );\n\t\t},\n\n\t\tgetField: function( id ) {\n\t\t\tif ( this.collection.findWhere( { key: id } ) ) {\n\t\t\t\t/*\n\t\t\t\t * First we check to see if a key matches what we were sent.\n\t\t\t\t */\t\t\t\t\n\t\t\t\treturn this.collection.findWhere( { key: id } );\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t * If it doesn't, we try to return an ID that matches.\n\t\t\t\t */\n\t\t\t\treturn this.collection.get( id );\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add a field to our collection. If silent is passed as true, no events will trigger.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tdata \t\t\tfield data to insert\n\t\t * @param bool \t\tsilent \t\t\tprevent events from firing as a result of adding\n\t\t * @param bool \trenderTrigger\tshould this cause the view to re-render?\n\t\t * @param string \taction\t\t\taction context - are we performing a higher level action? i.e. duplicate\n\t\t */\n\t\taddField: function( data, silent, renderTrigger, action ) {\n\n\t\t\t/*\n\t\t\t * Set our fields 'adding' value to true. This enables our add field animation.\n\t\t\t */\n\t\t\tnfRadio.channel( 'fields' ).request( 'set:adding', true );\n\n\t\t\tsilent = silent || false;\n\t\t\taction = action || '';\n\t\t\trenderTrigger = ( 'undefined' == typeof renderTrigger ) ? true : renderTrigger;\n\n\t\t\tif ( false === data instanceof Backbone.Model ) {\n\t\t\t\tif ( 'undefined' == typeof ( data.id ) ) {\n\t\t\t\t\tdata.id = this.getTmpFieldID();\n\t\t\t\t}\n\t\t\t\tvar model = new fieldModel( data );\n\t\t\t} else {\n\t\t\t\tvar model = data;\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * TODO: Add an nfRadio message filter for the model variable.\n\t\t\t * Currently, we manually replace for saved fields; this should be moved to a separate controller.\n\t\t\t * \n\t\t\t * If we're adding a saved field, make sure that we set the type to the parentType.\n\t\t\t */\n\n\t\t\tif ( jQuery.isNumeric( model.get( 'type' ) ) ) {\n\t\t\t\tvar savedType = nfRadio.channel( 'fields' ).request( 'get:type', model.get( 'type' ) );\n\t\t\t\tmodel.set( 'type', savedType.get( 'parentType' ) );\n\t\t\t}\n\n\t\t\tvar newModel = this.collection.add( model, { silent: silent } );\n\t\t\t\n\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'add:field', model );\n\t\t\tif ( renderTrigger ) {\n\t\t\t\tnfRadio.channel( 'fields' ).trigger( 'render:newField', newModel, action );\n\t\t\t}\n\t\t\tif( 'duplicate' == action ){\n nfRadio.channel( 'fields' ).trigger( 'render:duplicateField', newModel, action );\n\t\t\t}\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'after:addField', model );\n\t\t\t\n\t\t\treturn model;\n\t\t},\n\n\t\t/**\n\t\t * Update a field setting by ID\n\t\t * \n\t\t * @since 3.0\n\t\t * @param int \t\tid field id\n\t\t * @param string \tname setting name\n\t\t * @param mixed \tvalue setting value\n\t\t * @return void\n\t\t */\n\t\tupdateFieldSetting: function( id, name, value ) {\n\t\t\tvar fieldModel = this.collection.get( id );\n\t\t\tfieldModel.set( name, value );\n\t\t},\n\n\t\t/**\n\t\t * Get our fields sortable EL\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Array \torder optional order array like: [field-1, field-4, field-2]\n\t\t * @return void\n\t\t */\n\t\tsortFields: function( order, ui, updateDB ) {\n\t\t\tif ( null == updateDB ) {\n\t\t\t\tupdateDB = true;\n\t\t\t}\n\t\t\t// Get our sortable element\n\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) { // Make sure that sortable is enabled\n\t\t\t\t// JS ternerary for setting our order\n\t\t\t\tvar order = order || jQuery( sortableEl ).sortable( 'toArray' );\n\n\t\t\t\t// Loop through all of our fields and update their order value\n\t\t\t\t_.each( this.collection.models, function( field ) {\n\t\t\t\t\t// Get our current position.\n\t\t\t\t\tvar oldPos = field.get( 'order' );\n\t\t\t\t\tvar id = field.get( 'id' );\n\t\t\t\t\tif ( jQuery.isNumeric( id ) ) {\n\t\t\t\t\t\tvar search = 'field-' + id;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tvar search = id;\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\t// Get the index of our field inside our order array\n\t\t\t\t\tvar newPos = order.indexOf( search ) + 1;\n\t\t\t\t\tfield.set( 'order', newPos );\n\t\t\t\t} );\n\t\t\t\tthis.collection.sort();\n\n\t\t\t\tif ( updateDB ) {\n\t\t\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\t\t\t// Update our preview\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\t\t\t\t\t\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Delete a field from our collection.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \tfield model to be deleted\n\t\t * @return void\n\t\t */\n\t\tdeleteField: function( model ) {\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'delete:field', model );\n\t\t\tthis.removing = true;\n\t\t\tthis.collection.remove( model );\n\n\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\n\t\t},\n\n\t\t/**\n\t\t * Return a new tmp id for our fields.\n\t\t * Gets the field collection length, adds 1, then returns that prepended with 'tmp-'.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return string\n\t\t */\n\t\tgetTmpFieldID: function() {\n\t\t\tvar tmpNum = this.collection.tmpNum;\n\t\t\tthis.collection.tmpNum++;\n\t\t\treturn 'tmp-' + tmpNum;\n\t\t},\n\n\t\tgetAdding: function() {\n\t\t\treturn this.adding;\n\t\t},\n\n\t\tsetAdding: function( val ) {\n\t\t\tthis.adding = val;\n\t\t},\n\n\t\tgetRemoving: function() {\n\t\t\treturn this.removing;\n\t\t},\n\n\t\tsetRemoving: function( val ) {\n\t\t\tthis.removing = val;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Model for our repeater option.\n * \n * @package Ninja App builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/optionRepeaterModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\terrors: {},\n max_options: 0,\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// When we add errors to the option row, run a function.\n\t\t\tthis.on( 'change:errors', this.changeErrors, this );\n\t\t},\n\n\t\t/**\n\t\t * When we change the errors on our model, check to see if we should add or remove \n\t\t * the error from the setting that this option is a part of.\n\t\t *\n\t\t * Adding an error to the setting model simply disables the drawer and other\n\t\t * navigation. As long as we have one option with an error, it should be set to true.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tchangeErrors: function( model ) {\n\t\t\t/*\n\t\t\t * The errors attribute will be an object, so if we don't have any keys, it's empty.\n\t\t\t * If we have an empty object, check to see if we can remove the error from our setting model.\n\t\t\t */\n\n\t\t\tif ( 0 == _.size( model.get( 'errors' ) ) ) {\n\t\t\t\t/*\n\t\t\t\t * Loop through our collection to see if we have any other errors.\n\t\t\t\t */\n\t\t\t\tvar errorsFound = false;\n\t\t\t\t_.each( model.collection.models, function( opt ) {\n\t\t\t\t\tif ( 0 != _.size( opt.get( 'errors' ) ) ) {\n\t\t\t\t\t\terrorsFound = true;\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\tif ( ! errorsFound ) {\n\t\t\t\t\tmodel.collection.settingModel.set( 'error', false );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t * We have errors, so make sure that the setting model has an error set.\n\t\t\t\t */\n\t\t\t\tmodel.collection.settingModel.set( 'error', true );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Model that represents our list options.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/optionRepeaterCollection',['models/app/optionRepeaterModel'], function( listOptionModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: listOptionModel,\n\t\tcomparator: function( model ){\n\t\t\treturn parseInt( model.get( 'order' ) );\n\t\t},\n\n\t\tinitialize: function( models, options ) {\n\t\t\t// Listen to the 'sort' event\n\t\t\tthis.on( 'sort', this.changeCollection, this );\n\t\t\t// Listen to the 'add' event\n\t\t\tthis.on( 'add', this.addOption, this );\n\t\t\tthis.settingModel = options.settingModel;\n\t\t},\n\n\t\tchangeCollection: function() {\n\t\t\t// Trigger a 'sort:options' event so that our field model can update\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'sort:options', this );\n\n\t\t\tif ('undefined' !== typeof this.settingModel ) {\n\t\t\t\tnfRadio.channel('option-repeater-' + this.settingModel.get('name')).trigger('sort:options', this);\n\t\t\t}\n\t\t},\n\n\t\taddOption: function( model, collection ) {\n\t\t\tmodel.set( 'settingModel', this.settingModel );\n\t\t}\n\t} );\n\treturn collection;\n} );\ndefine( 'views/app/drawer/optionRepeaterError',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\tclassName: 'nf-error',\n\t\ttemplate: '#tmpl-nf-edit-setting-option-repeater-error',\n\n\t\ttemplateHelpers: function() {\n\t\t\tvar that = this;\n\t\t\treturn {\n\t\t\t\trenderErrors: function() {\n\t\t\t\t if ( 'undefined' != typeof that.errors ) {\n \t\t\t\t\treturn that.errors[ Object.keys( errors )[0] ];\n \t\t\t\t\t} else {\n \t\t\t\t\t\treturn '';\n \t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/optionRepeaterOption',['views/app/drawer/optionRepeaterError'], function( ErrorView ) {\n var view = Marionette.LayoutView.extend({\n tagName: 'div',\n className: 'nf-table-row',\n template: '#tmpl-nf-edit-setting-option-repeater-default-row',\n id: function() {\n return this.model.cid;\n },\n\n regions: {\n error: '.nf-option-error'\n },\n\n initialize: function( data ) {\n this.settingModel = data.settingModel;\n this.dataModel = data.dataModel;\n this.collection = data.collection;\n this.columns = data.columns;\n this.parentView = data.parentView;\n this.model.on( 'change:errors', this.renderErrors, this );\n\n // Removed because the re-render was breaking tag insertion for merge tags.\n // this.model.on( 'change', this.render, this );\n\n if ( 'undefined' != typeof this.settingModel.get( 'tmpl_row' ) ) {\n this.template = '#' + this.settingModel.get( 'tmpl_row' );\n }\n\n this.hasErrors = false;\n },\n\n onBeforeDestroy: function() { \n this.model.off( 'change', this.render );\n this.model.off( 'change:errors', this.renderErrors );\n },\n\n onBeforeRender: function() {\n /*\n * We want to escape any HTML being output for our label.\n */\n if ( this.model.get( 'label' ) ) {\n var label = this.model.get( 'label' );\n this.model.set( 'label', _.escape( label ), { silent: true } );\n }\n \n },\n\n onRender: function() {\n nfRadio.channel( 'mergeTags' ).request( 'init', this );\n /*\n * Send out a radio message.\n */\n nfRadio.channel( 'setting-' + this.settingModel.get( 'name' ) + '-option' ).trigger( 'render:setting', this.model, this.dataModel, this );\n /*\n * We want to unescape any HTML being output for our label.\n */\n if ( this.model.get( 'label' ) ) {\n var label = this.model.get( 'label' );\n this.model.set( 'label', _.unescape( label ), { silent: true } );\n }\n },\n\n onShow: function() {\n if ( this.model.get( 'new' ) ) {\n jQuery( this.el ).find( 'input:first' ).focus();\n this.model.set( 'new', false );\n }\n },\n\n events: {\n 'change .setting': 'changeOption',\n 'click .nf-delete': 'deleteOption',\n 'keyup': 'keyupOption'\n },\n\n changeOption: function( e ) {\n nfRadio.channel( 'option-repeater' ).trigger( 'change:option', e, this.model, this.dataModel, this.settingModel, this );\n },\n\n deleteOption: function( e ) {\n nfRadio.channel( 'option-repeater' ).trigger( 'click:deleteOption', this.model, this.collection, this.dataModel, this );\n },\n\n keyupOption: function( e ) {\n this.maybeAddOption( e );\n nfRadio.channel( 'option-repeater' ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n nfRadio.channel( 'option-repeater-' + this.settingModel.get( 'name' ) ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n },\n\n maybeAddOption: function( e ) {\n if ( 13 == e.keyCode && 'calculations' != this.settingModel.get( 'name' ) ) {\n nfRadio.channel( 'option-repeater' ).trigger( 'click:addOption', this.collection, this.dataModel, this );\n jQuery( this.parentView.children.findByIndex(this.parentView.children.length - 1).el ).find( '[data-id=\"label\"]' ).focus();\n }\n },\n\n renderErrors: function() {\n \n // if ( jQuery.isEmptyObject( this.model.get( 'errors' ) ) ) {\n // return false;\n // }\n\n /*\n * We don't want to redraw the entire row, which would remove focus from the eq textarea,\n * so we add and remove error classes manually.\n */\n if ( 0 == Object.keys( this.model.get( 'errors' ) ) ) {\n if ( this.hasErrors ) {\n this.error.empty();\n jQuery( this.el ).removeClass( 'nf-error' );\n }\n } else {\n this.hasErrors = true;\n this.error.show( new ErrorView( { model: this.model } ) );\n jQuery( this.el ).addClass( 'nf-error' );\n }\n },\n\n templateHelpers: function() {\n var that = this;\n return {\n getColumns: function() {\n var columns = that.columns;\n if(!nfAdmin.devMode){\n delete columns.value;\n delete columns.calc;\n }\n return columns;\n },\n renderFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, label;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.label = '--';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n fields.each( function( field ){\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.label = field.formatLabel();\n select.appendChild( option );\n });\n\n label = document.createElement( 'label' );\n label.classList.add( 'nf-select' );\n label.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n label.appendChild( emptyContainer );\n\n // The template requires a string.\n return label.innerHTML;\n },\n renderNonSaveFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, label;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.label = '--';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n // Build a lookup table for fields we want to remove from our fields list.\n var removeFieldsLookup = [ 'html', 'submit', 'hr',\n 'recaptcha', 'spam', 'creditcard', 'creditcardcvc',\n 'creditcardexpiration', 'creditcardfullname',\n 'creditcardnumber', 'creditcardzip' ];\n\n fields.each( function( field ){\n // Check for the field type in our lookup array and...\n if( jQuery.inArray( field.get( 'type' ), removeFieldsLookup ) !== -1 ) {\n // Return if the type is in our lookup array.\n return '';\n }\n\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.label = field.formatLabel();\n select.appendChild( option );\n });\n\n label = document.createElement( 'label' );\n label.classList.add( 'nf-select' );\n label.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n label.appendChild( emptyContainer );\n\n // The template requires a string.\n return label.innerHTML;\n },\n renderOptions: function( column, value ) {\n\n if( 'undefined' == typeof that.options.columns[ column ] ) return;\n\n var select = document.createElement( 'select' );\n \n _.each( that.options.columns[ column ].options, function( option ){\n var optionNode = document.createElement( 'option' );\n if ( value === option.value ) {\n optionNode.setAttribute( 'selected', 'selected' );\n }\n optionNode.setAttribute( 'value', option.value );\n optionNode.setAttribute( 'label', option.label );\n optionNode.innerText = option.label;\n select.appendChild( optionNode );\n });\n\n // The template only needs the options.\n return select.innerHTML;\n }\n\n }\n }\n\n });\n\n return view;\n} );\n\ndefine( 'views/app/drawer/optionRepeaterEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'tr',\n\t\ttemplate: '#tmpl-nf-edit-setting-option-repeater-empty'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/optionRepeaterComposite',['views/app/drawer/optionRepeaterOption', 'views/app/drawer/optionRepeaterEmpty', 'models/app/optionRepeaterCollection'], function( listOptionView, listEmptyView, listOptionCollection ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-edit-setting-option-repeater-wrap',\n\t\tchildView: listOptionView,\n\t\temptyView: listEmptyView,\n\t\treorderOnSort: false,\n\n\t\tinitialize: function( data ) {\n\n\t\t\t/*\n\t\t\t * Our options are stored in our database as objects, not collections.\n\t\t\t * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n\t\t\t */ \n\t\t\tvar optionCollection = data.dataModel.get( this.model.get( 'name' ) );\n\n\t\t\tif ( false == optionCollection instanceof Backbone.Collection ) {\n\t\t\t\toptionCollection = new listOptionCollection( [], { settingModel: this.model } );\n\t\t\t\toptionCollection.add( data.dataModel.get( this.model.get( 'name' ) ) );\n\t\t\t\tdata.dataModel.set( this.model.get( 'name' ), optionCollection, { silent: true } );\n\t\t\t}\n\n\t\t\tthis.collection = optionCollection;\n\t\t\tthis.dataModel = data.dataModel;\n\t\t\tthis.childViewOptions = { parentView: this, settingModel: this.model, collection: this.collection, dataModel: data.dataModel, columns: this.model.get( 'columns' ) };\n\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\t// If we don't have a 'settings' property, this is a legacy depdency setup.\n\t\t\t\tif ( 'undefined' == typeof deps.settings ) {\n\t\t\t\t\tdeps.settings = [];\n\t\t\t\t\t_.each(deps, function(dep, name){\n\t\t\t\t\t\tif( 'settings' !== name ) {\n\t\t\t\t\t\t\tdeps.settings.push( { name: name, value: dep } );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tdeps.match = 'all';\n\t\t\t\t}\n\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.on( 'change:' + name, this.render, this );\n\t\t\t\t}\n\t\t\t}\n this.listenTo( nfRadio.channel( 'option-repeater' ), 'added:option', this.maybeHideNew );\n this.listenTo( nfRadio.channel( 'option-repeater' ), 'removed:option', this.maybeHideNew );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tname = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.off( 'change:' + name, this.render );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\t\t\n\t\t\tvar that = this;\n\t\t\tjQuery( this.el ).find( '.nf-list-options-tbody' ).sortable( {\n\t\t\t\thandle: '.handle',\n\t\t\t\thelper: 'clone',\n\t\t\t\tplaceholder: 'nf-list-options-sortable-placeholder',\n\t\t\t\tforcePlaceholderSize: true,\n\t\t\t\topacity: 0.95,\n\t\t\t\ttolerance: 'pointer',\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).request( 'start:optionSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).request( 'stop:optionSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).request( 'update:optionSortable', ui, this, that );\n\t\t\t\t}\n\t\t\t} );\n\n that.setupTooltip();\n that.maybeHideNew( that.collection );\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t\n\t\t},\n\n\t\tonAttach: function() {\n \n\t\t\tvar importLink = jQuery( this.el ).find( '.nf-open-import-tooltip' );\n\t\t\tvar jBox = jQuery( importLink ).jBox( 'Tooltip', {\n title: '<h3>Please enter your options below:</h3>',\n content: ( \"1\" == nfAdmin.devMode ? jQuery( this.el ).find( '.nf-dev-import-options' ) : jQuery( this.el ).find( '.nf-import-options' ) ),\n trigger: 'click',\n closeOnClick: 'body',\n closeButton: 'box',\n offset: { x: 20, y: 0 },\n addClass: 'import-options',\n\n onOpen: function() {\n \tvar that = this;\n \tsetTimeout( function() { jQuery( that.content ).find( 'textarea' ).focus(); }, 200 );\n }\n } );\n\n\t\t\tjQuery( this.el ).find( '.nf-import' ).on( 'click', { view: this, jBox: jBox }, this.clickImport );\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t},\n \n /**\n * Function to append jBox modals to each tooltip element in the option repeater.\n */\n setupTooltip: function() {\n // For each .nf-help in the option repeater...\n jQuery( this.el ).find( '.nf-list-options' ).find( '.nf-help' ).each(function() {\n // Get the content.\n var content = jQuery(this).next('.nf-help-text');\n // Declare the modal.\n jQuery( this ).jBox( 'Tooltip', {\n content: content,\n maxWidth: 200,\n theme: 'TooltipBorder',\n trigger: 'click',\n closeOnClick: true\n })\n });\n },\n\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\n\t \treturn {\n\t \t\trenderHeaders: function() {\n // If this is a Field...\n // AND If the type includes 'list'...\n if ( 'Field' == that.dataModel.get( 'objectType' ) && -1 !== that.dataModel.get( 'type' ).indexOf( 'list' ) ) {\n // Declare help text.\n var helpText, helpTextContainer, helpIcon, helpIconLink, helpTextWrapper;\n\n helpText = document.createTextNode( nfi18n.valueChars );\n helpTextContainer = document.createElement( 'div' );\n helpTextContainer.classList.add( 'nf-help-text' );\n helpTextContainer.appendChild( helpText );\n\n helpIcon = document.createElement( 'span' );\n helpIcon.classList.add( 'dashicons', 'dashicons-admin-comments' );\n helpIconLink = document.createElement( 'a' );\n helpIconLink.classList.add( 'nf-help' );\n helpIconLink.setAttribute( 'href', '#' );\n helpIconLink.setAttribute( 'tabindex', '-1' );\n helpIconLink.appendChild( helpIcon );\n\n helpTextWrapper = document.createElement( 'span' );\n helpTextWrapper.appendChild( helpIconLink );\n helpTextWrapper.appendChild( helpTextContainer );\n\n\t\t\t\t\t\t// Append the help text to the 'value' header.\n\t\t\t\t\t\tif('undefined' !== typeof that.model.get('columns') ){\n\t\t\t\t\t\t\tif('undefined' !== typeof that.model.get('columns').value ){\n\t\t\t\t\t\t\t\tif ( -1 == that.model.get('columns').value.header.indexOf( helpTextWrapper.innerHTML ) ) {\n\t\t\t\t\t\t\t\t\tthat.model.get('columns').value.header += helpTextWrapper.innerHTML;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n }\n\t \t\t\tvar columns, beforeColumns, afterColumns;\n\n\t \t\t\tbeforeColumns = document.createElement( 'div' );\n\n\t \t\t\tcolumns = document.createElement( 'span' );\n\t \t\t\tcolumns.appendChild( beforeColumns );\n\n\t\t\t\t\tif(!nfAdmin.devMode){\n\t\t\t\t\t\tdelete this.columns.value;\n\t\t\t\t\t\tdelete this.columns.calc;\n\t\t\t\t\t}\n\n\t \t\t\t_.each( this.columns, function( col ) {\n\t \t\t\t\tvar headerText, headerContainer;\n\n\t \t\t\t\t// Use a fragment to support HTML in the col.header property, ie Dashicons.\n headerText = document.createRange().createContextualFragment( col.header );\n\t \t\t\t\theaderContainer = document.createElement( 'div' );\n\t \t\t\t\theaderContainer.appendChild( headerText );\n\n\t \t\t\t\tcolumns.appendChild( headerContainer );\n\t \t\t\t} );\n\n afterColumns = document.createElement( 'div' );\n columns.appendChild( afterColumns );\n\n\t\t\t\t\treturn columns.innerHTML;\n\t\t\t\t},\n\n\t \t\trenderSetting: function() {\n\t \t\t\tvar setting = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-' + this.type );\n\t\t\t\t\treturn setting( this );\n\t\t\t\t},\n\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = '';\n\t\t\t\t\tif ( 'undefined' != typeof this.width ) {\n\t\t\t\t\t\tclasses += this.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclasses += ' one-half';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\tclasses += ' nf-error';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderVisible: function() {\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'check:deps', this, that );\n\t \t\t},\n\n\t\t\t\trenderError: function() {\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\treturn this.error;\n\t\t\t\t\t}\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\n\t\t\t\trenderFieldsetClasses: function() {\n\t\t\t\t\treturn that.model.get( 'name' );\n\t\t\t\t},\n\n\t\t\t\tcurrencySymbol: function() {\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'get:setting', 'currency' ) || nfi18n.currency_symbol;\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.nf-list-options-tbody' ).append( childView.el );\n\t\t\tnfRadio.channel( 'mergeTags' ).request( 'init', this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-add-new': 'clickAddOption',\n\t\t\t'click .extra': 'clickExtra'\n\t\t},\n \n maybeHideNew: function( collection ) {\n\t\t\tif( 'undefined' == typeof collection.settingModel ) return false;\n var limit = collection.settingModel.get( 'max_options' );\n if( 0 !== limit && collection.models.length >= ( limit ) ) {\n jQuery(this.el).find('.nf-add-new').addClass('disabled');\n } else {\n jQuery(this.el).find('.nf-add-new').removeClass('disabled');\n }\n },\n\n\t\tclickAddOption: function( e ) {\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'click:addOption', this.collection, this.dataModel );\n\t\t\tjQuery( this.children.findByIndex(this.children.length - 1).el ).find( '[data-id=\"label\"]' ).focus();\n\t\t},\n\n\t\tclickExtra: function( e ) {\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'click:extra', e, this.collection, this.dataModel );\n\t\t\tnfRadio.channel( 'option-repeater-' + this.model.get( 'name' ) ).trigger( 'click:extra', e, this.model, this.collection, this.dataModel );\n\t\t},\n\n\t\tclickImport: function( e ) {\n\t\t\tvar textarea = jQuery( e.data.jBox.content ).find( 'textarea' );\n\t\t\tvar value = textarea.val().trimLeft().trimRight();\n\t\t\t/*\n\t\t\t * Return early if we have no strings.\n\t\t\t */\n\t\t\tif ( 0 == value.length ) {\n\t\t\t\te.data.jBox.close();\n\t\t\t\treturn false;\n\t\t\t}\t\t\t\n\t\t\t/*\n\t\t\t * Split our value based on new lines.\n\t\t\t */\n\n\t\t\tvar lines = value.split(/\\n/);\n\t\t\tif ( _.isArray( lines ) ) {\n\t\t\t\t/*\n\t\t\t\t * Loop over \n\t\t\t\t */\n\t\t\t\t_.each( lines, function( line ) {\n\t\t\t\t\tvar row = line.split( ',' );\n\t\t\t\t\tvar label = row[0];\n\t\t\t\t\tvar value = row[1] || jQuery.slugify( label, { separator: '-' } );\n\t\t\t\t\tvar calc = row[2] || '';\n\n\t\t\t\t\tlabel = label.trimLeft().trimRight();\n\t\t\t\t\tvalue = value.trimLeft().trimRight();\n\t\t\t\t\tcalc = calc.trimLeft().trimRight();\n\t\t\t\t\t/*\n\t\t\t\t\t * Add our row to the collection\n\t\t\t\t\t */\n\t\t\t\t\tvar model = e.data.view.collection.add( { label: row[0], value: value, calc: calc } );\n\t\t\t\t\t// Add our field addition to our change log.\n\t\t\t\t\tvar label = {\n\t\t\t\t\t\tobject: 'field',\n\t\t\t\t\t\tlabel: row[0],\n\t\t\t\t\t\tchange: 'Option Added',\n\t\t\t\t\t\tdashicon: 'plus-alt'\n\t\t\t\t\t};\n\n\t\t\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addListOption', model, null, label );\n\t\t\t\t\tnfRadio.channel( 'option-repeater-' + e.data.view.model.get( 'name' ) ).trigger( 'add:option', model );\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'add:option', model );\n\t\t\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', model );\n\t\t\t\t}, this );\n\t\t\t\t/*\n\t\t\t\t * Set our state to unclean so that the user can publish.\n\t\t\t\t */\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t * TODO: Error Handling Here\n\t\t\t\t */\n\t\t\t}\n\t\t\ttextarea.val( '' );\n\t\t\te.data.jBox.close();\n\t\t},\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles tasks associated with our option-repeater.\n * \n * Return our repeater child view.\n *\n * Also listens for changes to the options settings.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/optionRepeater',['models/app/optionRepeaterModel', 'models/app/optionRepeaterCollection', 'views/app/drawer/optionRepeaterComposite'], function( listOptionModel, listOptionCollection, listCompositeView ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for the childView for list type fields.\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n\t\t\t\n\t\t\t// Listen for changes to our list options.\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'change:option', this.changeOption );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'click:addOption', this.addOption );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'click:deleteOption', this.deleteOption );\n\n\t\t\t// Respond to requests related to our list options sortable.\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'update:optionSortable', this.updateOptionSortable, this );\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'stop:optionSortable', this.stopOptionSortable, this );\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'start:optionSortable', this.startOptionSortable, this );\n\t\t\n\t\t\t/**\n\t\t\t * When we init our setting model, we need to convert our array/objects into collections/models\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'init:dataModel', this.convertSettings );\n\t\t},\n\n\t\t/**\n\t\t * Update an option value in our model.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te event\n\t\t * @param backbone.model \tmodel option model\n\t\t * @param backbone.model \tdataModel\n\t\t * @return void\n\t\t */\n\t\tchangeOption: function( e, model, dataModel, settingModel, optionView ) {\n\t\t\tvar name = jQuery( e.target ).data( 'id' );\n\t\t\tif ( 'selected' == name ) {\n\t\t\t\tif ( jQuery( e.target ).prop( 'checked' ) ) {\n\t\t\t\t\tvar value = 1;\n\t\t\t\t} else {\n\t\t\t\t\tvar value = 0;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tvar value = jQuery( e.target ).val();\n\t\t\t}\n\t\t\t\n\t\t\tvar before = model.get( name );\n\t\t\t\n\t\t\tmodel.set( name, value );\n\t\t\t// Trigger an update on our dataModel\n\t\t\tthis.triggerDataModel( model, dataModel );\n\n\t\t\tvar after = value;\n\t\t\t\n\t\t\tvar changes = {\n\t\t\t\tattr: name,\n\t\t\t\tbefore: before,\n\t\t\t\tafter: after\n\t\t\t}\n\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option ' + model.get( 'label' ) + ' ' + name + ' changed from ' + before + ' to ' + after\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'changeSetting', model, changes, label );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'update:option', model, dataModel, settingModel, optionView );\n\t\t\tnfRadio.channel( 'option-repeater-option-' + name ).trigger( 'update:option', e, model, dataModel, settingModel, optionView );\n\t\t\tnfRadio.channel( 'option-repeater-' + settingModel.get( 'name' ) ).trigger( 'update:option', model, dataModel, settingModel, optionView );\n\t\t},\n\n\t\t/**\n\t\t * Add an option to our list\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\taddOption: function( collection, dataModel ) {\n\t\t\tvar modelData = {\n\t\t\t\torder: collection.length,\n\t\t\t\tnew: true,\n\t\t\t\toptions: {}\n\t\t\t};\n\t\t\t/**\n\t\t\t * If we don't actually have a 'settingModel' duplicated fields\n\t\t\t * can't add options until publish and the builder is reloaded.\n\t\t\t * If we ignore the code if we don't have settingsModel, then it\n\t\t\t * works.\n\t\t\t */\n\t\t\tif ( 'undefined' !== typeof collection.settingModel ) {\n\t\t\t\tvar limit = collection.settingModel.get( 'max_options' );\n\t\t\t\tif ( 0 !== limit && collection.models.length >= limit ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\t_.each( collection.settingModel.get( 'columns' ), function ( col, key ) {\n\t\t\t\t\tmodelData[ key ] = col.default;\n\n\t\t\t\t\tif ( 'undefined' != typeof col.options ) {\n\t\t\t\t\t\tmodelData.options[ key ] = col.options;\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t}\n\t\t\tvar model = new listOptionModel( modelData );\n\t\t\tcollection.add( model );\n\n\t\t\t// Add our field addition to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addListOption', model, null, label );\n\n\t\t\tif ( 'undefined' !== typeof collection.settingModel ) {\n\t\t\t\tnfRadio.channel('option-repeater-' + collection.settingModel.get('name')).trigger('add:option', model);\n\t\t\t}\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'add:option', model );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'added:option', collection );\n\t\t\tthis.triggerDataModel( model, dataModel );\n\t\t},\n\n\t\t/**\n\t\t * Delete an option from our list\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \t\tmodel list option model\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\tdeleteOption: function( model, collection, dataModel ) {\n\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', model );\n\n\t\t\t// Add our field deletion to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option ' + newModel.get( 'label' ) + ' Removed',\n\t\t\t\tdashicon: 'dismiss'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: collection\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'removeListOption', newModel, null, label, data );\n\t\t\t\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tvar results = changeCollection.where( { model: model } );\n\n\t\t\t_.each( results, function( changeModel ) {\n\t\t\t\tif ( 'object' == typeof changeModel.get( 'data' ) ) {\n\t\t\t\t\t_.each( changeModel.get( 'data' ), function( dataModel ) {\n\t\t\t\t\t\tif ( dataModel.model == dataModel ) {\n\t\t\t\t\t\t\tdataModel.model = newModel;\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tchangeModel.set( 'model', newModel );\n\t\t\t\tchangeModel.set( 'disabled', true );\n\t\t\t} );\n\n\t\t\tcollection.remove( model );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'remove:option', model );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'removed:option', collection );\n\t\t\tnfRadio.channel( 'option-repeater-' + collection.settingModel.get( 'name' ) ).trigger( 'remove:option', model );\n\t\t\tthis.triggerDataModel( model, dataModel );\n\t\t},\n\n\t\t/**\n\t\t * Creates an arbitrary value on our collection, then clones and updates that collection.\n\t\t * This forces a change event to be fired on the dataModel where the list option collection data is stored.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\ttriggerDataModel: function( model, dataModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', model );\t\n\t\t},\n\n\t\t/**\n\t\t * Return our list composite view to the setting collection view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \tsettings model\n\t\t * @return void\n\t\t */\n\t\tgetSettingChildView: function( model ) {\n\t\t\treturn listCompositeView;\n\t\t},\n\n\t\t/**\n\t\t * When we sort our list options, change the order in our option model and trigger a change.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t \t\tsortable \tjQuery UI element\n\t\t * @param backbone.view \tsetting \tSetting view\n\t\t * @return void\n\t\t */\n\t\tupdateOptionSortable: function( ui, sortable, setting ) {\n\t\t\tvar newOrder = jQuery( sortable ).sortable( 'toArray' );\n\t\t\tvar dragModel = setting.collection.get( { cid: jQuery( ui.item ).prop( 'id' ) } );\n\t\t\tvar data = {\n\t\t\t\tcollection: setting.collection,\n\t\t\t\tobjModels: []\n\t\t\t};\n\n\t\t\t_.each( newOrder, function( cid, index ) {\n\t\t\t\tvar optionModel = setting.collection.get( { cid: cid } );\n\t\t\t\tvar oldPos = optionModel.get( 'order' );\n\t\t\t\toptionModel.set( 'order', index );\n\t\t\t\tvar newPos = index;\n\n\t\t\t\tdata.objModels.push( {\n\t\t\t\t\tmodel: optionModel,\n\t\t\t\t\tattr: 'order',\n\t\t\t\t\tbefore: oldPos,\n\t\t\t\t\tafter: newPos\n\t\t\t\t} );\n\t\t\t} );\n\t\t\t\n\t\t\tsetting.collection.sort( { silent: true } );\n\t\t\t\n\t\t\tvar label = {\n\t\t\t\tobject: setting.dataModel.get( 'objectType' ),\n\t\t\t\tlabel: setting.dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option ' + dragModel.get( 'label' ) + ' re-ordered from ' + dragModel._previousAttributes.order + ' to ' + dragModel.get( 'order' ),\n\t\t\t\tdashicon: 'sort'\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'sortListOptions', dragModel, null, label, data );\n\t\t\tthis.triggerDataModel( dragModel, setting.dataModel );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'sort:option', dragModel, setting );\n\t\t\tnfRadio.channel( 'option-repeater-' + setting.model.get( 'name' ) ).trigger( 'sort:option', dragModel, setting );\n\t\t},\n\n\t\t/**\n\t\t * When we stop sorting our list options, reset our item opacity.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopOptionSortable: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t},\n\n\t\t/**\n\t\t * When we start sorting our list options, remove containing divs and set our item opacity to 0.5\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Objects ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartOptionSortable: function( ui ) {\n\t\t\tjQuery( ui.placeholder ).find( 'div' ).remove();\n\t\t\tjQuery( ui.item ).css( 'opacity', '0.5' ).show();\n\t\t},\n\n\t\t/**\n\t\t * Convert settings from an array/object to a collection/model\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Backbone.Model dataModel\n\t\t * @param Backbone.Model settingModel\n\t\t * @return void\n\t\t */\n\t\tconvertSettings: function( dataModel, settingModel ) {\n\t\t\t/*\n\t\t\t * Our options are stored in our database as objects, not collections.\n\t\t\t * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n\t\t\t */ \n\t\t\tvar optionCollection = dataModel.get( settingModel.get( 'name' ) );\n\n\t\t\tif ( false == optionCollection instanceof Backbone.Collection ) {\n\t\t\t\toptionCollection = new listOptionCollection( [], { settingModel: settingModel } );\n\t\t\t\toptionCollection.add( dataModel.get( settingModel.get( 'name' ) ) );\n\t\t\t\tdataModel.set( settingModel.get( 'name' ), optionCollection, { silent: true } );\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\ndefine( 'views/app/drawer/imageOptionRepeaterOption',['views/app/drawer/optionRepeaterError'], function( ErrorView ) {\n var view = Marionette.LayoutView.extend({\n tagName: 'div',\n className: 'nf-table-row',\n template: '#tmpl-nf-edit-setting-image-option-repeater-default-row',\n id: function() {\n return this.model.cid;\n },\n\n regions: {\n error: '.nf-option-error'\n },\n\n initialize: function( data ) {\n this.settingModel = data.settingModel;\n this.dataModel = data.dataModel;\n this.collection = data.collection;\n this.columns = data.columns;\n this.parentView = data.parentView;\n this.model.on( 'change:errors', this.renderErrors, this );\n\n // Removed because the re-render was breaking tag insertion for merge tags.\n // this.model.on( 'change', this.render, this );\n\n if ( 'undefined' != typeof this.settingModel.get( 'tmpl_row' ) ) {\n this.template = '#' + this.settingModel.get( 'tmpl_row' );\n }\n\n this.listenTo( nfRadio.channel( 'image-option-repeater' ), 'click:extra', this.clickExtra );\n\n this.hasErrors = false;\n },\n\n onBeforeDestroy: function() { \n this.model.off( 'change', this.render );\n this.model.off( 'change:errors', this.renderErrors );\n },\n\n onBeforeRender: function() {\n /*\n * We want to escape any HTML being output for our image.\n */\n if ( this.model.get( 'image' ) ) {\n var image = this.model.get( 'image' );\n this.model.set( 'image', _.escape( image ), { silent: true } );\n }\n \n },\n\n onRender: function() {\n nfRadio.channel( 'mergeTags' ).request( 'init', this );\n /*\n * Send out a radio message.\n */\n nfRadio.channel( 'setting-' + this.settingModel.get( 'name' ) + '-option' ).trigger( 'render:setting', this.model, this.dataModel, this );\n /*\n * We want to unescape any HTML being output for our image.\n */\n if ( this.model.get( 'image' ) ) {\n var image = this.model.get( 'image' );\n this.model.set( 'image', _.unescape( image ), { silent: true } );\n }\n },\n\n onShow: function() {\n if ( this.model.get( 'new' ) ) {\n jQuery( this.el ).find( 'input:first' ).focus();\n this.model.set( 'new', false );\n }\n },\n\n events: {\n 'change .setting': 'changeOption',\n 'click .nf-delete': 'deleteOption',\n 'keyup': 'keyupOption',\n // 'click .open-media-manager': 'openMediaModal'\n },\n\n changeOption: function( e ) {\n nfRadio.channel( 'image-option-repeater' ).trigger( 'change:option', e, this.model, this.dataModel, this.settingModel, this );\n },\n\n deleteOption: function( e ) {\n nfRadio.channel( 'image-option-repeater' ).trigger( 'click:deleteOption', this.model, this.collection, this.dataModel, this );\n },\n\n keyupOption: function( e ) {\n this.maybeAddOption( e );\n nfRadio.channel( 'image-option-repeater' ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n nfRadio.channel( 'image-option-repeater-' + this.settingModel.get( 'name' ) ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n },\n\n maybeAddOption: function( e ) {\n if ( 13 == e.keyCode && 'calculations' != this.settingModel.get( 'name' ) ) {\n nfRadio.channel( 'image-option-repeater' ).trigger( 'click:addOption', this.collection, this.dataModel, this );\n jQuery( this.parentView.children.findByIndex(this.parentView.children.length - 1).el ).find( '[data-id=\"image\"]' ).focus();\n }\n },\n\n clickExtra: function(e, settingModel, dataModel, settingView) {\n \n var textEl = jQuery(e.target).parent().find('.setting');\n var optionContainerDiv = jQuery(e.target).parent().parent().parent();\n\n var valueEl = jQuery(optionContainerDiv[0]).find('[data-id=\"value\"]');\n\n var imageIdEl = jQuery(optionContainerDiv[0]).find('[data-id=\"image_id\"]');\n\n var labelEl = jQuery(optionContainerDiv[0]).find('[data-id=\"label\"]');\n \n if ( jQuery( e.target ).hasClass( 'open-media-manager' )\n && this.el.id === optionContainerDiv[0].id) {\n // If the frame already exists, re-open it.\n if ( this.meta_image_frame ) {\n this.meta_image_frame.open();\n return;\n }\n\n // Sets up the media library frame\n this.meta_image_frame = wp.media.frames.meta_image_frame = wp.media({\n title: 'Select a file',\n button: { text: 'insert' }\n });\n\n var that = this;\n\n // Runs when an image is selected.\n this.meta_image_frame.on('select', function(){\n // Grabs the attachment selection and creates a JSON representation of the model.\n var media_attachment = that.meta_image_frame.state().get('selection').first().toJSON();\n \n textEl.val(media_attachment.url).change();\n valueEl.val(media_attachment.filename).change();\n labelEl.val(media_attachment.title).change();\n imageIdEl.val(media_attachment.id).change();\n var img_container = optionContainerDiv.find('.option-image-container');\n\n if(img_container) {\n $imgs = jQuery(img_container).find('img');\n if($imgs.length > 0) {\n jQuery($imgs[0]).attr('src', media_attachment.url);\n } else {\n var new_img = document.createElement('img');\n new_img.style=\"max-width:100px;display:inline-block;\";\n new_img.src = media_attachment.url;\n jQuery(img_container).append(new_img);\n }\n }\n });\n\n // Opens the media library frame.\n this.meta_image_frame.open();\n }\n },\n\n renderErrors: function() {\n \n // if ( jQuery.isEmptyObject( this.model.get( 'errors' ) ) ) {\n // return false;\n // }\n\n /*\n * We don't want to redraw the entire row, which would remove focus from the eq textarea,\n * so we add and remove error classes manually.\n */\n if ( 0 == Object.keys( this.model.get( 'errors' ) ) ) {\n if ( this.hasErrors ) {\n this.error.empty();\n jQuery( this.el ).removeClass( 'nf-error' );\n }\n } else {\n this.hasErrors = true;\n this.error.show( new ErrorView( { model: this.model } ) );\n jQuery( this.el ).addClass( 'nf-error' );\n }\n },\n\n templateHelpers: function() {\n var that = this;\n return {\n getColumns: function() {\n var columns = that.columns;\n if(!nfAdmin.devMode){\n delete columns.value;\n delete columns.calc;\n }\n return columns;\n },\n renderFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, image;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.image = '';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n fields.each( function( field ){\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.image = field.formatLabel();\n select.appendChild( option );\n });\n\n image = document.createElement( 'image' );\n image.classList.add( 'nf-select' );\n image.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n image.appendChild( emptyContainer );\n\n // The template requires a string.\n return image.innerHTML;\n },\n renderNonSaveFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, image;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.image = '';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n // Build a lookup table for fields we want to remove from our fields list.\n var removeFieldsLookup = [ 'html', 'submit', 'hr',\n 'recaptcha', 'spam', 'creditcard', 'creditcardcvc',\n 'creditcardexpiration', 'creditcardfullname',\n 'creditcardnumber', 'creditcardzip' ];\n\n fields.each( function( field ){\n // Check for the field type in our lookup array and...\n if( jQuery.inArray( field.get( 'type' ), removeFieldsLookup ) !== -1 ) {\n // Return if the type is in our lookup array.\n return '';\n }\n\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.image = field.formatLabel();\n select.appendChild( option );\n });\n\n image = document.createElement( 'image' );\n image.classList.add( 'nf-select' );\n image.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n image.appendChild( emptyContainer );\n\n // The template requires a string.\n return image.innerHTML;\n },\n renderOptions: function( column, value ) {\n\n if( 'undefined' == typeof that.options.columns[ column ] ) return;\n\n var select = document.createElement( 'select' );\n \n _.each( that.options.columns[ column ].options, function( option ){\n var optionNode = document.createElement( 'option' );\n if ( value === option.value ) {\n optionNode.setAttribute( 'selected', 'selected' );\n }\n optionNode.setAttribute( 'value', option.value );\n optionNode.setAttribute( 'image_id', option.image_id);\n optionNode.setAttribute( 'image', option.image );\n optionNode.innerText = option.image;\n select.appendChild( optionNode );\n });\n\n // The template only needs the options.\n return select.innerHTML;\n }\n\n }\n }\n\n });\n\n return view;\n} );\n\ndefine( 'views/app/drawer/imageOptionRepeaterComposite',['views/app/drawer/imageOptionRepeaterOption', 'views/app/drawer/optionRepeaterEmpty', 'models/app/optionRepeaterCollection'], function( listOptionView, listEmptyView, listOptionCollection ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-edit-setting-image-option-repeater-wrap',\n\t\tchildView: listOptionView,\n\t\temptyView: listEmptyView,\n\t\treorderOnSort: false,\n\n\t\tinitialize: function( data ) {\n\n\t\t\t/*\n\t\t\t * Our options are stored in our database as objects, not collections.\n\t\t\t * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n\t\t\t */ \n\t\t\tvar optionCollection = data.dataModel.get( this.model.get( 'name' ) );\n\n\t\t\tif ( false == optionCollection instanceof Backbone.Collection ) {\n\t\t\t\toptionCollection = new listOptionCollection( [], { settingModel: this.model } );\n\t\t\t\toptionCollection.add( data.dataModel.get( this.model.get( 'name' ) ) );\n\t\t\t\tdata.dataModel.set( this.model.get( 'name' ), optionCollection, { silent: true } );\n\t\t\t}\n\n\t\t\tthis.collection = optionCollection;\n\t\t\tthis.dataModel = data.dataModel;\n\t\t\tthis.childViewOptions = { parentView: this, settingModel: this.model, collection: this.collection, dataModel: data.dataModel, columns: this.model.get( 'columns' ) };\n\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\t// If we don't have a 'settings' property, this is a legacy depdency setup.\n\t\t\t\tif ( 'undefined' == typeof deps.settings ) {\n\t\t\t\t\tdeps.settings = [];\n\t\t\t\t\t_.each(deps, function(dep, name){\n\t\t\t\t\t\tif( 'settings' !== name ) {\n\t\t\t\t\t\t\tdeps.settings.push( { name: name, value: dep } );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tdeps.match = 'all';\n\t\t\t\t}\n\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.on( 'change:' + name, this.render, this );\n\t\t\t\t}\n\t\t\t}\n this.listenTo( nfRadio.channel( 'image-option-repeater' ), 'added:option', this.maybeHideNew );\n this.listenTo( nfRadio.channel( 'image-option-repeater' ), 'removed:option', this.maybeHideNew );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.off( 'change:' + name, this.render );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\t\t\n\t\t\tvar that = this;\n\t\t\tjQuery( this.el ).find( '.nf-listimage-options-tbody' ).sortable( {\n\t\t\t\thandle: '.handle',\n\t\t\t\thelper: 'clone',\n\t\t\t\tplaceholder: 'nf-listimage-options-sortable-placeholder',\n\t\t\t\tforcePlaceholderSize: true,\n\t\t\t\topacity: 0.95,\n\t\t\t\ttolerance: 'pointer',\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'image-option-repeater' ).request( 'start:optionSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'image-option-repeater' ).request( 'stop:optionSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'image-option-repeater' ).request( 'update:optionSortable', ui, this, that );\n\t\t\t\t}\n\t\t\t} );\n\n that.setupTooltip();\n that.maybeHideNew( that.collection );\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t\n\t\t},\n\n\t\tonAttach: function() {\n \n\t\t\t// var importLink = jQuery( this.el ).find( '.nf-open-import-tooltip' );\n\t\t\t// var jBox = jQuery( importLink ).jBox( 'Tooltip', {\n // title: '<h3>Please enter your options below:</h3>',\n // content: ( \"1\" == nfAdmin.devMode ? jQuery( this.el ).find( '.nf-dev-import-options' ) : jQuery( this.el ).find( '.nf-import-options' ) ),\n // trigger: 'click',\n // closeOnClick: 'body',\n // closeButton: 'box',\n // offset: { x: 20, y: 0 },\n // addClass: 'import-options',\n\n // onOpen: function() {\n // \tvar that = this;\n // \tsetTimeout( function() { jQuery( that.content ).find( 'textarea' ).focus(); }, 200 );\n // }\n // } );\n\n\t\t\t// jQuery( this.el ).find( '.nf-import' ).on( 'click', { view: this, jBox: jBox }, this.clickImport );\n\n\t\t\t// /*\n\t\t\t// * Send out a radio message.\n\t\t\t// */\n\t\t\t// nfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t\t// nfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t},\n \n /**\n * Function to append jBox modals to each tooltip element in the option repeater.\n */\n setupTooltip: function() {\n // For each .nf-help in the option repeater...\n jQuery( this.el ).find( '.nf-listimage-options' ).find( '.nf-help' ).each(function() {\n // Get the content.\n var content = jQuery(this).next('.nf-help-text');\n // Declare the modal.\n jQuery( this ).jBox( 'Tooltip', {\n content: content,\n maxWidth: 200,\n theme: 'TooltipBorder',\n trigger: 'click',\n closeOnClick: true\n })\n });\n },\n\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\n\t \treturn {\n\t \t\trenderHeaders: function() {\n // If this is a Field...\n // AND If the type includes 'list'...\n if ( 'Field' == that.dataModel.get( 'objectType' ) && -1 !== that.dataModel.get( 'type' ).indexOf( 'list' ) ) {\n // Declare help text.\n var helpText, helpTextContainer, helpIcon, helpIconLink, helpTextWrapper;\n\n helpText = document.createTextNode( nfi18n.valueChars );\n helpTextContainer = document.createElement( 'div' );\n helpTextContainer.classList.add( 'nf-help-text' );\n helpTextContainer.appendChild( helpText );\n\n helpIcon = document.createElement( 'span' );\n helpIcon.classList.add( 'dashicons', 'dashicons-admin-comments' );\n helpIconLink = document.createElement( 'a' );\n helpIconLink.classList.add( 'nf-help' );\n helpIconLink.setAttribute( 'href', '#' );\n helpIconLink.setAttribute( 'tabindex', '-1' );\n helpIconLink.appendChild( helpIcon );\n\n helpTextWrapper = document.createElement( 'span' );\n helpTextWrapper.appendChild( helpIconLink );\n helpTextWrapper.appendChild( helpTextContainer );\n\n\t\t\t\t\t\t// Append the help text to the 'value' header.\n\t\t\t\t\t\tif('undefined' !== typeof that.model.get('columns') ){\n\t\t\t\t\t\t\tif('undefined' !== typeof that.model.get('columns').value ){\n\t\t\t\t\t\t\t\tif ( -1 == that.model.get('columns').value.header.indexOf( helpTextWrapper.innerHTML ) ) {\n\t\t\t\t\t\t\t\t\tthat.model.get('columns').value.header += helpTextWrapper.innerHTML;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n }\n\t \t\t\tvar columns, beforeColumns, afterColumns;\n\n\t \t\t\tbeforeColumns = document.createElement( 'div' );\n\n\t \t\t\tcolumns = document.createElement( 'span' );\n\t \t\t\tcolumns.appendChild( beforeColumns );\n\n\t\t\t\t\tif(!nfAdmin.devMode){\n\t\t\t\t\t\tdelete this.columns.value;\n\t\t\t\t\t\tdelete this.columns.calc;\n\t\t\t\t\t}\n\n\t \t\t\t_.each( this.columns, function( col ) {\n\t \t\t\t\tvar headerText, headerContainer;\n\n\t \t\t\t\t// Use a fragment to support HTML in the col.header property, ie Dashicons.\n headerText = document.createRange().createContextualFragment( col.header );\n\t \t\t\t\theaderContainer = document.createElement( 'div' );\n\t \t\t\t\theaderContainer.appendChild( headerText );\n\n\t \t\t\t\tcolumns.appendChild( headerContainer );\n\t \t\t\t} );\n\n afterColumns = document.createElement( 'div' );\n columns.appendChild( afterColumns );\n\n\t\t\t\t\treturn columns.innerHTML;\n\t\t\t\t},\n\n\t \t\trenderSetting: function() {\n\t \t\t\tvar setting = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-' + this.type );\n\t\t\t\t\treturn setting( this );\n\t\t\t\t},\n\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = '';\n\t\t\t\t\tif ( 'undefined' != typeof this.width ) {\n\t\t\t\t\t\tclasses += this.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclasses += ' one-half';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\tclasses += ' nf-error';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderVisible: function() {\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'check:deps', this, that );\n\t \t\t},\n\n\t\t\t\trenderError: function() {\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\treturn this.error;\n\t\t\t\t\t}\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\n\t\t\t\trenderFieldsetClasses: function() {\n\t\t\t\t\treturn that.model.get( 'name' );\n\t\t\t\t},\n\n\t\t\t\tcurrencySymbol: function() {\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'get:setting', 'currency' ) || nfi18n.currency_symbol;\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.nf-listimage-options-tbody' ).append( childView.el );\n\t\t\tnfRadio.channel( 'mergeTags' ).request( 'init', this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-add-new': 'clickAddOption',\n\t\t\t'click .extra': 'clickExtra'\n\t\t},\n \n maybeHideNew: function( collection ) {\n\t\t\tif( 'undefined' == typeof collection.settingModel ) return false;\n var limit = collection.settingModel.get( 'max_options' );\n if( 0 !== limit && collection.models.length >= ( limit ) ) {\n jQuery(this.el).find('.nf-add-new').addClass('disabled');\n } else {\n jQuery(this.el).find('.nf-add-new').removeClass('disabled');\n }\n },\n\n\t\tclickAddOption: function( e ) {\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'click:addOption', this.collection, this.dataModel );\n\t\t\tjQuery( this.children.findByIndex(this.children.length - 1).el ).find( '[data-id=\"image\"]' ).focus();\n\t\t},\n\n\t\tclickExtra: function( e ) {\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'click:extra', e, this.collection, this.dataModel );\n\t\t\tnfRadio.channel( 'image-option-repeater-' + this.model.get( 'name' ) ).trigger( 'click:extra', e, this.model, this.collection, this.dataModel );\n\t\t},\n\n\t\tclickImport: function( e ) {\n\t\t\tvar textarea = jQuery( e.data.jBox.content ).find( 'textarea' );\n\t\t\tvar value = textarea.val().trimLeft().trimRight();\n\t\t\t/*\n\t\t\t * Return early if we have no strings.\n\t\t\t */\n\t\t\tif ( 0 == value.length ) {\n\t\t\t\te.data.jBox.close();\n\t\t\t\treturn false;\n\t\t\t}\t\t\t\n\t\t\t/*\n\t\t\t * Split our value based on new lines.\n\t\t\t */\n\n\t\t\tvar lines = value.split(/\\n/);\n\t\t\tif ( _.isArray( lines ) ) {\n\t\t\t\t/*\n\t\t\t\t * Loop over \n\t\t\t\t */\n\t\t\t\t_.each( lines, function( line ) {\n\t\t\t\t\tvar row = line.split( ',' );\n\t\t\t\t\tvar image = row[0];\n\t\t\t\t\tvar value = row[1] || jQuery.slugify( image, { separator: '-' } );\n\t\t\t\t\tvar calc = row[2] || '';\n\n\t\t\t\t\timage = image.trimLeft().trimRight();\n\t\t\t\t\tvalue = value.trimLeft().trimRight();\n\t\t\t\t\tcalc = calc.trimLeft().trimRight();\n\t\t\t\t\t/*\n\t\t\t\t\t * Add our row to the collection\n\t\t\t\t\t */\n\t\t\t\t\tvar model = e.data.view.collection.add( { image: row[0], value: value, calc: calc } );\n\t\t\t\t\t// Add our field addition to our change log.\n\t\t\t\t\tvar image = {\n\t\t\t\t\t\tobject: 'field',\n\t\t\t\t\t\timage: row[0],\n\t\t\t\t\t\tchange: 'Option Added',\n\t\t\t\t\t\tdashicon: 'plus-alt'\n\t\t\t\t\t};\n\n\t\t\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addListOption', model, null, image );\n\t\t\t\t\tnfRadio.channel( 'image-option-repeater-' + e.data.view.model.get( 'name' ) ).trigger( 'add:option', model );\n\t\t\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'add:option', model );\n\t\t\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', model );\n\t\t\t\t}, this );\n\t\t\t\t/*\n\t\t\t\t * Set our state to unclean so that the user can publish.\n\t\t\t\t */\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t * TODO: Error Handling Here\n\t\t\t\t */\n\t\t\t}\n\t\t\ttextarea.val( '' );\n\t\t\te.data.jBox.close();\n\t\t},\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles tasks associated with our option-repeater.\n * \n * Return our repeater child view.\n *\n * Also listens for changes to the options settings.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/imageOptionRepeater',['models/app/optionRepeaterModel', 'models/app/optionRepeaterCollection', 'views/app/drawer/imageOptionRepeaterComposite'], function( listOptionModel, listOptionCollection, listCompositeView ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for the childView for list type fields.\n\t\t\tnfRadio.channel( 'image-option-repeater' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n\t\t\t\n\t\t\t// Listen for changes to our list options.\n\t\t\tthis.listenTo( nfRadio.channel( 'image-option-repeater' ), 'change:option', this.changeOption );\n\t\t\tthis.listenTo( nfRadio.channel( 'image-option-repeater' ), 'click:addOption', this.addOption );\n\t\t\tthis.listenTo( nfRadio.channel( 'image-option-repeater' ), 'click:deleteOption', this.deleteOption );\n\n\t\t\t// Respond to requests related to our list options sortable.\n\t\t\tnfRadio.channel( 'image-option-repeater' ).reply( 'update:optionSortable', this.updateOptionSortable, this );\n\t\t\tnfRadio.channel( 'image-option-repeater' ).reply( 'stop:optionSortable', this.stopOptionSortable, this );\n\t\t\tnfRadio.channel( 'image-option-repeater' ).reply( 'start:optionSortable', this.startOptionSortable, this );\n\t\t\n\t\t\t/**\n\t\t\t * When we init our setting model, we need to convert our array/objects into collections/models\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'image-option-repeater' ), 'init:dataModel', this.convertSettings );\n\t\t},\n\n\t\t/**\n\t\t * Update an option value in our model.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te event\n\t\t * @param backbone.model \tmodel option model\n\t\t * @param backbone.model \tdataModel\n\t\t * @return void\n\t\t */\n\t\tchangeOption: function( e, model, dataModel, settingModel, optionView ) {\n\t\t\tvar name = jQuery( e.target ).data( 'id' );\n\t\t\tif ( 'selected' == name ) {\n\t\t\t\tif ( jQuery( e.target ).prop( 'checked' ) ) {\n\t\t\t\t\tvar value = 1;\n\t\t\t\t} else {\n\t\t\t\t\tvar value = 0;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tvar value = jQuery( e.target ).val();\n\t\t\t}\n\t\t\t\n\t\t\tvar before = model.get( name );\n\t\t\t\n\t\t\tmodel.set( name, value );\n\t\t\t// Trigger an update on our dataModel\n\t\t\tthis.triggerDataModel( model, dataModel );\n\n\t\t\tvar after = value;\n\t\t\t\n\t\t\tvar changes = {\n\t\t\t\tattr: name,\n\t\t\t\tbefore: before,\n\t\t\t\tafter: after\n\t\t\t}\n\t\t\t\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option ' + model.get( 'label' ) + ' ' + name + ' changed from ' + before + ' to ' + after\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'changeSetting', model, changes, label );\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'update:option', model, dataModel, settingModel, optionView );\n\t\t\tnfRadio.channel( 'image-option-repeater-option-' + name ).trigger( 'update:option', e, model, dataModel, settingModel, optionView );\n\t\t\tnfRadio.channel( 'image-option-repeater-' + settingModel.get( 'name' ) ).trigger( 'update:option', model, dataModel, settingModel, optionView );\n\t\t},\n\n\t\t/**\n\t\t * Add an option to our list\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\taddOption: function( collection, dataModel ) {\n\t\t\tvar modelData = {\n\t\t\t\torder: collection.length,\n\t\t\t\tnew: true,\n\t\t\t\toptions: {}\n\t\t\t};\n\t\t\t/**\n\t\t\t * If we don't actually have a 'settingModel' duplicated fields\n\t\t\t * can't add options until publish and the builder is reloaded.\n\t\t\t * If we ignore the code if we don't have settingsModel, then it\n\t\t\t * works.\n\t\t\t */\n\t\t\tif ( 'undefined' !== typeof collection.settingModel ) {\n\t\t\t\tvar limit = collection.settingModel.get( 'max_options' );\n\t\t\t\tif ( 0 !== limit && collection.models.length >= limit ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\t_.each( collection.settingModel.get( 'columns' ), function ( col, key ) {\n\t\t\t\t\tmodelData[ key ] = col.default;\n\n\t\t\t\t\tif ( 'undefined' != typeof col.options ) {\n\t\t\t\t\t\tmodelData.options[ key ] = col.options;\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t}\n\t\t\tvar model = new listOptionModel( modelData );\n\t\t\tcollection.add( model );\n\n\t\t\t// Add our field addition to our change log.\n\t\t\tvar image = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\timage: dataModel.get( 'image' ),\n\t\t\t\tchange: 'Option Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addListOption', model, null, image );\n\n\t\t\tif ( 'undefined' !== typeof collection.settingModel ) {\n\t\t\t\tnfRadio.channel('image-option-repeater-' + collection.settingModel.get('name')).trigger('add:option', model);\n\t\t\t}\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'add:option', model );\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'added:option', collection );\n\t\t\tthis.triggerDataModel( model, dataModel );\n\t\t},\n\n\t\t/**\n\t\t * Delete an option from our list\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \t\tmodel list option model\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\tdeleteOption: function( model, collection, dataModel ) {\n\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', model );\n\n\t\t\t// Add our field deletion to our change log.\n\t\t\tvar image = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\timage: dataModel.get( 'image' ),\n\t\t\t\tchange: 'Option ' + newModel.get( 'image' ) + ' Removed',\n\t\t\t\tdashicon: 'dismiss'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: collection\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'removeListOption', newModel, null, image, data );\n\t\t\t\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tvar results = changeCollection.where( { model: model } );\n\n\t\t\t_.each( results, function( changeModel ) {\n\t\t\t\tif ( 'object' == typeof changeModel.get( 'data' ) ) {\n\t\t\t\t\t_.each( changeModel.get( 'data' ), function( dataModel ) {\n\t\t\t\t\t\tif ( dataModel.model == dataModel ) {\n\t\t\t\t\t\t\tdataModel.model = newModel;\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tchangeModel.set( 'model', newModel );\n\t\t\t\tchangeModel.set( 'disabled', true );\n\t\t\t} );\n\n\t\t\tcollection.remove( model );\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'remove:option', model );\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'removed:option', collection );\n\t\t\tnfRadio.channel( 'image-option-repeater-' + collection.settingModel.get( 'name' ) ).trigger( 'remove:option', model );\n\t\t\tthis.triggerDataModel( model, dataModel );\n\t\t},\n\n\t\t/**\n\t\t * Creates an arbitrary value on our collection, then clones and updates that collection.\n\t\t * This forces a change event to be fired on the dataModel where the list option collection data is stored.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\ttriggerDataModel: function( model, dataModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', model );\t\n\t\t},\n\n\t\t/**\n\t\t * Return our list composite view to the setting collection view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \tsettings model\n\t\t * @return void\n\t\t */\n\t\tgetSettingChildView: function( model ) {\n\t\t\treturn listCompositeView;\n\t\t},\n\n\t\t/**\n\t\t * When we sort our list options, change the order in our option model and trigger a change.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t \t\tsortable \tjQuery UI element\n\t\t * @param backbone.view \tsetting \tSetting view\n\t\t * @return void\n\t\t */\n\t\tupdateOptionSortable: function( ui, sortable, setting ) {\n\t\t\tvar newOrder = jQuery( sortable ).sortable( 'toArray' );\n\t\t\tvar dragModel = setting.collection.get( { cid: jQuery( ui.item ).prop( 'id' ) } );\n\t\t\tvar data = {\n\t\t\t\tcollection: setting.collection,\n\t\t\t\tobjModels: []\n\t\t\t};\n\n\t\t\t_.each( newOrder, function( cid, index ) {\n\t\t\t\tvar optionModel = setting.collection.get( { cid: cid } );\n\t\t\t\tvar oldPos = optionModel.get( 'order' );\n\t\t\t\toptionModel.set( 'order', index );\n\t\t\t\tvar newPos = index;\n\n\t\t\t\tdata.objModels.push( {\n\t\t\t\t\tmodel: optionModel,\n\t\t\t\t\tattr: 'order',\n\t\t\t\t\tbefore: oldPos,\n\t\t\t\t\tafter: newPos\n\t\t\t\t} );\n\t\t\t} );\n\t\t\t\n\t\t\tsetting.collection.sort( { silent: true } );\n\t\t\t\n\t\t\tvar image = {\n\t\t\t\tobject: setting.dataModel.get( 'objectType' ),\n\t\t\t\timage: setting.dataModel.get( 'image' ),\n\t\t\t\tchange: 'Option ' + dragModel.get( 'image' ) + ' re-ordered from ' + dragModel._previousAttributes.order + ' to ' + dragModel.get( 'order' ),\n\t\t\t\tdashicon: 'sort'\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'sortListOptions', dragModel, null, image, data );\n\t\t\tthis.triggerDataModel( dragModel, setting.dataModel );\n\t\t\tnfRadio.channel( 'image-option-repeater' ).trigger( 'sort:option', dragModel, setting );\n\t\t\tnfRadio.channel( 'image-option-repeater-' + setting.model.get( 'name' ) ).trigger( 'sort:option', dragModel, setting );\n\t\t},\n\n\t\t/**\n\t\t * When we stop sorting our list options, reset our item opacity.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopOptionSortable: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t},\n\n\t\t/**\n\t\t * When we start sorting our list options, remove containing divs and set our item opacity to 0.5\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Objects ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartOptionSortable: function( ui ) {\n\t\t\tjQuery( ui.placeholder ).find( 'div' ).remove();\n\t\t\tjQuery( ui.item ).css( 'opacity', '0.5' ).show();\n\t\t},\n\n\t\t/**\n\t\t * Convert settings from an array/object to a collection/model\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Backbone.Model dataModel\n\t\t * @param Backbone.Model settingModel\n\t\t * @return void\n\t\t */\n\t\tconvertSettings: function( dataModel, settingModel ) {\n\t\t\t/*\n\t\t\t * Our options are stored in our database as objects, not collections.\n\t\t\t * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n\t\t\t */ \n\t\t\tvar optionCollection = dataModel.get( settingModel.get( 'name' ) );\n\n\t\t\tif ( false == optionCollection instanceof Backbone.Collection ) {\n\t\t\t\toptionCollection = new listOptionCollection( [], { settingModel: settingModel } );\n\t\t\t\toptionCollection.add( dataModel.get( settingModel.get( 'name' ) ) );\n\t\t\t\tdataModel.set( settingModel.get( 'name' ), optionCollection, { silent: true } );\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles adding and removing the active class from a field currently being edited.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/editActive',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests to remove the active class from all our fields.\n\t\t\tnfRadio.channel( 'fields' ).reply( 'clear:editActive', this.clearEditActive, this );\n\t\t\t// Listen for the closing drawer so that we can remove all of our active classes.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-editSettings' ), 'before:closeDrawer', this.clearEditActive );\n\t\t},\n\n\t\t/**\n\t\t * Loops through our fields collection and sets editActive to false.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n clearEditActive: function() {\n var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n _.each( fieldCollection.models, function( field ) {\n\t\t\t\tfield.set( 'editActive', false );\n } );\n }\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Fetches settings models so that we can get setting information\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldSettings',['models/app/settingCollection'], function( settingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.collection = new settingCollection( fieldSettings, { objectType: 'fields' } );\n\n\t\t\t// Responds to requests for settings models.\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:settingModel', this.getSettingModel, this );\n\t\t\t\n\t\t\t// Responds to requests for our collection.\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:settingCollection', this.getSettingCollection, this );\n\t\t},\n\n\t\tgetSettingModel: function( name ) {\n\t\t\treturn this.collection.findWhere( { name: name } );\n\t\t},\n\n\t\tgetSettingCollection: function() {\n\t\t\treturn this.collection;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel to add the individual Credit Card Fields.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldCreditCard',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n this.listenTo( nfRadio.channel( 'fields' ), 'after:addField', this.dropCreditCardField );\n },\n\n dropCreditCardField: function( fieldModel ) {\n\n if( 'creditcard' == fieldModel.get( 'type' ) ) {\n\n var order = fieldModel.get( 'order' );\n\n nfRadio.channel( 'fields' ).request( 'delete', fieldModel );\n\n _.each( [ 'creditcardfullname', 'creditcardnumber', 'creditcardcvc', 'creditcardexpiration', 'creditcardzip'], function( type ) {\n\n var fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\n var newField = {\n id: nfRadio.channel( 'fields' ).request( 'get:tmpID' ),\n type: type,\n label: fieldType.get( 'nicename' ),\n order: order\n };\n\n nfRadio.channel( 'fields' ).request( 'add', newField );\n });\n }\n\n },\n\n stageCreditCardField: function( model ) {\n\n if( 'creditcard' == model.get( 'slug' ) ) {\n\n nfRadio.channel( 'fields' ).request( 'remove:stagedField', '', model );\n\n _.each( [ 'creditcardfullname', 'creditcardnumber', 'creditcardcvc', 'creditcardexpiration', 'creditcardzip'], function( type ) {\n nfRadio.channel('fields').request('add:stagedField', type );\n });\n }\n }\n\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel to add the individual List Fields.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldList',[ 'models/app/optionRepeaterCollection' ], function( ListOptionCollection ) {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n this.listenTo( nfRadio.channel( 'option-repeater-option-label' ), 'update:option', this.updateOptionLabel );\n this.listenTo( nfRadio.channel( 'option-repeater-option-value' ), 'update:option', this.updateOptionValue );\n \n /*\n * When we init our model, convert our options from an array of objects to a collection of models.\n */\n this.listenTo( nfRadio.channel( 'fields-list' ), 'init:fieldModel', this.convertOptions );\n },\n\n updateOptionLabel: function( e, model, dataModel, settingModel, optionView ) {\n\n if( 'list' != _.findWhere( fieldTypeData, { id: dataModel.get( 'type' ) } ).parentType ) return;\n\n if( model.get( 'manual_value' ) ) return;\n\n value = jQuery.slugify( model.get( 'label' ), { separator: '-' } );\n\n model.set( 'value', value );\n model.trigger( 'change', model );\n\n // Set focus on value input\n jQuery( optionView.el ).find( '[data-id=\"value\"]' ).focus().select();\n },\n\n updateOptionValue: function( e, model, dataModel, settingModel, optionView ) {\n if ( 'Field' == dataModel.get( 'objectType' ) ) {\n var newVal = model.get( 'value' );\n // Sanitize any unwanted special characters.\n // TODO: This assumes English is the standard language.\n // We might want to allow other language characters through this check later.\n var pattern = /[^0-9a-zA-Z _@.-]/g;\n newVal = newVal.replace( pattern, '' );\n model.set( 'value', newVal );\n // Re-render the value.\n optionView.render();\n }\n \n var findWhere = _.findWhere( fieldTypeData, { id: dataModel.get( 'type' ) } );\n if( 'undefined' == typeof findWhere ) return;\n if( 'list' != findWhere.parentType ) return;\n\n model.set( 'manual_value', true );\n \n // Set focus on calc input\n jQuery( optionView.el ).find( '[data-id=\"calc\"]' ).focus().select();\n },\n\n convertOptions: function( fieldModel ) {\n /*\n * Our options are stored in our database as objects, not collections.\n * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n */ \n var options = fieldModel.get( 'options' );\n\n var settingModel = nfRadio.channel( 'fields' ).request( 'get:settingModel', 'options' );\n\n if ( false == options instanceof Backbone.Collection ) {\n options = new ListOptionCollection( [], { settingModel: settingModel } );\n options.add( fieldModel.get( 'options' ) );\n fieldModel.set( 'options', options, { silent: true } );\n }\n }\n\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel to add the individual Credit Card Fields.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldPassword',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n this.listenTo( nfRadio.channel( 'fields' ), 'after:addField', this.addField );\n },\n\n addField: function( model ) {\n\n if( 'password' == model.get( 'type' ) ) {\n\n var order = model.get( 'order' );\n\n var confirm = this.insertField( 'passwordconfirm', order + 1 );\n\n confirm.set( 'confirm_field', model.get( 'key' ) );\n }\n },\n\n insertField: function( type, order ) {\n var fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\n var newField = {\n id: nfRadio.channel( 'fields' ).request( 'get:tmpID' ),\n type: type,\n label: fieldType.get( 'nicename' ),\n order: order\n };\n\n return nfRadio.channel('fields').request('add', newField );\n }\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're rendering a product_assignment setting, add our products to the data model.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldQuantity',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for messages that are fired before a setting view is rendered.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n\t\t},\n\n\t\tbeforeRenderSetting: function( settingModel, dataModel, view ) {\n\t\t\tif ( 'product_assignment' == settingModel.get( 'name' ) ) {\n\t\t\t\tvar productFields = this.getProductFields( settingModel );\n\t\t\t\tsettingModel.set( 'options', productFields );\n\t\t\t}\n\t\t},\n\n\t\tgetProductFields: function( settingModel ) {\n\t\t\tvar productFields = [ settingModel.get( 'select_product' ) ];\n\t\t\t// Update our dataModel with all of our product fields.\n\t\t\tvar fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t_.each( fields.models, function( field ) {\n\t\t\t\tif ( 'product' == field.get( 'type' ) ) {\n\t\t\t\t\tproductFields.push( { label: field.get( 'label' ), value: field.get( 'id' ) } );\n\t\t\t\t}\n\t\t\t} );\n\t\t\treturn productFields;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're rendering a product_assignment setting, add our products to the data model.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldShipping',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-shipping_options' ), 'render:setting', this.addMask );\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-shipping_options-option' ), 'render:setting', this.addMask );\n\t\t},\n\n\t\taddMask: function( settingModel, dataModel, view ) {\n\t\t\tjQuery( view.el ).find( '[data-id=\"value\"]' ).each( function() {\n\t\t\t\tjQuery( this ).autoNumeric({\n\t\t\t\t\taSign: '$', // TODO: Use form setting\n\t\t\t\t\taSep: thousandsSeparator,\n\t\t\t\t\taDec: decimalPoint\n\t\t\t\t});\n\t\t\t} );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * When we add a new field, update its key.\n *\n * When we change the key, update any refs to the key.\n *\n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/key',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// When we add a field, update its key.\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'add:field', this.newFieldKey );\n\n\t\t\t// When we edit a label, update our key.\n\t\t\tthis.listenTo( nfRadio.channel( 'fieldSetting-label' ), 'update:setting', this.updateLabel );\n\n\t\t\t// When we edit a key, check for places that key might be used.\n\t\t\tthis.listenTo( nfRadio.channel( 'fieldSetting-key' ), 'update:setting', this.updateKey );\n\n\t\t\t// When we type inside the admin key field, we need to save our manual_key setting.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-key' ), 'keyup:setting', this.keyUp );\n\t\t},\n\n\t\t/**\n\t\t * Add a key to our new field model.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param backbone.model model new field model\n\t\t * @return void\n\t\t */\n\t\tnewFieldKey: function( model ) {\n\t\t\tvar d = new Date();\n\t\t\tvar n = d.valueOf();\n\t\t\tvar key = this.slugify( model.get( 'type' ) + '_' + n );\n\n\t\t\tmodel.set( 'key', key, { silent: true } );\n\n\t\t\tif( 'undefined' == model.get( 'manual_key' ) ) {\n\t\t\t\tmodel.set('manual_key', false, {silent: true});\n\t\t\t}\n\t\t},\n\n\t\tupdateLabel: function( model ) {\n\n\t\t\t/*\n\t\t\t * If we haven't entered a key manually, update our key when our label changes.\n\t\t\t */\n\t\t\tif ( ! model.get( 'manual_key' ) && 0 != jQuery.trim( model.get( 'label' ) ).length ) {\n\t\t\t\t/*\n\t\t\t\t * When we're editing settings, we expect the edits to fire one at a time.\n\t\t\t\t * Since we're calling this in the middle of our label update, anything that inquires about what has changed after we set our key will see both label and key.\n\t\t\t\t * We need to remove the label from our model.changed property so that all that has changed is the key.\n\t\t\t\t *\n\t\t\t\t */\n\t\t\t\tdelete model.changed.label;\n\t\t\t\tvar d = new Date();\n\t\t\t\tvar n = d.valueOf();\n\t\t\t\tvar key = this.slugify( model.get( 'label' ) + '_' + n );\n // If our slug didn't setup correctly...\n // Force a valid entry.\n if ( -1 == key.indexOf( '_' ) ) key = 'field_' + key;\n\t\t\t\tmodel.set( 'key', key );\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When a field key is updated, find any merge tags using the key and update them.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param backbone.model model field model\n\t\t * @return void\n\t\t */\n\t\tupdateKey: function( dataModel ) {\n\t\t\tvar key = dataModel.get( 'key' );\n\t\t\tthis.settingModel = nfRadio.channel( 'fields' ).request( 'get:settingModel', 'key' );\n\t\t\tthis.setError( key, dataModel );\n\t\t},\n\n\t\tkeyUp: function( e, settingModel, dataModel ) {\n\t\t\tdataModel.set( 'manual_key', true );\n\t\t\tthis.settingModel = settingModel;\n\t\t\tvar key = jQuery( e.target ).val();\n\t\t\tthis.setError( key, dataModel );\n\t\t},\n\n\t\tsetError: function( key, dataModel ) {\n\t\t\tvar error = false;\n\t\t\tif ( '' == jQuery.trim( key ) ) {\n\t\t\t\terror = 'Field keys can\\'t be empty. Please enter a key.';\n\t\t\t} else if ( key != key.toLowerCase() ) {\n\t\t\t\terror = 'Field keys must be lowercase.';\n\t\t\t} else if ( key != key.replace( ' ', '_' ) ) {\n\t\t\t\terror = 'Field keys must cannot use spaces. Separate with \"_\" instead.';\n\t\t\t} else if ( '_' == key.slice( -1 ) ) {\n\t\t\t\terror = 'Field keys cannot end with a \"_\"';\n\t\t\t} else if ( key != this.slugify( key ) ) {\n\t\t\t\terror = 'Invalid Format.';\n\t\t\t} else if ( key != this.keyExists( key, dataModel ) ) {\n\t\t\t\terror = 'Field keys must be unique. Please enter another key.'\n\t\t\t}\n\n\t\t\tif ( error ) {\n\t\t\t\tthis.settingModel.set( 'error', error );\n\t\t\t} else {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'update:fieldKey', dataModel );\n\t\t\t\tthis.settingModel.set( 'error', false );\n\t\t\t}\n\t\t},\n\n\t\tkeyExists: function( key, dataModel ) {\n\t\t\tvar newKey = this.slugify( key );\n\t\t\tif ( 0 != newKey.length ) {\n\t\t\t\tkey = newKey;\n\t\t\t}\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\tvar x = 1;\n\t\t\tvar testKey = key;\n\t\t\t_.each( fieldCollection.models, function( field ) {\n\t\t\t\tif ( dataModel != field && testKey == field.get( 'key' ) ) {\n\t\t\t\t\ttestKey = key + '_' + x;\n\t\t\t\t\tx++;\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tkey = testKey;\n\n\t\t\treturn key;\n\t\t},\n\n\t\tslugify: function( string ){\n\t\t\treturn jQuery.slugify( string, { separator: '_' } )\n\t\t}\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Creates notices for our fields domain.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/notices',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'add:stagedField', this.addStagedField );\n\t\t},\n\n\t\taddStagedField: function( model ) {\n\t\t\tnfRadio.channel( 'notices' ).request( 'add', 'addStagedField', model.get( 'nicename' ) + ' added to staging' );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles mobile-specific JS for our fields domain.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/mobile',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for the start of our sorting.\n\t\t\t// this.listenTo( nfRadio.channel( 'app' ), 'render:fieldsSortable', this.initWiggle );\n\t\t\t// Listen for when we start sorting.\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'sortable:start', this.startWiggle );\n\t\t\t// Listen for when we stop sorting.\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'sortable:stop', this.stopWiggle );\n\t\t},\n\n\t\tinitWiggle: function( view ) {\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( view.el ).find( '.nf-field-wrap' ).on( 'taphold', function() {\n\t\t\t\t\tjQuery( this ).ClassyWiggle( 'start', { degrees: ['.65', '1', '.65', '0', '-.65', '-1', '-.65', '0'], delay: 50 } );\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\n\t\tstartWiggle: function( ui ) {\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( ui.item ).removeClass( 'ui-sortable-helper' ).ClassyWiggle( 'stop' );\n\t\t\t\tjQuery( ui.helper ).css( 'opacity', '0.75' ).ClassyWiggle( 'start', { degrees: ['.5', '1', '.5', '0', '-.5', '-1', '-.5', '0'] } );\n\t\t\t}\n\t\t},\n\n\t\tstopWiggle: function( ui ) {\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( ui.helper ).ClassyWiggle( 'stop' );\n\t\t\t\tjQuery( ui.item ).removeClass( 'ui-sortable-helper drag-selected' );\n\t\t\t}\n\t\t}\n\t});\n\n\treturn controller;\n} );\n\n/**\n * If we add a saved field to our form and then update it, set the \"saved\" flag to false.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/savedFields',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tignoreAttributes: [\n\t\t\t'editActive',\n\t\t\t'order',\n\t\t\t'saved',\n\t\t\t'jBox'\n\t\t],\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'update:setting', this.updateField );\n\t\t\t// Listen to clicks on our add saved field button.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:addSavedField', this.clickAddSavedField, this );\n\t\t},\n\n\t\tupdateField: function( dataModel ) {\n\t\t\tif ( dataModel.get( 'saved' ) ) {\n\t\t\t\t\n\t\t\t\tvar modified = false;\n\t\t\t\tvar changedAttributes = _.keys( dataModel.changedAttributes() );\n\t\t\t\tvar that = this;\n\t\t\t\t_.each( changedAttributes, function( changed ) {\n\t\t\t\t\tif ( -1 == that.ignoreAttributes.indexOf( changed ) ) {\n\t\t\t\t\t\tmodified = true;\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\t\n\t\t\t\tif ( modified ) {\n\t\t\t\t\tdataModel.set( 'saved', false );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tclickAddSavedField: function( e, dataModel ) {\n\t\t\tvar modelClone = nfRadio.channel( 'app' ).request( 'clone:modelDeep', dataModel );\n\n\t\t\tvar fieldData = modelClone.attributes;\n\t\t\tfieldData.saved = true;\n\n\t\t\tdelete fieldData.jBox;\n\t\t\tdelete fieldData.editActive;\n\t\t\tdelete fieldData.created_at;\n\t\t\tdelete fieldData.order;\n\t\t\tdelete fieldData.id;\n\t\t\tdelete fieldData.formID;\n\t\t\tdelete fieldData.parent_id;\n\t\t\t\n\t\t\tvar type = nfRadio.channel( 'fields' ).request( 'get:type', fieldData.type );\n\t\t\tvar newType = _.clone( type.attributes );\n\n\t\t\tvar nicename = jQuery( e.target ).parent().parent().find( 'input' ).val();\n\t\t\tconsole.log( nicename );\n\t\t\tnewType.nicename = nicename;\n\t\t\tfieldData.label = nicename;\n\t\t\tfieldData.nicename = nicename;\n\t\t\tdataModel.set( 'addSavedLoading', true );\n\t\t\tvar newTypeDefaults = JSON.stringify( fieldData );\n\n\t\t\tjQuery.post( ajaxurl, { action: 'nf_create_saved_field', field: newTypeDefaults, security: nfAdmin.ajaxNonce }, function( response ) {\n\t\t\t\tresponse = JSON.parse( response );\n\t\t\t\tnewType.id = response.data.id;\n\t\t\t\tnewType.nicename = nicename;\n\t\t\t\tnewType.settingDefaults = fieldData;\n\n\t\t\t\tvar typeCollection = nfRadio.channel( 'fields' ).request( 'get:typeCollection' );\n\t\t\t\tvar newModel = typeCollection.add( newType );\n\n\t\t\t\tvar typeSections = nfRadio.channel( 'fields' ).request( 'get:typeSections' );\n\t\t\t\ttypeSections.get( 'saved' ).get( 'fieldTypes' ).push( newType.id );\n\n\t\t\t\t// dataModel.set( 'type', response.data.id );\n\t\t\t\tdataModel.set( 'addSavedLoading', false );\n\t\t\t\tdataModel.unset( 'addSavedLoading', { silent: true } );\n\t\t\t\tdataModel.get( 'jBox' ).close();\n\t\t\t\t// dataModel.set( 'saved', true );\n\n\t\t\t\tnfRadio.channel( 'notices' ).request( 'add', 'addSaved', 'Saved Field Added' );\n\t\t\t} );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're rendering a datepicker setting, add our datepicker.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldDatepicker',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-type-datepicker' ), 'render:setting', this.addDatepicker );\n\t\t},\n\n\t\taddDatepicker: function( settingModel, dataModel, view ) {\n\t\t\t//Switch to flatpickr from pikaday\n\t\t\tlet el = jQuery( view.el ).find( '.setting' )[0];\n\t\t\tlet datePickerSettings = {};\n\n\t\t\t// Allow fields to add settings to the datepicker.\n\t\t\tlet filteredDatePickerSettings = nfRadio.channel( 'setting-type-datepicker' ).request( 'filter:settings', datePickerSettings, settingModel, el );\n\t\t\tif ( 'undefined' != typeof filteredDatePickerSettings ) {\n\t\t\t\tdatePickerSettings = filteredDatePickerSettings;\n\t\t\t}\n\n\t\t\tvar dateObject = flatpickr( el, datePickerSettings );\n\n\t\t\tnfRadio.channel( 'setting-type-datepicker' ).trigger( 'loadComplete', dateObject, settingModel, dataModel, view );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're rendering a product_assignment setting, add our products to the data model.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldDisplayCalc',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for messages that are fired before a setting view is rendered.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-calc_var' ), 'before:renderSetting', this.beforeRenderSetting );\n\t\t},\n\n\t\tbeforeRenderSetting: function( settingModel, dataModel, view ) {\n\t\t\t// console.log( 'render!' );\n\t\t},\n\n\t\tgetProductFields: function( settingModel ) {\n\t\t\tvar productFields = [ settingModel.get( 'select_product' ) ];\n\t\t\t// Update our dataModel with all of our product fields.\n\t\t\tvar fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t_.each( fields.models, function( field ) {\n\t\t\t\tif ( 'product' == field.get( 'type' ) ) {\n\t\t\t\t\tproductFields.push( { label: field.get( 'label' ), value: field.get( 'id' ) } );\n\t\t\t\t}\n\t\t\t} );\n\t\t\treturn productFields;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles specifics for our repeater field types.\n *\n */\ndefine( 'controllers/fields/fieldRepeater',[ 'models/fields/fieldCollection' ], function( fieldCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\n\t\tinitialize: function() {\n\t\t\t// Listen for repeater field models.\n\t\t\tthis.listenTo( nfRadio.channel( 'fields-repeater' ), 'init:fieldModel', this.setupCollection, this );\n\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'add:childField', this.addChildField, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'receive:fields', this.receiveFields, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'get:childField', this.getChildField, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'process:stagedField', this.processStagedFields, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'sort:repeaterField', this.sortRepeaterField, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'over:repeaterField', this.overRepeaterField, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'out:repeaterField', this.outRepeaterField, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'stop:repeaterField', this.stopRepeaterField, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'start:repeaterField', this.startRepeaterField, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'update:repeaterField', this.updateRepeaterField, this );\n\t\t},\n\n\t\t/**\n\t\t * When we save repeater fields, their 'fields' content will be saved as an array of objects.\n\t\t * When a repeater field model is created, we need to hyrdate the 'fields' settings and turn it into a Backbone Collection.\n\t\t * \n\t\t * @since version\n\t\t * @param {[type]} fieldModel [description]\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tsetupCollection: function( fieldModel ) {\n\t\t\t// The fields var will be an array of field model data.\n\t\t\tlet fields = fieldModel.get( 'fields' );\n\n\t\t\t// Only turn it into a collection if we haven't already.\n\t\t\tif ( false === fields instanceof Backbone.Collection ) {\n\t\t\t\tlet collection = new fieldCollection( fields );\n\t\t\t\tfieldModel.set( 'fields', collection );\n\n\t\t\t\t//Allows to loop through Repeater fields to reset correct state\n\t\t\t\tcollection.listenTo( nfRadio.channel( 'fields-repeater' ), 'clearEditActive', this.clearEditActive, collection );\n\t\t\t\tcollection.listenTo( nfRadio.channel( 'app' ), 'after:appStart', this.clearEditActive, collection );\n\t\t\t\t\n\t\t\t\t// Listen for radio messages that a field was deleted.\n\t\t\t\tcollection.listenTo( nfRadio.channel( 'fields' ), 'delete:field', this.maybeDeleteField, collection );\n\t\t\t}\t\n\t\t},\n\n\t\t/**\n\t\t * In order to delete items from within a repeater field without creating a new convention, we listen to radio messages for field deletion.\n\t\t * We just have to make sure that these fields weren't just added to our repeater field collection.\n\t\t * \n\t\t * @since version\n\t\t * @param {[type]} fieldModel [description]\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tmaybeDeleteField: function( fieldModel ) {\n\t\t\t// Make sure that we didn't just add this field to our repeater.\n\t\t\tif ( ! fieldModel.get( 'droppedInRepeater' ) ) {\n\t\t\t\tthis.remove( fieldModel );\n\t\t\t}\n\t\t\t// We're done dropping now.\n\t\t\tfieldModel.set( 'droppedInRepeater', false );\n\t\t},\n\n\t\t/**\n\t\t * Loops through our fields collection and sets editActive to false.\n\t\t * \n\t\t * @param {[type]} fieldModel field that was clicked\n\t\t * @return void\n\t\t */\n clearEditActive: function( model ) {\n _.each( this.models, function( field ) {\n\t\t\t\tif( model.cid !== field.cid ){\n\t\t\t\t\tfield.set( 'editActive', true );\n\t\t\t\t\tfield.set( 'editActive', false );\n\t\t\t\t}\n } );\n\t\t},\n\n\n\t\t/**\n\t\t * Receive fields in the repeater field sortable zone\n\t\t * \n\t\t */\n\t\treceiveFields: function( ui, that, e ) {\n\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-stage' ) ) {\n\t\t\t\tthis.processStagedFields( ui, that, e );\n\t\t\t} else {\n\t\t\t\tthis.addChildField(ui, that, e);\n\t\t\t}\n\n\t\t},\t\n\t\t\n\t\t/**\n\t\t * Add a field in the repeater fields collection\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\taddChildField: function( ui, that, e ) {\n\n\t\t\tlet type = typeof ui.item !== \"undefined\" ? jQuery( ui.item ).data( 'id' ) : ui.get('slug'),\n\t\t\tdroppedFieldModel = nfRadio.channel( 'fields' ).request( 'get:field', type ),\n\t\t\tcollection = that.repeaterFieldModel.get( 'fields' ),\n\t\t\tfieldModel;\n\t\t\t\n\t\t\t\n\t\t\t//Don't process another repeater field\n\t\t\tif(type === \"repeater\") return;\n\t\t\t\n\t\t\t//If a field Model exists and comes from the builder get the field Type and delete Field Model from main collection\n\t\t\tif(droppedFieldModel != null){\n\t\t\t\t//Reset type based on the model\n\t\t\t\ttype = droppedFieldModel.attributes.type;\n\t\t\t\t// Remove the field from the main field collection.\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:delete', e, droppedFieldModel );\n\t\t\t}\n\n\t\t\t// Get our field type model\n\t\t\tfieldModel = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\n\t\t\t// Get our tmp ID\n\t\t\tlet elId = nfRadio.channel( 'fields' ).request( 'get:tmpID' ) != null ? nfRadio.channel( 'fields' ).request( 'get:tmpID' ) : \"tmp\";\n\t\t\t//Add field to collection\n\t\t\tnewField = collection.add( { id: elId , label: fieldModel.get( 'nicename' ), type: type, repeaterField: true} );\n\n\t\t\t//Sort fields\n\t\t\tlet sortableEl = nfRadio.channel( 'fields-repeater' ).request( 'get:sortableEl' );\n\t\t\tif(! jQuery(sortableEl).hasClass('ui-sortable')){\n\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'init:sortable' );\n\t\t\t}\n\t\t\tlet sortableElArray = jQuery( sortableEl ).sortable( 'toArray' );\n\t\t\t_.each( sortableElArray, function( element, index ) {\n\t\t\t\tif(false === element.length > 0){\n\t\t\t\t\tsortableElArray[index] = elId;\n\t\t\t\t} else if (element === elId) {\n\t\t\t\t\tsortableElArray.splice( index, 1);\n\t\t\t\t}\n\t\t\t});\n\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'sort:repeaterField', sortableElArray);\n\n\t\t\t// Add our field addition to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: 'Field',\n\t\t\t\tlabel: newField.get( 'label' ),\n\t\t\t\tchange: 'Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: collection\n\t\t\t}\n\t\t\t\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', newField, null, label, data );\n\n\t\t\t\n\t\t\tif( typeof elId !== \"undefined\" && typeof ui.helper !== \"undefined\" ){\n\t\t\t\t/*\n\t\t\t\t* Update our helper id to the tmpID.\n\t\t\t\t* We do this so that when we sort, we have the proper ID.\n\t\t\t\t*/ \n\t\t\t\tjQuery( ui.helper ).prop( 'id', elId );\n\t\t\t\t//Sort fields in repeater\n\t\t\t\tnfRadio.channel( 'app' ).request( 'stop:fieldsSortable', ui );\n\t\t\t\t// Remove the helper. Gets rid of a weird type artifact.\n\t\t\t\tjQuery( ui.helper ).remove();\n\t\t\t\t// Trigger a drop field type event.\n\t\t\t\tnfRadio.channel( 'fields' ).trigger( 'drop:fieldType', type, elId );\n\t\t\t}\n\n\t\t\treturn elId;\n\n\t\t},\n\n\t\t/**\n\t\t * Get a field from a repeater field collection\n\t\t * \n\t\t * @return fieldModel\n\t\t */\n\t\tgetChildField: function( childFieldID, parentFieldModel, newID ) {\n\n\t\t\tif( typeof childFieldID === \"undefined\") return;\n\t\t\t//Prepare retuned variable\n\t\t\tlet childFieldModel;\n\t\t\t//Allow to retrieve parentFieldModel by the newID that contains the parent Field ID ( USed to update a field ID after saving the form )\n\t\t\tif( parentFieldModel == null && typeof newID !== \"undefined\" ){\n\t\t\t\tconst parentID = newID.split('.')[0];\n\t\t\t\tparentFieldModel = nfRadio.channel( 'fields' ).request( 'get:field', parentID );\n\t\t\t}\n\t\t\t\n\t\t\t//Check we have the Repeater Field Model\n\t\t\tif( parentFieldModel ) {\n\t\t\t\t//Get the fields collection in the repeater Field model\n\t\t\t\tlet repeaterFieldsCollection = parentFieldModel.get( 'fields' );\n\t\t\t\t//Get the Child Field Model\n\t\t\t\tchildFieldModel = repeaterFieldsCollection.get( childFieldID );\n\t\t\t}\n\t\t\t\n\t\t\treturn childFieldModel;\n\t\t},\n\n\t\t/**\n\t\t * Add Staged fields to repeater fieldset\n\t\t * \n\t\t * @paran object event dropped\n\t\t * @param object ui dropped element\n\t\t */\n\t\tprocessStagedFields( ui, that, e) {\n\n\t\t\t// Make sure that our staged fields are sorted properly.\t\n\t\t\tnfRadio.channel( 'fields' ).request( 'sort:staging' );\n\t\t\t// Grab our staged fields.\n\t\t\tvar stagedFields = nfRadio.channel( 'fields' ).request( 'get:staging' );\n\n\t\t\t// Get our current field order.\n\t\t\tvar sortableEl = nfRadio.channel( 'fields-repeater' ).request( 'get:sortableEl' );\n\n\t\t\tlet order = [];\n\t\t\tif ( jQuery( sortableEl ).hasClass( 'repeater' ) ) { // Sortable isn't empty\n\t\t\t\t// If we're dealing with a sortable that isn't empty, get the order.\n\t\t\t\torder = jQuery( sortableEl ).sortable( 'toArray' );\n\t\t\t} else { // Sortable is empty\n\t\t\t\t// Sortable is empty, all we care about is our staged field draggable.\n\t\t\t\torder = ['nf-staged-fields-drag'];\n\t\t\t} \n\t\t\t\n\t\t\t// Get the index of our droped element.\n\t\t\tlet insertedAt = order.indexOf( 'nf-staged-fields-drag' );\n\n\t\t\t// Loop through each staged fields model and insert a field.\n\t\t\t_.each( stagedFields.models, function( field, index ) {\n\t\t\t\t// Add our field.\n\t\t\t\tvar tmpID = nfRadio.channel( 'fields-repeater' ).request( 'add:childField', field, that, e );\n\t\t\t\t// Add this newly created field to our order array.\n\t\t\t\torder.splice( insertedAt + index, 0, tmpID );\n\t\t\t\t\n\t\t\t} );\n\n\t\t\t// Remove our dropped element from our order array.\n\t\t\tinsertedAt = order.indexOf( 'nf-staged-fields-drag' );\n\t\t\torder.splice( insertedAt, 1 );\n\n\t\t\t// Sort our fields\n\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields', order );\n\t\t\t// Clear our staging\n\t\t\tnfRadio.channel( 'fields' ).request( 'clear:staging' );\n\t\t\t// Remove our helper. Fixes a weird artifact.\n\t\t\tjQuery( ui.helper ).remove();\n\n\t\t},\n\n\t\t/**\n\t\t * Sort the fields in a repeater Field\n\t\t * \n\t\t * @param Array \torder optional order array like: [field-1, field-4, field-2]\n\t\t * @return void\n\t\t */\n\t\tsortRepeaterField: function( order, ui, updateDB ) {\n\t\t\t// Add the field to this repeatable collection.\n\t\t\tlet collection = nfRadio.channel( 'fields-repeater' ).request( 'get:repeaterFieldsCollection' );\n\n\t\t\tif ( null == updateDB ) {\n\t\t\t\tupdateDB = true;\n\t\t\t}\n\t\t\t// Get our sortable element\n\t\t\tvar sortableEl = nfRadio.channel( 'fields-repeater' ).request( 'get:sortableEl' );\n\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) { // Make sure that sortable is enabled\n\t\t\t\t// JS ternerary for setting our order\n\t\t\t\tvar order = order || jQuery( sortableEl ).sortable( 'toArray' );\n\t\t\t\t// Loop through all of our fields and update their order value\n\t\t\t\t_.each( collection.models, function( field ) {\n\t\t\t\t\t// Get our current position.\n\t\t\t\t\tvar oldPos = field.get( 'order' );\n\t\t\t\t\tvar id = field.get( 'id' );\n\t\t\t\t\tif ( jQuery.isNumeric( id ) ) {\n\t\t\t\t\t\tvar search = 'field-' + id;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tvar search = id;\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\t// Get the index of our field inside our order array\n\t\t\t\t\tvar newPos = order.indexOf( search ) + 1;\n\t\t\t\t\tfield.set( 'order', newPos );\n\t\t\t\t} );\n\n\t\t\t\tcollection.sort();\n\t\t\t\t\n\t\t\t\tif ( updateDB ) {\n\t\t\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\t\t\t// Update our preview\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\t\t\t\t\t\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When the user drags a field type or staging over our sortable, we need to modify the helper.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toverRepeaterField: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type\n\t\t\t\t// String type\n\t\t\t\tvar type = jQuery( ui.helper ).data( 'id' );\n\t\t\t\t// Get our field type model.\n\t\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\t\t\t\t// Get our field type nicename.\n\t\t\t\tvar label = fieldType.get( 'nicename' );\n\t\t\t\t// Get our sortable element.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields-repeater' ).request( 'get:sortableEl' );\n\n\t\t\t\t// Set our currentHelper to an object var so that we can access it later.\n\t\t\t\tthis.currentHelper = ui.helper;\n\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// Get our sortable, and if it's initialized add our hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields-repeater' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).addClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When the user moves a draggable outside of the sortable, we need to change the helper.\n\t\t * This returns the item to its pre-over state.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toutRepeaterField: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type\n\t\t\t\t/*\n\t\t\t\t * Get our helper clone.\n\t\t\t\t * This will let us access the previous label and classes of our helper.\n\t\t\t\t */ \n\t\t\t\tvar helperClone = nfRadio.channel( 'drawer-addField' ).request( 'get:typeHelperClone' );\n\t\t\t\t// Set our helper label, remove our sortable class, and add the type class back to the type draggable.\n\t\t\t\tjQuery( this.currentHelper ).html( jQuery( helperClone ).html() );\n\t\t\t\tjQuery( this.currentHelper ).removeClass( 'nf-field-wrap' ).addClass( 'nf-field-type-button' ).css( { 'width': '', 'height': '' } );\n\t\t\t\t// Get our sortable and if it has been intialized, remove the droppable hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields-repeater' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// If we've initialized our sortable, remove the droppable hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields-repeater' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging in the sortable:\n\t\t * remove our opacity setting\n\t\t * remove our ui helper\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopRepeaterField: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t\tjQuery( ui.helper ).remove();\n\t\t\t//nfRadio.channel( 'fields' ).trigger( 'sortable:stop', ui );\n\t\t},\n\n\t\t/**\n\t\t * When we start dragging in the sortable:\n\t\t * add an opacity setting of 0.5\n\t\t * show our item (jQuery hides the original item by default)\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartRepeaterField: function( ui ) {\n\t\t\t// If we aren't dragging an item in from types or staging, update our change log.\n\t\t\tif( ! jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) && ! jQuery( ui.item ).hasClass( 'nf-stage' ) ) { \n\t\t\t\t\n\t\t\t\t// Maintain origional visibility during drag/sort.\n\t\t\t\tjQuery( ui.item ).show();\n\n\t\t\t\t// Determine helper based on builder/layout type.\n\t\t\t\tif(jQuery(ui.item).hasClass('nf-field-wrap')){\n\t\t\t\t\tvar newHelper = jQuery(ui.item).clone();\n\t\t\t\t} else if(jQuery(ui.item).parent().hasClass('layouts-cell')) {\n\t\t\t\t\tvar newHelper = $parentHelper.clone();\n\t\t\t\t} else {\n\t\t\t\t\tvar newHelper = jQuery(ui.item).clone();\n\t\t\t\t}\n\n\t\t\t\t// Remove unecessary item controls from helper.\n\t\t\t\tnewHelper.find('.nf-item-controls').remove();\n\n\t\t\t\t// Update helper with clone's content.\n\t\t\t\tjQuery( ui.helper ).html( newHelper.html() );\n\n\t\t\t\tjQuery( ui.helper ).css( 'opacity', '0.5' );\n\t\t\t\t\n\t\t\t\t// Add de-emphasize origional.\n\t\t\t\tjQuery( ui.item ).css( 'opacity', '0.25' );\n\t\t\t}\n\t\t\t//nfRadio.channel( 'fields' ).trigger( 'sortable:start', ui );\n\t\t},\n\n\t\t/**\n\t\t * Sort our fields when we change the order.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tupdateRepeaterField: function( ui, sortable ) {\n\n\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'sort:repeaterField' );\n\n\t\t\t// If we aren't dragging an item in from types or staging, update our change log.\n\t\t\tif( ! jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) && ! jQuery( ui.item ).hasClass( 'nf-stage' ) ) { \n\n\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields-repeater' ).request( 'get:repeaterFieldsCollection' );\n\t\t\t\tvar dragFieldID = jQuery( ui.item ).prop( 'id' ).replace( 'field-', '' );\n\t\t\t\tvar dragModel = fieldCollection.get( dragFieldID );\n\n\t\t\t\t// Add our change event to the change tracker.\n\t\t\t\tvar data = { fields: [] };\n\t\t\t\t_.each( fieldCollection.models, function( field ) {\n\t\t\t\t\tvar oldPos = field._previousAttributes.order;\n\t\t\t\t\tvar newPos = field.get( 'order' );\n\t\t\t\t\t\n\t\t\t\t\tdata.fields.push( {\n\t\t\t\t\t\tmodel: field,\n\t\t\t\t\t\tattr: 'order',\n\t\t\t\t\t\tbefore: oldPos,\n\t\t\t\t\t\tafter: newPos\n\t\t\t\t\t} );\n\n\t\t\t\t} );\n\n\t\t\t\tvar label = {\n\t\t\t\t\tobject: 'Field',\n\t\t\t\t\tlabel: dragModel.get( 'label' ),\n\t\t\t\t\tchange: 'Re-ordered from ' + dragModel._previousAttributes.order + ' to ' + dragModel.get( 'order' ),\n\t\t\t\t\tdashicon: 'sort'\n\t\t\t\t};\n\n\t\t\t\t//nfRadio.channel( 'changes' ).request( 'register:change', 'sortFields', dragModel, null, label, data );\n\t\t\t}\n\n\t\t},\n\n\t});\n\n\t\n\t\n\treturn controller;\n} );\n/**\n * Creates and stores a collection of action types. This includes all of the settings shown when editing a field.\n *\n * Loops over our preloaded data and adds that to our action type collection\n *\n * Also responds to requests for data about action types\n *\n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/types',[ 'models/app/typeCollection' ], function( TypeCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\n\t\t\t/*\n\t\t\t * Instantiate \"installed\" actions collection.\n\t\t\t */\n\t\t\tthis.installedActions = new TypeCollection(\n\t\t\t\t_.filter( actionTypeData, function( type ) {\n\t\t\t\t\treturn type.section == 'installed';\n\t\t\t\t\t} \n\t\t\t\t),\n\t\t\t\t{\n\t\t\t\t\tslug: 'installed',\n\t\t\t\t\tnicename: nfi18n.installed\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.availableActions = new TypeCollection(\n\t\t\t\t_.filter( actionTypeData, function( type ) {\n\t\t\t\t\treturn type.section == 'available';\n\t\t\t\t\t} \n\t\t\t\t),\n\t\t\t\t{\n\t\t\t\t\tslug: 'available',\n\t\t\t\t\tnicename: nfi18n.available\n\t\t\t\t}\n\t\t\t);\n\n\t\t\t// Respond to requests to get field type, collection, settings, and sections\n\t\t\tnfRadio.channel( 'actions' ).reply( 'get:type', this.getType, this );\n\t\t\tnfRadio.channel( 'actions' ).reply( 'get:installedActions', this.getInstalledActions, this );\n\t\t\tnfRadio.channel( 'actions' ).reply( 'get:availableActions', this.getAvailableActions, this );\n\t\t},\n\n\t\t/**\n\t\t * Return a field type by id\n\t\t *\n\t\t * @since 3.0\n\t\t * @param string \t\t\tid \tfield type\n\t\t * @return backbone.model \tfield type model\n\t\t */\n\t\tgetType: function( id ) {\n\t\t\t// Search our installed actions first\n\t\t\tvar type = this.installedActions.get( id );\n\t\t\tif ( ! type ) {\n\t\t\t\ttype = this.availableActions.get( id );\n\t\t\t}\n \treturn type;\n },\n\n /**\n * Return the installed action type collection\n *\n * @since 3.0\n * @return backbone.collection \tfield type collection\n */\n\t\tgetInstalledActions: function() {\n \treturn this.installedActions;\n },\n\n /**\n * Return the available action type collection\n *\n * @since 3.0\n * @return backbone.collection \tfield type collection\n */\n\t\tgetAvailableActions: function() {\n \treturn this.availableActions;\n },\n\n /**\n * Add a field type to our staging area when the field type button is clicked.\n *\n * @since 3.0\n * @param Object e event\n * @return void\n */\n addStagedField: function( e ) {\n \tvar type = jQuery( e.target ).data( 'id' );\n \tnfRadio.channel( 'fields' ).request( 'add:stagedField', type );\n },\n\n /**\n * Return our field type settings sections\n *\n * @since 3.0\n * @return backbone.collection field type settings sections\n */\n getTypeSections: function() {\n return this.fieldTypeSections;\n }\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Model that represents our form action.\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/actions/actionModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tobjectType: 'Action',\n\t\t\tobjectDomain: 'actions',\n\t\t\teditActive: false\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Listen for model attribute changes\n\t\t\tthis.on( 'change', this.changeSetting, this );\n\n\t\t\t// Get our parent field type.\n\t\t\tvar actionType = nfRadio.channel( 'actions' ).request( 'get:type', this.get( 'type' ) );\n\n\t\t\tif( 'undefined' == typeof actionType ) return;\n\n\t\t\t// Loop through our action type \"settingDefaults\" and add any default settings.\n\t\t\tvar that = this;\n\t\t\t_.each( actionType.get( 'settingDefaults' ), function( val, key ) {\n\t\t\t\tif ( ! that.get( key ) ) {\n\t\t\t\t\tthat.set( key, val, { silent: true } );\n\t\t\t\t}\n\t\t\t} );\n\t\t\t\n\t\t\t/*\n\t\t\t * Trigger an init event on three channels:\n\t\t\t * \n\t\t\t * actions\n\t\t\t * action-type\n\t\t\t *\n\t\t\t * This lets specific field types modify model attributes before anything uses them.\n\t\t\t */ \n\t\t\tnfRadio.channel( 'actions' ).trigger( 'init:actionModel', this );\n\t\t\tnfRadio.channel( 'actions-' + this.get( 'type' ) ).trigger( 'init:actionModel', this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'fire:updateFieldKey', this.updateFieldKey );\n\t\t},\n\n\t\t/**\n\t\t * When we change the model attributes, fire an event saying we've changed something.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tchangeSetting: function( model, options ) {\n nfRadio.channel( 'actionSetting-' + _.keys( this.changedAttributes() )[0] ).trigger( 'update:setting', this, options.settingModel ) ;\n\t\t\tnfRadio.channel( 'actions').trigger( 'update:setting', this, options.settingModel );\n nfRadio.channel( 'app' ).trigger( 'update:setting', this, options.settingModel );\n\t\t},\n\n\t\tupdateFieldKey: function( keyModel, settingModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'replace:fieldKey', this, keyModel, settingModel );\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our action models. \n * This is the actual action data created by the user.\n *\n * We listen to the add and remove events so that we can push the new id to either the new action or removed action property.\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/actions/actionCollection',['models/actions/actionModel'], function( actionModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: actionModel,\n\t\tcomparator: 'order',\n\t\ttmpNum: 1,\n\n\t\tinitialize: function() {\n\t\t\tthis.on( 'add', this.addAction, this );\n\t\t\tthis.on( 'remove', this.removeAction, this );\n\t\t\tthis.newIDs = [];\n\t\t},\n\n\t\t/**\n\t\t * When we add a field, push the id onto our new action property.\n\t\t * This lets us tell the server that this is a new field to be added rather than a field to be updated.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param void\n\t\t */\n\t\taddAction: function( model ) {\n\t\t\tthis.newIDs.push( model.get( 'id' ) );\n\t\t},\n\n\t\t/**\n\t\t * When we remove a field, push the id onto our removed action property.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param void\n\t\t */\n\t\tremoveAction: function( model ) {\n\t\t\tthis.removedIDs[ model.get( 'id' ) ] = model.get( 'id' );\n\t\t}\n\t} );\n\treturn collection;\n} );\n/**\n * Handles interactions with our actions collection.\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/data',['models/actions/actionCollection', 'models/actions/actionModel'], function( actionCollection, actionModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Load our action collection from our localized form data\n\t\t\tthis.collection = new actionCollection( preloadedFormData.actions );\n\t\t\tthis.collection.tmpNum = 1;\n\n\t\t\tif ( 0 != this.collection.models.length ) {\n\t\t\t\tvar that = this;\n\t\t\t\t_.each( this.collection.models, function( action ) {\n\t\t\t\t\tif ( ! jQuery.isNumeric( action.get( 'id' ) ) ) {\n\t\t\t\t\t\tthat.collection.tmpNum++;\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t\t// Set our removedIDs to an empty object. This will be populated when a action is removed so that we can add it to our 'deleted_actions' object.\n\t\t\tthis.collection.removedIDs = {};\n\n\t\t\t// Respond to requests for data about actions and to update/change/delete actions from our collection.\n\t\t\tnfRadio.channel( 'actions' ).reply( 'get:collection', this.getCollection, this );\n\t\t\tnfRadio.channel( 'actions' ).reply( 'get:action', this.getAction, this );\n\t\t\tnfRadio.channel( 'actions' ).reply( 'get:tmpID', this.getTmpID, this );\n\n\t\t\tnfRadio.channel( 'actions' ).reply( 'add', this.addAction, this );\n\t\t\tnfRadio.channel( 'actions' ).reply( 'delete', this.deleteAction, this );\n\t\t},\n\n\t\tgetCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tgetAction: function( id ) {\n\t\t\treturn this.collection.get( id );\n\t\t},\n\n\t\t/**\n\t\t * Add a action to our collection. If silent is passed as true, no events will trigger.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tdata \taction data to insert\n\t\t * @param bool \t\tsilent \tprevent events from firing as a result of adding\t \t\n\t\t */\n\t\taddAction: function( data, silent ) {\n\t\t\tsilent = silent || false;\n\n\t\t\tif ( false === data instanceof Backbone.Model ) {\n\t\t\t\tvar model = new actionModel( data );\n\t\t\t} else {\n\t\t\t\tvar model = data;\n\t\t\t}\n\n\t\t\tthis.collection.add( model, { silent: silent } );\n\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\n\t\t\treturn model;\n\t\t},\n\n\t\t/**\n\t\t * Delete a action from our collection.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \taction model to be deleted\n\t\t * @return void\n\t\t */\n\t\tdeleteAction: function( model ) {\n\t\t\tthis.collection.remove( model );\n\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\n\t\t},\n\n\n\t\t/**\n\t\t * Return a new tmp id for our actions.\n\t\t * Gets the action collection length, adds 1, then returns that prepended with 'tmp-'.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return string\n\t\t */\n\t\tgetTmpID: function() {\n\t\t\tvar tmpNum = this.collection.tmpNum;\n\t\t\tthis.collection.tmpNum++;\n\t\t\treturn 'tmp-' + tmpNum;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Fetches settings models so that we can get setting information\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/actionSettings',['models/app/settingCollection'], function( settingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.collection = new settingCollection( actionSettings, { objectType: 'actions' } );\n\n\t\t\t// Responds to requests for settings models.\n\t\t\tnfRadio.channel( 'actions' ).reply( 'get:settingModel', this.getSettingModel, this );\n\t\t},\n\n\t\tgetSettingModel: function( name ) {\n\t\t\treturn this.collection.findWhere( { name: name } );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles adding and removing the active class from a action currently being edited.\n * \n * @package Ninja Forms builder\n * @subpackage Actions - Edit Action Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/editActive',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests to remove the active class from all our actions.\n\t\t\tnfRadio.channel( 'actions' ).reply( 'clear:editActive', this.clearEditActive, this );\n\t\t\t// Listen for the closing drawer so that we can remove all of our active classes.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-editSettings' ), 'before:closeDrawer', this.clearEditActive );\n\t\t},\n\n\t\t/**\n\t\t * Loops through our actions collection and sets editActive to false.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n clearEditActive: function() {\n var actionCollection = nfRadio.channel( 'actions' ).request( 'get:collection' );\n _.each( actionCollection.models, function( action ) {\n\t\t\t\taction.set( 'editActive', false );\n } );\n }\n\t});\n\n\treturn controller;\n} );\n\n/**\n * @package Ninja Forms builder\n * @subpackage Actions - Action Settings Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/emailFromSetting',[], function( ) {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n this.listenTo( nfRadio.channel( 'actionSetting-from_address' ), 'update:setting', this.updateFromAddress );\n },\n\n updateFromAddress: function( dataModel, settingModel ) {\n if( 'undefined' == typeof settingModel ) return;\n\n var value = dataModel.get( 'from_address' ).trim();\n\n if( '{wp:admin_email}' == value ) {\n return settingModel.set( 'warning', false );\n }\n\n if( value && ( ! this.isValidEmail( value ) ) || nfAdmin.home_url_host != value.replace(/.*@/, \"\") ){\n return settingModel.set( 'warning', nfi18n.errorInvalidEmailFromAddress );\n }\n\n return settingModel.set( 'warning', false );\n },\n\n isValidEmail: function(email) {\n return /^.+@.+\\..+$/.test(email);\n }\n });\n return controller;\n} );\n/**\n * Handles clicks and dragging for our action types.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/addActionTypes',['models/actions/actionCollection', 'models/actions/actionModel'], function( actionCollection, actionModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'actions' ), 'click:addAction', this.addAction );\n\n\t\t\tnfRadio.channel( 'actions' ).reply( 'add:actionType', this.addAction, this );\n\t\t},\n\n\t\t/**\n\t\t * Add an action to our collection. If silent is passed as true, no events will trigger.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tdata \taction data to insert\n\t\t * @param bool \t\tsilent \tprevent events from firing as a result of adding\t \t\n\t\t */\n\t\taddAction: function( type ) {\n\n\t\t\tvar data = {\n\t\t\t\tid: nfRadio.channel( 'actions' ).request( 'get:tmpID' ),\n\t\t\t\ttype: type.get( 'id' ),\n\t\t\t\tlabel: type.get( 'settingDefaults').label || type.get( 'nicename' )\n\t\t\t}\n\n\t\t\tvar newModel = nfRadio.channel( 'actions' ).request( 'add', data );\n\n\t\t\tvar label = {\n\t\t\t\tobject: 'Action',\n\t\t\t\tlabel: newModel.get( 'label' ),\n\t\t\t\tchange: 'Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: nfRadio.channel( 'actions' ).request( 'get:collection' )\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', newModel, null, label, data );\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', {}, newModel );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles the logic for our action type draggables.\n * \n * @package Ninja Forms builder\n * @subpackage Actions - New Action Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/typeDrag',[], function( ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our action type draggables and run the appropriate function.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addAction' ), 'startDrag:type', this.startDrag );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addAction' ), 'stopDrag:type', this.stopDrag );\n\t\t\t/*\n\t\t\t * Respond to requests for our helper clone.\n\t\t\t * This is used by other parts of the application to modify what the user is dragging in real-time.\n\t\t\t */ \n\t\t\tnfRadio.channel( 'drawer-addAction' ).reply( 'get:typeHelperClone', this.getCurrentDraggableHelperClone, this );\n\t\t},\n\n\t\t/**\n\t\t * When we start dragging:\n\t\t * get our drawer element\n\t\t * set its overflow property to visible !important -> forces the type drag element to be on at the top of the z-index.\n\t\t * get our main element\n\t\t * est its overflow propery to visible !important -> forces the type drag element to be on top of the z-index.\n\t\t * set our dragging helper clone\n\t\t * \n\t\t * @since 3.0\n\t\t * @param object context \tThis function is going to be called from a draggable. Context is the \"this\" reference to the draggable.\n\t\t * @param object ui \tObject sent by jQuery UI draggable.\n\t\t * @return void\n\t\t */\n\t\tstartDrag: function( context, ui ) {\n\t\t\tthis.drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tthis.mainEl = nfRadio.channel( 'app' ).request( 'get:mainEl' );\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\t\t\t// jQuery( this.mainEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\n\t\t\tthis.draggableHelperClone = jQuery( ui.helper ).clone();\n\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging, reset our overflow property to hidden !important.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param object context \tThis function is going to be called from a draggable. Context is the \"this\" reference to the draggable.\n\t\t * @param object ui \tObject sent by jQuery UI draggable.\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tstopDrag: function( context, ui ) {\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t\t// jQuery( this.mainEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t},\n\n\t\tgetCurrentDraggableHelperClone: function() {\n\t\t\treturn this.draggableHelperClone;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles the logic for our action type droppable.\n * \n * @package Ninja Forms builder\n * @subpackage Actions - New Action Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/droppable',[], function( ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Respond to requests for our helper clone.\n\t\t\t * This is used by other parts of the application to modify what the user is dragging in real-time.\n\t\t\t */ \n\t\t\tnfRadio.channel( 'app' ).reply( 'drop:actionType', this.dropActionType, this );\n\t\t},\n\n\t\tdropActionType: function( e, ui ) {\n\t\t\tvar type_slug = jQuery( ui.helper ).data( 'type' );\n\t\t\tvar type = nfRadio.channel( 'actions' ).request( 'get:type', type_slug );\n\t\t\tnfRadio.channel( 'actions' ).request( 'add:actionType', type );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Model for our action type\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/actions/typeModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our action type models. \n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/actions/typeCollection',['models/actions/typeModel'], function( actionTypeModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: actionTypeModel,\n\t} );\n\treturn collection;\n} );\n/**\n * Filters our action type collection.\n * \n * @package Ninja Forms builder\n * @subpackage Actions - New Action Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/filterTypes',['models/actions/typeCollection'], function( typeCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our change filter event.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addAction' ), 'change:filter', this.filterActionTypes );\n\t\t},\n\n\t\t/**\n\t\t * Filter our action types in the add new action drawer\n\t\t * \n\t\t * Takes a search string and finds any action types that match either the name or alias.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string\t search \tstring being searched for\n\t\t * @param object \t e \tKeyup event\n\t\t * @return void\n\t\t */\n\t\tfilterActionTypes: function( search, e ) {\n\n\t\t\t// Make sure that we aren't dealing with an empty string.\n\t\t\tif ( '' != jQuery.trim( search ) ) {\n\n \t\tvar filteredInstalled = [];\n \t\t/**\n \t\t * Call the function that actually filters our collection,\n \t\t * and then loop through our collection, adding each model to our filteredInstalled array.\n \t\t */\n\t\t\t\tvar installedActions = nfRadio.channel( 'actions' ).request( 'get:installedActions' );\n \t\t_.each( this.filterCollection( search, installedActions ), function( model ) {\n \t\t\tfilteredInstalled.push( model );\n \t\t} );\n\n \t\tvar filteredAvailable = [];\n \t\tvar availableActions = nfRadio.channel( 'actions' ).request( 'get:availableActions' );\n \t\t_.each( this.filterCollection( search, availableActions ), function( model ) {\n \t\t\tfilteredAvailable.push( model );\n \t\t} );\n\n \t\t// Create a new Action Type Section collection with the filtered array.\n \t\tvar newInstalled = new typeCollection( filteredInstalled );\n \t\tnewInstalled.slug = 'installed';\n \t\tnewInstalled.nicename = 'Installed';\n\n \t\tvar newAvailable = new typeCollection( filteredAvailable );\n \t\tnewAvailable.slug = 'available';\n\t\t\t\tnewAvailable.nicename = 'Available';\n\n \t\t// Request that our action types filter be applied, passing the collection we created above.\n \t\tnfRadio.channel( 'drawer' ).trigger( 'filter:actionTypes', newInstalled, newAvailable );\n \t\t// If we've pressed the 'enter' key, add the action to staging and clear the filter.\n \t\tif ( e.addObject ) {\n \t\t\tif ( 0 < newInstalled.length ) {\n \t\t\t\tnfRadio.channel( 'actions' ).request( 'add:actionType', newInstalled.models[0] );\n \t\t\t\tnfRadio.channel( 'drawer' ).request( 'clear:filter' );\n \t\t\t}\n \t\t}\n \t} else {\n \t\t// Clear our filter if the search text is empty.\n \t\tnfRadio.channel( 'drawer' ).trigger( 'clear:filter' );\n \t}\n },\n\n /**\n * Search our action type collection for the search string.\n * \n * @since 3.0\n * @param string\t search \tstring being searched for\n * @return backbone.collection\n */\n filterCollection: function( search, collection ) {\n \tsearch = search.toLowerCase();\n \t/*\n \t * Backbone collections have a 'filter' method that loops through every model,\n \t * waiting for you to return true or false. If you return true, the model is kept.\n \t * If you return false, it's removed from the filtered result.\n \t */\n\t\t\tvar filtered = collection.filter( function( model ) {\n\t\t\t\tvar found = false;\n\t\t\t\t\n\t\t\t\t// If we match either the ID or nicename, return true.\n\t\t\t\tif ( model.get( 'id' ).toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\tfound = true;\n\t\t\t\t} else if ( model.get( 'nicename' ).toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\tfound = true;\n\t\t\t\t}\n\n\t\t\t\t/*\n\t\t\t\t * TODO: Hashtag searching. Doesn't really do anything atm.\n\t\t\t\t */\n\t\t\t\tif ( model.get( 'tags' ) && 0 == search.indexOf( '#' ) ) {\n\t\t\t\t\t_.each( model.get( 'tags' ), function( tag ) {\n\t\t\t\t\t\tif ( search.replace( '#', '' ).length > 1 ) {\n\t\t\t\t\t\t\tif ( tag.toLowerCase().indexOf( search.replace( '#', '' ) ) != -1 ) {\n\t\t\t\t\t\t\t\tfound = true;\n\t\t\t\t\t\t\t}\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// If we match any of the aliases, return true.\n\t\t\t\tif ( model.get( 'alias' ) ) {\n\t\t\t\t\t_.each( model.get( 'alias' ), function( alias ) {\n\t\t\t\t\t\tif ( alias.toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\t\t\tfound = true;\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn found;\n\t\t\t} );\n\n\t\t\t// Return our filtered collection.\n\t\t\treturn filtered;\n }\n\t});\n\n\treturn controller;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage Actions - New Action Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/actions/newsletterList',[], function( ) {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n this.listenTo( nfRadio.channel( 'setting-newsletter_list' ), 'show:setting', this.defaultFields );\n this.listenTo( nfRadio.channel( 'setting-type-newsletter_list' ), 'click:extra', this.clickListUpdate );\n this.listenTo( nfRadio.channel( 'actionSetting-newsletter_list' ), 'update:setting', this.maybeRenderFields );\n this.listenTo( nfRadio.channel( 'actionSetting-newsletter_list' ), 'update:setting', this.maybeRenderGroups );\n this.listenTo( nfRadio.channel( 'setting-name-newsletter_list_fields' ), 'init:settingModel', this.registerFieldsListener );\n this.listenTo( nfRadio.channel( 'setting-name-newsletter_list_groups' ), 'init:settingModel', this.registerGroupsListener );\n },\n\n defaultFields: function( settingModel, dataModel ) {\n this.maybeRenderFields( dataModel, settingModel );\n this.maybeRenderGroups( dataModel, settingModel );\n },\n\n registerFieldsListener: function ( model ) {\n model.listenTo( nfRadio.channel( 'newsletter_list_fields' ), 'update:fieldMapping', this.updateFieldMapping, model );\n },\n\n registerGroupsListener: function ( model ) {\n model.listenTo( nfRadio.channel( 'newsletter_list_groups' ), 'update:interestGroups', this.updateInterestGroups, model );\n },\n\n clickListUpdate: function( e, settingModel, dataModel, settingView ) {\n\n var data = {\n action: 'nf_' + dataModel.attributes.type + '_get_lists',\n security: nfAdmin.ajaxNonce\n };\n\n var that = this;\n jQuery( e.srcElement ).addClass( 'spin' );\n jQuery.post( ajaxurl, data, function( response ){\n var response = JSON.parse( response );\n that.updateLists( settingModel, response.lists, settingView, dataModel );\n dataModel.set( 'newsletter_list', response.lists[0].value, { settingModel: settingModel } );\n }).always( function() {\n jQuery( e.srcElement ).removeClass( 'spin' );\n });\n },\n\n updateLists: function( settingModel, lists, settingView, dataModel ) {\n settingModel.set( 'options', lists );\n settingView.render();\n },\n\n maybeRenderFields: function( dataModel, settingModel ) {\n\n if( 'undefined' == typeof settingModel ) return;\n\n var selectedList = dataModel.get( 'newsletter_list' );\n var lists = settingModel.get( 'options' );\n _.each( lists, function( list ) {\n if ( selectedList == list.value ) {\n nfRadio.channel( 'newsletter_list_fields').trigger( 'update:fieldMapping', list.fields );\n }\n } );\n\n dataModel.set( 'newsletter_list_fields', 0 );\n },\n\n maybeRenderGroups: function( dataModel, settingModel ) {\n if( 'undefined' == typeof settingModel ) return;\n\n var selectedList = dataModel.get( 'newsletter_list' );\n var lists = settingModel.get( 'options' );\n _.each( lists, function( list ) {\n if ( selectedList == list.value ) {\n nfRadio.channel( 'newsletter_list_groups').trigger( 'update:interestGroups', list.groups );\n }\n } );\n\n dataModel.set( 'newsletter_list_fields', 0 );\n },\n\n updateFieldMapping: function( fields ) {\n var settings = this.get( 'settings' );\n settings.reset();\n _.each( fields, function( field ){\n\n settings.add({\n name: field.value,\n type: 'textbox',\n label: field.label,\n width: 'full',\n use_merge_tags: { exclude: [ 'user', 'post', 'system', 'querystrings' ] }\n });\n });\n this.set( 'settings', settings );\n },\n\n updateInterestGroups: function( groups ) {\n var settings = this.get( 'settings' );\n settings.reset();\n _.each( groups, function( group ){\n\n settings.add({\n name: group.value,\n type: 'toggle',\n label: group.label,\n width: 'full',\n });\n });\n this.set( 'settings', settings );\n },\n\n });\n\n return controller;\n} );\n\n/**\n * Listens to field deletion, removing any merge tags that reference the field.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1.7\n */\ndefine( 'controllers/actions/deleteFieldListener',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * When we init an action model, register a listener for field deletion.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'actions' ), 'init:actionModel', this.registerListener );\n\t\t},\n\n\t\tregisterListener: function( actionModel ) {\n\t\t\tactionModel.listenTo( nfRadio.channel( 'fields' ), 'delete:field', this.maybeUpdateSettings );\n\t\t},\n\n\t\tmaybeUpdateSettings: function( fieldModel ) {\n\t\t\tvar newObject, filteredCollection,\n\t\t\t\tfieldMergeTag = '{field:' + fieldModel.get( 'key' ) + '}';\n\t\t\t\n\t\t\t/*\n\t\t\t * Loop through our action attributes to see if the field mergetag exists in our action.\n\t\t\t *\n\t\t\t * If it does:\n\t\t\t * \t- Replace the field mergetag in strings with ''.\n\t\t\t * \t- Remove any items with the field merge tag if they are in an array.\n\t\t\t */\n\t\t\t_.each( this.attributes, function( attr, key ) {\n\t\t\t\tif ( _.isString( attr ) ) {\n\t\t\t\t\t// If our attribute is a string, replace any instances of the field merge tag with an empty string.\n\t\t\t\t\tthis.set( key, attr.replace( fieldMergeTag, '' ) );\n\t\t\t\t} else if ( _.isArray( attr ) ) {\n\t\t\t\t\t// If our attribute is an array, search the contents for field merge tag and remove items that match.\n\t\t\t\t\t_.each( attr, function( val, index ) {\n\t\t\t\t\t\tif ( _.isString( val ) ) {\n\t\t\t\t\t\t\t// If val is a string, search it for the field mergetag.\n\t\t\t\t\t\t\tconsole.log( 'string replace' );\n\t\t\t\t\t\t} else if ( _.isArray( val ) ) {\n\t\t\t\t\t\t\t// If val is an array, search it for the field mergetag.\n\t\t\t\t\t\t\tconsole.log( 'array search' );\n\t\t\t\t\t\t} else if ( _.isObject( val ) ) {\n\t\t\t\t\t\t\t// If val is a object, search it for the field mergetag.\n\t\t\t\t\t\t\tnewObject = _.mapObject( val, function( value, key ) {\n\t\t\t\t\t\t\t\tif ( _.isString( value ) ) {\n\t\t\t\t\t\t\t\t\tif ( -1 != value.indexOf( fieldMergeTag ) ) {\n\t\t\t\t\t\t\t\t\t\tattr.splice( index, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\t\treturn value;\n\t\t\t\t\t\t\t} );\n\n\t\t\t\t\t\t\tthis.set( key, attr );\n\t\t\t\t\t\t}\n\t\t\t\t\t}, this );\n\t\t\t\t} else if ( attr instanceof Backbone.Collection ) {\n\t\t\t\t\t// This is a Backbone Collection, so we need to loop through the models and remove any that have an attribute containing the field merge tag.\n\t\t\t\t\tvar filteredCollection = attr.filter( function ( model ) {\n\t\t\t\t\t\t// Make sure that EVERY model attribute does NOT reference the field merge tag.\n\t\t\t\t\t return _.every( model.attributes, function( val ) {\n\t\t\t\t\t \t/*\n\t\t\t\t\t \t * Currently only handles items that are one-level deep.\n\t\t\t\t\t \t * TODO: Add support for further nesting of values.\n\t\t\t\t\t \t */\n\t\t\t\t\t \tif ( _.isString( val ) ) {\n\t\t\t\t\t \t\tif ( -1 != val.indexOf( fieldMergeTag ) ) {\n\t\t\t\t\t \t\t\treturn false;\n\t\t\t\t\t \t\t}\n\t\t\t\t\t \t}\n\t\t\t\t\t \treturn true;\n\t\t\t\t\t });;\n\t\t\t\t\t});\n\t\t\t\t\t// Update our key with the filtered collection value.\n\t\t\t\t\tthis.set( key, filteredCollection );\n\t\t\t\t}\n\t\t\t}, this );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're rendering a collect payment setting, add our number fields and total fields to the data model.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1.7\n */\ndefine( 'controllers/actions/collectPaymentFields',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for messages that are fired before a setting view is rendered.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n\t\t},\n\n\t\tbeforeRenderSetting: function( settingModel, dataModel, view ) {\n\t\t\tif ( 'field' != settingModel.get( 'total_type' ) ) return false;\n\n\t\t\tvar fields = this.getFields( settingModel );\n\n\t\t\t/*\n\t\t\t * If the field in the payment total isn't in our field list, add it.\n\t\t\t *\n\t\t\t * Remove the merge tag stuff to get the field key.\n\t\t\t */\n\t\t\t\n\t\t\tvar field_key = dataModel.get( 'payment_total' );\n\t\t\tfield_key = field_key.replace( '{field:', '' );\n\t\t\tfield_key = field_key.replace( '}', '' );\n\t\t\tvar fieldModel = nfRadio.channel( 'fields' ).request( 'get:field', field_key );\n\n\t\t\tif ( 'undefined' != typeof fieldModel ) {\n\t\t\t\tif ( 'undefined' == typeof _.findWhere( fields, { value: dataModel.get( 'payment_total' ) } ) ) {\n\t\t\t\t\tfields.push( { label: fieldModel.get( 'label' ), value: '{field:' + fieldModel.get( 'key' ) + '}' } );\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t\t/*\n\t\t\t * Update our fields options.\n\t\t\t */\n\t\t\tsettingModel.set( 'options', fields );\n\t\t\t\n\t\t},\n\n\t\tgetFields: function( settingModel ) {\n\t\t\tvar returnFields = [ settingModel.get( 'default_options' ) ];\n\t\t\t// Update our dataModel with all of our product fields.\n\t\t\tvar fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t_.each( fields.models, function( field ) {\n\t\t\t\tif ( 'number' == field.get( 'type' ) || 'total' == field.get( 'type' ) || 'checkbox' == field.get( 'type' ) ) {\n\t\t\t\t\treturnFields.push( { label: field.get( 'label' ), value: '{field:' + field.get( 'key' ) + '}' } );\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\treturnFields = _.sortBy( returnFields, function( field ) { return field.label } );\n\n\t\t\treturn returnFields;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're rendering a collect payment setting, add our calculations to the data model.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1.7\n */\ndefine( 'controllers/actions/collectPaymentCalculations',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n // Listen for messages that are fired before a setting view is rendered.\n this.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n },\n\n beforeRenderSetting: function( settingModel, dataModel, view ) {\n if ( 'calc' == settingModel.get( 'total_type' ) ) {\n var calcModels = nfRadio.channel( 'app' ).request( 'get:formModel' );\n var calcs = this.getCalcs( calcModels, settingModel );\n\n settingModel.set( 'options', calcs );\n }\n },\n\n getCalcs: function( calcModels, settingModel ) {\n var returnCalcs = [ settingModel.get( 'default_options' ) ];\n\n // Update our dataModel with all of our product fields.\n var calcs = calcModels.get( 'settings' ).get( 'calculations' );\n\n _.each( calcs.models, function( calc ) {\n returnCalcs.push( { label: calc.get( 'name' ), value: '{calc:' + calc.get( 'name' ) + '}' } );\n } );\n\n returnCalcs = _.sortBy( returnCalcs, function( calc ) { return calc.label } );\n\n return returnCalcs;\n }\n\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we haven't set a total_type, then set the total_type to fixed.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1.7\n */\ndefine( 'controllers/actions/collectPaymentFixed',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n // Listen for messages that are fired before a setting view is rendered.\n this.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n },\n\n beforeRenderSetting: function( settingModel, dataModel, view ) {\n\n if ( 'payment_total_type' != settingModel.get( 'name' ) || _.isEmpty( dataModel.get( 'payment_total' ) ) ) return false;\n\n /*\n * If we don't have a payment total type and we have a payment total, set our total type to the appropriate total type.\n */\n if ( ( 'undefined' == dataModel.get( 'payment_total_type' ) || _.isEmpty( dataModel.get( 'payment_total_type' ) ) ) ) {\n /*\n * If payment_total is a field merge tag, set payment_total_type to \"field\"\n */\n\n if ( -1 != dataModel.get( 'payment_total' ).indexOf( '{field' ) ) {\n dataModel.set( 'payment_total_type', 'field' );\n } else if ( -1 != dataModel.get( 'payment_total' ).indexOf( '{calc' ) ) {\n dataModel.set( 'payment_total_type', 'calc' );\n } else {\n dataModel.set( 'payment_total_type', 'fixed' );\n } \n }\n },\n\n });\n\n return controller;\n} );\n/**\n * When we init a collect payment action, listen for calc changes\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1.7\n */\ndefine( 'controllers/actions/collectPayment',[], function( settingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * When we init a collect payment action model, register a listener for calc changes.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'actions-collectpayment' ), 'init:actionModel', this.initCollectPayment );\n\t\t\t\n\t\t\t/*\n\t\t\t * Before we render our total field, we may want to update its value.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.maybeClearTotal );\n\t\t},\n\n\t\t/**\n\t\t * When a collect payment action is init'd, register a listener for calc changes and update our data appropriately.\n\t\t * @since 3.1.7\n\t\t * @param {backbone.model} actionModel \n\t\t * @return {void}\n\t\t */\n\t\tinitCollectPayment: function( actionModel ) {\n\t\t\tactionModel.listenTo( nfRadio.channel( 'calcs' ), 'update:calcName', this.maybeUpdateTotal );\n },\n\n\t\t//TODO: Add in an error that will not allow drawer to close until total type and total value is selected.\n\t\tmaybeError: function(){},\n\n\t\tmaybeUpdateTotal: function( optionModel, oldName ) {\n\t\t\t/*\n\t\t\t * We have changed a calculation. Make sure that 'calc' is our payment total type.\n\t\t\t */\n\t\t\tif ( 'calc' != this.get( 'payment_total_type' ) ) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t\n\t\t\t/*\n\t\t\t * Check our payment_total setting for the old merge tag and replace it with the new one.\n\t\t\t */\n\t\t\tvar newVal = this.get( 'payment_total' ).replace( '{calc:' + oldName + '}', '{calc:' + optionModel.get( 'name' ) + '}' );\n\t\t\tthis.set( 'payment_total', newVal );\n\t\t},\n\n\t\tmaybeClearTotal: function( settingModel, dataModel, view ) {\n /*\n * If our payment_total is a merge tag, clear it when we select the \"fixed\" option.\n */\n if ( 'fixed' == dataModel.get( 'payment_total_type' ) ) {\n if ( -1 != dataModel.get( 'payment_total' ).indexOf( '{field' ) || -1 != dataModel.get( 'payment_total' ).indexOf( '{calc' ) ) {\n dataModel.set( 'payment_total', '' );\n }\n }\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * When we init a save action, listen for form changes\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1.7\n */\ndefine( 'controllers/actions/save',[], function( settingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'actions-save' ), 'init:actionModel', this.initSave );\n\t\t},\n\n\t\t/**\n\t\t * Set listeners up to listen for add/delete fields for Save action\n\t\t */\n\t\tinitSave: function( actionModel ) {\n\n\t\t\tthis.model = actionModel;\n\n\t\t\t/*\n\t\t\t * When we init a save action model, register a listener for new\n\t\t\t * fields\n\t\t\t */\n\t\t\tthis.listenTo( Backbone.Radio.channel( 'fields' ), 'add:field',\n\t\t\t\tthis.checkFieldAdded );\n\n\t\t\t/*\n\t\t\t * When we init a save action model, register a listener for deleted\n\t\t\t * fields\n\t\t\t */\n\t\t\tthis.listenTo( Backbone.Radio.channel( 'fields' ), 'delete:field',\n\t\t\t\tthis.checkFieldDeleted );\n\t\t},\n\n\t\t/**\n\t\t * When a save action is init'd, check to see if a new field added\n\t\t * is an email and decide if it needs to be the 'submitter_email'\n\t\t * for privacy regulation functionality\n\t\t *\n\t\t * @param {backbone.model} actionModel\n\t\t * @return {void}\n\t\t */\n\t\tcheckFieldAdded: function( newFieldModel ) {\n\t\t\tif( 'email' == newFieldModel.get( 'type' ) ) {\n\t\t\t\tvar submitter_email = this.model.get('submitter_email');\n\n\t\t\t\tif( '' === submitter_email ) {\n\t\t\t\t\tthis.model.set( 'submitter_email', newFieldModel.get( 'key' ) );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When a save action is init'd, check to see if a field that has been\n\t\t * deleted is an email and rearrance the submitter email setting\n\t\t * for privacy regulation functionality\n\t\t *\n\t\t * @param {backbone.model} actionModel\n\t\t * @return {void}\n\t\t */\n\t\tcheckFieldDeleted: function( fieldModel ) {\n\t\t\tvar submitter_email = this.model.get( 'submitter_email' );\n\t\t\t\n\t\t\tif( submitter_email == fieldModel.get( 'key' ) ) {\n\t\t\t\tthis.model.set( 'submitter_email', '' );\n\t\t\t}\n\t\t},\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Creates and stores a collection of form setting types. This includes all of the settings shown when editing a field.\n *\n * Loops over our preloaded data and adds that to our form setting type collection\n *\n * Also responds to requests for data about form setting types\n *\n * @package Ninja Forms builder\n * @subpackage Advanced\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/advanced/types',[\n\t\t'models/app/typeCollection'\n\t],\n\tfunction(\n\t\tTypeCollection\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Create our field type collection\n\t\t\tthis.collection = new TypeCollection( formSettingTypeData );\n\n\t\t\tif(!nfAdmin.devMode){\n\t\t\t\tvar calculations = this.collection.where({id:'calculations'});\n\t\t\t\tthis.collection.remove(calculations);\n\t\t\t}\n\n\t\t\t// Respond to requests to get field type, collection, settings, and sections\n\t\t\tnfRadio.channel( 'settings' ).reply( 'get:type', this.getType, this );\n\t\t\tnfRadio.channel( 'settings' ).reply( 'get:typeCollection', this.getCollection, this );\n\t\t},\n\n\t\t/**\n\t\t * Return a field type by id\n\t\t *\n\t\t * @since 3.0\n\t\t * @param string \t\t\tid \tfield type\n\t\t * @return backbone.model \tfield type model\n\t\t */\n\t\tgetType: function( id ) {\n\t\t\treturn this.collection.get( id );\n },\n\n /**\n * Return the installed action type collection\n *\n * @since 3.0\n * @return backbone.collection \tfield type collection\n */\n\t\tgetCollection: function() {\n \treturn this.collection;\n }\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Model that represents our form settings.\n * \n * @package Ninja Forms builder\n * @subpackage Form Settings\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/advanced/settingsModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tobjectType: 'Form Setting',\n\t\t\teditActive: false\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Listen for model attribute changes\n\t\t\tthis.bind( 'change', this.changeSetting, this );\n\t\t\t/*\n\t\t\t * Check to see if we have any setting defaults to set.\n\t\t\t */\n\t\t\tvar formSettings = nfRadio.channel( 'settings' ).request( 'get:collection' );\n\t\t\t_.each( formSettings.models, function( settingModel ) {\n\t\t\t\tif ( 'undefined' == typeof this.get( settingModel.get( 'name' ) ) ) {\n\t\t\t\t\tthis.set( settingModel.get( 'name' ), settingModel.get( 'value' ), { silent: true } );\n\t\t\t\t}\n\t\t\t\tnfRadio.channel( settingModel.get( 'type' ) ).trigger( 'init:dataModel', this, settingModel );\n\t\t\t}, this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'fire:updateFieldKey', this.updateFieldKey );\n\t\t},\n\n\t\t/**\n\t\t * When we change the model attributes, fire an event saying we've changed something.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tchangeSetting: function( model, options) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', this, options.settingModel );\n\t\t},\n\n\t\tupdateFieldKey: function( keyModel, settingModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'replace:fieldKey', this, keyModel, settingModel );\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Handles interactions with our form settings collection.\n * \n * @package Ninja Forms builder\n * @subpackage Advanced\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/advanced/data',['models/advanced/settingsModel'], function( settingsModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Load our action collection from our localized form data\n\t\t\tthis.model = new settingsModel( preloadedFormData.settings );\n\n\t\t\tnfRadio.channel( 'settings' ).reply( 'get:settings', this.getSettings, this );\n\t\t\tnfRadio.channel( 'settings' ).reply( 'get:setting', this.getSetting, this );\n\t\t\tnfRadio.channel( 'settings' ).reply( 'update:setting', this.updateSetting, this );\n\t\t},\n\n\t\tgetSettings: function() {\n\t\t\treturn this.model;\n\t\t},\n\n\t\tupdateSetting: function( name, value, silent ) {\n\t\t\tsilent = silent || false;\n\t\t\tthis.model.set( name, value, { silent: silent } );\n\t\t},\n\n\t\tgetSetting: function( name ) {\n\t\t\treturn this.model.get( name );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Fetches settings models so that we can get setting information\n * \n * @package Ninja Forms builder\n * @subpackage Advanced\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/advanced/formSettings',['models/app/settingCollection'], function( settingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.collection = new settingCollection( formSettings, { objectType: 'settings' } );\n\t\t\t\t\t\n\t\t\t// Responds to requests for settings models.\n\t\t\tnfRadio.channel( 'settings' ).reply( 'get:settingModel', this.getSettingModel, this );\n\n\t\t\t// Responds to requests for our setting collection\n\t\t\tnfRadio.channel( 'settings' ).reply( 'get:collection', this.getSettingCollection, this );\n\t\t},\n\n\t\tgetSettingModel: function( name ) {\n\t\t\treturn this.collection.findWhere( { name: name } );\n\t\t},\n\n\t\tgetSettingCollection: function() {\n\t\t\treturn this.collection;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles adding and removing the active class from form settings currently being edited.\n * \n * @package Ninja Forms builder\n * @subpackage Advanced\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/advanced/editActive',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests to remove the active class from all our fields.\n\t\t\tnfRadio.channel( 'settings' ).reply( 'clear:editActive', this.clearEditActive, this );\n\t\t\t// Listen for the closing drawer so that we can remove all of our active classes.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-editSettings' ), 'before:closeDrawer', this.clearEditActive );\n\t\t},\n\n\t\t/**\n\t\t * Loops through our fields collection and sets editActive to false.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n clearEditActive: function() {\n var collection = nfRadio.channel( 'settings' ).request( 'get:typeCollection' );\n _.each( collection.models, function( field ) {\n\t\t\t\tfield.set( 'editActive', false );\n } );\n }\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Listens for clicks on our form settings sections.\n * \n * @package Ninja Forms builder\n * @subpackage Advanced\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/advanced/clickEdit',['models/advanced/settingsModel'], function( settingsModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'settings' ), 'click:edit', this.clickEdit );\n\t\t},\n\n\t\tclickEdit: function( e, typeModel ) {\n\t\t\tvar model = nfRadio.channel( 'settings' ).request( 'get:settings' );\n\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'editSettings', { model: model, groupCollection: typeModel.get( 'settingGroups' ), typeModel: typeModel } );\n\t\t\tvar preventClose = nfRadio.channel( 'drawer' ).request( 'get:preventClose' );\n\t\t\tif ( ! preventClose ) {\n\t\t\t\ttypeModel.set( 'editActive', true );\n\t\t\t}\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Makes sure that calculations don't reference calculations with a lower order.\n *\n * For example, our first caclulation can't reference the second, but the second can reference the first.\n * \n * @package Ninja Forms builder\n * @subpackage Advanced\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/advanced/calculations',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * When someone types in the \"name\" or \"eq\" portion of our calculation, we need to make sure\n\t\t\t * that they haven't duplicated a name or made a bad EQ reference.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater-calculations' ), 'keyup:option', this.keyUp );\n\t\t\t/*\n\t\t\t * Same thing for when our calculation option is updated\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater-calculations' ), 'update:option', this.updateCalc );\n\t\t\t/*\n\t\t\t * When we sort our calcluations, we need to make sure that we don't get any bad EQ\n\t\t\t * references.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater-calculations' ), 'sort:option', this.sortCalc );\n\t\t},\n\n\t\tkeyUp: function( e, optionModel ) {\n\t\t\t// Get our current value\n\t\t\tvar value = jQuery( e.target ).val();\n\t\t\t// Check to see if we're editing a name or eq\n var id = jQuery( e.target ).data( 'id' );\n\t\t\tif( 'name' == id ) { // We are editing the name field\n\t\t\t\t// Check to see if our name already exists.\n\t\t\t\tthis.checkName( value, optionModel );\n\t\t\t\tthis.checkEQ( optionModel.get( 'eq' ), optionModel );\n\t\t\t} else if( 'eq' == id ) { // We're editing the eq\n\t\t\t\t// Check to see if there are any calcs referenced in our eq\n\t\t\t\tthis.checkEQ( value, optionModel );\n\t\t\t} else if( 'dec' == id ) { // We're editing the dec\n // Check to see that we have a non-negative integer\n this.checkDec( value, optionModel );\n }\n\t\t},\n\n\t\tupdateCalc: function( optionModel ) {\n\t\t\tthis.checkName( optionModel.get( 'name' ), optionModel, false );\n\t\t\tthis.checkEQ( optionModel.get( 'eq' ), optionModel );\n\t\t\tthis.checkDec( optionModel.get( 'dec' ), optionModel );\n\n\t\t\tBackbone.Radio.channel( 'calcs' ).trigger( 'update:calc', optionModel );\n\t\t},\n\n\t\tsortCalc: function( optionModel, setting ) {\n\t\t\tthis.checkAllCalcs( setting.collection );\n\t\t},\n\n\t\t/**\n\t\t * Check to see if a calc name exists.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string \t\t\tname calc name to check\n\t\t * @param backbone.model \toptionModel \n\t\t * @return void\n\t\t */\n\t\tcheckName: function( name, optionModel, silent ) {\n\t\t\tsilent = silent || true;\n\t\t\t// Get our current errors, if any.\n\t\t\tvar errors = optionModel.get( 'errors' );\n\t\t\t// Search our calc collection for our name\n\t\t\tvar found = optionModel.collection.where( { name: jQuery.trim( name ) } );\n\n\t\t\t// If the name that was passed is the same as our current name, return false.\n\t\t\tif ( name == optionModel.get( 'name' ) ) {\n\t\t\t\tfound = [];\n\t\t\t}\n\n\t\t\t// If our name exists, add an errors to the option model\n\t\t\tif ( 0 != found.length ) {\n\t\t\t\terrors.nameExists = 'Calculation names must be unique. Please enter another name.';\n\t\t\t} else {\n\t\t\t\tvar oldName = optionModel.get( 'name' );\n\t\t\t\toptionModel.set( 'name', name, { silent: silent } );\n\t\t\t\tnfRadio.channel( 'calcs' ).trigger( 'update:calcName', optionModel, oldName );\n\t\t\t\tdelete errors.nameExists;\n\t\t\t}\n\n\t\t\toptionModel.set( 'errors', errors );\n\t\t\toptionModel.trigger( 'change:errors', optionModel );\n\t\t},\n\n\t\t/**\n\t\t * Check to see if an eq contains a reference to a calc at a lower priority.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param string \t\t\teq our equation\n\t\t * @param backbone.model \toptionModel\n\t\t * @return void\n\t\t */\n\t\tcheckEQ: function( eq, optionModel ) {\n\t\t\t// Get any current errors on our optionModel\n\t\t\tvar errors = optionModel.get( 'errors' );\n\t\t\t/*\n\t\t\t * We're looking for two errors:\n\t\t\t * - Calculations that are below the current one can't be processed.\n\t\t\t * - Calculations can't refer to themselves.\n\t\t\t */ \n\t\t\tvar errorSelfRef = false;\n\t\t\tvar errorFutureCalc = false;\n\t\t\t// Regex that searches for {calc:key}\n\t\t\tvar calcs = eq.match( new RegExp( /{calc:(.*?)}/g ) );\n\t\t\t/*\n\t\t\t * Calcs will be an array like:\n\t\t\t * ['{calc:test}'], ['{calc:another}']\n\t\t\t * \n\t\t\t * If we have any calcs in the eq, loop through them and search for the errors.\n\t\t\t */\n\t\t\tif ( calcs ) {\n\t\t\t\tvar calculations = optionModel.collection;\n\t\t\t\t// Maps a function to each item in our calcs array.\n\t\t\t\tcalcs = calcs.map( function( calc ) {\n\t\t\t\t\t// calc will be {calc:name}\n\t\t\t\t\tvar name = calc.replace( '}', '' ).replace( '{calc:', '' );\n\t\t\t\t\t// Get our optionModel from our calculations collection.\n\t\t\t\t\tvar targetCalc = calculations.findWhere( { name: name } );\n\t\t\t\t\tif ( name == optionModel.get( 'name' ) ) {\n\t\t\t\t\t\t// If we already have a calc with this name, set an error.\n\t\t\t\t\t\terrors.selfRef = 'A calculation can\\'t reference itself!';\n\t\t\t\t\t\terrorSelfRef = true;\n\t\t\t\t\t} else if ( targetCalc && targetCalc.get( 'order' ) > optionModel.get( 'order' ) ) {\n\t\t\t\t\t\t// If the calc is after this one, set an error. \n\t\t\t\t\t\terrorFutureCalc = true;\n\t\t\t\t\t\terrors.futureCalc = 'Can\\'t reference a future calculation!';\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\t// If we didn't find any self ref errors, remove the key.\n\t\t\tif ( ! errorSelfRef ) {\n\t\t\t\tdelete errors.selfRef;\n\t\t\t}\n\n\t\t\t// If we didn't find any future calc errors, remove the key.\n\t\t\tif ( ! errorFutureCalc ) {\n\t\t\t\tdelete errors.futureCalc;\n\t\t\t}\n\n\t\t\t// Set errors and trigger our optionModel change.\n\t\t\toptionModel.set( 'errors', errors );\n\t\t\toptionModel.trigger( 'change:errors', optionModel );\n\n\t\t},\n\n /**\n * Ceck to see if a dec is an integer value.\n * \n * @since 3.1\n * @param string dec our decimal value\n * @param backbone.model optionModel\n * @return void\n */\n checkDec: function( dec, optionModel ) {\n // If dec isn't defined, bail...\n if( 'undefined' === typeof(dec) ) return false;\n\t\t\t// Get our current errors, if any.\n\t\t\tvar errors = optionModel.get( 'errors' );\n /**\n * We're looking for one error:\n * - dec is not a non-negative integer.\n */\n var errorNonIntDec = false;\n \n // Get our target value and see if it matches what we got.\n var checked = Math.abs( parseInt( dec.trim() ) );\n if ( dec.trim() !== '' && checked.toString() !== dec.trim() ) {\n errorNonIntDec = true;\n errors.nonIntDec = 'Decimals must be a non-negative integer!';\n }\n \n // If our dec value is a non-negative integer.\n if ( ! errorNonIntDec ) {\n delete errors.nonIntDec;\n }\n \n\t\t\t// Set errors and trigger our optionModel change.\n\t\t\toptionModel.set( 'errors', errors );\n\t\t\toptionModel.trigger( 'change:errors', optionModel );\n \n },\n \n\t\tcheckAllCalcs: function( collection ) {\n\t\t\tvar that = this;\n\t\t\tcollection.models.map( function( opt ) {\n\t\t\t\tthat.checkName( opt.get( 'name' ), opt );\n\t\t\t\tthat.checkEQ( opt.get( 'eq' ), opt );\n that.checkDec( opt.get( 'dec' ), opt );\n\t\t\t} );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Loads all of our controllers using Require JS.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine(\n\t'controllers/loadControllers',[\n\t\t/*\n\t\t * Application controllers\n\t\t */\n\t\t'controllers/app/remote',\n\t\t'controllers/app/drawer',\n\t\t'controllers/app/drawerConfig',\n\t\t'controllers/app/domainConfig',\n\t\t'controllers/app/data',\t\t\n\t\t'controllers/app/drawerToggleSettingGroup',\n\t\t'controllers/app/updateDB',\n\t\t'controllers/app/formData',\n\t\t'controllers/app/previewLink',\n\t\t'controllers/app/menuButtons',\n\t\t'controllers/app/trackChanges',\n\t\t'controllers/app/undoChanges',\n\t\t'controllers/app/publishResponse',\n\t\t'controllers/app/changeDomain',\n\t\t'controllers/app/pushstate',\n\t\t'controllers/app/hotkeys',\n\t\t'controllers/app/cleanState',\n\t\t'controllers/app/coreUndo',\n\t\t'controllers/app/cloneModelDeep',\n\t\t'controllers/app/getSettingChildView',\n\t\t'controllers/app/changeSettingDefault',\n\t\t'controllers/app/fieldset',\n\t\t'controllers/app/toggleSetting',\n\t\t'controllers/app/buttonToggleSetting',\n\t\t'controllers/app/numberSetting',\n\t\t'controllers/app/radioSetting',\n\t\t'controllers/app/itemControls',\n\t\t'controllers/app/mergeTags',\n\t\t'controllers/app/mergeTagBox',\n\t\t'controllers/app/itemSettingFill',\n\t\t'controllers/app/confirmPublish',\n\t\t'controllers/app/rte',\n\t\t'controllers/app/settingFieldSelect',\n\t\t'controllers/app/settingFieldList',\n\t\t'controllers/app/settingHTML',\n\t\t'controllers/app/settingColor',\n\t\t'controllers/app/changeMenu',\n\t\t'controllers/app/mobile',\n\t\t'controllers/app/notices',\n\t\t'controllers/app/unloadCheck',\n\t\t'controllers/app/formContentFilters',\n\t\t'controllers/app/formContentGutterFilters',\n\t\t'controllers/app/cloneCollectionDeep',\n\t\t'controllers/app/trackKeyDown',\n\t\t'controllers/app/perfectScroll',\n\t\t'controllers/app/getNewSettingGroupCollection',\n\t\t'controllers/app/settingMedia',\n\t\t'controllers/app/publicLink',\n\t\t/*\n\t\t * Fields domain controllers\n\t\t */\n\t\t'controllers/fields/types',\n\t\t'controllers/fields/fieldTypeDrag',\n\t\t'controllers/fields/stagingDrag',\n\t\t'controllers/fields/staging',\n\t\t'controllers/fields/stagingSortable',\n\t\t'controllers/fields/filterTypes',\n\t\t'controllers/fields/sortable',\n\t\t'controllers/fields/data',\n\t\t'controllers/app/optionRepeater',\n\t\t'controllers/app/imageOptionRepeater',\n\t\t'controllers/fields/editActive',\n\t\t'controllers/fields/fieldSettings',\n\t\t'controllers/fields/fieldCreditCard',\n\t\t'controllers/fields/fieldList',\n\t\t'controllers/fields/fieldPassword',\n\t\t'controllers/fields/fieldQuantity',\n\t\t'controllers/fields/fieldShipping',\n\t\t'controllers/fields/key',\n\t\t'controllers/fields/notices',\n\t\t'controllers/fields/mobile',\n\t\t'controllers/fields/savedFields',\n\t\t'controllers/fields/fieldDatepicker',\n\t\t'controllers/fields/fieldDisplayCalc',\n\t\t'controllers/fields/fieldRepeater',\n\n\t\t/*\n\t\t * TODO: Actions domain controllers\n\t\t */\n\t\t'controllers/actions/types',\n\t\t'controllers/actions/data',\n\t\t'controllers/actions/actionSettings',\n\t\t'controllers/actions/editActive',\n\t\t'controllers/actions/emailFromSetting',\n\t\t'controllers/actions/addActionTypes',\n\t\t'controllers/actions/typeDrag',\n\t\t'controllers/actions/droppable',\n\t\t'controllers/actions/filterTypes',\n\t\t'controllers/actions/newsletterList',\n\t\t'controllers/actions/deleteFieldListener',\n\t\t'controllers/actions/collectPaymentFields',\n\t\t'controllers/actions/collectPaymentCalculations',\n\t\t'controllers/actions/collectPaymentFixed',\n\t\t'controllers/actions/collectPayment',\n\t\t'controllers/actions/save',\n\n\t\t/*\n\t\t * TODO: Settings domain controllers\n\t\t */\n\t\t'controllers/advanced/types',\n\t\t'controllers/advanced/data',\n\t\t'controllers/advanced/formSettings',\n\t\t'controllers/advanced/editActive',\n\t\t'controllers/advanced/clickEdit',\n\t\t'controllers/advanced/calculations'\n\t],\n\tfunction(\n\t\t/*\n\t\t * Application controllers\n\t\t */\n\t\tRemote,\n\t\tDrawer,\n\t\tDrawerConfig,\n\t\tDomainConfig,\n\t\tAppData,\n\t\tDrawerToggleSettingGroup,\n\t\tUpdateDB,\n\t\tFormData,\n\t\tPreviewLink,\n\t\tAppMenuButtons,\n\t\tAppTrackChanges,\n\t\tAppUndoChanges,\n\t\tAppPublishResponse,\n\t\tAppChangeDomain,\n\t\tPushstate,\n\t\tHotkeys,\n\t\tCleanState,\n\t\tCoreUndo,\n\t\tCloneModelDeep,\n\t\tDrawerSettingChildView,\n\t\tChangeSettingDefault,\n\t\tFieldset,\n\t\tToggleSetting,\n\t\tButtonToggleSetting,\n\t\tNumberSetting,\n\t\tRadioSetting,\n\t\tItemControls,\n\t\tMergeTags,\n\t\tMergeTagsBox,\n\t\tItemSettingFill,\n\t\tConfirmPublish,\n\t\tRTE,\n\t\tSettingFieldSelect,\n\t\tSettingFieldList,\n\t\tSettingHTML,\n\t\tSettingColor,\n\t\tChangeMenu,\n\t\tAppMobile,\n\t\tAppNotices,\n\t\tAppUnloadCheck,\n\t\tFormContentFilters,\n\t\tFormContentGutterFilters,\n\t\tCloneCollectionDeep,\n\t\tTrackKeyDown,\n\t\tPerfectScroll,\n\t\tGetNewSettingGroupCollection,\n\t\tSettingMedia,\n\t\tPublicLink,\n\t\t/*\n\t\t * Fields domain controllers\n\t\t */\n\t\tFieldTypes,\n\t\tFieldTypeDrag,\n\t\tFieldStagingDrag,\n\t\tStagedFieldsData,\n\t\tStagedFieldsSortable,\n\t\tDrawerFilterFieldTypes,\n\t\tMainContentFieldsSortable,\n\t\tFieldData,\n\t\tOptionRepeater,\n\t\timageOptionRepeater,\n\t\tFieldsEditActive,\n\t\tFieldSettings,\n\t\tFieldCreditCard,\n\t\tFieldList,\n\t\tFieldPassword,\n\t\tFieldQuantity,\n\t\tFieldShipping,\n\t\tFieldKey,\n\t\tNotices,\n\t\tFieldsMobile,\n\t\tSavedFields,\n\t\tFieldDatepicker,\n\t\tFieldDisplayCalc,\n\t\tFieldRepeater,\n\t\t/*\n\t\t * TODO: Actions domain controllers\n\t\t */\n\t\tActionTypes,\n\t\tActionData,\n\t\tActionSettings,\n\t\tActionEditActive,\n\t\tActionEmailFromSetting,\n\t\tActionAddTypes,\n\t\tActionTypeDrag,\n\t\tActionDroppable,\n\t\tActionFilterTypes,\n\t\tActionNewsletterList,\n\t\tActionDeleteFieldListener,\n\t\tActionCollectPaymentFields,\n\t\tActionCollectPaymentCalculations,\n\t\tActionCollectPaymentFixed,\n\t\tActionCollectPayment,\n\t\tActionSave,\n\n\t\t/*\n\t\t * TODO: Settings domain controllers\n\t\t */\n\t\tSettingTypes,\n\t\tSettingData,\n\t\tFormSettings,\n\t\tSettingsEditActive,\n\t\tSettingsClickEdit,\n\t\tAdvancedCalculations\n\t\t\n\t) {\n\t\tvar controller = Marionette.Object.extend( {\n\t\t\tinitialize: function() {\n\t\t\t\t/*\n\t\t\t\t * Application controllers\n\t\t\t\t */\n\t\t\t\tnew FormContentFilters();\n\t\t\t\tnew FormContentGutterFilters();\n\t\t\t\tnew Hotkeys();\n\t\t\t\tnew Remote();\n\t\t\t\tnew Drawer();\n\t\t\t\tnew DrawerConfig();\n\t\t\t\tnew DomainConfig();\n\t\t\t\tnew DrawerToggleSettingGroup();\n\t\t\t\tnew PreviewLink();\n\t\t\t\tnew AppMenuButtons();\n\t\t\t\tnew AppTrackChanges();\n\t\t\t\tnew AppUndoChanges();\n\t\t\t\tnew AppPublishResponse();\n\t\t\t\tnew AppChangeDomain();\n\t\t\t\tnew CleanState();\n\t\t\t\tnew CoreUndo();\n\t\t\t\tnew CloneModelDeep();\n\t\t\t\tnew ItemControls();\n\t\t\t\tnew ConfirmPublish();\n\t\t\t\tnew RTE();\n\t\t\t\tnew SettingFieldSelect();\n\t\t\t\tnew SettingFieldList();\n\t\t\t\tnew SettingHTML();\n\t\t\t\tnew SettingColor();\n\t\t\t\tnew SettingMedia();\n\t\t\t\tnew ChangeMenu();\n\t\t\t\tnew AppMobile();\n\t\t\t\tnew AppNotices();\n\t\t\t\tnew AppUnloadCheck();\n\t\t\t\tnew UpdateDB();\n\t\t\t\tnew CloneCollectionDeep();\n\t\t\t\tnew TrackKeyDown();\n\t\t\t\tnew PerfectScroll();\n\t\t\t\tnew GetNewSettingGroupCollection();\n\t\t\t\tnew PublicLink();\n\t\t\t\t// new Pushstate();\n\t\t\t\t/*\n\t\t\t\t * Fields domain controllers\n\t\t\t\t * \n\t\t\t\t * Field-specific controllers should be loaded before our field type controller.\n\t\t\t\t * This ensures that any 'init' hooks are properly registered.\n\t\t\t\t */\n\t\t\t\tnew Fieldset();\n\t\t\t\tnew OptionRepeater();\n\t\t\t\tnew imageOptionRepeater();\n\t\t\t\tnew FieldTypes();\n\t\t\t\tnew FieldTypeDrag();\n\t\t\t\tnew FieldStagingDrag();\n\t\t\t\tnew StagedFieldsData();\n\t\t\t\tnew StagedFieldsSortable();\n\t\t\t\tnew DrawerFilterFieldTypes();\n\t\t\t\tnew MainContentFieldsSortable();\n\t\t\t\tnew ChangeSettingDefault();\n\t\t\t\tnew ToggleSetting();\n\t\t\t\tnew ButtonToggleSetting();\n\t\t\t\tnew NumberSetting();\n\t\t\t\tnew RadioSetting();\n\t\t\t\tnew DrawerSettingChildView();\n\t\t\t\tnew FieldsEditActive();\n\t\t\t\tnew FieldSettings();\n\t\t\t\tnew FieldCreditCard();\n\t\t\t\tnew FieldList();\n\t\t\t\tnew FieldPassword;\n\t\t\t\tnew FieldQuantity();\n\t\t\t\tnew FieldShipping();\n\t\t\t\tnew FieldKey();\n\t\t\t\tnew Notices();\n\t\t\t\tnew FieldsMobile();\n\t\t\t\tnew SavedFields();\n\t\t\t\tnew FieldDatepicker();\n\t\t\t\tnew FieldDisplayCalc();\n\t\t\t\tnew FieldRepeater();\n\t\t\t\t/*\n\t\t\t\t * TODO: Actions domain controllers\n\t\t\t\t */\n\t\t\t\tnew ActionNewsletterList();\n\t\t\t\tnew ActionDeleteFieldListener();\n\t\t\t\tnew ActionCollectPaymentCalculations();\n\t\t\t\tnew ActionCollectPayment();\n\t\t\t\tnew ActionSave();\n\t\t\t\tnew ActionTypes();\n\t\t\t\tnew ActionData();\n\t\t\t\tnew ActionSettings();\n\t\t\t\tnew ActionEditActive();\n\t\t\t\tnew ActionEmailFromSetting();\n\t\t\t\tnew ActionAddTypes();\n\t\t\t\tnew ActionTypeDrag();\n\t\t\t\tnew ActionDroppable();\n\t\t\t\tnew ActionFilterTypes();\n\t\t\t\tnew ActionCollectPaymentFields();\n\t\t\t\tnew ActionCollectPaymentFixed();\n\n\t\t\t\t/*\n\t\t\t\t * TODO: Settings domain controllers\n\t\t\t\t */\n\t\t\t\tnew SettingTypes();\n\t\t\t\tnew FormSettings();\n\t\t\t\tnew AdvancedCalculations();\n\t\t\t\tnew SettingData();\n\t\t\t\tnew SettingsEditActive();\n\t\t\t\tnew SettingsClickEdit();\n\t\t\t\t\n\t\t\t\t/*\n\t\t\t\t * Data controllers need to be set after every other controller has been setup, even if they aren't domain-specific.\n\t\t\t\t * AppData() was after FormData();\n\t\t\t\t */\n\t\t\t\tnew AppData();\n\t\t\t\tnew FieldData();\n\t\t\t\tnew FormData();\n\t\t\t\tnew MergeTags();\n\t\t\t\tnew MergeTagsBox();\n\t\t\t\tnew ItemSettingFill();\n\t\t\t}\n\t\t});\n\n\t\treturn controller;\n} );\n\ndefine( 'views/fields/mainContentEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-content-fields-empty',\n\n\t\tonBeforeDestroy: function() {\n\t\t\tjQuery( this.el ).parent().removeClass( 'nf-fields-empty-droppable' ).droppable( 'destroy' );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tif ( jQuery( this.el ).parent().hasClass( 'ui-sortable' ) ) {\n\t\t\t\tjQuery( this.el ).parent().sortable( 'destroy' );\n\t\t\t}\n\t\t\tjQuery( this.el ).parent().addClass( 'nf-fields-empty-droppable' );\n\t\t\tjQuery( this.el ).parent().droppable( {\n\t\t\t\taccept: function( draggable ) {\n\t\t\t\t\tif ( jQuery( draggable ).hasClass( 'nf-stage' ) || jQuery( draggable ).hasClass( 'nf-field-type-button' ) ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\tactiveClass: 'nf-droppable-active',\n\t\t\t\thoverClass: 'nf-droppable-hover',\n\t\t\t\ttolerance: 'pointer',\n\t\t\t\tover: function( e, ui ) {\n\t\t\t\t\tui.item = ui.draggable;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'over:fieldsSortable', ui );\n\t\t\t\t},\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\tui.item = ui.draggable;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'out:fieldsSortable', ui );\n\t\t\t\t},\n\t\t\t\tdrop: function( e, ui ) {\n\t\t\t\t\tui.item = ui.draggable;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'receive:fieldsSortable', ui );\n\t\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t\t\tfieldCollection.trigger( 'reset', fieldCollection );\n\t\t\t\t},\n\t\t\t} );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Renders our form title.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/formTitle',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-header-form-title',\n\n\t\tinitialize: function() {\n\t\t\t// When we change the model (to disable it, for example), re-render.\n\t\t\tthis.model.on( 'change:title', this.render, this );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function() {\n\t\t\tvar that = this;\n\t \treturn {\n\t \t\trenderTitle: function(){\n\t \t\t\tvar formData = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t \t\t\treturn _.escape( formData.get( 'settings' ).get( 'title' ) );\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n/**\n * Return views that might be used in extensions.\n * These are un-instantiated views.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/loadViews',[ 'views/fields/fieldItem', 'views/fields/mainContentEmpty', 'views/app/formTitle' ], function( fieldItemView, mainContentEmptyView, FormTitleView ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Reply to requests for our field item view.\n\t\t\tnfRadio.channel( 'views' ).reply( 'get:fieldItem', this.getFieldItem );\n\t\t\n\t\t\t// Reply to requests for our empty content view.\n\t\t\tnfRadio.channel( 'views' ).reply( 'get:mainContentEmpty', this.getMainContentEmpty );\n\t\t\n\t\t\t// Reply to requests for our form title view.\n\t\t\tnfRadio.channel( 'views' ).reply( 'get:formTitle', this.getFormTitle );\n\t\t},\n\n\t\tgetFieldItem: function( model ) {\n\t\t\treturn fieldItemView;\n\t\t},\n\n\t\tgetMainContentEmpty: function() {\n\t\t\treturn mainContentEmptyView;\n\t\t},\n\n\t\tgetFormTitle: function() {\n\t\t\treturn FormTitleView;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\nvar nfRadio = Backbone.Radio;\n\njQuery( document ).ready( function( $ ) {\n\trequire( ['views/app/builder', 'controllers/loadControllers', 'views/loadViews'], function( BuilderView, LoadControllers, LoadViews ) {\n\n\t\tvar NinjaForms = Marionette.Application.extend( {\n\n\t\t\tinitialize: function( options ) {\n\n\t\t\t\tvar that = this;\n\t\t\t\tMarionette.Renderer.render = function(template, data){\n\t\t\t\t\tvar template = that.template( template );\n\t\t\t\t\treturn template( data );\n\t\t\t\t};\n\n\t\t\t\t// Trigger an event before we load our controllers.\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'before:loadControllers', this );\n\t\t\t\t// Load our controllers.\n\t\t\t\tvar loadControllers = new LoadControllers();\n\t\t\t\t// Trigger an event after we load our controllers.\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'after:loadControllers', this );\n\n\t\t\t\t// Trigger an event before we load un-instantiated views\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'before:loadViews', this );\n\t\t\t\tvar loadViews = new LoadViews();\n\t\t\t\t// Trigger an event after we load un-instantiated views.\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'after:loadViews', this );\n\n\t\t\t\tnfRadio.channel( 'app' ).reply( 'get:template', this.template );\n\t\t\t},\n\n\t\t\tonStart: function() {\n\t\t\t\tvar builderView = new BuilderView();\n\t\t\t\t// Trigger our after start event.\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'after:appStart', this );\n\n\t\t\t\t/*\n\t\t\t\t * If we're on the new forms builder, open the add fields drawer.\n\t\t\t\t */\n\t\t\t\tif ( 0 == nfAdmin.formID ) {\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'addField' );\n\t\t\t\t}\n\t\t\t},\n\n\t\t\ttemplate: function( template ) {\n\t\t\t\treturn _.template( $( template ).html(), {\n\t\t\t\t\tevaluate: /<#([\\s\\S]+?)#>/g,\n\t\t\t\t\tinterpolate: /\\{\\{\\{([\\s\\S]+?)\\}\\}\\}/g,\n\t\t\t\t\tescape: /\\{\\{([^\\}]+?)\\}\\}(?!\\})/g,\n\t\t\t\t\tvariable: 'data'\n\t\t\t\t} );\n\t\t\t}\n\t\t} );\n\t\n\t\tvar ninjaForms = new NinjaForms();\n\t\tninjaForms.start();\n\t} );\n} );\ndefine(\"main\", function(){});\n\n}());"],"file":"builder.js"}

+ {"version":3,"names":[],"mappings":"","sources":["main.js"],"sourcesContent":["(function () {\n/**\n * @license almond 0.3.1 Copyright (c) 2011-2014, The Dojo Foundation All Rights Reserved.\n * Available via the MIT or new BSD license.\n * see: http://github.com/jrburke/almond for details\n */\n//Going sloppy to avoid 'use strict' string cost, but strict practices should\n//be followed.\n/*jslint sloppy: true */\n/*global setTimeout: false */\n\nvar requirejs, require, define;\n(function (undef) {\n var main, req, makeMap, handlers,\n defined = {},\n waiting = {},\n config = {},\n defining = {},\n hasOwn = Object.prototype.hasOwnProperty,\n aps = [].slice,\n jsSuffixRegExp = /\\.js$/;\n\n function hasProp(obj, prop) {\n return hasOwn.call(obj, prop);\n }\n\n /**\n * Given a relative module name, like ./something, normalize it to\n * a real name that can be mapped to a path.\n * @param {String} name the relative name\n * @param {String} baseName a real name that the name arg is relative\n * to.\n * @returns {String} normalized name\n */\n function normalize(name, baseName) {\n var nameParts, nameSegment, mapValue, foundMap, lastIndex,\n foundI, foundStarMap, starI, i, j, part,\n baseParts = baseName && baseName.split(\"/\"),\n map = config.map,\n starMap = (map && map['*']) || {};\n\n //Adjust any relative paths.\n if (name && name.charAt(0) === \".\") {\n //If have a base name, try to normalize against it,\n //otherwise, assume it is a top-level require that will\n //be relative to baseUrl in the end.\n if (baseName) {\n name = name.split('/');\n lastIndex = name.length - 1;\n\n // Node .js allowance:\n if (config.nodeIdCompat && jsSuffixRegExp.test(name[lastIndex])) {\n name[lastIndex] = name[lastIndex].replace(jsSuffixRegExp, '');\n }\n\n //Lop off the last part of baseParts, so that . matches the\n //\"directory\" and not name of the baseName's module. For instance,\n //baseName of \"one/two/three\", maps to \"one/two/three.js\", but we\n //want the directory, \"one/two\" for this normalization.\n name = baseParts.slice(0, baseParts.length - 1).concat(name);\n\n //start trimDots\n for (i = 0; i < name.length; i += 1) {\n part = name[i];\n if (part === \".\") {\n name.splice(i, 1);\n i -= 1;\n } else if (part === \"..\") {\n if (i === 1 && (name[2] === '..' || name[0] === '..')) {\n //End of the line. Keep at least one non-dot\n //path segment at the front so it can be mapped\n //correctly to disk. Otherwise, there is likely\n //no path mapping for a path starting with '..'.\n //This can still fail, but catches the most reasonable\n //uses of ..\n break;\n } else if (i > 0) {\n name.splice(i - 1, 2);\n i -= 2;\n }\n }\n }\n //end trimDots\n\n name = name.join(\"/\");\n } else if (name.indexOf('./') === 0) {\n // No baseName, so this is ID is resolved relative\n // to baseUrl, pull off the leading dot.\n name = name.substring(2);\n }\n }\n\n //Apply map config if available.\n if ((baseParts || starMap) && map) {\n nameParts = name.split('/');\n\n for (i = nameParts.length; i > 0; i -= 1) {\n nameSegment = nameParts.slice(0, i).join(\"/\");\n\n if (baseParts) {\n //Find the longest baseName segment match in the config.\n //So, do joins on the biggest to smallest lengths of baseParts.\n for (j = baseParts.length; j > 0; j -= 1) {\n mapValue = map[baseParts.slice(0, j).join('/')];\n\n //baseName segment has config, find if it has one for\n //this name.\n if (mapValue) {\n mapValue = mapValue[nameSegment];\n if (mapValue) {\n //Match, update name to the new value.\n foundMap = mapValue;\n foundI = i;\n break;\n }\n }\n }\n }\n\n if (foundMap) {\n break;\n }\n\n //Check for a star map match, but just hold on to it,\n //if there is a shorter segment match later in a matching\n //config, then favor over this star map.\n if (!foundStarMap && starMap && starMap[nameSegment]) {\n foundStarMap = starMap[nameSegment];\n starI = i;\n }\n }\n\n if (!foundMap && foundStarMap) {\n foundMap = foundStarMap;\n foundI = starI;\n }\n\n if (foundMap) {\n nameParts.splice(0, foundI, foundMap);\n name = nameParts.join('/');\n }\n }\n\n return name;\n }\n\n function makeRequire(relName, forceSync) {\n return function () {\n //A version of a require function that passes a moduleName\n //value for items that may need to\n //look up paths relative to the moduleName\n var args = aps.call(arguments, 0);\n\n //If first arg is not require('string'), and there is only\n //one arg, it is the array form without a callback. Insert\n //a null so that the following concat is correct.\n if (typeof args[0] !== 'string' && args.length === 1) {\n args.push(null);\n }\n return req.apply(undef, args.concat([relName, forceSync]));\n };\n }\n\n function makeNormalize(relName) {\n return function (name) {\n return normalize(name, relName);\n };\n }\n\n function makeLoad(depName) {\n return function (value) {\n defined[depName] = value;\n };\n }\n\n function callDep(name) {\n if (hasProp(waiting, name)) {\n var args = waiting[name];\n delete waiting[name];\n defining[name] = true;\n main.apply(undef, args);\n }\n\n if (!hasProp(defined, name) && !hasProp(defining, name)) {\n throw new Error('No ' + name);\n }\n return defined[name];\n }\n\n //Turns a plugin!resource to [plugin, resource]\n //with the plugin being undefined if the name\n //did not have a plugin prefix.\n function splitPrefix(name) {\n var prefix,\n index = name ? name.indexOf('!') : -1;\n if (index > -1) {\n prefix = name.substring(0, index);\n name = name.substring(index + 1, name.length);\n }\n return [prefix, name];\n }\n\n /**\n * Makes a name map, normalizing the name, and using a plugin\n * for normalization if necessary. Grabs a ref to plugin\n * too, as an optimization.\n */\n makeMap = function (name, relName) {\n var plugin,\n parts = splitPrefix(name),\n prefix = parts[0];\n\n name = parts[1];\n\n if (prefix) {\n prefix = normalize(prefix, relName);\n plugin = callDep(prefix);\n }\n\n //Normalize according\n if (prefix) {\n if (plugin && plugin.normalize) {\n name = plugin.normalize(name, makeNormalize(relName));\n } else {\n name = normalize(name, relName);\n }\n } else {\n name = normalize(name, relName);\n parts = splitPrefix(name);\n prefix = parts[0];\n name = parts[1];\n if (prefix) {\n plugin = callDep(prefix);\n }\n }\n\n //Using ridiculous property names for space reasons\n return {\n f: prefix ? prefix + '!' + name : name, //fullName\n n: name,\n pr: prefix,\n p: plugin\n };\n };\n\n function makeConfig(name) {\n return function () {\n return (config && config.config && config.config[name]) || {};\n };\n }\n\n handlers = {\n require: function (name) {\n return makeRequire(name);\n },\n exports: function (name) {\n var e = defined[name];\n if (typeof e !== 'undefined') {\n return e;\n } else {\n return (defined[name] = {});\n }\n },\n module: function (name) {\n return {\n id: name,\n uri: '',\n exports: defined[name],\n config: makeConfig(name)\n };\n }\n };\n\n main = function (name, deps, callback, relName) {\n var cjsModule, depName, ret, map, i,\n args = [],\n callbackType = typeof callback,\n usingExports;\n\n //Use name if no relName\n relName = relName || name;\n\n //Call the callback to define the module, if necessary.\n if (callbackType === 'undefined' || callbackType === 'function') {\n //Pull out the defined dependencies and pass the ordered\n //values to the callback.\n //Default to [require, exports, module] if no deps\n deps = !deps.length && callback.length ? ['require', 'exports', 'module'] : deps;\n for (i = 0; i < deps.length; i += 1) {\n map = makeMap(deps[i], relName);\n depName = map.f;\n\n //Fast path CommonJS standard dependencies.\n if (depName === \"require\") {\n args[i] = handlers.require(name);\n } else if (depName === \"exports\") {\n //CommonJS module spec 1.1\n args[i] = handlers.exports(name);\n usingExports = true;\n } else if (depName === \"module\") {\n //CommonJS module spec 1.1\n cjsModule = args[i] = handlers.module(name);\n } else if (hasProp(defined, depName) ||\n hasProp(waiting, depName) ||\n hasProp(defining, depName)) {\n args[i] = callDep(depName);\n } else if (map.p) {\n map.p.load(map.n, makeRequire(relName, true), makeLoad(depName), {});\n args[i] = defined[depName];\n } else {\n throw new Error(name + ' missing ' + depName);\n }\n }\n\n ret = callback ? callback.apply(defined[name], args) : undefined;\n\n if (name) {\n //If setting exports via \"module\" is in play,\n //favor that over return value and exports. After that,\n //favor a non-undefined return value over exports use.\n if (cjsModule && cjsModule.exports !== undef &&\n cjsModule.exports !== defined[name]) {\n defined[name] = cjsModule.exports;\n } else if (ret !== undef || !usingExports) {\n //Use the return value from the function.\n defined[name] = ret;\n }\n }\n } else if (name) {\n //May just be an object definition for the module. Only\n //worry about defining if have a module name.\n defined[name] = callback;\n }\n };\n\n requirejs = require = req = function (deps, callback, relName, forceSync, alt) {\n if (typeof deps === \"string\") {\n if (handlers[deps]) {\n //callback in this case is really relName\n return handlers[deps](callback);\n }\n //Just return the module wanted. In this scenario, the\n //deps arg is the module name, and second arg (if passed)\n //is just the relName.\n //Normalize module name, if it contains . or ..\n return callDep(makeMap(deps, callback).f);\n } else if (!deps.splice) {\n //deps is a config object, not an array.\n config = deps;\n if (config.deps) {\n req(config.deps, config.callback);\n }\n if (!callback) {\n return;\n }\n\n if (callback.splice) {\n //callback is an array, which means it is a dependency list.\n //Adjust args if there are dependencies\n deps = callback;\n callback = relName;\n relName = null;\n } else {\n deps = undef;\n }\n }\n\n //Support require(['a'])\n callback = callback || function () {};\n\n //If relName is a function, it is an errback handler,\n //so remove it.\n if (typeof relName === 'function') {\n relName = forceSync;\n forceSync = alt;\n }\n\n //Simulate async callback;\n if (forceSync) {\n main(undef, deps, callback, relName);\n } else {\n //Using a non-zero value because of concern for what old browsers\n //do, and latest browsers \"upgrade\" to 4 if lower value is used:\n //http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-settimeout:\n //If want a value immediately, use require('id') instead -- something\n //that works in almond on the global level, but not guaranteed and\n //unlikely to work in other AMD implementations.\n setTimeout(function () {\n main(undef, deps, callback, relName);\n }, 4);\n }\n\n return req;\n };\n\n /**\n * Just drops the config on the floor, but returns req in case\n * the config return value is used.\n */\n req.config = function (cfg) {\n return req(cfg);\n };\n\n /**\n * Expose module registry for debugging and tooling\n */\n requirejs._defined = defined;\n\n define = function (name, deps, callback) {\n if (typeof name !== 'string') {\n throw new Error('See almond README: incorrect module build, no module name');\n }\n\n //This module may not have dependencies\n if (!deps.splice) {\n //deps is not an array, so probably means\n //an object literal or factory function for\n //the value. Adjust args.\n callback = deps;\n deps = [];\n }\n\n if (!hasProp(defined, name) && !hasProp(waiting, name)) {\n waiting[name] = [name, deps, callback];\n }\n };\n\n define.amd = {\n jQuery: true\n };\n}());\n\ndefine(\"../lib/almond\", function(){});\n\n/**\n * Renders an application menu item from a domain model.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/menuItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-app-menu-item',\n\n\t\tinitialize: function() {\n\t\t\t// Listen for domain changes and re-render when we detect one.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.render );\n\t\t\t// When we change the model (to disable it, for example), re-render.\n\t\t\tthis.model.on( 'change', this.render, this );\n\t\t},\n\n\t\t/**\n\t\t * When we render this view, remove the extra <div> tag created by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\t// Listen for clicks on our app menu.\n\t\tevents: {\n\t\t\t'click a': 'clickAppMenu'\n\t\t},\n\n\t\t/**\n\t\t * When we click on a menu item, fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * We pass this.model so that we know what item was clicked.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\te event\n\t\t * @return return\n\t\t */\n\t\tclickAppMenu: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:menu', e, this.model );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\t/**\n\t\t\t\t * If we have any dashicons in our model, render them.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDashicons: function() {\n\t\t\t\t\tif ( ! this.dashicons ) return '';\n\n\t\t\t\t\tvar icon = document.createElement( 'span' );\n\t\t\t\t\ticon.classList.add( 'dashicons' );\n\t\t\t\t\ticon.classList.add( this.dashicons );\n\n\t\t\t\t\treturn icon.outerHTML;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * Render classes for our menu item, including active.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = this.classes;\n\t\t\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tif ( currentDomain.get( 'id' ) == this.id ) {\n\t\t\t\t\t\tclasses += ' active';\n\t\t\t\t\t}\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its url.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderUrl: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t\t\t\treturn this.url + formModel.get( 'id' );\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '#';\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its target.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderTarget: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\treturn '_blank';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '_self';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t\t/**\n\t\t\t\t * If our menu item is disabled, output 'disabled'\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\tif ( this.disabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n\n/**\n * Collection view that takes our app menu items and renders an individual view for each.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/menu',['views/app/menuItem'], function( appMenuItemView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: appMenuItemView,\n\n\t\t/**\n\t\t * When we show this view, get rid of the extra <div> tag added by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).find( 'li:last' ).unwrap();\n\t\t}\n\t} );\n\n\treturn view;\n} );\n/**\n * Renders the action buttons to the right of the app menu. i.e. Publish\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/menuButtons',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'span',\n\t\ttemplate: '#tmpl-nf-app-header-action-button',\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes on the app 'clean' state. When it changes, re-render.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.render, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:loading', this.render, this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'response:updateDB', this.bounceIcon, this );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\n\t \t\t/**\n\t \t\t * Render our Publish button. If we're loading, render the loading version.\n\t \t\t *\n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\trenderPublish: function() {\n\t \t\t\tif ( that.publishWidth ) {\n\t \t\t\t\tthis.publishWidth = that.publishWidth + 'px';\n\t \t\t\t} else {\n\t \t\t\t\tthis.publishWidth = 'auto';\n\t \t\t\t}\n\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'loading' ) ) {\n\t \t\t\t\tvar template = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-add-header-publish-loading' );\n\t \t\t\t} else {\n\t \t\t\t\tvar template = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-app-header-publish-button' );\n\t \t\t\t}\n\t \t\t\treturn template( this );\n\t \t\t},\n\n\t \t\t/**\n\t \t\t * If our app state is clean, disable publish.\n\t \t\t * \n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\tmaybeDisabled: function() {\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t \t\t\t\treturn 'disabled';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t},\n\n\t \t\t/**\n\t \t\t * [DEPRECATED] If our app isn't clean, render our 'viewChanges' button.\n\t \t\t * @since version\n\t \t\t * @return {[type]} [description]\n\t \t\t */\n\t \t\tmaybeRenderCancel: function() {\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\n\t \t\trenderPublicLink: function() {\n\t\t\t\t\t\t// Don't show public link if the form has a temp ID\n\t\t\t\t\t\tvar formModel = Backbone.Radio.channel('app').request('get:formModel');\n\t\t\t\t\t\tif (isNaN(formModel.get('id'))) { return };\n\t\t\t\t\t\t// Otherwise, display normally\n\t \t\t\tvar publicLink = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-app-header-public-link' );\n\t \t\t\t\treturn publicLink( this );\n\t \t\t},\n\t\t\t};\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tvar publishEL = jQuery( this.el ).find( '.publish' );\n\t\t\t// this.publishWidth = jQuery( publishEL ).outerWidth( true );\n\t\t},\n\n\t\t/**\n\t\t * Listen for clicks on the Publish or view changes button.\n\t\t * @type {Object}\n\t\t */\n\t\tevents: {\n\t\t\t'click .publish': 'clickPublish',\n\t\t\t'click .viewChanges': 'clickViewChanges',\n\t\t\t'click .publicLink': 'clickPublicLink',\n\t\t},\n\n\t\t/**\n\t\t * When we click publish, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickPublish: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:publish', e );\n\t\t},\n\n\t\t/**\n\t\t * When we click view changes, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickViewChanges: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:viewChanges', e );\n\t\t},\n\n\t\tclickPublicLink: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:publicLink', e );\n\t\t},\n\n\t\tbounceIcon: function( changeModel ) {\n\t\t\tjQuery( this.el ).find( '.dashicons-backup' ).effect( 'bounce', { times: 3 }, 600 );\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n\n/**\n * Renders the action buttons to the right of the app menu. i.e. Publish\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/mobileMenuButton',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'span',\n\t\ttemplate: '#tmpl-nf-mobile-menu-button',\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes on the app 'clean' state. When it changes, re-render.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.render, this );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\t \t\t/**\n\t \t\t * If our app state is clean, disable button.\n\t \t\t * \n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\tmaybeDisabled: function() {\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t \t\t\t\treturn 'disabled';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t}\n\t\t\t};\n\t\t},\n\n\t\t/**\n\t\t * Listen for clicks on the mobile menu button.\n\t\t * @type {Object}\n\t\t */\n\t\tevents: {\n\t\t\t'click .nf-mobile-menu': 'clickMobileMenu'\n\t\t},\n\n\t\t/**\n\t\t * When we click publish, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickMobileMenu: function( e) {\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).toggleClass( 'nf-menu-expand' );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Main application header. Includes links to all of our domains.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/header',['views/app/menu', 'views/app/menuButtons', 'views/app/mobileMenuButton'], function( appMenuCollectionView, appMenuButtonsView, mobileMenuButtonView ) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-app-header',\n\n\t\tregions: {\n\t\t\t// Menu is our main app menu.\n\t\t\tmenu: '.nf-app-menu',\n\t\t\t// Buttons represents the 'view changes' and 'Publish' buttons.\n\t\t\tbuttons: '.nf-app-buttons',\n\t\t\tmobileMenuButton: '.nf-mobile-menu-button'\n\t\t},\n\n\t\t/**\n\t\t * Since this is a layout region, we need to fill the two areas: menu and buttons whenever we show this view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\t// Get our domains\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\t// show the menu area using the appropriate view, passing our domain collection.\n\t\t\tthis.menu.show( new appMenuCollectionView( { collection: appDomainCollection } ) );\n\t\t\tthis.buttons.show( new appMenuButtonsView() );\n\t\t\tthis.mobileMenuButton.show( new mobileMenuButtonView() );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click #nf-logo': 'clickLogo'\n\t\t},\n\n\t\tclickLogo: function( e ) {\n\t\t\t\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n/**\n * Renders our sub-header. i.e. add new field, add new action, etc.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header'\n\t});\n\n\treturn view;\n} );\n/**\n * Renders our builder header.\n *\n * This is a layout view and handles two regions:\n * app - menu/buttons\n * subapp - title, add new field, etc.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/builderHeader',[ 'views/app/header', 'views/app/subHeader' ], function( appHeaderView, appSubHeaderView ) {\n\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: \"div\",\n\t\ttemplate: \"#tmpl-nf-header\",\n\n\t\tregions: {\n\t\t\tapp: \"#nf-app-header\",\n\t\t\tformTitle: \"#nf-app-form-title\",\n\t\t\tappSub: \"#nf-app-sub-header\"\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.changeSubHeader );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tthis.app.show( new appHeaderView() );\n\n\t\t\tvar formData = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\tvar formSettings = formData.get( 'settings' );\n\n\t\t\tvar formTitleView = nfRadio.channel( 'views' ).request( 'get:formTitle' );\n\t\t\tthis.formTitle.show( new formTitleView( { model: formSettings } ) );\n\n\t\t\tthis.changeSubHeader();\n\t\t},\n\n\t\tchangeSubHeader: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar subHeaderView = currentDomain.get( 'getSubHeaderView' ).call( currentDomain );\n\t\t\tthis.appSub.show( subHeaderView );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Renders our builder.\n *\n * This is a layout view and handles three regions:\n * gutterLeft - gutter to the left of our main content area\n * body - main content area\n * gutterRight - gutter to the right of our main content area\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/main',[], function() {\n\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main',\n\t\tclassName: 'nf-main-test',\n\t\tmaybeDone: false,\n\n\t\toffsetRight: false,\n\t\toffsetLeft: false,\n\n\t\tregions: {\n\t\t\tgutterLeft: '#nf-main-gutter-left',\n\t\t\tbody: '#nf-main-body',\n\t\t\tgutterRight: '#nf-main-gutter-right'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.render );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:mainEl', this.getMainEl, this );\n\n\t\t\t/*\n\t\t\t * Make sure that our gutters resize to match our screen upon resize or drawer open/close.\n\t\t\t */\n\t\t\tjQuery( window ).on( 'resize', { context: this }, this.resizeBothGutters );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'before:open', this.setBothGuttersAbsolute );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.setBothGuttersFixed );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'before:close', this.setBothGuttersAbsolute );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.setBothGuttersFixed );\n\t\t\t// ... or Domain Change.\n this.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', function(){\n // @todo Using a timeout feels like a hack, but there may be a timing issue here.\n \tsetTimeout(function(){\n nfRadio.channel( 'app' ).request( 'update:gutters' );\n\t\t\t\t}, 300, this );\n\t\t\t}, this );\n\n\n\t\t\t/*\n\t\t\t * Reply to messages requesting that we resize our gutters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:gutters', this.updateGutters, this );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tnfRadio.channel( 'main' ).trigger( 'show:main', this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar bodyView = currentDomain.get( 'getMainContentView' ).call( currentDomain );\n\t\t\tthis.body.show( bodyView );\n\n\t\t\tvar gutterLeftView = currentDomain.get( 'getGutterLeftView' ).call( currentDomain );\n\t\t\tthis.gutterLeft.show( gutterLeftView );\n\n\t\t\tvar gutterRightView = currentDomain.get( 'getGutterRightView' ).call( currentDomain );\n\t\t\tthis.gutterRight.show( gutterRightView );\n\t\t\t\n\t\t\tnfRadio.channel( 'main' ).trigger( 'render:main' );\n\t\t},\n\n\t\tgetMainEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tonAttach: function() {\n\t\t\tthis.initialGutterResize();\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tjQuery( window ).off( 'resize', this.resize );\n\t\t},\n\n\t\tinitialGutterResize: function() {\n\t\t\tthis.resizeGutter( this.gutterLeft.el );\n\t\t\tthis.resizeGutter( this.gutterRight.el );\n\t\t\tthis.setBothGuttersFixed( this );\n\t\t},\n\n\t\tresizeBothGutters: function( e ) {\n\t\t\tvar context = ( e ) ? e.data.context : this;\n\n\t\t\tvar leftEl = context.gutterLeft.el;\n\t\t\tvar rightEl = context.gutterRight.el;\n\t\t\t\n\t\t\tcontext.resizeGutter( leftEl, context );\n\t\t\tcontext.resizeGutter( rightEl, context );\n\n\t\t\tcontext.setBothGuttersAbsolute( context );\n\n\t\t\t/*\n\t\t\t * Clear our timeout. If the timeout runs, it means we've stopped resizing.\n\t\t\t */\t\n\t\t\tclearTimeout( context.maybeDone );\n\t\t\t/*\n\t\t\t * Add our timeout.\n\t\t\t */\n\t\t\tcontext.maybeDone = setTimeout( context.setBothGuttersFixed, 100, context );\n\t\t},\n\n\t\tresizeGutter: function( el, context ) {\n\t\t\tvar top = jQuery( el ).offset().top;\n\t\t\tvar viewHeight = jQuery( window ).height();\n\t\t\tvar height = viewHeight - top;\n\t\t\tjQuery( el ).height( height );\n\t\t},\n\n\t\tsetBothGuttersFixed: function( context ) {\n\t\t\tcontext = context || this;\n\n\t\t\tvar offsetLeft = jQuery( context.gutterLeft.el ).offset();\n\t\t\tvar topLeft = offsetLeft.top;\n\t\t\tvar leftLeft = offsetLeft.left;\n\n\t\t\tjQuery( context.gutterLeft.el ).css( { position: 'fixed', left: leftLeft, top: topLeft } );\t\t\tvar offsetLeft = jQuery( context.gutterLeft.el ).offset();\n\t\t\t\n\t\t\tvar offsetRight = jQuery( context.gutterRight.el ).offset();\n\t\t\tvar topRight = offsetRight.top;\n\t\t\tvar leftRight = offsetRight.left;\n\n\t\t\tjQuery( context.gutterRight.el ).css( { position: 'fixed', left: leftRight, top: topRight } );\n\t\t},\n\n\t\tsetBothGuttersAbsolute: function( context ) {\n\t\t\tcontext = context || this;\n\n\t\t\tvar offsetLeft = jQuery( context.gutterLeft.el ).offset();\n\t\t\tvar offsetRight = jQuery( context.gutterRight.el ).offset();\n\n\t\t\tvar scrollTop = jQuery( '#nf-main' ).scrollTop();\n\n\t\t\tjQuery( context.gutterLeft.el ).css( { position: 'absolute', left: 0, top: scrollTop } );\n\t\t\tjQuery( context.gutterRight.el ).css( { position: 'absolute', top: scrollTop, right: 0, left: 'auto' } );\n\t\t},\n\n\t\tupdateGutters: function() {\n\t\t\tthis.resizeBothGutters();\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n\n/**\n * Renders an application menu item from a domain model.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/mobileMenuItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-mobile-menu-item',\n\n\t\t/**\n\t\t * When we render this view, remove the extra <div> tag created by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\t// Listen for clicks on our app menu.\n\t\tevents: {\n\t\t\t'click a': 'clickAppMenu'\n\t\t},\n\n\t\t/**\n\t\t * When we click on a menu item, fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * We pass this.model so that we know what item was clicked.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\te event\n\t\t * @return return\n\t\t */\n\t\tclickAppMenu: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:menu', e, this.model );\n\t\t},\n\n\t\t/**\n\t\t * These functions are available to templates, and help us to remove logic from template files.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\t/**\n\t\t\t\t * If we have any dashicons in our model, render them.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDashicons: function() {\n\t\t\t\t\tif ( ! this.mobileDashicon ) return '';\n\n var icon = document.createElement( 'span' );\n icon.classList.add( 'dashicons' );\n icon.classList.add( this.mobileDashicon );\n\n return icon.outerHTML;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * Render classes for our menu item, including active.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = this.classes;\n\t\t\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tif ( currentDomain.get( 'id' ) == this.id ) {\n\t\t\t\t\t\tclasses += ' active';\n\t\t\t\t\t}\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its url.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderUrl: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t\t\t\treturn this.url + formModel.get( 'id' );\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '#';\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * If our menu is a link (like preview), render its target.\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderTarget: function() {\n\t\t\t\t\tif ( '' != this.url ) {\n\t\t\t\t\t\treturn '_blank';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '_self';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t\t/**\n\t\t\t\t * If our menu item is disabled, output 'disabled'\n\t\t\t\t * \n\t\t\t\t * @since 3.0\n\t\t\t\t * @return string\n\t\t\t\t */\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\tif ( this.disabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n\n/**\n * Single item view used for the menu drawer.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/mobileMenu',['views/app/mobileMenuItem'], function( mobileMenuItemView ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-mobile-menu',\n\t\tchildView: mobileMenuItemView,\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes on the app 'clean' state. When it changes, re-render.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.render, this );\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.secondary' ).append( childView.el );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\t/**\n\t \t\t * If our app state is clean, disable button.\n\t \t\t * \n\t \t\t * @since 3.0\n\t \t\t * @return string\n\t \t\t */\n\t \t\tmaybeDisabled: function() {\n\t \t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t \t\t\t\treturn 'disabled';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t}\n\t\t\t};\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-publish': 'clickPublish'\n\t\t},\n\n\t\t/**\n\t\t * When we click publish, trigger a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tclickPublish: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:publish', e );\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).toggleClass( 'nf-menu-expand' );\n\t\t},\n\t});\n\n\treturn view;\n} );\n/**\n * Empty drawer content view.\n * Called before we close the drawer.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-empty'\n\t});\n\n\treturn view;\n} );\n/**\n * Renders our drawer region\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer',['views/app/drawer/contentEmpty'], function( drawerEmptyView ) {\n\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer',\n\n\t\tregions: {\n\t\t\theader: '#nf-drawer-header',\n\t\t\tcontent: '#nf-drawer-content',\n\t\t\tfooter: '#nf-drawer-footer'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:drawerEl', this.getEl, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'load:drawerContent', this.loadContent, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'empty:drawerContent', this.emptyContent, this );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).parent().perfectScrollbar();\n\t\t},\n\n\t\tloadContent: function( drawerID, data ) {\n\t\t\tvar drawer = nfRadio.channel( 'app' ).request( 'get:drawer', drawerID );\n\t\t\tvar contentView = drawer.get( 'getContentView' ).call( drawer, data );\n\t\t\tvar headerView = drawer.get( 'getHeaderView' ).call( drawer, data );\n\t\t\tvar footerView = drawer.get( 'getFooterView' ).call( drawer, data );\n\n\t\t\tthis.header.show( headerView );\n\t\t\tthis.content.show( contentView );\n\t\t\tthis.footer.show( footerView );\n\n\t\t},\n\n\t\temptyContent: function() {\n\t\t\tthis.header.empty();\n\t\t\tthis.content.empty();\n\t\t\tthis.footer.empty();\n\t\t},\n\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-toggle-drawer': 'clickToggleDrawer'\n\t\t},\n\n\t\tclickToggleDrawer: function() {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:toggleDrawerSize' );\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Single item view used for merge tags.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'li',\n\n\t\ttemplate: '#tmpl-nf-merge-tags-item',\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:active', this.render );\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:active', this.render, this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click a': 'clickTag'\n\t\t},\n\n\t\tclickTag: function( e ) {\n\t\t\tnfRadio.channel( 'mergeTags' ).trigger( 'click:mergeTag', e, this.model );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tif ( this.active ) {\n\t\t\t\t\t\treturn 'active';\n\t\t\t\t\t}\n\t\t\t\t}\t\t\t\t\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Merge tags popup section\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagsSection',['views/app/drawer/mergeTagItem'], function( mergeTagItemView ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\ttagName: 'div',\n\t\tchildView: mergeTagItemView,\n\t\ttemplate: '#tmpl-nf-merge-tags-section',\n\n\t\tinitialize: function() {\n\t\t\tthis.collection = this.model.get( 'tags' );\n\t\t\tthis.model.on( 'change', this.render, this );\n\t\t\tif ( 'fields' == this.model.get( 'id' ) ) {\n\t\t\t\t// var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t\t// fieldCollection.on( 'all', this.updateFields, this );\n\t\t\t}\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change', this.render );\n\t\t\tif ( 'fields' == this.model.get( 'id' ) ) {\n\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t\tfieldCollection.off( 'all', this.updateFields, this );\n\t\t\t}\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.merge-tags' ).append( childView.el );\n\t\t},\n\n\t\tupdateFields: function() {\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\tthis.model.set( 'tags', fieldCollection );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Model that represents our merge tags.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/mergeTagModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tactive: false,\n\t\t\texclude: false\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collections of merge tags.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/mergeTagCollection',['models/app/mergeTagModel'], function( mergeTagModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: mergeTagModel\n\t} );\n\treturn collection;\n} );\n/**\n * Merge tags popup\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagsContent',['views/app/drawer/mergeTagsSection', 'models/app/mergeTagCollection'], function( mergeTagsSectionView, MergeTagCollection ) {\n\tvar view = Marionette.CollectionView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-merge-tags-content',\n\t\tchildView: mergeTagsSectionView,\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'get:view', this.getMergeTagsView, this );\n\t\t},\n\n\t\treRender: function( settingModel ) {\n\t\t\tvar mergeTagCollection = nfRadio.channel( 'mergeTags' ).request( 'get:collection' );\n\t\t\tvar defaultGroups = mergeTagCollection.where( { default_group: true } );\n\n\t\t\t/*\n\t\t\t * For the Actions Domain, Add Calc Merge Tags as a Default Group.\n\t\t\t */\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tif( 'actions' == currentDomain.get( 'id' ) ){\n\t\t\t\tvar calcMergeTagGroup = mergeTagCollection.where( { id: 'calcs' } );\n defaultGroups = defaultGroups.concat( calcMergeTagGroup );\n }\n\n\t\t\tthis.collection = new MergeTagCollection( defaultGroups );\n\t\t\tvar that = this;\n\t\t\tvar useMergeTags = settingModel.get( 'use_merge_tags' );\n\t\t\tif ( 'object' == typeof useMergeTags ) {\n\t\t\t\tif ( 'undefined' != typeof useMergeTags.exclude ) {\n\t\t\t\t\t_.each( useMergeTags.exclude, function( exclude ) {\n\t\t\t\t\t\tthat.collection.remove( exclude )\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\tif ( 'undefined' != typeof useMergeTags.include ) {\n\t\t\t\t\t_.each( mergeTagCollection.models, function( sectionModel ) {\n\t\t\t\t\t\tif ( -1 != useMergeTags.include.indexOf( sectionModel.get( 'id' ) ) ) {\n\t\t\t\t\t\t\t// console.log( sectionModel );\n\t\t\t\t\t\t\tthat.collection.add( sectionModel );\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.render();\n\t\t},\n\n\t\tgetMergeTagsView: function() {\n\t\t\treturn this;\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Builder view.\n *\n * This layout view has regions that represent our application areas:\n * header\n * main\n * menuDrawer - Mobile side-menu\n * drawer\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/builder',['views/app/builderHeader', 'views/app/main', 'views/app/mobileMenu', 'views/app/drawer', 'views/app/drawer/mergeTagsContent'], function( headerView, mainView, mobileMenuView, drawerView, mergeTagsContentView ) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: \"#tmpl-nf-builder\",\n\t\tel: '#nf-builder',\n\n\t\tregions: {\n\t\t\theader: \"#nf-header\",\n\t\t\tmain: \"#nf-main\",\n\t\t\tmenuDrawer: \"#nf-menu-drawer\",\n\t\t\tdrawer: \"#nf-drawer\",\n\t\t\tmergeTagsContent: '.merge-tags-content'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Respond to requests asking for the builder dom element.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:builderEl', this.getBuilderEl, this );\n\t\t\t// Respond to requests asking for the builder view\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:builderView', this.getBuilderView, this );\n\t\t\t// Layout views aren't self-rendering.\n\t\t\tthis.render();\n\t\t\tvar mergeTags = nfRadio.channel( 'mergeTags' ).request( 'get:collection' );\n\t\t\tvar mergeTagsClone = mergeTags.clone();\n\t\t\tthis.mergeTagsContent.show( new mergeTagsContentView( { collection: mergeTagsClone } ) );\n\t\t\t// Show our header.\n\t\t\tthis.header.show( new headerView() );\n\t\t\t// Show our main content.\n\t\t\tthis.main.show( new mainView() );\n\t\t\t// Show our mobile menu\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tthis.menuDrawer.show( new mobileMenuView( { collection: appDomainCollection } ) );\n\t\t\t// Show our drawer.\n\t\t\tthis.drawer.show( new drawerView() );\n\n\n\t\t},\n\n\t\tonRender: function() {\n\n\t\t},\n\n\t\tgetBuilderEl: function() {\n\t\t\treturn this.el;\n\t\t},\n\n\t\tgetBuilderView: function() {\n\t\t\treturn this;\n\t\t},\n\n\t\t// Listen for clicks\n\t\tevents: {\n\t\t\t'click .nf-open-drawer': 'openDrawer',\n\t\t\t'click .nf-change-domain': 'changeDomain',\n\t\t\t'click .nf-close-drawer': 'closeDrawer'\n\t\t},\n\n\t\t/**\n\t\t * Someone clicked to open a drawer, so fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \te \tevent\n\t\t * @return void\n\t\t */\n\t\topenDrawer: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:openDrawer', e );\n\t\t},\n\t\t/**\n\t\t * Someone clicked to close a drawer, so fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tcloseDrawer: function() {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:closeDrawer' );\n\t\t},\n\t\t/**\n\t\t * Someone clicked to change the domain, so fire a radio event.\n\t\t * This lets us separate the logic from the click event and view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \te \tevent\n\t\t * @return void\n\t\t */\n\t\tchangeDomain: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:menu', e );\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n\n\ndefine( 'controllers/app/remote',[], function() {\n return Marionette.Object.extend( {\n initialize: function() {\n this.listenTo( nfRadio.channel( 'setting' ), 'remote', this.addListener );\n },\n\n addListener: function( model, dataModel ) {\n\n var listenTo = model.get( 'remote' ).listen;\n\n // TODO: Change seems to be triggering twice on each update.\n this.listenTo( nfRadio.channel( 'fieldSetting-' + listenTo ), 'update:setting', this.updateSetting );\n this.listenTo( nfRadio.channel( 'actionSetting-' + listenTo ), 'update:setting', this.updateSetting );\n\n this.listenTo( nfRadio.channel( 'setting-type-' + model.get( 'type' ) ), 'click:extra', this.clickExtra );\n\n model.listenTo( nfRadio.channel( 'setting-remote' ), 'get:remote', this.getRemote, model );\n\n // Auto-trigger get:remote on drawer load.\n nfRadio.channel( 'setting-remote' ).trigger( 'get:remote', dataModel );\n },\n\n clickExtra: function( e, settingModel, dataModel, settingView ) {\n jQuery( e.srcElement ).addClass( 'spin' );\n nfRadio.channel( 'setting-remote' ).trigger( 'get:remote', dataModel );\n },\n\n updateSetting: function( dataModel, settingModel ) {\n nfRadio.channel( 'setting-remote' ).trigger( 'get:remote', dataModel );\n },\n\n getRemote: function( dataModel ) {\n\n var remote = this.get( 'remote' );\n\n var data = {\n parentValue: dataModel.get( remote.listen ),\n action: remote.action,\n security: ( remote.security ) ? remote.security : nfAdmin.ajaxNonce\n };\n\n // TODO: Disable setting and lock drawer while updating.\n var that = this;\n jQuery.post( ajaxurl, data, function( response ){\n var response = JSON.parse( response );\n\n if( 'textbox' == that.get( 'type' ) ) {\n dataModel.set( that.get('name'), response.value );\n }\n\n if( 'select' == that.get( 'type' ) ) {\n that.set( 'options', response.options );\n that.trigger( 'rerender' );\n }\n });\n },\n\n });\n} );\n/**\n * Handles opening and closing our drawer. This is where we display settings for fields, actions, and settings.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/drawer',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our drawer-related click events.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:openDrawer', this.clickOpenDrawer );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:closeDrawer', this.closeDrawer );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:toggleDrawerSize', this.toggleDrawerSize );\n\n\t\t\t// Reply to direct requests to open or close the drawer.\n\t\t\tnfRadio.channel( 'app' ).reply( 'open:drawer', this.openDrawer, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'close:drawer', this.closeDrawer, this );\n\n\t\t\t/*\n\t\t\t * When we close the drawer, we have to figure out what the right position should be.\n\t\t\t * This listens to requests from other parts of our app asking what the closed right position is.\n\t\t\t */\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:closedRightPos', this.getClosedDrawerPos, this );\n\t\t\t\n\t\t\t// Reply to requests to prevent our drawer from closing\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'prevent:close', this.preventClose, this );\n\t\t\t// Reply to requests to enable drawer closing\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'enable:close', this.enableClose, this );\n\t\t\t// Reply to requests for our disabled/enabled state.\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:preventClose', this.maybePreventClose, this );\n\n\t\t\t/*\n\t\t\t * Object that holds our array of 'prevent close' values.\n\t\t\t * We use an array so that registered requests can unregister and not affect each other.\n\t\t\t */\n\t\t\tthis.objPreventClose = {};\n\n\t\t\t/*\n\t\t\t * Listen to focus events on the filter and stop our interval when it happens.\n\t\t\t * This is to fix a bug that can cause the filter to gain focus every few seconds.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'filter:focused', this.filterFocused );\n\t\t},\n\n\t\t/**\n\t\t * Handles closing our drawer\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tcloseDrawer: function() {\n\t\t\t// Get our current domain.\n\t\t\tvar currentDrawer = nfRadio.channel( 'app' ).request( 'get:currentDrawer' );\n if ( ! currentDrawer || this.maybePreventClose() ) {\n return false;\n }\n\n\t\t\t// Triggers the before close drawer action on our current domain's drawer channel.\n\t\t\tnfRadio.channel( 'drawer-' + currentDrawer.get( 'id' ) ).trigger( 'before:closeDrawer' );\n\t\t\t/*\n\t\t\t * The 'before:closeDrawer' message is deprecated as of version 3.0 in favour of 'before:close'.\n\t\t\t * TODO: Remove this radio message in the future.\n\t\t\t */\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'before:closeDrawer' );\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'before:close' );\n\t\t\t// Send a message to our drawer to empty its contents.\n\t\t\tnfRadio.channel( 'drawer' ).request( 'empty:drawerContent' );\n\n\t\t\t// To close our drawer, we have to add our closed class to the builder and remove the opened class.\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).addClass( 'nf-drawer-closed' ).removeClass( 'nf-drawer-opened' );\n\t\t\tjQuery( builderEl ).removeClass( 'disable-main' );\n\n\t\t\t// Get the right position of our closed drawer. Should be container size in -px.\n\t\t\tvar rightClosed = this.getClosedDrawerPos();\n\n\t\t\t// Get our drawer element and give change the 'right' property to our closed position.\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tjQuery( drawerEl ).css( { 'right': rightClosed } );\n\n\t\t\t// In order to access properties in 'this' context in our interval below, we have to set it here.\t\n\t\t\tvar that = this;\n\n\t\t\t/*\n\t\t\t * Since jQuery can't bind to a CSS change, we poll every .15 seconds to see if we've closed the drawer.\n\t\t\t *\n\t\t\t * Once our drawer is closed, we:\n\t\t\t * clear our interval\n\t\t\t * request that the app change it's current drawer to false\n\t\t\t * trigger a drawer closed message\n\t\t\t */\n\t\t\tthis.checkCloseDrawerPos = setInterval( function() {\n\t \tif ( rightClosed == jQuery( drawerEl ).css( 'right' ) ) {\n\t \t\tclearInterval( that.checkCloseDrawerPos );\n\t\t \t\tnfRadio.channel( 'app' ).request( 'update:currentDrawer', false );\n\t\t \t\tnfRadio.channel( 'drawer' ).trigger( 'closed' );\n\t\t \t\t/*\n\t\t \t\t * Reset the add new button z-index to 98.\n\t\t \t\t */\n\t\t \t\tjQuery( '.nf-master-control' ).css( 'z-index', 98 );\n\t\t \t\t// jQuery( drawerEl ).scrollTop( 0 );\n\t \t}\n\t\t\t}, 150 );\n\t\t},\n\n\t\t/**\n\t\t * Click handler for our 'open drawer' event.\n\t\t * @since 3.0\n\t\t * @param e jQuery event\n\t\t * @return void\n\t\t */\n\t\tclickOpenDrawer: function( e ) {\n\t\t\tvar drawerID = jQuery( e.target ).data( 'drawerid' );\n\t\t\tthis.openDrawer( drawerID );\n\t\t},\n\n\t\t/**\n\t\t * Open our drawer.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string drawerID \tID of the drawer we want to open.\n\t\t * @param object data \tOptional data that we want to pass to the drawer.\n\t\t * @return void\n\t\t */\n\t\topenDrawer: function( drawerID, data ) {\n\t\t\tif ( this.maybePreventClose() ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t// If we haven't sent a data object, set the variable to an empty object.\n\t\t\tdata = data || {};\n\n\t\t\t/*\n\t\t\t * If we're dealing with something that has a model, set the proper active state.\n\t\t\t *\n\t\t\t * TODO: Make this more dynamic. I'm not sure that it fits in the drawer controller.\n\t\t\t */\n\t\t\tif ( 'undefined' != typeof data.model ) {\n\t\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\t\t\t\tnfRadio.channel( currentDomainID ).request( 'clear:editActive' );\n\t\t\t\tdata.model.set( 'editActive', true );\n\t\t\t\tthis.dataModel = data.model;\n\t\t\t}\n\n\t\t\t// Send out a message requesting our drawer view to load the content for our drawer ID.\n\t\t\tnfRadio.channel( 'drawer' ).request( 'load:drawerContent', drawerID, data );\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'before:open' );\n\t\t\t\n\t\t\t// To open our drawer, we have to add our opened class to our builder element and remove the closed class.\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).addClass( 'nf-drawer-opened' ).removeClass( 'nf-drawer-closed' );\n\t\t\t\n\t\t\t// To open our drawer, we have to set the right position of our drawer to 0px.\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tjQuery( drawerEl ).css( { 'right': '0px' } );\n\t\t\t\n\t\t\t// In order to access properties in 'this' context in our interval below, we have to set it here.\t\n\t\t\tvar that = this;\n\n\t\t\t/*\n\t\t\t * Since jQuery can't bind to a CSS change, we poll every .15 seconds to see if we've opened the drawer.\n\t\t\t *\n\t\t\t * Once our drawer is opened, we:\n\t\t\t * clear our interval\n\t\t\t * focus our filter\n\t\t\t * request that the app update its current drawer to the one we opened\n\t\t\t * trigger a drawer opened message\n\t\t\t */\n\t\t\tthis.hasFocus = false;\n\n\t\t\t/*\n\t\t\t * Set our add new button z-index to 0;\n\t\t\t */\n\t\t\tjQuery( '.nf-master-control' ).css( 'z-index', 0 );\n\n\t\t\tthis.checkOpenDrawerPos = setInterval( function() {\n\t \tif ( '0px' == jQuery( drawerEl ).css( 'right' ) ) {\n\t \t\tclearInterval( that.checkOpenDrawerPos );\n\t\t\t\t\tif ( ! that.hasFocus ) {\n\t\t \t\tthat.focusFilter();\n\t\t\t\t\t\tthat.hasFocus = true;\n\t\t\t \t\tnfRadio.channel( 'app' ).request( 'update:currentDrawer', drawerID );\n\t\t\t \t\tjQuery( drawerEl ).scrollTop( 0 );\n\t\t\t \t\tnfRadio.channel( 'drawer' ).trigger( 'opened' );\n\t\t\t\t\t} \t\t\n\t \t}\n\t\t\t}, 150 );\n\t\t},\n\n\t\t/**\n\t\t * Toggle the drawer from half to full screen and vise-versa\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\ttoggleDrawerSize: function() {\n\t\t\t// Get our drawer element.\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\t// toggle our drawer size class.\n\t\t\tjQuery( drawerEl ).toggleClass( 'nf-drawer-expand' );\n\t\t},\n\n\t\t/**\n\t\t * Focus our filter\n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n focusFilter: function() {\n \t// Get our filter element\n \tvar filterEl = nfRadio.channel( 'drawer' ).request( 'get:filterEl' );\n \t// Focus\n \tjQuery( filterEl ).focus();\n },\n\n /**\n * Get the CSS right position (in px) of the closed drawer element.\n * This is calculated by:\n * getting the width of the builder element\n * add 300 pixels\n * make it negative\n * \n * @since 3.0\n * @return void\n */\n getClosedDrawerPos: function() {\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tvar closedPos = jQuery( builderEl ).width() + 300;\n\t\t\treturn '-' + closedPos + 'px';\n },\n\n /**\n * Check to see if anything has registered a prevent close key.\n * \n * @since 3.0\n * @return boolean\n */\n maybePreventClose: function() {\n \tif ( 0 == Object.keys( this.objPreventClose ).length ) {\n \t\treturn false;\n \t} else {\n \t\treturn true;\n \t}\n },\n\n /**\n * Register a prevent close key.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent close' setting.\n * @return void\n */\n preventClose: function( key ) {\n \tthis.objPreventClose[ key ] = true;\n \t/*\n \t * When we disable closing the drawer, add the disable class.\n \t */\n \t// Get our current drawer.\n\t\t\tthis.dataModel.set( 'drawerDisabled', true );\n },\n\n /**\n * Remove a previously registered prevent close key.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent close' setting.\n * @return void\n */\n enableClose: function( key ) {\n \tdelete this.objPreventClose[ key ];\n \t /*\n \t * When we remove all of our disables preventing closing the drawer, remove the disable class.\n \t */\n \tif ( ! this.maybePreventClose() && 'undefined' != typeof this.dataModel ) {\n\t \t// Get our current drawer.\n\t\t\t\tthis.dataModel.set( 'drawerDisabled', false ); \t\t\n \t}\n },\n\n /**\n * When we focus our filter, make sure that our open drawer interval is cleared.\n * \n * @since 3.0\n * @return void\n */\n filterFocused: function() {\n \tclearInterval( this.checkOpenDrawerPos );\n },\n\n getPreventClose: function() {\n \treturn this.objPreventClose;\n }\n\t});\n\n\treturn controller;\n} );\n/**\n * Default drawer header.\n *\n * Includes our filter/search and 'Done' button.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerDefault',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-default',\n\n\t\tinitialize: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\t// Listen for our drawer being disabled.\n\t\t\t\tthis.model.on( 'change:drawerDisabled', this.render, this );\t\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When we render, remove the extra div added by backbone and add listeners related to our filter.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\t// Remove extra wrapping div.\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t\t// Respond to requests related to our filter.\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'clear:filter', this.clearFilter, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'blur:filter', this.blurFilter, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:filterEl', this.getEl, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\tthis.model.off( 'change:drawerDisabled', this.render );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'keyup .nf-filter'\t: 'maybeChangeFilter',\n\t\t\t'input .nf-filter'\t: 'changeFilter',\n\t\t\t'focus input'\t\t: 'getFocus'\n\t\t},\n\n\t\t/**\n\t\t * When the filter text is changed, trigger an event on our current drawer.\n\t\t * This lets us keep the logic separate from the click event and view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tchangeFilter: function( e ) {\n\t\t\tvar currentDrawer = nfRadio.channel( 'app' ).request( 'get:currentDrawer' );\n\t\t\tnfRadio.channel( 'drawer-' + currentDrawer.get( 'id' ) ).trigger( 'change:filter', e.target.value, e );\n\t\t},\n\n\t\t/**\n\t\t * The user pressed a key. If it's the enter key, then run the change filter function.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @return void\n\t\t */\n\t\tmaybeChangeFilter: function( e ) {\n\t\t\tif ( 13 == e.keyCode ) {\n\t\t\t\te.addObject = true;\n\t\t\t\tthis.changeFilter( e );\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Clear our filter.\n\t\t *\n\t\t * This triggers 'input' on the field, which will trigger a change if necessary.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tclearFilter: function() {\n\t\t\tvar filterEl = jQuery( this.el ).find( '.nf-filter' );\n\t\t\tif ( '' != jQuery.trim( filterEl.val() ) ) {\n\t\t\t\tfilterEl.val('');\n\t\t\t\tfilterEl.trigger( 'input' );\n\t\t\t\tfilterEl.focus();\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Fire the 'blur' event on our filter. Used to force a change event when the user tabs.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tblurFilter: function() {\n\t\t\tjQuery( this.el ).find( '.nf-filter' ).blur();\n\t\t},\n\n\t\t/**\n\t\t * Return our filter dom element.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return Object\n\t\t */\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).find( '.nf-filter' );\n\t\t},\n\n\t\tgetFocus: function() {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'filter:focused' );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\t// Get our current domain.\n\t\t\t\t\tif ( this.drawerDisabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Default drawer footer\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/footerDefault',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-empty'\n\t});\n\n\treturn view;\n} );\ndefine( 'models/app/drawerModel',['views/app/drawer/headerDefault', 'views/app/drawer/footerDefault'], function( defaultHeaderView, defaultFooterView ) {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tgetHeaderView: function( data ) {\n\t\t\t\treturn new defaultHeaderView( data );\n\t\t\t},\n\n\t\t\tgetFooterView: function( data ) {\n\t\t\t\treturn new defaultFooterView( data );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds all of our drawer models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/drawerCollection',['models/app/drawerModel'], function( drawerModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: drawerModel\n\t} );\n\treturn collection;\n} );\ndefine( 'views/fields/drawer/stagedField',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-staged-field',\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .dashicons-dismiss': 'removeStagedField'\n\t\t},\n\n\t\tremoveStagedField: function( el ) {\n\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'click:removeStagedField', el, this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/fields/drawer/stagingEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-staged-fields-empty',\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/drawer/stagingCollection',['views/fields/drawer/stagedField', 'views/fields/drawer/stagingEmpty'], function( stagedFieldView, stagedFieldsEmptyView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: stagedFieldView,\n\t\temptyView: stagedFieldsEmptyView,\n\n\t\tactiveClass: 'nf-staged-fields-active', // CSS Class for showing the reservoir.\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:stagedFieldsEl', this.getStagedFieldsEl, this );\n\t\t},\n\n\t\tonShow: function() {\n\n\t\t\tthis.$el = jQuery( this.el ).parent();\n\t\t\tjQuery( this.$el ).find( 'span:first' ).unwrap();\n\t\t\tthis.setElement( this.$el );\n\n\t\t\tvar that = this;\n\n\t\t\tjQuery( this.el ).sortable( {\n\t\t\t\tplaceholder: 'nf-staged-fields-sortable-placeholder',\n\t\t\t\thelper: 'clone',\n\t\t\t\ttolerance: 'pointer',\n\t\t\t\tover: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'over:stagedFields', e, ui );\n\t\t\t\t},\n\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'out:stagedFields', ui );\n\t\t\t\t},\n\n\t\t\t\treceive: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'receive:stagedFields', ui );\n\t\t\t\t},\n\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:staging' );\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'start:stagedFields', ui );\n\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'stop:stagedFields', ui );\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tjQuery( this.el ).parent().draggable( {\n\t\t\t\topacity: 0.9,\n\t\t\t\tconnectToSortable: '.nf-field-type-droppable',\n\t\t\t\tappendTo: '#nf-main',\n\t\t\t\trefreshPositions: true,\n\t\t\t\tgrid: [ 3, 3 ],\n\t\t\t\ttolerance: 'pointer',\n\n\t\t\t\thelper: function( e ) {\n\t\t\t\t\tvar width = jQuery( e.target ).parent().width();\n\t\t\t\t\tvar height = jQuery( e.target ).parent().height();\n\t\t\t\t\tvar element = jQuery( e.target ).parent().clone();\n\t\t\t\t\tvar left = width / 4;\n\t\t\t\t\tvar top = height / 2;\n\t\t\t\t\tjQuery( this ).draggable( 'option', 'cursorAt', { top: top, left: left } );\n\t\t\t\t\tjQuery( element ).css( 'z-index', 1000 );\n\t\t\t\t\treturn element;\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'startDrag:fieldStaging', this, ui );\n\t\t\t\t},\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'stopDrag:fieldStaging', this, ui );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tgetStagedFieldsEl: function() {\n\t\t\treturn jQuery( this.el );\n\t\t},\n\n\t\tonAddChild: function() {\n\t\t\tjQuery( this.el ).addClass( this.activeClass );\n\t\t},\n\n\t\tonRemoveChild: function() {\n\t\t\tif( this.hasStagedFields() ) return;\n\t\t\tjQuery( this.el ).removeClass( this.activeClass );\n\t\t},\n\n\t\thasStagedFields: function() {\n\t\t\treturn 0 != this.collection.length;\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n/**\n * Model for our staged field.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/stagingModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection of staged fields.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/stagingCollection',['models/fields/stagingModel'], function( stagingModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: stagingModel,\n\t\tcomparator: 'order'\n\t} );\n\treturn collection;\n} );\ndefine( 'views/fields/drawer/typeSection',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-field-type-section',\n\n\t\tinitialize: function() {\n\t\t\t_.bindAll( this, 'render' );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:typeSection', this.getTypeSection, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\n\t\t\tthis.dragging = false;\n\t\t\tvar that = this;\n\t\t\t/*\n\t\t\t * If we're on a mobile device, we don't want to enable dragging for our field type buttons.\n\t\t\t */\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( this.el ).find( 'div.nf-field-type-draggable' ).draggable( {\n\t\t\t\t\topacity: 0.9,\n\t\t\t\t\ttolerance: 'pointer',\n\t\t\t\t\tconnectToSortable: '.nf-field-type-droppable',\n\t\t\t\t\trefreshPositions: true,\n\t\t\t\t\tgrid: [ 5, 5 ],\n\t\t\t\t\tappendTo: '#nf-builder',\n\n\t\t\t\t\thelper: function( e ) {\n\t\t\t\t\t\tvar width = jQuery( e.target ).parent().width();\n\t\t\t\t\t\tvar height = jQuery( e.target ).parent().height();\n\t\t\t\t\t\tvar element = jQuery( e.target ).parent().clone();\n\t\t\t\t\t\tvar left = width / 4;\n\t\t\t\t\t\tvar top = height / 2;\n\t\t\t\t\t\tjQuery( this ).draggable( 'option', 'cursorAt', { top: top, left: left } );\n\t\t\t\t\t\tjQuery( element ).css( 'z-index', 1000 );\n\t\t\t\t\t\treturn element;\n\t\t\t\t\t},\n\n\t\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = true;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'startDrag:type', this, ui );\n\t\t\t\t\t},\n\n\t\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = false;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'stopDrag:type', this, ui );\n\t\t\t\t\t},\n\n\t\t\t\t\tdrag: function(e, ui) {\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'drag:type', this, ui, e );\t\n\t\t\t\t\t}\n\n\t\t\t\t} ).disableSelection();\n\n\t\t\t\tjQuery( this.el ).find( '.nf-item' ).focus( function() {\n\t\t\t \tjQuery( this ).addClass( 'active' );\n\t\t\t } ).blur( function() {\n\t\t\t \tjQuery( this ).removeClass( 'active' );\n\t\t\t } );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-item': 'clickFieldType',\n\t\t\t'keydown .nf-item': 'maybeClickFieldType',\n\t\t\t'mousedown .nf-item': 'mousedownFieldType'\n\t\t},\n\n\t\tclickFieldType: function( e ) {\n\t\t\tif ( ! this.dragging ) {\n\t\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:fieldType', e );\n\t\t\t}\n\t\t},\n\n\t\tmousedownFieldType: function( e ) {\n\t\t\tjQuery( e.target).addClass( 'clicked' );\n\t\t\tsetTimeout( function() {\n\t\t\t\tjQuery( e.target ).removeClass( 'clicked' );\n\t\t\t}, 1500 );\n\t\t},\n\n\t\tmaybeClickFieldType: function( e ) {\n\t\t\tif ( 13 == e.keyCode ) {\n\t\t\t\tthis.clickFieldType( e );\n\t\t\t\tnfRadio.channel( 'drawer' ).request( 'clear:filter' );\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderFieldTypes: function() {\n\t\t\t var html = document.createElement( 'span' );\n\t\t\t var that = this;\n\t\t\t _.each( this.fieldTypes, function( id ) {\n\t\t\t var type = nfRadio.channel( 'fields' ).request( 'get:type', id );\n\t\t\t var nicename = type.get( 'nicename' );\n\t\t\t var icon = type.get( 'icon' );\n\t\t\t var renderType = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-drawer-field-type-button' );\n\t\t\t var templateHTML = renderType( { id: id, nicename: nicename, icon: icon, type: type, savedField: that.savedField } );\n var htmlFragments = document.createRange().createContextualFragment( templateHTML );\n html.appendChild( htmlFragments );\n\t\t\t } );\n\t\t\t return html.innerHTML;\n\t\t\t\t},\n\n\t\t\t\tsavedField: function() {\n\t\t\t\t\tif( this.type.get( 'savedField' ) ) {\n\t\t\t\t\t\treturn 'nf-saved';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tgetTypeSection: function() {\n\t\t\treturn this.el;\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/fields/drawer/typeSectionCollection',['views/fields/drawer/typeSection'], function( fieldTypeSectionView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: fieldTypeSectionView,\n\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).find( '.nf-settings' ).unwrap();\n\t\t\tnfRadio.channel( 'fields' ).request( 'clear:editActive' );\n\t\t}\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/fields/drawer/addField',['views/fields/drawer/stagingCollection', 'models/fields/stagingCollection', 'views/fields/drawer/typeSectionCollection'], function( drawerStagingView, StagingCollection, fieldTypeSectionCollectionView ) {\n\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer-content-add-field',\n\n\t\tregions: {\n\t\t\tstaging: '#nf-drawer-staging .nf-reservoir',\n\t\t\tprimary: '#nf-drawer-primary',\n\t\t\tsecondary: '#nf-drawer-secondary'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'filter:fieldTypes', this.filterFieldTypes );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'clear:filter', this.removeFieldTypeFilter );\n\n\t\t\tthis.savedCollection = nfRadio.channel( 'fields' ).request( 'get:savedFields' );\n\t\t\tthis.primaryCollection = this.savedCollection;\n\n\t\t\tthis.fieldTypeSectionCollection = nfRadio.channel( 'fields' ).request( 'get:typeSections' );\n\t\t\tthis.secondaryCollection = this.fieldTypeSectionCollection;\n\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tvar stagingCollection = nfRadio.channel( 'fields' ).request( 'get:staging' );\n\t\t\tthis.staging.show( new drawerStagingView( { collection: stagingCollection } ) );\n\n\t\t\tthis.primary.show( new fieldTypeSectionCollectionView( { collection: this.primaryCollection } ) );\n\t\t\tthis.secondary.show( new fieldTypeSectionCollectionView( { collection: this.secondaryCollection } ) );\n\t\t},\n\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tfilterFieldTypes: function( filteredSectionCollection ) {\n\t\t\tthis.primary.reset();\n\t\t\tthis.secondary.reset();\n\t\t\tthis.filteredSectionCollection = filteredSectionCollection;\n\t\t\tthis.primary.show( new fieldTypeSectionCollectionView( { collection: this.filteredSectionCollection } ) );\n\t\t},\n\n\t\tremoveFieldTypeFilter: function () {\n\t\t\tthis.primary.show( new fieldTypeSectionCollectionView( { collection: this.savedCollection } ) );\n\t\t\tthis.secondary.show( new fieldTypeSectionCollectionView( { collection: this.fieldTypeSectionCollection } ) );\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSettingCollection',[], function() {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.childViewOptions = { dataModel: data.dataModel };\n\t\t},\n\n\t\tgetChildView: function( model ) {\n\t\t\treturn nfRadio.channel( 'app' ).request( 'get:settingChildView', model );\n\t\t}\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSettingGroup',['views/app/drawer/itemSettingCollection'], function( itemSettingCollectionView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-field-setting-group',\n\t\t\n\t\tregions: {\n\t\t\tsettings: '.nf-field-settings'\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.model.on( 'change', this.render, this );\n\t\t\tthis.dataModel = data.dataModel;\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change', this.render );\n\t\t},\n\n\t\tonRender: function() {\n\n\t\t\tthis.settings.show( new itemSettingCollectionView( { collection: this.model.get( 'settings' ), dataModel: this.dataModel } ) );\n\n\t\t\tif(!nfAdmin.devMode) {\n\t\t\t\t// Only check if not for calculations.\n\t\t\t\tif(0 == this.$el.find('.calculations').length){\n\t\t\t\t\tvar visibleSettings = false;\n\t\t\t\t\tthis.$el.find('.nf-setting').each(function(index, setting) {\n\t\t\t\t\t\tif( 'none' !== setting.style.display ){\n\t\t\t\t\t\t\tvisibleSettings = true;\n\t\t\t\t\t\t\treturn false; //Exit jQuery each loop.\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tif(!visibleSettings) {\n\t\t\t\t\t\tthis.$el.hide();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( this.model.get( 'display' ) ) {\n\t\t\t\t// ...\n\t\t\t} else {\n\t\t\t\tthis.settings.empty();\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'render:settingGroup', this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .toggle': 'clickToggleGroup'\n\t\t},\n\n\t\tclickToggleGroup: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:toggleSettingGroup', e, this.model );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderLabel: function() {\n\t\t\t\t\tif ( '' != this.label ) {\n\t\t\t\t\t\tvar groupLabel = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-drawer-content-edit-setting-group-label' );\n\t\t\t\t\t\treturn groupLabel( this );\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t\trenderArrowDir: function() {\n\t\t\t\t\tif ( this.display ) {\n\t\t\t\t\t\treturn 'down';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn 'right';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSettingGroupCollection',['views/app/drawer/itemSettingGroup'], function( itemSettingGroupView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\tchildView: itemSettingGroupView,\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.childViewOptions = { dataModel: data.dataModel };\n\t\t}\n\t} );\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/editSettings',['views/app/drawer/itemSettingGroupCollection'], function( itemSettingGroupCollectionView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-settings',\n\n\t\tregions: {\n\t\t\tsettingTitle: '.nf-setting-title',\n\t\t\tsettingGroups: '.nf-setting-groups'\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.dataModel = data.model;\n\t\t\tthis.groupCollection = data.groupCollection;\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar titleView = currentDomain.get( 'getSettingsTitleView' ).call( currentDomain, { model: this.model } );\n\n\t\t\tthis.settingTitle.show( titleView );\n\t\t\tthis.settingGroups.show( new itemSettingGroupCollectionView( { collection: this.groupCollection, dataModel: this.dataModel } ) );\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\tmaybeRenderTitle: function() {\n\t \t\t\tif ( 'undefined' !== typeof this.type ) {\n\t \t\t\t\tvar title = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-drawer-content-edit-settings-title' );\n\t \t\t\t\treturn title( this );\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t},\n\n\t \t\trenderTypeNicename: function() {\n\t \t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tvar domainID = currentDomain.get( 'id' );\n\t \t\t\tvar type = nfRadio.channel( domainID ).request( 'get:type', this.type );\n\t \t\t\treturn type.get( 'nicename' );\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\t});\n\n\treturn view;\n} );\n/**\n * Edit Settings drawer header.\n *\n * Includes our 'Done' button.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerEditSettings',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-edit-settings',\n\n\t\tinitialize: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\t// Listen for our drawer being disabled.\n\t\t\t\tthis.model.on( 'change:drawerDisabled', this.render, this );\t\t\t\t\n\t\t\t}\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tif ( this.model ) {\n\t\t\t\tthis.model.off( 'change:drawerDisabled', this.render );\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderDisabled: function() {\n\t\t\t\t\t// Get our current domain.\n\t\t\t\t\tif ( this.drawerDisabled ) {\n\t\t\t\t\t\treturn 'disabled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Button to add an action to the form.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/drawer/typeButton',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-action-type-button',\n\n\t\tonRender: function() {\n\t\t\t\n\t\t\tjQuery( this.el ).disableSelection();\n\t\t\t\n\t\t\tif ( 'installed' == this.model.get( 'section') ) {\n\t\t\t\tvar that = this;\n\t\t\t\tjQuery( this.el ).draggable( {\n\t\t\t\t\topacity: 0.9,\n\t\t\t\t\ttolerance: 'intersect',\n\t\t\t\t\tscroll: false,\n\t\t\t\t\thelper: 'clone',\n\n\t\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = true;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addAction' ).trigger( 'startDrag:type', this, ui );\n\t\t\t\t\t},\n\n\t\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\t\tthat.dragging = false;\n\t\t\t\t\t\tnfRadio.channel( 'drawer-addAction' ).trigger( 'stopDrag:type', this, ui );\n\t\t\t\t\t}\n\n\t\t\t\t} );\n\t\t\t}\n\t\t\t\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-item': 'clickAddAction'\n\t\t},\n\n\t\tclickAddAction: function( e ) {\n\t\t\tif ( ! this.dragging ) {\n\t\t\t\tif ( 'installed' == this.model.get( 'section' ) ) { // Is this an installed action?\n\t\t\t\t\tnfRadio.channel( 'actions' ).trigger( 'click:addAction', this.model );\n\t\t\t\t} else { // This isn't an installed action\n\t\t\t\t\tvar modalContent = this.model.get( 'modal_content' );\n\n\t\t\t\t\tvar actionModal = new jBox( 'Modal', {\n\t\t\t\t\t content: modalContent,\n\t\t\t\t\t zIndex:99999999,\n\t\t\t\t\t closeButton: 'box',\n\t\t\t\t\t overlay: true,\n\t\t\t\t\t width: 600,\n\t\t\t\t\t repositionOnOpen: true,\n\t\t\t\t\t reposition: true\n\t\t\t\t\t});\n\n\t\t\t\t\tactionModal.open();\n\t\t\t\t\t// window.open( this.model.get( 'link' ), '_blank' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = 'nf-item';\n\t\t\t\t\tif ( '' != jQuery.trim( this.image ) ) {\n\t\t\t\t\t\tclasses += ' nf-has-img';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( 'installed' == this.section ) {\n\t\t\t\t\t\tclasses += ' nf-action-type';\n\t\t\t\t\t}\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderStyle: function() {\n\t\t\t\t\tif ( '' != jQuery.trim( this.image ) ) {\n\n\t\t\t\t\t\t// This is being used in a template, so carefully consider the order of double/single quotes.\n\t\t\t\t\t\treturn \"background-image: url('\" + jQuery.trim( this.image ) + \"')\";\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/actions/drawer/typeCollection',['views/actions/drawer/typeButton'], function( actionTypeButtonView ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer-action-type-section',\n\t\tchildView: actionTypeButtonView,\n\n\t\ttemplateHelpers: function() {\n\t\t\tvar that = this;\n\t\t\treturn {\n\t\t\t\thasContents: function() {\n\t\t\t\t\treturn that.collection.length > 0;\n\t\t\t\t},\n\n\t\t\t\trenderNicename: function() {\n\t\t\t\t\treturn that.collection.nicename;\n\t\t\t\t},\n\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\treturn that.collection.slug;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.action-types' ).append( childView.el );\n\t\t}\n\t} );\n\n\treturn view;\n} );\n/**\n * Model that represents our setting.\n *\n * When the model is created, we trigger the init event in two radio channels.\n *\n * This lets specific types of settings modify the model before anything uses it.\n *\n * Fieldset, for instance, uses this hook to instantiate its settings as a collection.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tsettings: false,\n\t\t\thide_merge_tags: false,\n\t\t\terror: false\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Send out two messages saying that we've initialized a setting model.\n\t\t\tnfRadio.channel( 'app' ).trigger( 'init:settingModel', this );\n\t\t\tnfRadio.channel( this.get( 'type' ) ).trigger( 'init:settingModel', this );\n\t\t\tnfRadio.channel( 'setting-name-' + this.get( 'name' ) ).trigger( 'init:settingModel', this );\n\t\t\tthis.on( 'change:error', this.maybePreventUI, this );\n\n\t\t\t/*\n\t\t\t * If we have an objectType set on our collection, then we're creating a model for the generic settings collection.\n\t\t\t * If we're using merge tags in this setting\n\t\t\t */\n\t\t\tif( 'undefined' == typeof this.collection ) return;\n\n\t\t\tif ( this.get( 'use_merge_tags' ) && 'undefined' != typeof this.collection.options.objectType ) {\n\t\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'update:fieldKey', this.updateKey );\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When a field key is updated, send out a radio message requesting that this setting be checked for the old key.\n\t\t * We want to send the message on the objectType channel.\n\t\t * This means that if this setting is for fields, it will trigger on the fields channel, actions, etc.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Backbone.Model \tkeyModel data model representing the field for which the key just changed\n\t\t * @return void\n\t\t */\n\t\tupdateKey: function( keyModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'fire:updateFieldKey', keyModel, this );\n\t\t},\n\n\t\tmaybePreventUI: function() {\n\t\t\tif ( this.get( 'error' ) ) {\n\t\t\t\tnfRadio.channel( 'drawer' ).request( 'prevent:close', 'setting-' + this.get( 'name' ) + '-error' );\n\t\t\t\tnfRadio.channel( 'app' ).request( 'prevent:changeDomain', 'setting-' + this.get( 'name' ) + '-error' );\t\t\t\t\n\t\t\t} else {\n\t\t\t\tnfRadio.channel( 'drawer' ).request( 'enable:close', 'setting-' + this.get( 'name' ) + '-error' );\n\t\t\t\tnfRadio.channel( 'app' ).request( 'enable:changeDomain', 'setting-' + this.get( 'name' ) + '-error' );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collections of settings for each field type.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingCollection',['models/app/settingModel'], function( settingModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: settingModel,\n\n\t\tinitialize: function( models, options ) {\n\t\t\tthis.options = options || {};\n\t\t}\n\t} );\n\treturn collection;\n} );\n/**\n * Model that represents our type settings groups.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingGroupModel',[ 'models/app/settingCollection' ], function( SettingCollection ) {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tdisplay: false\n\t\t},\n\n\t\tinitialize: function( options ) {\n\t\t\tif ( false == this.get( 'settings' ) instanceof Backbone.Collection ) {\n\t\t\t\tthis.set( 'settings', new SettingCollection( this.get( 'settings' ) ) );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection of our type settings groups.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/settingGroupCollection',['models/app/settingGroupModel'], function( settingGroupModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: settingGroupModel\n\t} );\n\treturn collection;\n} );\n/**\n * Model for our field type\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/typeModel',[ 'models/app/settingGroupCollection' ], function( SettingGroupCollection ) {\n\tvar model = Backbone.Model.extend( {\n\t\tinitialize: function() {\n\t\t\tif ( false === this.get( 'settingGroups' ) instanceof Backbone.Collection ) {\n\t\t\t\tthis.set( 'settingGroups', new SettingGroupCollection( this.get( 'settingGroups' ) ) );\n\t\t\t}\n\t\t\t\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'init:typeModel', this );\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our field type models. \n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/typeCollection',['models/app/typeModel'], function( typeModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: typeModel,\n\t\ttype: false,\n\n\t\tinitialize: function( models, options ) {\n\t\t\t_.each( options, function( option, key ) {\n\t\t\t\tthis[ key ] = option;\n\t\t\t}, this );\n\t\t}\n\t} );\n\treturn collection;\n} );\n/**\n * Add action drawer.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/drawer/addAction',['views/actions/drawer/typeCollection', 'models/app/typeCollection'], function( actionTypeCollectionView, actionTypeCollection ) {\n\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttemplate: '#tmpl-nf-drawer-content-add-action',\n\n\t\tregions: {\n\t\t\tprimary: '#nf-drawer-primary',\n\t\t\t\n\t\t\tpayments: '#nf-drawer-secondary-payments',\n\t\t\tmarketing: '#nf-drawer-secondary-marketing',\n\t\t\tmanagement: '#nf-drawer-secondary-management',\n\t\t\tworkflow: '#nf-drawer-secondary-workflow',\n\t\t\tnotifications: '#nf-drawer-secondary-notifications',\n\t\t\tmisc: '#nf-drawer-secondary-misc',\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'filter:actionTypes', this.filteractionTypes );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'clear:filter', this.removeactionTypeFilter );\n\t\t\n\t\t\tthis.installedActions = nfRadio.channel( 'actions' ).request( 'get:installedActions' );\n\t\t\tthis.primaryCollection = this.installedActions;\n\n\t\t\tthis.availableActions = nfRadio.channel( 'actions' ).request( 'get:availableActions' );\n\t\t\tthis.updateAvailableActionGroups();\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tthis.primary.show( new actionTypeCollectionView( { collection: this.primaryCollection } ) );\n\n\t\t\tthis.payments.show( new actionTypeCollectionView( { collection: this.paymentsCollection } ) );\n\t\t\tthis.marketing.show( new actionTypeCollectionView( { collection: this.marketingCollection } ) );\n\t\t\tthis.management.show( new actionTypeCollectionView( { collection: this.managementCollection } ) );\n\t\t\tthis.workflow.show( new actionTypeCollectionView( { collection: this.workflowCollection } ) );\n\t\t\tthis.notifications.show( new actionTypeCollectionView( { collection: this.notificationsCollection } ) );\n\t\t\tthis.misc.show( new actionTypeCollectionView( { collection: this.miscCollection } ) );\t\t\n\t\t},\n\n\t\tgetEl: function() {\n\t\t\treturn jQuery( this.el ).parent();\n\t\t},\n\n\t\tfilteractionTypes: function( filteredInstalled, filteredAvailable ) {\n\t\t\tthis.primary.reset().show( new actionTypeCollectionView( { collection: filteredInstalled } ) );\n\n\t\t\tthis.availableActions = filteredAvailable;\n\t\t\tthis.updateAvailableActionGroups();\n\t\t\tthis.payments.reset().show( new actionTypeCollectionView( { collection: this.paymentsCollection } ) );\n\t\t\tthis.marketing.reset().show( new actionTypeCollectionView( { collection: this.marketingCollection } ) );\n\t\t\tthis.management.reset().show( new actionTypeCollectionView( { collection: this.managementCollection } ) );\n\t\t\tthis.workflow.reset().show( new actionTypeCollectionView( { collection: this.workflowCollection } ) );\n\t\t\tthis.notifications.reset().show( new actionTypeCollectionView( { collection: this.notificationsCollection } ) );\n\t\t\tthis.misc.reset().show( new actionTypeCollectionView( { collection: this.miscCollection } ) );\t\n\t\t\t\n\t\t},\n\n\t\tremoveactionTypeFilter: function () {\n\t\t\tthis.primary.show( new actionTypeCollectionView( { collection: this.primaryCollection } ) );\n\n\t\t\tthis.availableActions = nfRadio.channel( 'actions' ).request( 'get:availableActions' );\n\t\t\tthis.updateAvailableActionGroups();\n\t\t\tthis.payments.show( new actionTypeCollectionView( { collection: this.paymentsCollection } ) );\n\t\t\tthis.marketing.show( new actionTypeCollectionView( { collection: this.marketingCollection } ) );\n\t\t\tthis.management.show( new actionTypeCollectionView( { collection: this.managementCollection } ) );\n\t\t\tthis.workflow.show( new actionTypeCollectionView( { collection: this.workflowCollection } ) );\n\t\t\tthis.notifications.show( new actionTypeCollectionView( { collection: this.notificationsCollection } ) );\n\t\t\tthis.misc.show( new actionTypeCollectionView( { collection: this.miscCollection } ) );\n\t\t},\n\n\t\tupdateAvailableActionGroups: function() {\n\t\t\tthis.paymentsCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'payments'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'payments',\n\t\t\t\t\tnicename: nfi18n.paymentsActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.marketingCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'marketing'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'marketing',\n\t\t\t\t\tnicename: nfi18n.marketingActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.managementCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'management'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'management',\n\t\t\t\t\tnicename: nfi18n.managementActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.workflowCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'workflow'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'workflow',\n\t\t\t\t\tnicename: nfi18n.workflowActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.notificationsCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'notifications'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'notifications',\n\t\t\t\t\tnicename: nfi18n.notificationsActionNicename\n\t\t\t\t} \n\t\t\t);\n\n\t\t\tthis.miscCollection = new actionTypeCollection(\n\t\t\t\tthis.availableActions.where({group: 'misc'}),\n\t\t\t\t{\n\t\t\t\t\tslug: 'misc',\n\t\t\t\t\tnicename: nfi18n.miscActionNicename\n\t\t\t\t} \n\t\t\t);\n\t\t}\n\n\t} );\n\n\treturn view;\n} );\n/**\n * Individual change item.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentViewChangesItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-view-changes-item',\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:disabled', this.render, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:disabled', this.render );\n\t\t},\n\n\t\t/**\n\t\t * When we render this element, remove the extra wrapping <div> that backbone creates.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .undoSingle': 'undoSingle'\n\t\t},\n\n\t\tundoSingle: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:undoSingle', this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Changes collection view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentViewChanges',['views/app/drawer/contentViewChangesItem'], function( viewChangesItem ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'table',\n className: 'nf-changes',\n\t\tchildView: viewChangesItem\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles clicks on the 'view changes' button in the header.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerViewChanges',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-view-changes',\n\n\t\tevents: {\n\t\t\t'click .undoChanges': 'clickUndoChanges'\n\t\t},\n\n\t\tclickUndoChanges: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:undoChanges' );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Error view used for settings.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/settingError',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-edit-setting-error'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/itemSetting',['views/app/drawer/mergeTagsContent', 'views/app/drawer/settingError'], function( mergeTagsContentView, settingErrorView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-edit-setting-wrap',\n\n\t\tregions: {\n\t\t\terror: '.nf-setting-error'\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.dataModel = data.dataModel;\n\t\t\t/*\n\t\t\t * Send out a request on the setting-type-{type} channel asking if we should render on dataModel change.\n\t\t\t * Defaults to false.\n\t\t\t * This lets specific settings, like RTEs, say that they don't want to be re-rendered when their data model changes.\n\t\t\t */\n\t\t\tvar renderOnChange = ( 'undefined' == typeof nfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).request( 'renderOnChange' ) ) ? false : nfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).request( 'renderOnChange' );\n\t\t\t\n\t\t\tif ( renderOnChange ) {\n\t\t\t\tthis.dataModel.on( 'change:' + this.model.get( 'name' ), this.render, this );\n\t\t\t}\n\n\t\t\tthis.model.on( 'change:error', this.renderError, this );\n\t\t\tthis.model.on( 'change:warning', this.renderWarning, this );\n\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\t// If we don't have a 'settings' property, this is a legacy depdency setup.\n\t\t\t\tif ( 'undefined' == typeof deps.settings ) {\n\t\t\t\t\tdeps.settings = [];\n\t\t\t\t\t_.each(deps, function(dep, name){\n\t\t\t\t\t\tif( 'settings' !== name ) {\n\t\t\t\t\t\t\tdeps.settings.push( { name: name, value: dep } );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tdeps.match = 'all';\n\t\t\t\t}\n\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.on( 'change:' + name, this.render, this );\n\t\t\t\t}\n\t\t\t}\n\n /**\n\t\t\t * For settings that require a remote refresh\n\t\t\t * add an \"update\"/refresh icon to the label.\n */\n var remote = this.model.get( 'remote' );\n\t\t\tif( remote ) {\n if( 'undefined' != typeof remote.refresh || remote.refresh ) {\n\t\t\t\t\tvar labelText, updateIcon, updateLink, labelWrapper;\n\n labelText = document.createTextNode( this.model.get('label') );\n\n updateIcon = document.createElement( 'span' );\n updateIcon.classList.add( 'dashicons', 'dashicons-update' );\n\n updateLink = document.createElement( 'a' );\n updateLink.classList.add( 'extra' );\n updateLink.appendChild( updateIcon );\n\n // Wrap the label text and icon/link in a parent element.\n labelWrapper = document.createElement( 'span' );\n labelWrapper.appendChild( labelText );\n labelWrapper.appendChild( updateLink );\n\n // The model expects a string value.\n this.model.set('label', labelWrapper.innerHTML );\n }\n\n\t\t\t\tnfRadio.channel( 'setting' ).trigger( 'remote', this.model, this.dataModel, this );\n\t\t\t\tthis.model.on( 'rerender', this.render, this );\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * When our drawer opens, send out a radio message on our setting type channel.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.drawerOpened );\n\n\t\t\t/*\n\t\t\t * When our drawer closes, send out a radio message on our setting type channel.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.drawerClosed );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.dataModel.off( 'change:' + this.model.get( 'name' ), this.render );\n\t\t\tthis.model.off( 'change:error', this.renderError );\n\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.off( 'change:' + name, this.render );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif( this.model.get( 'remote' ) ) {\n\t\t\t\tthis.model.off( 'rerender', this.render, this );\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'destroy:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'destroy:setting', this.model, this.dataModel, this );\n\t\t\n\t\t\t/*\n\t\t\t * Unescape any HTML being saved if we are a textbox.\n\t\t\t */\n\t\t\tif ( 'textbox' == this.model.get( 'type' ) ) {\n\t\t\t\tvar setting = this.model.get( 'name' );\n\t\t\t\tvar value = this.dataModel.get( setting );\n\t\t\t\tthis.dataModel.set( setting, _.unescape( value ), { silent: true } );\n\t\t\t}\n\n\t\t},\n\n\t\tonBeforeRender: function() {\n\t\t\t/*\n\t\t\t * We want to escape any HTML being output if we are a textbox.\n\t\t\t */\n\t\t\tif ( 'textbox' == this.model.get( 'type' ) ) {\n\t\t\t\tvar setting = this.model.get( 'name' );\n\t\t\t\tvar value = this.dataModel.get( setting );\n\t\t\t\tthis.dataModel.set( setting, _.escape( value ), { silent: true } );\n\t\t\t}\n\t\t\t\n\t\t\tnfRadio.channel( 'app' ).trigger( 'before:renderSetting', this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.mergeTagsContentView = false;\n\t\t\tvar that = this;\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\n\t\t\tjQuery( this.el ).find( '.nf-help' ).each(function() {\n\t\t\t\tvar content = jQuery(this).next('.nf-help-text');\n\t\t\t\tjQuery( this ).jBox( 'Tooltip', {\n\t\t\t\t\tcontent: content,\n\t\t\t\t\tmaxWidth: 200,\n\t\t\t\t\ttheme: 'TooltipBorder',\n\t\t\t\t\ttrigger: 'click',\n\t\t\t\t\tcloseOnClick: true\n\t\t\t\t})\n\t\t });\n\t\t\t\n\t\t if ( this.model.get( 'use_merge_tags' ) ) {\n\t\t \tnfRadio.channel( 'mergeTags' ).request( 'init', this );\n\t\t }\n\n\t\t\t/*\n\t\t\t * Apply Setting Field Masks\n\t\t\t */\n\t\t\tvar mask = this.model.get( 'mask' );\n\n\t\t\tif( typeof mask != \"undefined\" ){\n\n\t\t\t\tvar input = jQuery( this.$el ).find( 'input' );\n\t\t\t\tjQuery( input ).attr( 'contentEditable', true );\n\t\t\t\tswitch( mask.type ){\n\t\t\t\t\tcase 'numeric':\n\t\t\t\t\t\tinput.autoNumeric({\n\t\t\t\t\t\t\taSep: thousandsSeparator,\n\t\t\t\t\t\t\taDec: decimalPoint\n\t\t\t\t\t\t});\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'currency':\n\n\t\t\t\t\t\tvar currency = nfRadio.channel( 'settings' ).request( 'get:setting', 'currency' );\n\t\t\t\t\t\tvar currencySymbol = nfAdmin.currencySymbols[ currency ] || '';\n\n\t\t\t\t\t\tinput.autoNumeric({\n\t\t\t\t\t\t\taSign: jQuery('<div />').html(currencySymbol).text(),\n\t\t\t\t\t\t\taSep: thousandsSeparator,\n\t\t\t\t\t\t\taDec: decimalPoint\n\t\t\t\t\t\t});\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'custom':\n\t\t\t\t\t\tif( mask.format ) input.mask( mask.format );\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tdefault:\n\t\t\t\t\t\t// TODO: Error Logging.\n\t\t\t\t\t\tconsole.log( 'Notice: Mask type of \"' + mask.type + '\" is not supported.' );\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t\tthis.renderError();\n\t\t},\n\n\t\tonShow: function() {\t\t\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'show:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'show:setting', this.model, this.dataModel, this );\n\t\t},\n\n\t\tonAttach: function() {\t\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t},\n\n\t\trenderError: function() {\n\t\t\tif ( this.model.get( 'error' ) ) {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting' ).addClass( 'nf-error' );\n\t\t\t\tthis.error.show( new settingErrorView( { model: this.model } ) );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting' ).removeClass( 'nf-error' );\n\t\t\t\tthis.error.empty();\n\t\t\t}\n\t\t},\n\n renderWarning: function() {\n if ( this.model.get( 'warning' ) ) {\n jQuery( this.el ).find( '.nf-setting' ).addClass( 'nf-warning' );\n this.error.show( new settingErrorView( { model: this.model } ) );\n } else {\n jQuery( this.el ).find( '.nf-setting' ).removeClass( 'nf-warning' );\n this.error.empty();\n }\n },\n\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\n\t \t\trenderVisible: function() {\n\n\t\t\t\t\tif(!nfAdmin.devMode){\n\t\t\t\t\t\tif('Action' == that.dataModel.get('objectType') && 'email' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('cc' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('bcc' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('from_name' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('from_address' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('email_format' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\tif('Action' == that.dataModel.get('objectType') && 'save' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('submitter_email' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('label_pos' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit_type' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit_msg' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('help_text' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('disable_input' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('disable_browser_autocomplete' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('mask' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('custom_mask' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('custom_name_attribute' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('personally_identifiable' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\n\t\t\t\t\t\t// \"administration\" settings\n\t\t\t\t\t\tif('key' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('admin_label' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('num_sort' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('user_state' == this.name) return 'style=\"display:none;\"';\n\n\t\t\t\t\t\t\n\t\t\t\t\t\tif('checkbox' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('checked_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('unchecked_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('checked_calc_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('unchecked_calc_value' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('starrating' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('default' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('listmultiselect' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('box_size' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('date' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('year_range_start' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t\tif('year_range_end' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'check:deps', this, that );\n\t \t\t},\n\n\t \t\trenderSetting: function(){\n\t \t\t\tif ( 'undefined' != typeof that.dataModel.get( this.name ) ) {\n\t \t\t\t\tthis.value = that.dataModel.get( this.name );\n\t \t\t\t} else if ( 'undefined' == typeof this.value ) {\n\t \t\t\t\tthis.value = '';\n\t \t\t\t}\n\t \t\t\tvar setting = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-' + this.type );\n\t\t\t\t\treturn setting( this );\n\t\t\t\t},\n\n\t\t\t\trenderLabelClasses: function() {\n\t\t\t\t\tvar classes = '';\n\t\t\t\t\tif ( this.use_merge_tags ) {\n\t\t\t\t\t\tclasses += ' has-merge-tags';\n\t\t\t\t\t}\n\t\t\t\t\tif ( 'rte' == this.type ) {\n\t\t\t\t\t\tclasses += ' rte';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = 'nf-setting ';\n\t\t\t\t\tif ( 'undefined' != typeof this.width ) {\n\t\t\t\t\t\tclasses += 'nf-' + this.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclasses += ' nf-one-half';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\tclasses += ' nf-error';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderTooltip: function() {\n\t\t\t\t\tif ( ! this.help ) return '';\n\t\t\t\t\tvar helpText, helpTextContainer, helpIcon, helpIconLink, helpTextWrapper;\n\n\t\t\t\t\thelpText = document.createElement( 'div' );\n\t\t\t\t\thelpText.innerHTML = this.help;\n\t\t\t\t\t\n\t\t\t\t\thelpTextContainer = document.createElement( 'div' );\n\t\t\t\t\thelpTextContainer.classList.add( 'nf-help-text' );\n\t\t\t\t\thelpTextContainer.appendChild( helpText );\n\n\t\t\t\t\thelpIcon = document.createElement( 'span' );\n\t\t\t\t\thelpIcon.classList.add( 'dashicons', 'dashicons-admin-comments' );\n helpIconLink = document.createElement( 'a' );\n helpIconLink.classList.add( 'nf-help' );\n helpIconLink.setAttribute( 'href', '#' );\n helpIconLink.setAttribute( 'tabindex', '-1' );\n helpIconLink.appendChild( helpIcon );\n\n helpTextWrapper = document.createElement( 'span' );\n helpTextWrapper.appendChild( helpIconLink );\n helpTextWrapper.appendChild( helpTextContainer );\n\n // The template expects a string value.\n\t\t\t\t\treturn helpTextWrapper.innerHTML;\n\t\t\t\t},\n\n\t\t\t /*\n\t\t\t * Render a select element with only the email fields on the\n\t\t\t * form\n\t\t\t */\n\t\t\t renderEmailFieldOptions: function() {\n\t\t\t\t var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n\t\t\t\t initialOption = document.createElement( 'option' );\n\t\t\t\t initialOption.value = '';\n\t\t\t\t initialOption.label = '--';\n\t\t\t\t initialOption.innerHTML = '--';\n\n\t\t\t\t var select_value = '';\n\t\t\t\t var select = document.createElement( 'select' );\n\t\t\t\t select.classList.add( 'setting' );\n\t\t\t\t select.setAttribute( 'data-id', 'my_seledt' );\n\t\t\t\t select.appendChild( initialOption );\n\n\t\t\t\t var index = 0;\n\t\t\t\t var that = this;\n\t\t\t\t fields.each( function( field ) {\n\t\t\t\t\t // Check for the field type in our lookup array and...\n\t\t\t\t\t if( 'email' != field.get( 'type' ) ) {\n\t\t\t\t\t\t // Return if the type is in our lookup array.\n\t\t\t\t\t\t return '';\n\t\t\t\t\t }\n\n\t\t\t\t\t var option = document.createElement( 'option' );\n\n\t\t\t\t\t option.value = field.get( 'key' );\n\t\t\t\t\t option.innerHTML = field.get( 'label' );\n\t\t\t\t\t option.label = field.get( 'label' );\n\t\t\t\t\t \n\t\t\t\t\t if( that.value === field.get( 'key' ) ) {\n\t\t\t\t\t\t option.setAttribute( 'selected', 'selected' );\n\t\t\t\t\t }\n\t\t\t\t\t select.appendChild( option );\n\t\t\t\t\t index = index + 1;\n\t\t\t\t });\n\n\t\t\t\t label = document.createElement( 'label' );\n\t\t\t\t label.classList.add( 'nf-select' );\n\n\t\t\t\t label.appendChild( select );\n\n\t\t\t\t // Select Lists need an empty '<div></div>' for styling purposes.\n\t\t\t\t emptyContainer = document.createElement( 'div' );\n\t\t\t\t label.appendChild( emptyContainer );\n\n\t\t\t\t // The template requires a string.\n\t\t\t\t return label.innerHTML;\n\t\t\t },\n\n\t\t\t\trenderMergeTags: function() {\n\t\t\t\t\tif ( this.use_merge_tags && ! this.hide_merge_tags ) {\n\t\t\t\t\t\treturn '<span class=\"dashicons dashicons-list-view merge-tags\"></span>';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\t /**\n\t\t\t * Renders min and/or max attributes for the number input\n\t\t\t *\n\t\t\t * @returns {string}\n\t\t\t */\n\t\t\t renderMinMax: function() {\n\t\t\t\t\tvar minMaxStr = '';\n\t\t\t\t\t// if we have a min value set, then output it\n\t\t\t\t\tif( 'undefined' != typeof this.min_val && null != this.min_val && jQuery.isNumeric( this.min_val ) ) {\n\t\t\t\t\t\tminMaxStr = minMaxStr + \"min='\" + this.min_val + \"'\";\n\t\t\t\t\t}\n\n\t\t\t\t\t// if we have a max value set, then output it\n\t\t\t\t if( 'undefined' != typeof this.max_val && '' != this.max_val && jQuery.isNumeric( this.max_val ) ) {\n\t\t\t\t\t minMaxStr = minMaxStr + \" max='\" + this.max_val + \"'\";\n\t\t\t\t }\n\n\t\t\t\t // if we have a step size set, then output it\n\t\t\t\t if( 'undefined' != typeof this.step && '' != this.step && jQuery.isNumeric( this.step ) ) {\n\t\t\t\t\t minMaxStr = minMaxStr + \" step='\" + this.step + \"'\";\n\t\t\t\t }\n\n\t\t\t\t return minMaxStr;\n\t\t\t },\n\n\t\t\t /**\n\t\t\t * Returns a string to let the user know the min and/or max\n\t\t\t * value for the field\n\t\t\t *\n\t\t\t * @returns {string}\n\t\t\t */\n\t\t\t renderMinMaxHelper: function() {\n\t\t\t\t var minMaxHelperStr = '';\n\t\t\t\t // if we have a min value output it to the helper text\n\t\t\t\t if( 'undefined' != typeof this.min_val && null != this.min_val && jQuery.isNumeric( this.min_val ) ) {\n\t\t\t\t \t// empty string? then add '('\n\t\t\t\t \tif( 0 == minMaxHelperStr.length ) {\n\t\t\t\t \t\tminMaxHelperStr = \"(\";\n\t\t\t\t\t }\n\t\t\t\t\t minMaxHelperStr = minMaxHelperStr + nfi18n.minVal + \": \" + this.min_val;\n\t\t\t\t }\n\n\t\t\t\t // if we have a max value output it to the helper text\n\t\t\t\t if( 'undefined' != typeof this.max_val && '' != this.max_val && jQuery.isNumeric( this.max_val ) ) {\n\t\t\t\t\t // empty string? then add '('\n\t\t\t\t\t if( 0 == minMaxHelperStr.length ) {\n\t\t\t\t\t\t minMaxHelperStr = \"(\";\n\t\t\t\t\t } else {\n\t\t\t\t\t \t// else, we know we have a min so add a comma\n\t\t\t\t\t \tminMaxHelperStr = minMaxHelperStr + \", \";\n\t\t\t\t\t }\n\t\t\t\t\t minMaxHelperStr = minMaxHelperStr + nfi18n.maxVal + \": \" + this.max_val;\n\t\t\t\t }\n\n\t\t\t\t // if not an empty string, then add ')'\n\t\t\t\t if( 0 < minMaxHelperStr.length ) {\n\t\t\t\t\t minMaxHelperStr = minMaxHelperStr + \")\";\n\t\t\t\t }\n\n\t\t\t\t return minMaxHelperStr;\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'change .setting': 'changeSetting',\n\t\t\t'keyup .setting': 'keyUpSetting',\n\t\t\t'click .setting': 'clickSetting',\n\t\t\t'click .extra': 'clickExtra'\n\t\t},\n\n\t\tchangeSetting: function( e ) {\n\t\t\t//Check characters set in custom classes match sanitize_html_class\n\t\t\tif ( 'textbox' == this.model.get( 'type' ) && this.model.get('name').endsWith(\"_class\" )) {\n\t\t\t\tconst regexp = /^[a-zA-Z 0-9-_]+$/;\n\t\t\t\tif(e.target.value.search(regexp) === -1 && ''!== e.target.value){\n\t\t\t\t\tthis.model.set('error', \"HTML classes only allow - _ and alphanumeric characters.\" )\n\t\t\t\t} else if(e.target.value.search(regexp) === 0 || ''=== e.target.value){\n\t\t\t\t\tthis.model.unset('error');\n\t\t\t\t}\n\t\t\t}\n\t\t\tnfRadio.channel( 'app' ).trigger( 'change:setting', e, this.model, this.dataModel );\n\t\t},\n\n\t\tkeyUpSetting: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'keyup:setting', e, this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'keyup:setting', e, this.model, this.dataModel );\n\t\t},\n\n\t\tclickSetting: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:setting', e, this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'click:setting', e, this.model, this.dataModel, this );\n\t\t},\n\n\t\tclickExtra: function( e ) {\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'click:extra', e, this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'name' ) ).trigger( 'click:extra', e, this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-name-' + this.model.get( 'name' ) ).trigger( 'click:extra', e, this.model, this.dataModel, this );\n\t\t},\n\n\t\tdrawerOpened: function() {\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'drawer:opened', this.model, this.dataModel, this );\n\t\t},\n\n\t\tdrawerClosed: function() {\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'drawer:closed', this.model, this.dataModel, this );\n\t\t}\n\t});\n\n\treturn view;\n} );\n\n/**\n * Changes collection view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentPublicLink',['views/app/drawer/itemSetting'], function( itemSettingView) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttagName: 'div',\n template: '#tmpl-nf-drawer-content-public-link',\n \n\t\tregions: {\n embedForm: '.embed-form',\n\t\t\tenablePublicLink: '.enable-public-link',\n copyPublicLink: '.copy-public-link',\n },\n\n\t\tonRender: function() {\n var formModel = Backbone.Radio.channel('app').request('get:formModel');\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n\n var allowPublicLinkSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'allow_public_link' );\n this.enablePublicLink.show( new itemSettingView( { model: allowPublicLinkSettingModel, dataModel: formSettingsDataModel } ) );\n \n var embedForm = \"[ninja_form id='{FORM_ID}']\".replace('{FORM_ID}', formModel.get('id'));\n formSettingsDataModel.set('embed_form', embedForm);\n\n var embedFormSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'embed_form' );\n this.embedForm.show( new itemSettingView( { model: embedFormSettingModel, dataModel: formSettingsDataModel } ) );\n\n var public_link_key = formSettingsDataModel.get('public_link_key');\n \n /**\n * Generate a public link key which is follows the format:\n * Form Id + 4 consecutive base 36 numbers\n */\n if (!public_link_key) {\n public_link_key = nfRadio.channel('app').request('generate:publicLinkKey');\n }\n\n // apply public link url to settings (ending with key)\n var publicLink = nfAdmin.publicLinkStructure.replace('[FORM_ID]', public_link_key);\n formSettingsDataModel.set('public_link', publicLink);\n \n // Display public link\n var publicLinkSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'public_link' );\n this.copyPublicLink.show(new itemSettingView( { model: publicLinkSettingModel, dataModel: formSettingsDataModel } ));\n },\n\n\t\tevents: {\n\t\t\t'click #embed_form + .js-click-copytext': 'copyFormEmbedHandler',\n\t\t\t'click #public_link + div > .js-click-copytext': 'copyPublicLinkHandler',\n\t\t\t'click #public_link + div > .js-click-resettext': 'confirmResetPublicLinkHandler',\n\t\t\t'click #public_link + div > .js-click-confirm': 'resetPublicLinkHandler',\n\t\t\t'click #public_link + div > .js-click-cancel': 'cancelResetPublicLinkHandler'\n\t\t},\n\n\t\tcopyFormEmbedHandler: function( e ) {\n\n document.getElementById('embed_form').select();\n document.execCommand('copy');\n\n e.target.innerHTML = 'Copied!';\n setTimeout(function(){ e.target.innerHTML = 'Copy'; }, 1500);\n\t\t},\n\n\t\tcopyPublicLinkHandler: function( e ) {\n\n document.getElementById('public_link').select();\n document.execCommand('copy');\n\n e.target.innerHTML = 'Copied!';\n setTimeout(function(){ e.target.innerHTML = 'Copy'; }, 1500);\n },\n \n confirmResetPublicLinkHandler: function( e ) {\n _.each( e.target.parentNode.children, function( node ) {\n if ( node.classList.contains( 'js-click-copytext' ) || node.classList.contains( 'js-click-resettext' ) ) {\n node.style.display = 'none';\n } else {\n node.style.display = 'inline-block';\n }\n } );\n },\n\n resetPublicLinkHandler: function ( e ) {\n // Generate a new link.\n var public_link_key = nfRadio.channel('app').request('generate:publicLinkKey');\n var publicLink = nfAdmin.publicLinkStructure.replace('[FORM_ID]', public_link_key);\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n formSettingsDataModel.set('public_link', publicLink);\n // Reset the buttons.\n this.cancelResetPublicLinkHandler( e );\n _.each( e.target.parentNode.children, function( node ) {\n if ( node.classList.contains( 'js-click-resettext' ) ) {\n node.style.display = 'inline-block';\n node.classList.add('primary');\n node.classList.remove('secondary');\n node.innerHTML = 'Link Reset!';\n setTimeout(function(){\n node.classList.add('secondary');\n node.classList.remove('primary');\n node.innerHTML = 'Reset';\n }, 1500);\n } else {\n node.style.display = 'none';\n }\n if ( node.classList.contains( 'js-click-copytext' ) ) {\n setTimeout(function(){\n node.style.display = 'inline-block';\n }, 1500);\n }\n } );\n // Update the visible public link.\n jQuery('#public_link').val( publicLink );\n },\n\n cancelResetPublicLinkHandler: function ( e ) {\n _.each( e.target.parentNode.children, function( node ) {\n if ( node.classList.contains( 'js-click-cancel' ) || node.classList.contains( 'js-click-confirm' ) ) {\n node.style.display = 'none';\n } else {\n node.style.display = 'inline-block';\n }\n } );\n }\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles clicks on the 'view changes' button in the header.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerPublicLink',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-public-link'\n\t});\n\n\treturn view;\n} );\n/**\n * Changes collection view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/contentNewForm',['views/app/drawer/itemSetting'], function( itemSettingView) {\n\tvar view = Marionette.LayoutView.extend( {\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-new-form',\n\n\t\tregions: {\n\t\t\tformName: '.new-form-name',\n\t\t\tformSubmit: '.new-form-submit'\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar titleSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'title' );\n\t\t\tvar addSubmitSettingModel = nfRadio.channel( 'settings' ).request( 'get:settingModel', 'add_submit' );\n\t\t\tvar dataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n\t\t\tthis.formName.show( new itemSettingView( { model: titleSettingModel, dataModel: dataModel } ) );\n\t\t\t/*\n\t\t\t * If we don't have any submit buttons on the form, prompt the user to add one on publish.\n\t\t\t */\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\tvar submitButtons = fieldCollection.findWhere( { type: 'submit' } );\n\t\t\tif ( 'undefined' == typeof submitButtons ) {\n\t\t\t\tthis.formSubmit.show( new itemSettingView( { model: addSubmitSettingModel, dataModel: dataModel } ) );\n\t\t\t} else {\n\t\t\t\tdataModel.set( 'add_submit', 0 );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .publish': 'clickPublish'\n\t\t},\n\n\t\tclickPublish: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:confirmPublish', e );\n\t\t}\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles clicks on the 'view changes' button in the header.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/headerNewForm',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-header-new-form'\n\t});\n\n\treturn view;\n} );\n/**\n * Config file for our app drawers.\n *\n * this.collection represents all of our registered drawers.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/drawerConfig',[\n\t'models/app/drawerCollection',\n\t'views/fields/drawer/addField',\n\t'views/app/drawer/editSettings',\n\t'views/app/drawer/headerEditSettings',\n\t'views/actions/drawer/addAction',\n\t'views/app/drawer/contentViewChanges',\n\t'views/app/drawer/headerViewChanges',\n\t'views/app/drawer/contentPublicLink',\n\t'views/app/drawer/headerPublicLink',\n\t'views/app/drawer/contentNewForm',\n\t'views/app/drawer/headerNewForm'\n\t], function(\n\t\tdrawerCollection,\n\t\taddFieldView,\n\t\teditSettingsView,\n\t\teditSettingsHeaderView,\n\t\taddActionView,\n\t\tviewChangesView,\n\t\tviewChangesHeaderView,\n\t\tpublicLinkView,\n\t\tpublicLinkHeaderView,\t\t\n\t\tnewFormView,\n\t\tnewFormHeaderView,\n\t\tmobileItemControlsView\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\n\t\t\tthis.collection = new drawerCollection( [\n\t\t\t\t{\n\t\t\t\t\tid: 'addField',\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new addFieldView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'addAction',\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new addActionView( data );\n\t\t\t\t\t}\n\t\t\t\t},\t\t\t\t\n\t\t\t\t{\n\t\t\t\t\tid: 'editSettings',\n\n\t\t\t\t\t/*\n\t\t\t\t\t * TODO: Add filtering when editing settings. For now, removing them from settings.\n\t\t\t\t\t */\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Get a custom setting header view if one is set.\n\t\t\t\t\t\t * TODO: Currently, this only works for advanced settings.\n\t\t\t\t\t\t * This could be used to replace the need for a single config file.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tif ( 'undefined' != typeof data.typeModel ) {\n\t\t\t\t\t\t\tvar view = nfRadio.channel( data.typeModel.get( 'id' ) ).request( 'get:drawerHeaderView' ) || editSettingsHeaderView;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tvar view = editSettingsHeaderView;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn new view( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new editSettingsView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'viewChanges',\n\n\t\t\t\t\t// getHeaderView() is defined by default, but we need to override it for the viewChanges drawer.\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\treturn new viewChangesHeaderView( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new viewChangesView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'publicLink',\n\n\t\t\t\t\t// getHeaderView() is defined by default, but we need to override it for the publicLink drawer.\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\treturn new publicLinkHeaderView( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new publicLinkView( data );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'newForm',\n\n\t\t\t\t\t// getHeaderView() is defined by default, but we need to override it for the newForm drawer.\n\t\t\t\t\tgetHeaderView: function( data ) {\n\t\t\t\t\t\treturn new newFormHeaderView( data );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetContentView: function( data ) {\n\t\t\t\t\t\treturn new newFormView( data );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t] );\n\n\t\t\t// Listen for requests for our drawer collection.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:drawerCollection', this.getDrawerCollection, this );\n\t\t\t// Listen for requests for specific drawer models.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:drawer', this.getDrawer, this );\n\t\t},\n\n\t\tgetDrawerCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tgetDrawer: function( id ) {\n\t\t\treturn this.collection.get( id );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Default settings title view.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/defaultSettingsTitle',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-settings-title-default',\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderTypeNicename: function() {\n\t \t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tvar domainID = currentDomain.get( 'id' );\n\t \t\t\tvar type = nfRadio.channel( domainID ).request( 'get:type', this.type );\n\t \t\t\tif ( 'undefined' != typeof type ) {\n\t \t\t\t\treturn type.get( 'nicename' );\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\t});\n\n\treturn view;\n} );\n/**\n * Empty view.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/empty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-empty'\n\t});\n\n\treturn view;\n} );\n/**\n * Model for our individual domains.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/domainModel',[ 'views/app/drawer/defaultSettingsTitle', 'views/app/empty' ], function( DefaultSettingsTitleView, EmptyView ) {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tdashicons: '',\n\t\t\tclasses: '',\n\t\t\tactive: false,\n\t\t\turl: '',\n\t\t\thotkeys: false,\n\t\t\tdisabled: false,\n\n\t\t\tgetSettingsTitleView: function( data ) {\n\t\t\t\treturn new DefaultSettingsTitleView( data );\n\t\t\t},\n\n\t\t\tgetDefaultSettingsTitleView: function( data ) {\n\t\t\t\treturn new DefaultSettingsTitleView( data );\n\t\t\t},\n\n\t\t\tgetGutterLeftView: function( data ) {\n\t\t\t\t/*\n\t\t\t\t * Return empty view\n\t\t\t\t */\n\t\t\t\treturn new EmptyView();\n\t\t\t},\n\n\t\t\tgetGutterRightView: function( data ) {\n\t\t\t\t/* \n\t\t\t\t * Return empty view\n\t\t\t\t */\n\t\t\t\treturn new EmptyView();\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Holds all of our domain models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/domainCollection',['models/app/domainModel'], function( domainModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: domainModel\n\t} );\n\treturn collection;\n} );\ndefine( 'views/fields/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header-fields'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/mainContentFieldCollection',[], function() {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\treorderOnSort: true,\n\n\t\tgetChildView: function() {\n\t\t\treturn nfRadio.channel( 'views' ).request( 'get:fieldItem' );\n\t\t},\n\n\t\tgetEmptyView: function() {\n\t\t\treturn nfRadio.channel( 'views' ).request( 'get:mainContentEmpty' );\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:sortableEl', this.getSortableEl, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'init:sortable', this.initSortable, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'destroy:sortable', this.destroySortable, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif ( this.collection.models.length > 0 ) {\n\t\t\t\tjQuery( this.el ).addClass( 'nf-field-type-droppable' ).addClass( 'nf-fields-sortable' );\n\t\t\t\tvar that = this;\n\t\t\t\t/* TODO: There's a bug with some Android phones and chrome. The fix below hasn't been implement.\n\n\t\t\t\t * Instantiate our sortable field list, but only if we aren't on a mobile device.\n\t\t\t\t *\n\t\t\t\t * On Android, our sortable list isn't scrollable if it's instantiated at render.\n\t\t\t\t * Instead, for mobile, we need to instantiate our sortable when the user tapholds and then\n\t\t\t\t * destroy it when the drag stops.\n\t\t\t\t */\n\t\t\t\t// if ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\t\tthis.initSortable();\n\t\t\t\t// }\n\t\t\t}\n\t\t\tnfRadio.channel( 'app' ).trigger( 'render:fieldsSortable', this );\n\t\t},\n\n\t\tgetSortableEl: function() {\n\t\t\treturn this.el;\n\t\t},\n\n\t\tinitSortable: function() {\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tvar tolerance = 'pointer';\n\t\t\t} else {\n\t\t\t\tvar tolerance = 'intersect';\n\t\t\t}\n\n\t\t\tjQuery( this.el ).sortable( {\n\t\t\t\tcontainment: 'parent',\n\t\t\t\thelper: 'clone',\n\t\t\t\tcancel: '.nf-item-controls',\n\t\t\t\tplaceholder: 'nf-fields-sortable-placeholder',\n\t\t\t\topacity: 0.95,\n\t\t\t\tgrid: [ 5, 5 ],\n\t\t\t\t// scroll: false,\n\t\t\t\tappendTo: '#nf-main',\n\t\t\t\tscrollSensitivity: 10,\n\t\t\t\t//connectWith would allow drag and drop between fields already in the builder and the repeatable fieldset ( this is currently an issue until we deal with existing data stored)\n\t\t\t\t//connectWith: '.nf-fields-sortable', \n\n\t\t\t\treceive: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping || jQuery(ui.item).hasClass(\"nf-over-repeater\") ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'receive:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tover: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'over:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'out:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'start:fieldsSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:fieldsSortable', ui, this );\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'stop:fieldsSortable', ui );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tdestroySortable: function() {\n\t\t\tjQuery( this.el ).sortable( 'destroy' );\n\t\t},\n\n\t\tonAddChild: function( childView ) {\n\t\t\tif ( nfRadio.channel( 'fields' ).request( 'get:adding' ) ) {\n\t\t\t\tchildView.$el.hide().show( 'clip' );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'set:adding', false );\n\t\t\t}\n\t\t}\n\t\t\n\t} );\n\n\treturn view;\n} );\n\ndefine( 'views/fields/drawer/addSavedField',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-add-saved-field',\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:addSavedLoading', this.renderAddButton, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.renderAddButton();\n\t\t},\n\n\t\trenderAddButton: function() {\n\t\t\tif ( this.model.get( 'addSavedLoading' ) ) {\n\t\t\t\tvar button = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-add-saved-field-loading' );\n\t\t\t} else {\n\t\t\t\tvar button = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-add-saved-field-button' );\n\t\t\t}\n\t\t\tjQuery( this.el ).find( '.add-button' ).html( button( this ) );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:addSavedLoading', this.render );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-button': 'clickAddSavedField'\n\t\t},\n\n\t\tclickAddSavedField: function( e ) {\n\t\t\tnfRadio.channel( 'drawer' ).trigger( 'click:addSavedField', e, this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n\n/**\n * Fields settings title view.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/fields/drawer/settingsTitle',['views/fields/drawer/addSavedField'], function( addSavedFieldView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-drawer-content-edit-settings-title-fields',\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:saved', this.render, this );\n\t\t\tthis.model.on( 'change:label', this.renderjBoxContent, this );\n\t\t},\n\n\t\tregions: {\n\t\t\taddSaved: '.nf-add-saved-field'\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:saved', this.render );\n\t\t\tthis.addSavedjBox.destroy();\n\t\t\tthis.model.unset( 'jBox', { silent: true } );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.renderjBoxContent();\n\t\t\tvar that = this;\n\t\t\tthis.addSavedjBox = new jBox( 'Tooltip', {\n\t\t\t\ttrigger: 'click',\n\t\t\t\ttitle: 'Add to Favorite Fields',\n\t\t\t\tposition: {\n\t\t\t\t\tx:'left',\n\t\t\t\t\ty:'center'\n\t\t\t\t},\n\t\t\t\toutside:'x',\n\t\t\t\tcloseOnClick: 'body',\n\n\t\t\t\tonCreated: function() {\n\t\t\t\t\tthis.setContent( jQuery( that.el ).find( '.nf-add-saved-field' ) );\n\t\t\t\t}\n\t\t\t} );\n\t\t\tthis.addSavedjBox.attach( jQuery( this.el ).find( '.dashicons') );\n\t\t\tthis.model.set( 'jBox', this.addSavedjBox, { silent: true } );\n\t\t},\n\n\t\trenderjBoxContent: function() {\n\t\t\tif ( this.addSaved ) {\n\t\t\t\tthis.addSaved.show( new addSavedFieldView( { model: this.model } ) );\n\t\t\t}\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderTypeNicename: function() {\n\t \t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\t\t\tvar domainID = currentDomain.get( 'id' );\n\t \t\t\tvar type = nfRadio.channel( domainID ).request( 'get:type', this.type );\n\t \t\t\tvar displayName = type.get( 'nicename' );\n\n\t \t\t\tif ( this.saved ) {\n\t \t\t\t\tvar realType = nfRadio.channel( domainID ).request( 'get:type', type.get( 'type' ) );\n\t \t\t\t\tdisplayName += ' - ' + realType.get( 'nicename' );\n\t \t\t\t}\n\t \t\t\treturn displayName;\n\t\t\t\t},\n\t\t\t\t\n\t\t\t\trenderSavedStar: function() {\n\t\t\t\t\tif ( this.saved ) {\n\t\t\t\t\t\tvar star = 'filled';\n\t\t\t\t\t} else {\n\t\t\t\t\t\tvar star = 'empty';\n\t\t\t\t\t}\n\t\t\t\t\treturn '<span class=\"dashicons dashicons-star-' + star + '\"></span>'\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Add main header.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/mainHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-header-actions',\n\n\t\tinitialize: function() {\n\t\t\tvar actionCollection = nfRadio.channel( 'actions' ).request( 'get:collection' );\n\t\t\tthis.listenTo( actionCollection, 'add', this.render );\n\t\t\tthis.listenTo( actionCollection, 'remove', this.render );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tvar actionCollection = nfRadio.channel( 'actions' ).request( 'get:collection' );\n\t\t\tif ( actionCollection.models.length == 0 ) {\n\t\t\t\tjQuery( this.el ).hide();\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).show();\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Actions subheader view.\n *\n * TODO: make dynamic\n * \n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header-actions'\n\t});\n\n\treturn view;\n} );\n/**\n * Renders an application menu item from a domain model.\n *\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/itemControls',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-item-controls',\n\n\t\tinitialize: function() {\n\t\t\t// Listen for domain changes and re-render when we detect one.\n\t\t\t// this.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.render );\n\t\t},\n\n\t\t/**\n\t\t * When we render this view, remove the extra <div> tag created by backbone.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tonRender: function() {\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\t\t\t// \n\t\t\tthis.currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t},\n\n\t\tevents: {\n\t\t\t'mouseover .nf-item-control': 'mouseoverItemControl',\n\t\t\t'click .nf-edit-settings': 'clickEdit',\n\t\t\t'singletap .nf-item-control': 'singleTapEdit',\n\t\t\t'click .nf-item-delete': 'clickDelete',\n\t\t\t'click .nf-item-duplicate': 'clickDuplicateField'\n\t\t},\n\n\t\tclickEdit: function( e ) {\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tsingleTapEdit: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t},\n\n\t\tclickDelete: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:delete', e, this.model );\n\t\t},\n\n\t\tclickDuplicateField: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'click:duplicate', e, this.model );\n\t\t},\n\n\t\tmouseoverItemControl: function( e ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'mouseover:itemControl', e, this.model );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Single action table row\n *\n * TODO: make dynamic\n *\n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/actionItem',['views/app/itemControls'], function( itemControlsView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'tr',\n\t\ttemplate: '#tmpl-nf-action-item',\n\n\t\tregions: {\n\t\t\titemControls: '.nf-item-controls'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.template = nfRadio.channel( 'actions' ).request( 'get:actionItemTemplate' ) || this.template;\n\t\t\tthis.model.on( 'change:label', this.render, this );\n\t\t\tthis.model.on( 'change:editActive', this.render, this );\n\t\t\tthis.model.on( 'change:active', this.maybeDeactivate, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:label', this.render );\n\t\t\tthis.model.off( 'change:editActive', this.render );\n\t\t\tthis.model.off( 'change:active', this.maybeDeactivate );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif ( this.model.get( 'editActive' ) ) {\n\t\t\t\tjQuery( this.el ).addClass( 'active' );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).removeClass( 'active' );\n\t\t\t}\n\n\t\t\tthis.maybeDeactivate();\n\n\t\t\tthis.itemControls.show( new itemControlsView( { model: this.model } ) );\n\t\t},\n\n\t\tmaybeDeactivate: function() {\n\t\t\tif ( 0 == this.model.get( 'active' ) ) {\n\t\t\t\tjQuery( this.el ).addClass( 'deactivated' );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).removeClass( 'deactivated' );\n\t\t\t}\n\t\t},\n\n\t\tevents: {\n\t\t\t'change input': 'changeToggle',\n\t\t\t'click': 'maybeClickEdit'\n\t\t},\n\n\t\tmaybeClickEdit: function( e ) {\n\t\t\tif ( 'TR' == jQuery( e.target ).parent().prop( 'tagName' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tchangeToggle: function( e ) {\n\t\t\tvar setting = jQuery( e.target ).data( 'setting' );\n\t\t\tvar settingModel = nfRadio.channel( 'actions' ).request( 'get:settingModel', setting );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:setting', e, settingModel, this.model );\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderToggle: function( settingName ) {\n\t\t\t\t\tthis.settingName = settingName || 'active';\n\t\t\t\t\tvar actionLabel = this.label;\n\t\t\t\t\tthis.label = '';\n\t\t\t\t\tthis.value = this[ this.settingName ];\n\t\t\t\t\tthis.name = this.id + '-' + this.settingName;\n\t\t\t\t\tvar html = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-toggle' );\n\t\t\t\t\thtml = html( this );\n\t\t\t\t\tthis.label = actionLabel;\n\t\t\t\t\treturn html;\n\t\t\t\t},\n\n\t\t\t\trenderTypeNicename: function() {\n\t\t\t\t\tvar type = nfRadio.channel( 'actions' ).request( 'get:type', this.type );\n\t\t\t\t\tif ( 'undefined' == typeof type ) return;\n\n\t\t\t\t\treturn type.get( 'nicename' );\n\t\t\t\t},\n\n /**\n\t\t\t\t * [Deprecated] Tooltips are not currently implemented in the context of the action list.\n\t\t\t\t * However, the template uses a nested template which requires the helper method.\n * @returns {string}\n */\n\t\t\t\trenderTooltip: function() {\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\n\t\t\t\trenderMergeTags: function() {\n\t\t\t\t\tif ( this.use_merge_tags ) {\n\t\t\t\t\t\treturn '<span class=\"dashicons dashicons-list-view merge-tags\"></span>';\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/actions/mainContentEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-content-actions-empty',\n\n\t\tonBeforeDestroy: function() {\n\t\t\tjQuery( this.el ).parent().parent().removeClass( 'nf-actions-empty' );\n\t\t\t// jQuery( this.el ).parent().removeClass( 'nf-fields-empty-droppable' ).droppable( 'destroy' );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tjQuery( this.el ).parent().parent().addClass( 'nf-actions-empty' );\n\t\t\t// if ( jQuery( this.el ).parent().hasClass( 'ui-sortable' ) ) {\n\t\t\t// \tjQuery( this.el ).parent().sortable( 'destroy' );\n\t\t\t// }\n\t\t\t// jQuery( this.el ).parent().addClass( 'nf-fields-empty-droppable' );\n\t\t\t// jQuery( this.el ).parent().droppable( {\n\t\t\t// \taccept: function( draggable ) {\n\t\t\t// \t\tif ( jQuery( draggable ).hasClass( 'nf-stage' ) || jQuery( draggable ).hasClass( 'nf-field-type-button' ) ) {\n\t\t\t// \t\t\treturn true;\n\t\t\t// \t\t}\n\t\t\t// \t},\n\t\t\t// \thoverClass: 'nf-droppable-hover',\n\t\t\t// \ttolerance: 'pointer',\n\t\t\t// \tover: function( e, ui ) {\n\t\t\t// \t\tui.item = ui.draggable;\n\t\t\t// \t\tnfRadio.channel( 'app' ).request( 'over:fieldsSortable', ui );\n\t\t\t// \t},\n\t\t\t// \tout: function( e, ui ) {\n\t\t\t// \t\tui.item = ui.draggable;\n\t\t\t// \t\tnfRadio.channel( 'app' ).request( 'out:fieldsSortable', ui );\n\t\t\t// \t},\n\t\t\t// \tdrop: function( e, ui ) {\n\t\t\t// \t\tui.item = ui.draggable;\n\t\t\t// \t\tnfRadio.channel( 'app' ).request( 'receive:fieldsSortable', ui );\n\t\t\t// \t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t// \t\tfieldCollection.trigger( 'reset', fieldCollection );\n\t\t\t// \t},\n\t\t\t// } );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Main content view for our actions.\n *\n * TODO: make dynamic\n *\n * @package Ninja Forms builder\n * @subpackage Actions\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/actions/mainContent',['views/actions/actionItem', 'views/actions/mainContentEmpty'], function( actionView, emptyView ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\ttemplate: '#tmpl-nf-action-table',\n\t\tchildView: actionView,\n\t\temptyView: emptyView,\n\n\t\tinitialize: function() {\n\t\t\tthis.template = nfRadio.channel( 'actions' ).request( 'get:mainContentTemplate' ) || this.template;\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tjQuery( this.el ).droppable( {\n\t\t\t\taccept: '.nf-action-type-draggable',\n\t\t\t\tactiveClass: 'nf-droppable-active',\n\t\t\t\thoverClass: 'nf-droppable-hover',\n\t\t\t\tdrop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'drop:actionType', e, ui );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tif ( 'undefined' == typeof nfRadio.channel( 'actions' ).request( 'get:type', childView.model.get( 'type' ) ) ) return;\n\n\t\t\tjQuery( collectionView.el ).find( 'tbody' ).append( childView.el );\n\t\t},\n\t});\n\n\treturn view;\n} );\n\ndefine( 'views/advanced/mainHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-header-settings'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/advanced/subHeader',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-sub-header-settings'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/advanced/settingItem',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-form-setting-type',\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:editActive', this.updateActiveClass );\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:editActive', this.updateActiveClass, this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click': 'clickEdit'\n\t\t},\n\n\t\tclickEdit: function( e ) {\n\t\t\tnfRadio.channel( 'settings' ).trigger( 'click:edit', e, this.model );\n\t\t},\n\n\t\ttemplateHelpers: function() {\n\t\t\treturn {\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = 'nf-setting-wrap ' + this.id;\n\t \t\t\tif ( this.editActive ) {\n\t \t\t\t\tclasses += ' active';\n\t \t\t\t}\n\t \t\t\treturn classes;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tupdateActiveClass: function() {\n\t\t\tif ( this.model.get( 'editActive' ) ) {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting-wrap' ).addClass( 'active' );\n\t\t\t} else {\n\t\t\t\tjQuery( this.el ).find( '.nf-setting-wrap' ).removeClass( 'active' );\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/advanced/mainContent',['views/advanced/settingItem'], function( settingItem ) {\n\tvar view = Marionette.CompositeView.extend({\n\t\tchildView: settingItem,\n\t\ttemplate: '#tmpl-nf-advanced-main-content',\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.child-view-container' ).append( childView.el );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Model that represents our form fields.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/fieldModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tobjectType: 'Field',\n\t\t\tobjectDomain: 'fields',\n\t\t\teditActive: false,\n\t\t\torder: 999,\n\t\t\tidAttribute: 'id'\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tvar type = this.get('type');\n\t\t\tif ( 'undefined' == typeof type ) return;\n\n\t\t\t// Listen for model attribute changes\n\t\t\tthis.on( 'change', this.changeSetting, this );\n\n\t\t\t// Get our parent field type.\n\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', this.get( 'type' ) );\n\t\t\tvar parentType = fieldType.get( 'parentType' );\n\n\t\t\t// Loop through our field type \"settingDefaults\" and add any default settings.\n\t\t\t_.each( fieldType.get( 'settingDefaults' ), function( val, key ) {\n\t\t\t\tif ( 'undefined' == typeof this.get( key ) ) {\n\t\t\t\t\tthis.set( key, val, { silent: true } );\n\t\t\t\t}\n\t\t\t}, this );\n\n\t\t\t/*\n\t\t\t * If our field type is a saved field, set our field type to the actual field type\n\t\t\t */\n\t\t\tif ( 'saved' == fieldType.get( 'section' ) ) {\n\t\t\t\tthis.set( 'type', fieldType.get( 'type' ) );\n\t\t\t}\n\n\t\t\tif (type === 'listimage') {\n\t\t\t\tthis.get = this.listimageGet;\n\t\t\t\tthis.set = this.listimageSet;\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * Trigger an init event on three channels:\n\t\t\t * \n\t\t\t * fields\n\t\t\t * fields-parentType\n\t\t\t * field-type\n\t\t\t *\n\t\t\t * This lets specific field types modify model attributes before anything uses them.\n\t\t\t */ \n\t\t\tnfRadio.channel( 'fields' ).trigger( 'init:fieldModel', this );\n\t\t\tnfRadio.channel( 'fields-' + parentType ).trigger( 'init:fieldModel', this );\n\t\t\tnfRadio.channel( 'fields-' + this.get( 'type' ) ).trigger( 'init:fieldModel', this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'fire:updateFieldKey', this.updateFieldKey );\n\t\t},\n\n\t\tlistimageGet: function(attr) {\n if(attr === 'options') {\n\t\t\t\t\tattr = 'image_options';\n\t\t\t}\n\n return Backbone.Model.prototype.get.call(this, attr);\n\t\t},\n\t\t\n\t\tlistimageSet: function(attributes, options) {\n\t\t\tif ('options' === attributes) {\n\t\t\t\tattributes = 'image_options';\n\t\t\t}\n\t\t\treturn Backbone.Model.prototype.set.call(this, attributes, options);\n\t\t},\n\n\t\t/**\n\t\t * Fires an event on the fieldSetting-{name} channel saying we've updated a setting.\n\t\t * When we change the model attributes, fire an event saying we've changed something.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tchangeSetting: function( model, options ) {\n\t\t\tnfRadio.channel( 'fieldSetting-' + _.keys( model.changedAttributes() )[0] ).trigger( 'update:setting', this, options.settingModel ) ;\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'update:setting', this, options.settingModel );\n\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', this, options.settingModel );\n\t\t},\n\n\t\tupdateFieldKey: function( keyModel, settingModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'replace:fieldKey', this, keyModel, settingModel );\n\t\t},\n \n /**\n * Function used to get the formatted lable of the fieldModel.\n * \n * @since 3.3.3\n * @return String\n */\n formatLabel: function() {\n // Try to use admin label.\n var label = this.get( 'admin_label' );\n // If our admin label is empty...\n if ( '' == label ) {\n // Use the field label instead.\n label = this.get( 'label' );\n }\n return label;\n }\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our field models.\n * This is the actual field data created by the user.\n *\n * We listen to the add and remove events so that we can push the new id to either the new fields or removed fields property.\n *\n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/fieldCollection',['models/fields/fieldModel'], function( fieldModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: fieldModel,\n\t\tcomparator: function( model ){\n\t\t\treturn parseInt( model.get( 'order' ) );\n\t\t},\n\t\ttmpNum: 1,\n\n\t\tinitialize: function() {\n\t\t\tthis.on( 'add', this.addField, this );\n\t\t\tthis.on( 'remove', this.removeField, this );\n\n\t\t\tthis.listenTo( this, 'add:field', this.addNewField );\n\t\t\tthis.listenTo( this, 'append:field', this.appendNewField );\n\t\t\tthis.listenTo( this, 'remove:field', this.removeFieldResponse );\n\t\t\tthis.newIDs = [];\n\t\t},\n\n\t\t/**\n\t\t * When we add a field, push the id onto our new fields property.\n\t\t * This lets us tell the server that this is a new field to be added rather than a field to be updated.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param void\n\t\t */\n\t\taddField: function( model ) {\n\t\t\tthis.newIDs.push( model.get( 'id' ) );\n\t\t},\n\n\t\t/**\n\t\t * When we remove a field, push the id onto our removed fields property.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param void\n\t\t */\n\t\tremoveField: function( model ) {\n\t\t\tthis.removedIDs = this.removedIDs || {};\n\t\t\tthis.removedIDs[ model.get( 'id' ) ] = model.get( 'id' );\n\t\t},\n\n\t\taddNewField: function( model ) {\n\t\t\tthis.add( model );\n\t\t},\n\n\t\tappendNewField: function( model ) {\n\t\t\tif ( 0 == this.length ) {\n\t\t\t\tvar order = 0;\n\t\t\t} else {\n\t\t\t\tvar order = this.at( this.length -1 ).get( 'order' ) + 1;\n\t\t\t}\n\n\t\t\tmodel.set( 'order', order, { silent: true } );\n\t\t\tthis.add( model );\n\t\t},\n\n\t\tremoveFieldResponse: function( model ) {\n\t\t\tthis.remove( model );\n\t\t},\n\n\t\tfieldExists: function( fieldModel ) {\n\t\t\treturn -1 != this.indexOf( fieldModel );\n\t\t}\n\t} );\n\treturn collection;\n} );\n\n/**\n * Config file for our app domains.\n * \n * this.collection represents all of our app domain (fields, actions, settings) information.\n *\n * This doesn't store the current domain, but rather all the data about each.\n * \n * This data includes:\n * hotkeys\n * header view\n * subheader view\n * content view\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/domainConfig',[\n\t// Require our domain collection\n\t'models/app/domainCollection',\n\t// Require our fields domain files\n\t'views/fields/subHeader',\n\t'views/fields/mainContentFieldCollection',\n\t'views/fields/drawer/settingsTitle',\n\t// Require our actions domain files\n\t'views/actions/mainHeader', \n\t'views/actions/subHeader',\n\t'views/actions/mainContent',\n\t// Require our settings domain files\n\t'views/advanced/mainHeader',\n\t'views/advanced/subHeader',\n\t'views/advanced/mainContent',\n\t// Empty View\n\t'views/app/empty',\n\t// FieldCollection: used by the default formContentData filter\n\t'models/fields/fieldCollection'\n\t], \n\tfunction( \n\t\tappDomainCollection,\n\t\tfieldsSubHeaderView,\n\t\tFieldsMainContentFieldCollectionView,\n\t\tfieldsSettingsTitleView,\n\t\tactionsMainHeaderView,\n\t\tactionsSubHeaderView,\n\t\tactionsMainContentView,\n\t\tsettingsMainHeaderView,\n\t\tsettingsSubHeaderView,\n\t\tsettingsMainContentView,\n\t\tEmptyView,\n\t\tFieldCollection\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Add our default formContentView filter.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).request( 'add:viewFilter', this.defaultFormContentView, 10, this );\n\t\t\t\n\t\t\t/*\n\t\t\t * Add our default formContentData filter.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).request( 'add:loadFilter', this.defaultFormContentLoad, 10, this );\n\n\t\t\t/*\n\t\t\t * Add our default formContentGutterView filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContentGutters' ).request( 'add:leftFilter', this.defaultFormContentGutterView, 10, this );\n\t\t\tnfRadio.channel( 'formContentGutters' ).request( 'add:rightFilter', this.defaultFormContentGutterView, 10, this );\n\n\t\t\t// Define our app domains\n\t\t\tthis.collection = new appDomainCollection( [\n\t\t\t\t{\n\t\t\t\t\tid: 'fields',\n\t\t\t\t\tnicename: nfi18n.domainFormFields,\n\t\t\t\t\thotkeys: {\n\t\t\t\t\t\t'Esc'\t\t\t\t: 'close:drawer',\n\t\t\t\t\t\t'Ctrl+Shift+n'\t\t: 'add:newField',\n\t\t\t\t\t\t'Ctrl+Shift+a'\t\t: 'changeDomain:actions',\n\t\t\t\t\t\t'Ctrl+Shift+s'\t\t: 'changeDomain:settings',\n\t\t\t\t\t\t'Alt+Ctrl+t'\t\t: 'open:mergeTags',\n\t\t\t\t\t\t'up'\t\t\t\t: 'up:mergeTags',\n\t\t\t\t\t\t'down'\t\t\t\t: 'down:mergeTags',\n\t\t\t\t\t\t'Shift+return'\t\t: 'return:mergeTags'\n\t\t\t\t\t},\n\t\t\t\t\tmobileDashicon: 'dashicons-menu',\n\n\t\t\t\t\tgetSubHeaderView: function() {\n\t\t\t\t\t\treturn new fieldsSubHeaderView();\n\t\t\t\t\t},\n\n\t\t\t\t\t/**\n\t\t\t\t\t * Get the formContent view that should be used in our builder.\n\t\t\t\t\t * Uses two filters:\n\t\t\t\t\t * 1) One for our formContentData\n\t\t\t\t\t * 2) One for our formContentView\n\t\t\t\t\t *\n\t\t\t\t\t * If we don't have any view filters, we use the default formContentView.\n\t\t\t\t\t * \n\t\t\t\t\t * @since 3.0\n\t\t\t\t\t * @return formContentView backbone view.\n\t\t\t\t\t */\n\t\t\t\t\tgetMainContentView: function( collection ) {\n\t\t\t\t\t\tvar formContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'formContentData' );\n\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * As of version 3.0, 'fieldContentsData' has deprecated in favour of 'formContentData'.\n\t\t\t\t\t\t * If we don't have this setting, then we check for this deprecated value.\n\t\t\t\t\t\t * \n\t\t\t\t\t\t * Set our fieldContentsData to our form setting 'fieldContentsData'\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * TODO: Remove this backwards compatibility eventually.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tif ( ! formContentData ) {\n\t\t\t\t\t\t\tformContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'fieldContentsData' );\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * If we don't have a filter for our formContentData, default to fieldCollection.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar formContentLoadFilters = nfRadio.channel( 'formContent' ).request( 'get:loadFilters' );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( formContentLoadFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tformContentData = callback( formContentData, nfRadio.channel( 'app' ).request( 'get:formModel' ), true );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Check our fieldContentViewsFilter to see if we have any defined.\n\t\t\t\t\t\t * If we do, overwrite our default with the view returned from the filter.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar formContentViewFilters = nfRadio.channel( 'formContent' ).request( 'get:viewFilters' );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( formContentViewFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tformContentView = callback();\n\n\t\t\t\t\t\tnfRadio.channel( 'settings' ).request( 'update:setting', 'formContentData', formContentData, true );\n\t\t\t\t\t\treturn new formContentView( { collection: formContentData } );\n\t\t\t\t\t},\n\n\t\t\t\t\tgetSettingsTitleView: function( data ) {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * If we are dealing with a field model, return the fields settings view, otherwise, return the default.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tif ( 'fields' == data.model.get( 'objectDomain' ) ) {\n\t\t\t\t\t\t\treturn new fieldsSettingsTitleView( data );\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn this.get( 'getDefaultSettingsTitleView' ).call( this, data );\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t},\n\n\t\t\t\t\tgetGutterLeftView: function( data ) {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Check our fieldContentViewsFilter to see if we have any defined.\n\t\t\t\t\t\t * If we do, overwrite our default with the view returned from the filter.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar gutterFilters = nfRadio.channel( 'formContentGutters' ).request( 'get:leftFilters' );\n\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( gutterFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tgutterView = callback();\n\n\t\t\t\t\t\treturn new gutterView(); \n\t\t\t\t\t},\n\n\t\t\t\t\tgetGutterRightView: function() {\n\t\t\t\t\t\t/*\n\t\t\t\t\t\t * Check our fieldContentViewsFilter to see if we have any defined.\n\t\t\t\t\t\t * If we do, overwrite our default with the view returned from the filter.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tvar gutterFilters = nfRadio.channel( 'formContentGutters' ).request( 'get:rightFilters' );\n\t\t\t\t\t\t\n\t\t\t\t\t\t/* \n\t\t\t\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t\t\t\t*/\n\t\t\t\t\t\tvar sortedArray = _.without( gutterFilters, undefined );\n\t\t\t\t\t\tvar callback = _.first( sortedArray );\n\t\t\t\t\t\tgutterView = callback();\n\n\t\t\t\t\t\treturn new gutterView(); \n\t\t\t\t\t}\n\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'actions',\n\t\t\t\t\tnicename: nfi18n.domainActions,\n\t\t\t\t\thotkeys: {\n\t\t\t\t\t\t'Esc'\t\t\t\t: 'close:drawer',\n\t\t\t\t\t\t'Ctrl+Shift+n'\t\t: 'add:newAction',\n\t\t\t\t\t\t'Ctrl+Shift+f'\t\t: 'changeDomain:fields',\n\t\t\t\t\t\t'Ctrl+Shift+s'\t\t: 'changeDomain:settings',\n\t\t\t\t\t\t'Alt+Ctrl+t'\t\t: 'open:mergeTags',\n\t\t\t\t\t\t'up'\t\t\t\t: 'up:mergeTags',\n\t\t\t\t\t\t'down'\t\t\t\t: 'down:mergeTags',\n\t\t\t\t\t\t'Shift+return'\t\t: 'return:mergeTags'\n\t\t\t\t\t},\n\t\t\t\t\tmobileDashicon: 'dashicons-external',\n\n\t\t\t\t\tgetSubHeaderView: function() {\n\t\t\t\t\t\treturn new actionsSubHeaderView();\n\t\t\t\t\t},\n\t\t\t\t\t\n\t\t\t\t\tgetMainContentView: function() {\n\t\t\t\t\t\tvar collection = nfRadio.channel( 'actions' ).request( 'get:collection' );\n\t\t\t\t\t\treturn new actionsMainContentView( { collection: collection } );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'settings',\n\t\t\t\t\tnicename: nfi18n.domainAdvanced,\n\t\t\t\t\thotkeys: {\n\t\t\t\t\t\t'Esc'\t\t\t\t: 'close:drawer',\n\t\t\t\t\t\t'Ctrl+Shift+f'\t\t: 'changeDomain:fields',\n\t\t\t\t\t\t'Ctrl+Shift+a'\t\t: 'changeDomain:actions',\n\t\t\t\t\t\t'Alt+Ctrl+t'\t\t: 'open:mergeTags',\n\t\t\t\t\t\t'up'\t\t\t\t: 'up:mergeTags',\n\t\t\t\t\t\t'down'\t\t\t\t: 'down:mergeTags',\n\t\t\t\t\t\t'Shift+return'\t\t: 'return:mergeTags'\n\t\t\t\t\t},\n\t\t\t\t\tmobileDashicon: 'dashicons-admin-generic',\n\n\t\t\t\t\tgetSubHeaderView: function() {\n\t\t\t\t\t\treturn new settingsSubHeaderView();\n\t\t\t\t\t},\n\t\t\t\t\t\n\t\t\t\t\tgetMainContentView: function() {\n\t\t\t\t\t\tvar collection = nfRadio.channel( 'settings' ).request( 'get:typeCollection' );\n\t\t\t\t\t\treturn new settingsMainContentView( { collection: collection } );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: 'preview',\n\t\t\t\t\tnicename: 'Preview Form',\n\t\t\t\t\tclasses: 'preview',\n\t\t\t\t\tdashicons: 'dashicons-visibility',\n\t\t\t\t\tmobileDashicon: 'dashicons-visibility',\n\t\t\t\t\turl: nfAdmin.previewurl\n\t\t\t\t}\n\t\t\t] );\n\n\t\t\t/*\n\t\t\t * Send out a radio message with our domain config collection.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).trigger( 'init:domainCollection', this.collection );\n\n\t\t\t/*\n\t\t\t * Respond to requests to get the app domain collection.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:domainCollection', this.getDomainCollection, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:domainModel', this.getDomainModel, this );\n\t\t},\n\n\t\tgetDomainCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tgetDomainModel: function( id ) {\n\t\t\treturn this.collection.get( id );\n\t\t},\n\n\t\tdefaultFormContentView: function( formContentData ) {\n\t\t\treturn FieldsMainContentFieldCollectionView;\n\t\t},\n\n\t\tdefaultFormContentLoad: function( formContentData ) {\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t/*\n\t\t\t * If we only have one load filter, we can just return the field collection.\n\t\t\t */\n\t\t\tvar formContentLoadFilters = nfRadio.channel( 'formContent' ).request( 'get:loadFilters' );\n\t\t\tvar sortedArray = _.without( formContentLoadFilters, undefined );\n\n\t\t\tif ( 1 == sortedArray.length || 'undefined' == typeof formContentData || true === formContentData instanceof Backbone.Collection ) return fieldCollection;\n\n\t\t\t/*\n\t\t\t * If another filter is registered, we are calling this from somewhere else.\n\t\t\t */\n\n \tvar fieldModels = _.map( formContentData, function( key ) {\n \t\treturn fieldCollection.findWhere( { key: key } );\n \t}, this );\n\n \treturn new FieldCollection( fieldModels );\n\t\t},\n\n\t\tdefaultFormContentGutterView: function( formContentData ) {\n\t\t\treturn EmptyView;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Model for our app data.\n * Listens for changes to the 'clean' attribute and triggers a radio message when the state changes.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/appModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tloading: false\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// Listen to changes to our 'clean' attribute.\n\t\t\tthis.on( 'change:clean', this.changeStatus, this );\n\t\t},\n\n\t\tchangeStatus: function() {\n\t\t\t// Send out a radio message when the 'clean' attribute changes.\n\t\t\tnfRadio.channel( 'app' ).trigger( 'change:clean', this.get( 'clean' ) );\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Creates and stores a model that represents app-wide data. i.e. current domain, current drawer, clean, etc.\n *\n * clean is a boolean that represents whether or not changes have been made.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/data',['models/app/appModel'], function( appModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Get the collection that represents all the parts of our application.\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\t// Setup our initial model.\n\t\t\tthis.model = new appModel( {\n\t\t\t\tcurrentDrawer: false,\n\t\t\t\tcurrentDomain: appDomainCollection.get( 'fields' ),\n\t\t\t\tclean: true\n\t\t\t} );\n\n\t\t\t/*\n\t\t\t * Set the mobile setting used to track whether or not we're on a mobile device.\n\t\t\t */\n\t\t\tvar mobile = ( 1 == nfAdmin.mobile ) ? true : false;\n\t\t\tthis.model.set( 'mobile', mobile );\n\n\t\t\t/*\n\t\t\t * Respond to requests to see if we are on mobile.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'is:mobile', this.isMobile, this );\n\n\t\t\t/*\n\t\t\t * Respond to app channel requests for information about the state of our app.\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:data', this.getData, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:setting', this.getSetting, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:currentDomain', this.getCurrentDomain, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:currentDrawer', this.getCurrentDrawer, this );\n\t\t\tnfRadio.channel( 'drawer' ).reply( 'get:current', this.getCurrentDrawer, this );\n\n\t\t\t/*\n\t\t\t * Respond to app channel requests to update app settings.\n\t\t\t */\t\t\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:currentDomain', this.updateCurrentDomain, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:currentDrawer', this.updateCurrentDrawer, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:setting', this.updateSetting, this );\n\n\t\t\tnfRadio.channel( 'settings' ).reply( 'check:deps', this.checkDeps, this );\n\n\t\t},\n\t\t\n\t\t/**\n\t\t * A more robust settings dependency system.\n\t\t * This allows you to have a setting only show when X AND Y are met or when X OR Y are met.\n\t\t * \n\t\t * @since \n\t\t * @param {object} setting Setting object\n\t\t * @param {object} context Object context for where this is being called.\n\t\t * @return {bool}/{string}\n\t\t */\n\t\tcheckDeps: function( setting, context ) {\n\t\t\tif ( ! setting.deps ) {\n\t\t\t\treturn '';\n\t\t\t}\n\n\t\t\t// If we do have a \"settings\" property, then this is a new dependency format.\n\t\t\tlet deps_settings = setting.deps.settings;\n\t\t\tlet match = setting.deps.match;\n\t\t\t\n\t\t\tlet hide = false;\n\t\t\t\n\t\t\tfor (var i = deps_settings.length - 1; i >= 0; i--) {\n\t\t\t\tlet name = deps_settings[i].name;\n\t\t\t\tlet value = deps_settings[i].value;\n\n\t\t\t\t// Use == here instead of === in order to avoid string => int comparison.\n\t\t\t if ( context.dataModel.get( name ) == value ) {\n\t\t \t// If we're looking for \"any\" match, we can go ahead and return here. \n\t\t \tif ( 'any' == match ) {\n\t\t \t\thide = false;\n\t\t \t\tbreak;\n\t\t \t}\n\t\t } else {\n\t \t\thide = true;\n\t\t }\n\t\t\t}\n\n\t\t\tif ( hide ) {\n\t\t\t\treturn 'style=\"display:none;\"';\n\t\t\t}\n\t\t\t\n\t\t\treturn '';\n\t\t},\n\n\t\tupdateCurrentDomain: function( model ) {\n\t\t\tthis.updateSetting( 'currentDomain', model );\n\t\t},\n\n\t\tupdateSetting: function( setting, value ) {\n\t\t\tthis.model.set( setting, value );\n\t\t\treturn true;\n\t\t},\n\n\t\tgetSetting: function( setting ) {\n\t\t\treturn this.model.get( setting );\n\t\t},\n\n\t\tgetData: function() {\n\t\t\treturn this.model;\n\t\t},\n\n\t\tgetCurrentDomain: function() {\n\t\t\treturn this.model.get( 'currentDomain' );\n\t\t},\n\n\t\tupdateCurrentDrawer: function( drawerID ) {\n\t\t\tthis.updateSetting( 'currentDrawer', drawerID );\n\t\t\treturn true;\n\t\t},\n\n\t\tgetCurrentDrawer: function() {\n\t\t\tvar currentDrawerID = this.model.get( 'currentDrawer' );\n\t\t\treturn nfRadio.channel( 'app' ).request( 'get:drawer', currentDrawerID );\n\t\t},\n\n\t\tisMobile: function() {\n\t\t\treturn this.model.get( 'mobile' );\n\t\t}\n\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens for click events to expand/collapse setting groups.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/drawerToggleSettingGroup',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for click events on our settings group.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:toggleSettingGroup', this.toggleSettingGroup );\n\t\t},\n\n\t\t/**\n\t\t * Set the 'display' attribute of our group model to true or false to toggle.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \tgroup setting model\n\t\t * @return void\n\t\t */\n\t\ttoggleSettingGroup: function( e, model ) {\n\t\t\tif ( model.get( 'display' ) ) {\n\t\t\t\t/*\n\t\t\t\t * Make sure that none of our settings have errors\n\t\t\t\t */\n\t\t\t\tvar errors = false;\n\t\t\t\t_.each( model.get( 'settings' ).models, function( setting ) {\n\t\t\t\t\tif ( setting.get( 'error' ) ) {\n\t\t\t\t\t\terrors = true;\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\tif ( ! errors ) {\n\t\t\t\t\tmodel.set( 'display', false );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tmodel.set( 'display', true );\n\t\t\t}\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Updates our database with our form data.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/updateDB',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\n\t\tinitialize: function() {\n\t\t\t// Listen for the closing of the drawer and update when it's closed.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.updateDB );\n\t\t\t// Respond to requests to update the database.\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:db', this.updateDB, this );\n\t\t\t/*\n\t\t\t * Register our default formContent save filter.\n\t\t\t * This converts our collection into an array of keys.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).request( 'add:saveFilter', this.defaultSaveFilter, 10, this );\n\t\t},\n\n\t\t/**\n\t\t * Update our database.\n\t\t * If action isn't specified, assume we're updating the preview.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string \taction preview or publish\n\t\t * @return void\n\t\t */\n\t\tupdateDB: function( action ) {\n\n\t\t\t// If our app is clean, dont' update.\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t// Default action to preview.\n\t\t\taction = action || 'preview';\n\n\t\t\t// Setup our ajax actions based on the action we're performing\n\t\t\tif ( 'preview' == action ) {\n\t\t\t\tvar jsAction = 'nf_preview_update';\n\t\t\t} else if ( 'publish' == action ) {\n\t\t\t\tvar jsAction = 'nf_save_form';\n\t\t\t\t// now using a different ajax action\n\t\t\t\t// var jsAction = 'nf_batch_process';\n\t\t\t}\n\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\n\t\t\t/*\n\t\t\t * There are pieces of data that are only needed for the builder and not for the front-end.\n\t\t\t * We need to unset those.\n\t\t\t * TODO: Make this more dynamic/filterable.\n\t\t\t */\n\t\t\t_.each( formModel.get( 'fields' ).models, function( fieldModel, index ) {\n\t\t\t\tfieldModel.unset( 'jBox', { silent: true } );\n\t\t\t} );\n\n\t\t\t/*\n\t\t\t * The main content of our form is called the formContent.\n\t\t\t * In this next section, we check to see if any add-ons want to modify that contents before we save.\n\t\t\t * If there aren't any filters found, we default to the field collection.\n\t\t\t * \n\t\t\t */\n\t\t\t\n\t\t\tvar formContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'formContentData' );\n\t\t\t/*\n\t\t\t * As of version 3.0, 'fieldContentsData' has deprecated in favour of 'formContentData'.\n\t\t\t * If we don't have this setting, then we check for this deprecated value.\n\t\t\t * \n\t\t\t * Set our fieldContentsData to our form setting 'fieldContentsData'\n\t\t\t *\n\t\t\t * TODO: Remove this backwards compatibility eventually.\n\t\t\t */\n\t\t\tif ( ! formContentData ) {\n\t\t\t\tformContentData = nfRadio.channel( 'settings' ).request( 'get:setting', 'fieldContentsData' );\n\t\t\t}\n\n\t\t\tvar formContentSaveDataFilters = nfRadio.channel( 'formContent' ).request( 'get:saveFilters' );\n\t\t\t\t\t\t\n\t\t\t/* \n\t\t\t* Get our first filter, this will be the one with the highest priority.\n\t\t\t*/\n\t\t\tvar sortedArray = _.without( formContentSaveDataFilters, undefined );\n\t\t\tvar callback = _.first( sortedArray );\n\t\t\t/*\n\t\t\t * Set our formContentData to the callback specified in the filter, passing our current formContentData.\n\t\t\t */\n\t\t\tformContentData = callback( formContentData );\n\t\t\t\n\t\t\tif ( 'publish' == action && formModel.get( 'show_publish_options' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'newForm' );\n\t\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\t\tjQuery( builderEl ).addClass( 'disable-main' );\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t// Get our form data\n\t\t\tvar formData = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\n\t\t\t// Turn our formData model into an object\n\t\t\tvar data = JSON.parse( JSON.stringify( formData ) );\n\t\t\tdata.settings.formContentData = formContentData;\n\n\t\t\t/**\n\t\t\t * Prepare fields for submission.\n\t\t\t */\n\t\t\t\n\t\t\t// Get the field IDs that we've deleted.\n\t\t\tvar removedIDs = formData.get( 'fields' ).removedIDs;\n\n\t\t\t/*\n\t\t\t * data.fields is an array of objects like:\n\t\t\t * field.label = blah\n\t\t\t * field.label_pos = blah\n\t\t\t * etc.\n\t\t\t *\n\t\t\t * And we need that format to be:\n\t\t\t * field.settings.label = blah\n\t\t\t * field.settings.label_pos = blah\n\t\t\t *\n\t\t\t * So, we loop through our fields and create a field.settings object.\n\t\t\t */\n\t\t\t_.each( data.fields, function( field ) {\n\t\t\t\tvar id = field.id;\n\t\t\t\t// We dont' want to update id or parent_id\n\t\t\t\tdelete field.id;\n\t\t\t\tdelete field.parent_id;\n\t\t\t\tvar settings = {};\n\t\t\t\t// Loop through all the attributes of our fields\n\t\t\t\tfor (var prop in field) {\n\t\t\t\t if ( field.hasOwnProperty( prop ) ) {\n\t\t\t\t \t// If our field property isn't null, then...\n if ( null !== field[ prop ] ) {\n // Set our settings.prop value.\n settings[prop] = field[prop];\n }\n // Delete the property from the field.\n delete field[ prop ];\n }\n\t\t\t\t}\n\n\t\t\t\tfor( var setting in settings ){\n\t\t\t\t\tif( null === settings[ setting ] ) {\n\t\t\t\t\t\tdelete settings[setting];\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Update our field object.\n\t\t\t\tfield.settings = settings;\n\t\t\t\tfield.id = id;\n\t\t\t} );\n\n\t\t\t// Set our deleted_fields object so that we can know which fields were removed.\n\t\t\tdata.deleted_fields = removedIDs;\n\n\t\t\t/**\n\t\t\t * Prepare actions for submission.\n\t\t\t */\n\t\t\t\n\t\t\t// Get the action IDs that we've deleted.\n\t\t\tvar removedIDs = formData.get( 'actions' ).removedIDs;\n\n\t\t\t/*\n\t\t\t * data.actions is an array of objects like:\n\t\t\t * action.label = blah\n\t\t\t * action.label_pos = blah\n\t\t\t * etc.\n\t\t\t *\n\t\t\t * And we need that format to be:\n\t\t\t * action.settings.label = blah\n\t\t\t * action.settings.label_pos = blah\n\t\t\t *\n\t\t\t * So, we loop through our actions and create a field.settings object.\n\t\t\t */\n\t\t\t_.each( data.actions, function( action ) {\n\t\t\t\tvar id = action.id;\n\t\t\t\t// We dont' want to update id or parent_id\n\t\t\t\tdelete action.id;\n\t\t\t\tdelete action.parent_id;\n\t\t\t\tvar settings = {};\n\t\t\t\t// Loop through all the attributes of our actions\n\t\t\t\tfor (var prop in action) {\n\t\t\t\t if ( action.hasOwnProperty( prop ) ) {\n\t\t\t\t \t//Removing null values\n\t\t\t\t\t if( null !== action[ prop ] ) {\n\t\t\t\t\t\t // Set our settings.prop value.\n\t\t\t\t\t\t settings[ prop ] = action[ prop ];\n\t\t\t\t\t }\n\t\t\t\t // Delete the property from the action.\n\t\t\t\t delete action[ prop ];\n\t\t\t\t }\n\t\t\t\t}\n\t\t\t\t// Update our action object.\n\t\t\t\taction.settings = settings;\n\t\t\t\taction.id = id;\n\t\t\t} );\n\n\t\t\tfor ( var setting in data.settings ) {\n\t\t\t\tif ( null === data.settings[ setting ] ) {\n\t\t\t\t\tdelete data.settings[ setting ];\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Set our deleted_actions object so that we can know which actions were removed.\n\t\t\tdata.deleted_actions = removedIDs;\n\n\t\t\t// Turn our object into a JSON string.\n\t\t\tdata = JSON.stringify( data );\n\n\t\t\t// Run anything that needs to happen before we update.\n\t\t\tnfRadio.channel( 'app' ).trigger( 'before:updateDB', data );\n\n\t\t\tif ( 'publish' == action ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'loading', true );\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'change:loading' );\t\n\n\t\t\t\t// If we're on mobile, show a notice that we're publishing\n\t\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\t\tnfRadio.channel( 'notices' ).request( 'add', 'publishing', 'Your Changes Are Being Published', { autoClose: false } );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( 'nf_save_form' === jsAction ) {\n\t\t\t\t// if the form string is long than this, chunk it\n\t\t\t\tvar chunk_size = 100000;\n\t\t\t\tvar data_chunks = [];\n\n\t\t\t\t// Let's chunk this\n\t\t\t\tif( chunk_size < data.length ) {\n\t\t\t\t\tdata_chunks = data.match(new RegExp('.{1,' + chunk_size + '}', 'g'));\n\t\t\t\t}\n\t\t\t\t// if we have chunks send them via the step processor\n\t\t\t\tif( 1 < data_chunks.length ) {\n\t\t\t\t\t// this function will make the ajax call for chunks\n\t\t\t\t\tthis.saveChunkedForm(\n\t\t\t\t\t\tdata_chunks,\n\t\t\t\t\t\t0,\n\t\t\t\t\t\t'nf_batch_process',\n\t\t\t\t\t\taction,\n\t\t\t\t\t\tformModel.get('id'),\n\t\t\t\t\t\ttrue\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\t// otherwise send it the regular way.\n\t\t\t\t\tvar context = this;\n\t\t\t\t\tvar responseData = null;\n\n\t\t\t\t\tjQuery.post( ajaxurl,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\taction: jsAction,\n\t\t\t\t\t\t\tform: data,\n\t\t\t\t\t\t\tsecurity: nfAdmin.ajaxNonce\n\t\t\t\t\t\t},\n\t\t\t\t\t\tfunction( response ) {\n\t\t\t\t\t\t\tresponseData = response;\n\t\t\t\t\t\t\tcontext.handleFinalResponse( responseData, action );\n\t\t\t\t\t\t}\n\t\t\t\t\t).fail( function( xhr, status, error ) {\n\t\t\t\t\t\tcontext.handleFinalFailure( xhr, status, error, action )\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t} else if ( 'nf_preview_update' === jsAction ) {\n\t\t\t\tvar context = this;\n\t\t\t\tvar responseData = null;\n\t\t\t\tjQuery.post( ajaxurl,\n\t\t\t\t\t{\n\t\t\t\t\t\taction: jsAction,\n\t\t\t\t\t\tform: data,\n\t\t\t\t\t\tsecurity: nfAdmin.ajaxNonce\n\t\t\t\t\t},\n\t\t\t\t\tfunction( response ) {\n\t\t\t\t\t\tresponseData = response;\n\t\t\t\t\t\tcontext.handleFinalResponse( responseData, action );\n\t\t\t\t\t}\n\t\t\t\t).fail( function( xhr, status, error ) {\n\t\t\t\t\tcontext.handleFinalFailure( xhr, status, error, action )\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Function to recursively send chunks until all chunks have been sent\n\t\t *\n\t\t * @param chunks\n\t\t * @param currentIndex\n\t\t * @param currentChunk\n\t\t * @param jsAction\n\t\t * @param action\n\t\t */\n\t\tsaveChunkedForm: function( chunks, currentChunk, jsAction, action, formId, new_publish ) {\n\t\t\tvar total_chunks = chunks.length;\n\t\t\tvar postObj = {\n\t\t\t\taction: jsAction,\n\t\t\t\tbatch_type: 'chunked_publish',\n\t\t\t\tdata: {\n\t\t\t\t\tnew_publish: new_publish,\n\t\t\t\t\tchunk_total: total_chunks,\n\t\t\t\t\tchunk_current: currentChunk,\n\t\t\t\t\tchunk: chunks[ currentChunk ],\n\t\t\t\t\tform_id: formId\n\t\t\t\t},\n\t\t\t\tsecurity: nfAdmin.batchNonce\n\t\t\t};\n\n\t\t\tvar that = this;\n\t\t\tjQuery.post( ajaxurl, postObj )\n\t\t\t\t.then( function ( response ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tvar res = JSON.parse(response);\n\t\t\t\t\t\tif ( 'success' === res.last_request && ! res.batch_complete) {\n\t\t\t\t\t\t\tconsole.log('Chunk ' + currentChunk + ' processed');\n\n\t\t\t\t\t\t\t// send the next chunk\n\t\t\t\t\t\t\tthat.saveChunkedForm(chunks, res.requesting, jsAction, action, formId, false);\n\t\t\t\t\t\t} else if ( res.batch_complete ) {\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * We need to respond with data to make the\n\t\t\t\t\t\t\t * publish button return to gray\n */\n\t\t\t\t\t\t\tthat.handleFinalResponse(response, action);\n\t\t\t\t\t\t}\n\t\t\t\t\t} catch ( exception ) {\n\t\t\t\t\t\tconsole.log( 'There was an error in parsing the' +\n\t\t\t\t\t\t\t' response');\n\t\t\t\t\t\tconsole.log( exception );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t).fail( function( xhr, status, error ) {\n\t\t\t\t\tconsole.log( 'There was an error sending form data' );\n\t\t\t\t\tconsole.log( error );\n\t\t\t\t\tthat.handleFinalFailure( xhr, status, error, action );\n\t\t\t\t});\n\t\t},\n\n\t\thandleFinalResponse: function( response, action ) {\n\t\t\ttry {\n\t\t\t\tresponse = JSON.parse( response );\n\t\t\t\tresponse.action = action;\n\n\t\t\t\t// Run anything that needs to happen after we update.\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'response:updateDB', response );\n\t\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) && 'preview' == action ) {\n\t\t\t\t\t// nfRadio.channel( 'notices' ).request( 'add', 'previewUpdate', 'Preview Updated'\t);\n\t\t\t\t}\n\t\t\t} catch( exception ) {\n\t\t\t\tconsole.log( 'Something went wrong!' );\n\t\t\t\tconsole.log( exception );\n\t\t\t}\n\t\t},\n\n\t\thandleFinalFailure: function( xhr, status, error, action ) {\n\t\t\t// For previews, only log to the console.\n\t\t\tif( 'preview' == action ) {\n\t\t\t\tconsole.log( error );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// @todo Convert alert to jBox Modal.\n\t\t\talert(xhr.status + ' ' + error + '\\r\\n' + 'An error on the server caused your form not to publish.\\r\\nPlease contact Ninja Forms Support with your PHP Error Logs.\\r\\nhttps://ninjaforms.com/contact');\n\t\t},\n\n\t\tdefaultSaveFilter: function( formContentData ) {\n\t\t\treturn formContentData.pluck( 'key' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Model that represents our form data.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/formModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tinitialize: function() {\n\t\t\tif ( ! jQuery.isNumeric( this.get( 'id' ) ) ) {\n\t\t\t\tthis.set( 'show_publish_options', true, { silent: true } );\n\t\t\t} else {\n\t\t\t\tthis.set( 'show_publish_options', false, { silent: true } );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Stores our form data and responds to requests for it.\n * Form data stores fields, actions, and settings.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/formData',['models/app/formModel'], function( formModel) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Instantiate Form Model\n\t\t\tthis.model = new formModel( { id: preloadedFormData.id } );\n\t\t\t// Set our field collection\n\t\t\tthis.model.set( 'fields', nfRadio.channel( 'fields' ).request( 'get:collection' ) );\n\t\t\t// Set our actions collection\n\t\t\tthis.model.set( 'actions', nfRadio.channel( 'actions' ).request( 'get:collection' ) );\n\t\t\t// Set our settings collection\n\t\t\tthis.model.set( 'settings', nfRadio.channel( 'settings' ).request( 'get:settings' ) );\n\t\t\t// Respond to requests for form data.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:formModel', this.getFormModel, this );\n\t\t},\n\n\t\t/**\n\t\t * Return form data model.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return backbone.model\n\t\t */\n\t\tgetFormModel: function() {\n\t\t\treturn this.model;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles changing our preview link when we change the 'clean' state of our app.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/previewLink',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for events that would change our preview link\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'before:sendChanges', this.disablePreview, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'response:sendChanges', this.enablePreview, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.changePreviewNicename, this );\n\t\t},\n\n\t\t/**\n\t\t * Disable our preview link before we send data to update our preview.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tdisablePreview: function() {\n\t\t\t// Get our preview domain\n\t\t\tvar appDomains = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar preview = appDomains.get( 'preview' );\n\t\t\t// Set disabled to true. This will trigger the preview link view to redraw.\n\t\t\tpreview.set( 'disabled', true );\n\t\t},\n\n\t\t/**\n\t\t * Change the preview link text from \"Preview Form\" to \"Preview Changes\" or vice-versa\n\t\t * \n\t\t * @since 3.0\n\t\t * @param boolean \tclean app data state\n\t\t * @return void\n\t\t */\n\t\tchangePreviewNicename: function( clean ) {\n\t\t\t// Get our preview domain\n\t\t\tvar appDomains = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar preview = appDomains.get( 'preview' );\n\n\t\t\t// If we have unsaved changes, set our text to 'changes' otherwise, set it to 'form'\n\t\t\tif ( ! clean ) {\n\t\t\t\tvar nicename = 'Preview Changes';\n\t\t\t} else {\n\t\t\t\tvar nicename = 'Preview Form';\n\t\t\t}\n\n\t\t\tpreview.set( 'nicename', nicename );\n\t\t},\n\n\t\t/**\n\t\t * Enable our preview button.\n\t\t * This is triggered when we get a response from our preview update.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tenablePreview: function() {\n\t\t\t// Get our preview domain\n\t\t\tvar appDomains = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar preview = appDomains.get( 'preview' );\n\t\t\t// Set disabled to false. This will trigger the preview link view to redraw.\n\t\t\tpreview.set( 'disabled', false );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for requests to change the current domain.\n *\n * The app menu and the main submenu both contain clickable links that change the current domain.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/menuButtons',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:publish', this.publish );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:viewChanges', this.viewChanges );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:publicLink', this.publicLink );\n\t\t},\n\n\t\tpublish: function() {\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db', 'publish' );\n\t\t},\n\n\t\tviewChanges: function() {\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'viewChanges', { collection: changeCollection } );\n\t\t},\n\n\t\tpublicLink: function() {\n\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'publicLink' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Model that represents our change data.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/changeModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tdisabled: false\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Holds all of our change models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/changeCollection',['models/app/changeModel'], function( domainModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: domainModel,\n\n\t\tcomparator: function( model ) {\n\t\t\tvar id = parseInt( model.cid.replace( 'c', '' ) );\n\t\t\treturn -id;\n\t\t}\n\t} );\n\treturn collection;\n} );\n/**\n * Track settings changes across our app.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/trackChanges',['models/app/changeCollection', 'models/app/changeModel'], function( changeCollection, ChangeModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.collection = new changeCollection();\n\t\t\t// Respond to any requests to add a change directly.\n\t\t\tnfRadio.channel( 'changes' ).reply( 'register:change', this.registerChange, this );\n\t\t\t// Respond to requests for the change collection\n\t\t\tnfRadio.channel( 'changes' ).reply( 'get:collection', this.getCollection, this );\n\t\t\t// Listen for changes in our clean state. If it goes to clean, clear our collection.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:clean', this.maybeResetCollection );\n\t\t},\n\n\t\tregisterChange: function( action, model, changes, label, data ) {\n\t\t\tvar data = typeof data !== 'undefined' ? data : {};\n\t\t\tif ( 'undefined' == typeof label.dashicon ) {\n\t\t\t\tlabel.dashicon = 'admin-generic';\n\t\t\t}\n\t\t\tvar changeModel = new ChangeModel({\n\t\t\t\taction: action,\n\t\t\t\tmodel: model,\n\t\t\t\tchanges: changes,\n\t\t\t\tlabel: label,\n\t\t\t\tdata: data\t\t\n\t\t\t} );\n\t\t\tthis.collection.add( changeModel );\n\n\t\t\t//loop through repeater fields to reset active state if needed\n\t\t\tnfRadio.channel( 'fields-repeater' ).trigger( 'clearEditActive', model );\n\t\t\t\n\t\t\treturn changeModel;\n\t\t},\n\n\t\tgetCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tmaybeResetCollection: function( clean ) {\n\t\t\tif ( clean ) {\n\t\t\t\tthis.collection.reset();\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\ndefine( 'controllers/app/undoChanges',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:undoChanges', this.undoChanges, this );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:undoSingle', this.undoSingle, this );\n\t\t},\n\n\t\tundoChanges: function() {\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tchangeCollection.sort();\n\t\t\tvar that = this;\n\t\t\t_.each( changeCollection.models, function( change ) {\n\t\t\t\tthat.undoSingle( change, true );\n\t\t\t} );\n\t\t\tchangeCollection.reset();\n\t\t\t// Update preview.\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\t\t\t\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', true );\n\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n this.dispatchClick();\n\t\t},\n\n\t\tundoSingle: function( change, undoAll ) {\n\t\t\tnfRadio.channel( 'changes' ).request( 'undo:' + change.get( 'action' ), change, undoAll );\n this.dispatchClick();\n\t\t},\n \n dispatchClick: function() {\n // If we already have a cookie, exit.\n if ( document.cookie.includes( 'nf_undo' ) ) return;\n // Otherwise, prepare our cookie.\n var cname = \"nf_undo\";\n var d = new Date();\n // Set expiration at 1 week.\n d.setTime( d.getTime() + ( 7*24*60*60*1000 ) );\n var expires = \"expires=\"+ d.toUTCString();\n // Bake the cookie.\n document.cookie = cname + \"=1;\" + expires + \";path=/\";\n var data = {\n action: 'nf_undo_click',\n security: nfAdmin.ajaxNonce\n }\n // Make our AJAX call.\n jQuery.post( ajaxurl, data );\n }\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens for our update:db response and replaces tmp ids with new ids if we were performing the publish action.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/publishResponse',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our app channel for the updateDB response.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'response:updateDB', this.publishResponse );\n\t\t},\n\n\t\tpublishResponse: function( response ) {\n\t\t\t// If we aren't performing a publish action, bail.\n\t\t\tif ( 'publish' !== response.action ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\t\n\t\t\t// Check to see if we have any new ids. \n\t\t\tif ( 'undefined' != typeof response.data.new_ids ) {\n\n\t\t\t\t// If we have any new fields, update their models with the new id.\n\t\t\t\tif ( 'undefined' != typeof response.data.new_ids.fields ) {\n\t\t\t\t\t_.each( response.data.new_ids.fields, function( newID, oldID ) {\n\t\t\t\t\t\tvar field = nfRadio.channel( 'fields' ).request( 'get:field', oldID );\n\t\t\t\t\t\tif ( field ) {\n\t\t\t\t\t\t\tfield.set( 'id', newID );\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tfield = nfRadio.channel( 'fields-repeater' ).request( 'get:childField', oldID, null, newID );\n\t\t\t\t\t\t\tfield.set( 'id', newID );\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// If we have any new actions, update their models with the new id.\n\t\t\t\tif ( 'undefined' != typeof response.data.new_ids.actions ) {\n\t\t\t\t\t_.each( response.data.new_ids.actions, function( newID, oldID ) {\n\t\t\t\t\t\tvar action = nfRadio.channel( 'actions' ).request( 'get:action', oldID );\n\t\t\t\t\t\tif ( action ) {\n\t\t\t\t\t\t\taction.set( 'id', newID );\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// If we have a new form id, update the model with the new id.\n\t\t\t\tif ( 'undefined' != typeof response.data.new_ids.forms ) {\n\t\t\t\t\t_.each( response.data.new_ids.forms, function( newID, oldID ) {\n\t\t\t\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t\t\t\tformModel.set( 'id', newID );\n\t\t\t\t\t\thistory.replaceState( '', '', 'admin.php?page=ninja-forms&form_id=' + newID );\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'loading', false );\n\t\t\tnfRadio.channel( 'app' ).trigger( 'change:loading' );\n\n\t\t\t// If we're on mobile, show a notice that we're publishing\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tnfRadio.channel( 'notices' ).request( 'close', 'publishing' );\n\t\t\t}\n\t\t\t// Add a notice that we've published.\n//\t\t\tnfRadio.channel( 'notices' ).request( 'add', 'published', 'Changes Published' );\n\t\t\tnfRadio.channel( 'app' ).trigger( 'app:published', response );\n\n\t\t\t// Mark our app as clean. This will disable the publish button and fire anything else that cares about the state.\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', true );\n\t\t}\n\t\t\n\t});\n\n\treturn controller;\n} );\n/**\n * Listens to our app channel for requests to change the current domain.\n *\n * The app menu and the main submenu both contain clickable links that change the current domain.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/changeDomain',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for both menu and submenu clicks.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:menu', this.changeAppDomain );\n\t\t\t// Reply to specific requests to change the domain\n\t\t\tnfRadio.channel( 'app' ).reply( 'change:currentDomain', this.changeAppDomain, this );\n\n\t\t\t// Reply to requests to prevent our drawer from closing\n\t\t\tnfRadio.channel( 'app' ).reply( 'prevent:changeDomain', this.preventChange, this );\n\t\t\t// Reply to requests to enable drawer closing\n\t\t\tnfRadio.channel( 'app' ).reply( 'enable:changeDomain', this.enableChange, this );\n\n\t\t\t/*\n\t\t\t * Object that holds our array of 'prevent change' values.\n\t\t\t * We use an array so that registered requests can unregister and not affect each other.\n\t\t\t */\n\t\t\tthis.objPreventChange = {};\n\t\t},\n\n\t\tchangeAppDomain: function( e, model ) {\n\t\t\t/*\n\t\t\t * If we have disabled movement between domains, return false.\n\t\t\t */\n\t\t\tif ( this.maybePreventChange() ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * If we are passed a model, use that model.\n\t\t\t * Otherwise, get the domain from the event target data.\n\t\t\t */ \n\t\t\tif ( 'undefined' == typeof model ) {\n\t\t\t\tvar domainID = jQuery( e.target ).data( 'domain' );\n\t\t\t\tvar model = nfRadio.channel( 'app' ).request( 'get:domainModel', domainID );\n\t\t\t}\n\t\t\t// If a drawer is open, close it.\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'get:currentDrawer' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t}\n\t\t\t/*\n\t\t\t * If we aren't dealing with an external url (such as preview), update our app data\n\t\t\t * and trigger a radio message saying we've changed the domain.\n\t\t\t */ \n\t\t\tif ( 0 == model.get( 'url' ).length ) {\n\t\t\t\tvar mainEl = nfRadio.channel( 'app' ).request( 'get:mainEl' );\n\t\t\t\tnfRadio.channel( 'app' ).request( 'update:currentDomain', model );\n\t\t\t\tjQuery( mainEl ).scrollTop( 0 );\t\t\t\t\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'change:currentDomain', model );\n\t\t\t}\n\t\t},\n\n\t\t/**\n * Check to see if anything has registered a key to prevent changing the domain.\n * \n * @since 3.0\n * @return boolean\n */\n maybePreventChange: function() {\n \tif ( 0 == Object.keys( this.objPreventChange ).length ) {\n \t\treturn false;\n \t} else {\n \t\treturn true;\n \t}\n },\n\n /**\n * Register a key to prevent changing the domain.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent change domain' setting.\n * @return void\n */\n preventChange: function( key ) {\n \tthis.objPreventChange[ key ] = true;\n },\n\n /**\n * Remove a previously registered key that is preventing our domain from changing.\n * \n * @since 3.0\n * @param string \tkey unique id for our 'prevent change domain' setting.\n * @return void\n */\n enableChange: function( key ) {\n \tdelete this.objPreventChange[ key ];\n },\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Modify the user's browser history when they click on a domain\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/pushstate',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.changePushState );\n\t\t},\n\n\t\tchangePushState: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\thistory.pushState( null, null, window.location.href + '&domain=' + currentDomain.get( 'id' ) );\n\t\t\tvar reExp = /domain=\\\\d+/;\n\t\t\tvar url = window.location.toString();\n\t\t\tvar newUrl = url.replace( reExp, '' );\n\t\t\tconsole.log( newUrl );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles our hotkey execution. Needs to be cleaned up and made more programmatic.\n * \n * Our hotkeys are defined by the domain that we're currently viewing. In each domain's model, there is a hotkey object.\n * \n * Currently too much hotkey data is hard-coded here.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/hotkeys',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// When we change our domain, change the hotkeys to those within that object.\n\t\t\tthis.listenTo( nfRadio.channel( 'main' ), 'render:main', this.changeHotkeys );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.changeHotkeys );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'render:settingGroup', this.changeHotkeys );\n\t\t\t// Currently, these are the functions that run when the new field or new action hotkey is pressed.\n\t\t\t// TODO: move these into a config module or into something more programmatic and scalable.\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'add:newField', this.addNewField );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'add:newAction', this.addNewAction );\n\t\t\t// Same as above, these functions need to be moved into a more modular/programmatic solution.\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'changeDomain:fields', this.changeDomainFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'changeDomain:actions', this.changeDomainActions );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'changeDomain:settings', this.changeDomainSettings );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'close:drawer', this.closeDrawer );\n\t\t},\n\n\t\tchangeHotkeys: function() {\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tjQuery( document ).off( '.nfDomainHotkeys' );\n\t\t\tjQuery( 'input' ).off( '.nfDomainHotkeys' );\n\t\t\tif ( currentDomain.get( 'hotkeys' ) ) {\n\t\t\t\tjQuery.each( currentDomain.get( 'hotkeys' ), function( hotkey, msg ) {\n\t\t\t\t\tjQuery( document ).on( 'keydown.nfDomainHotkeys', null, hotkey, function( e ) {\n\t\t\t\t\t\tnfRadio.channel( 'hotkeys' ).trigger( msg, e );\n\t\t\t\t\t} );\n\t\t\t\t\tjQuery( 'input' ).on( 'keydown.nfDomainHotkeys', null, hotkey, function( e ) {\n\t\t\t\t\t\tnfRadio.channel( 'hotkeys' ).trigger( msg, e );\n\t\t\t\t\t} );\n\t\t\t\t\tjQuery( 'textarea' ).on( 'keydown.nfDomainHotkeys', null, hotkey, function( e ) {\n\t\t\t\t\t\tnfRadio.channel( 'hotkeys' ).trigger( msg, e );\n\t\t\t\t\t} );\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\n\t\taddNewField: function() {\n\t\t\tif ( 'addField' != nfRadio.channel( 'app' ).request( 'get:currentDrawer' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'addField' );\n\t\t\t} else {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t}\n\t\t\t\n\t\t},\n\n\t\taddNewAction: function() {\n\t\t\tif ( 'addAction' != nfRadio.channel( 'app' ).request( 'get:currentDrawer' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'open:drawer', 'addAction' );\n\t\t\t} else {\n\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t}\n\t\t},\n\n\t\tchangeDomainFields: function() {\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar fieldsDomain = appDomainCollection.get( 'fields' );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:currentDomain', {}, fieldsDomain );\n\t\t},\n\n\t\tchangeDomainActions: function() {\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar actionsDomain = appDomainCollection.get( 'actions' );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:currentDomain', {}, actionsDomain );\n\t\t},\n\n\t\tchangeDomainSettings: function() {\n\t\t\tvar appDomainCollection = nfRadio.channel( 'app' ).request( 'get:domainCollection' );\n\t\t\tvar settingsDomain = appDomainCollection.get( 'settings' );\n\t\t\tnfRadio.channel( 'app' ).request( 'change:currentDomain', {}, settingsDomain );\n\t\t},\n\n\t\tcloseDrawer: function() {\n\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Change the clean state of our app when settings are changed.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/cleanState',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Set an array of field model attributes to ignore.\n\t\t\t * This list will be filtered just before we ignore anything.\n\t\t\t */ \n\t\t\tthis.ignoreAttributes = [\n\t\t\t\t'editActive'\n\t\t\t];\n\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'update:setting', this.setAppClean );\n\t\t},\n\n\t\tsetAppClean: function( model ) {\n\t\t\tfor( var attr in model.changedAttributes() ) {\n\t\t\t\tvar changedAttr = attr;\n\t\t\t\tvar after = model.changedAttributes()[ attr ];\n\t\t\t}\n\n\t\t\tvar ignoreAttributes = nfRadio.channel( 'undo-' + model.get( 'type' ) ).request( 'ignore:attributes', this.ignoreAttributes ) || this.ignoreAttributes;\n\t\t\t\n\t\t\tif ( -1 != this.ignoreAttributes.indexOf( attr ) ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\n\t\t\t//loop through repeater fields to reset active state if needed\n\t\t\tnfRadio.channel( 'fields-repeater' ).trigger( 'clearEditActive', model );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * All of the core undo functions. Listens on the 'changes' channel for an undo request.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/coreUndo',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:changeSetting', this.undoChangeSetting, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:addObject', this.undoAddObject, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:removeObject', this.undoRemoveObject, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:duplicateObject', this.undoDuplicateObject, this );\n\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:sortFields', this.undoSortFields, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:addListOption', this.undoAddListOption, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:removeListOption', this.undoRemoveListOption, this );\n\t\t\tnfRadio.channel( 'changes' ).reply( 'undo:sortListOptions', this.undoSortListOptions, this );\n\t\t},\n\n\t\t/**\n\t\t * Undo settings that have been changed.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoChangeSetting: function( change, undoAll ) {\n\t\t\tvar fieldModel = change.get( 'model' );\n\t\t\tvar changes = change.get( 'changes' );\n\t\t\tvar attr = changes.attr;\n\t\t\tvar before = changes.before;\n\t\t\tfieldModel.set( attr, before );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * Undo adding a field or an action.\n\t\t * Loops through our change collection and removes any change models based upon the one we're removing.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoAddObject: function( change, undoAll ) {\n\t\t\tvar objectModel = change.get( 'model' );\n\t\t\tvar collection = change.get( 'data' ).collection;\n\n\t\t\tif ( 'undefined' != typeof collection.newIDs ) {\n\t\t\t\tdelete collection.newIDs[ objectModel.get( 'id' ) ];\n\t\t\t}\n\t\t\t\t\t\t\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: objectModel } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tchangeCollection.remove( model );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\t\t\t\n\t\t\tcollection.remove( objectModel );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\t\t\n\n\t\t/**\n\t\t * Undo adding a field or an action.\n\t\t * Loops through our change collection and removes any change models based upon the one we're removing.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoDuplicateObject: function( change, undoAll ) {\n\t\t\tvar objectModel = change.get( 'model' );\n\t\t\tvar objectCollection = change.get( 'data' ).collection;\n\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: objectModel } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tchangeCollection.remove( model );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tobjectCollection.remove( objectModel );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * Undo removing a field or an action.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoRemoveObject: function( change, undoAll ) {\n\t\t\tvar dataModel = change.get( 'model' );\n\t\t\tvar collection = change.get( 'data' ).collection;\n\n\t\t\tnfRadio.channel( dataModel.get( 'objectDomain' ) ).request( 'add', dataModel );\n\n\t\t\tdelete collection.removedIDs[ dataModel.get( 'id' ) ];\n\t\t\t\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: dataModel } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tmodel.set( 'disabled', false );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\n\t\t\t// Trigger a reset on our field collection so that our view re-renders\n\t\t\tcollection.trigger( 'reset', collection );\n\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * Undo field sorting.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tundoAll are we in the middle of an undo all action?\n\t\t * @return void\n\t\t */\n\t\tundoSortFields: function( change, undoAll ) {\n\t\t\tvar data = change.get( 'data' );\n\t\t\tvar fields = data.fields;\n\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t_.each( fields, function( changeModel ) {\n\t\t\t\tvar before = changeModel.before;\n\t\t\t\tvar fieldModel = changeModel.model;\n\t\t\t\tfieldModel.set( 'order', before );\n\t\t\t\t// console.log( 'set ' + fieldModel.get( 'label' ) + ' to ' + before );\n\t\t\t} );\n\t\t\t// console.log( fieldCollection.where( { label: 'Name' } ) );\n\t\t\t// console.log( fieldCollection.where( { label: 'Email' } ) );\n\n\n\t\t\tfieldCollection.sort();\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\tundoAddListOption: function( change, undoAll ) {\n\t\t\tvar model = change.get( 'model' );\n\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: model } );\n\n\t\t\t\t_.each( results, function( changeModel ) {\n\t\t\t\t\tif ( changeModel !== change ) {\n\t\t\t\t\t\tchangeCollection.remove( changeModel );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\n\t\t\tmodel.collection.remove( model );\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\tundoRemoveListOption: function( change, undoAll ) {\n\t\t\tvar model = change.get( 'model' );\n\t\t\tvar collection = change.get( 'data' ).collection;\n\t\t\tcollection.add( model );\n\n\t\t\tif ( ! undoAll ) {\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tvar results = changeCollection.where( { model: model } );\n\n\t\t\t\t_.each( results, function( model ) {\n\t\t\t\t\tif ( model !== change ) {\n\t\t\t\t\t\tmodel.set( 'disabled', false );\n\t\t\t\t\t}\n\t\t\t\t} );\t\t\t\t\n\t\t\t}\n\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\tundoSortListOptions: function( change, undoAll ) {\n\t\t\tvar data = change.get( 'data' );\n\t\t\tvar collection = data.collection;\n\t\t\t\n\t\t\tvar objModels = data.objModels;\n\n\t\t\t_.each( objModels, function( changeModel ) {\n\t\t\t\tvar before = changeModel.before;\n\t\t\t\tvar optionModel = changeModel.model;\n\t\t\t\toptionModel.set( 'order', before );\n\t\t\t} );\t\t\t\t\n\n\n\t\t\tcollection.sort();\n\t\t\tthis.maybeRemoveChange( change, undoAll );\n\t\t},\n\n\t\t/**\n\t\t * If our undo action was requested to 'remove' the change from the collection, remove it.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tchange \tmodel of our change\n\t\t * @param boolean \t\t\tremove \tshould we remove this item from our change collection\n\t\t * @return void\n\t\t */\n\t\tmaybeRemoveChange: function( change, undoAll ) {\t\t\t\n\t\t\tvar undoAll = typeof undoAll !== 'undefined' ? undoAll : false;\n\t\t\tif ( ! undoAll ) {\n\t\t\t\t// Update preview.\n\t\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\t\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\t\tchangeCollection.remove( change );\n\t\t\t\tif ( 0 == changeCollection.length ) {\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', true );\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'close:drawer' );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns a clone of a backbone model with all the attributes looped through so that collections contained within are propely cloned.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/cloneModelDeep',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'clone:modelDeep', this.cloneModelDeep, this );\n\t\t},\n\n\t\tcloneModelDeep: function( model ) {\n\t\t\t// Temporary value used to store any new collections.\n\t\t\tvar replace = {};\n\t\t\t// Loop over every model attribute and if we find a collection, clone each model and instantiate a new collection.\n\t\t\t_.each( model.attributes, function( val, key ) {\n\t\t\t\tif( val instanceof Backbone.Collection ) { // Is this a backbone collection?\n\t\t\t\t\tvar clonedCollection = nfRadio.channel( 'app' ).request( 'clone:collectionDeep', val );\n\t\t\t\t\treplace[ key ] = clonedCollection;\n\t\t\t\t} else if ( val instanceof Backbone.Model ) { // Is this a backbone model?\n\t\t\t\t\treplace[ key ] = this.cloneModelDeep( val );\n\t\t\t\t}\n\t\t\t}, this );\n\n\t\t\t// Clone our original model\n\t\t\tvar newModel = model.clone();\n\t\t\t// Overwrite any collections we created above.\n\t\t\t_.each( replace, function( val, key ) {\n\t\t\t\tnewModel.set( key, val );\n\t\t\t} );\n\n\t\t\treturn newModel;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns the appropriate child view for our settings drawer.\n *\n * This enables settings types to register custom childviews for their settings.\n * The option-repeater setting for the list field is an example.\n * \n * @package Ninja Forms builder\n * @subpackage App - Edit Settings Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/getSettingChildView',['views/app/drawer/itemSetting'], function( itemSettingView ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for field settings child views.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n\t\t},\n\n\t\t/**\n\t\t * Return the appropriate child setting view.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param backbone.model\tmodel \tField setting\n\t\t * @return backbone.view\n\t\t */\n\t\tgetSettingChildView: function( model ) {\n\t\t\t// Get our setting type.\n\t\t\tvar type = model.get( 'type' );\n\t\t\t// Request a setting childview from our setting type channel. (Setting type, not field type)\n\t\t\tvar settingChildView = nfRadio.channel( type ).request( 'get:settingChildView', model ) || itemSettingView;\n\t\t\t\n\t\t\treturn settingChildView\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Updates our model when the user changes a setting.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/changeSettingDefault',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests to update settings.\n\t\t\tnfRadio.channel( 'app' ).reply( 'change:setting', this.changeSetting, this );\n\n\t\t\t// Listen on our app channel for the change setting event. Fired by the setting view.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'change:setting', this.changeSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * When we change our setting, update the model.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tsettingModel model that holds our field type settings info\n\t\t * @param backbone.model \tdataModel model that holds our field settings\n\t\t * @return void\n\t\t */\n\t\tchangeSetting: function( e, settingModel, dataModel, value ) {\n\t\t\tvar name = settingModel.get( 'name' );\n\t\t\tvar before = dataModel.get( name );\n\t\t\tvar value = value || null;\n\t\t\tif ( ! value ) {\n\t\t\t\t// Sends out a request on the fields-type (fields-text, fields-checkbox, etc) channel to see if that field type needs to return a special value for saving.\n\t\t\t\tvalue = nfRadio.channel( settingModel.get( 'type' ) ).request( 'before:updateSetting', e, dataModel, name, settingModel );\n\t\t\t}\n\n\t\t\tif( 'undefined' == typeof value ){\n\t\t\t value = jQuery( e.target ).val();\n }\n\t\t\t\n\t\t\t// Update our field model with the new setting value.\n\t\t\tdataModel.set( name, value, { settingModel: settingModel } );\n\t\t\tnfRadio.channel( 'setting-' + name ).trigger( 'after:updateSetting', dataModel, settingModel );\n\t\t\t// Register our setting change with our change tracker\n\t\t\tvar after = value;\n\t\t\t\n\t\t\tvar changes = {\n\t\t\t\tattr: name,\n\t\t\t\tbefore: before,\n\t\t\t\tafter: after\n\t\t\t}\n\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Changed ' + settingModel.get( 'label' ) + ' from ' + before + ' to ' + after\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'changeSetting', dataModel, changes, label );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\ndefine( 'views/app/drawer/typeSettingFieldset',['views/app/drawer/itemSetting'], function( itemSettingView ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-edit-setting-wrap',\n\t\tchildView: itemSettingView,\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.collection = this.model.get( 'settings' );\n\t\t\tthis.childViewOptions = { dataModel: data.dataModel };\n\t\t\tthis.dataModel = data.dataModel;\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\t// If we don't have a 'settings' property, this is a legacy depdency setup.\n\t\t\t\tif ( 'undefined' == typeof deps.settings ) {\n\t\t\t\t\tdeps.settings = [];\n\t\t\t\t\t_.each(deps, function(dep, name){\n\t\t\t\t\t\tif( 'settings' !== name ) {\n\t\t\t\t\t\t\tdeps.settings.push( { name: name, value: dep } );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tdeps.match = 'all';\n\t\t\t\t}\n\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.on( 'change:' + name, this.render, this );\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.model.on( 'rerender', this.render, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tname = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.off( 'change:' + name, this.render );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tonBeforeRender: function() {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'before:renderSetting', this.model, this.dataModel );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'before:renderSetting', this.model, this.dataModel, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\t \treturn {\n\t \t\trenderVisible: function() {\n\n\t\t\t\t\tif(!nfAdmin.devMode){\n\t\t\t\t\t\tif('help' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('classes' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\tif('input_limit_set' == this.name) return 'style=\"display:none;\"';\n\n\t\t\t\t\t\tif('checkbox' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('checkbox_values' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif('date' == that.dataModel.get('type')){\n\t\t\t\t\t\t\tif('year_range' == this.name) return 'style=\"display:none;\"';\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'check:deps', this, that );\n\t \t\t},\n\t \t\trenderSetting: function(){\n\t \t\t\tvar setting = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-' + this.type );\n\t\t\t\t\treturn setting( this );\n\t\t\t\t},\n\t\t\t\t\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = '';\n\t\t\t\t\tif ( 'undefined' != typeof this.width ) {\n\t\t\t\t\t\tclasses += this.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclasses += ' one-half';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\tclasses += ' nf-error';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderError: function() {\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\treturn this.error;\n\t\t\t\t\t}\n\t\t\t\t\treturn '';\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.nf-field-sub-settings' ).append( childView.el );\n\t\t}\n\t} );\n\n\treturn view;\n} );\n/**\n * Handles actions related to field settings that use a fieldset\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/fieldset',['views/app/drawer/typeSettingFieldset','models/app/settingCollection'], function( fieldsetView, settingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'fieldset' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n\t\t\t// When a list type field is initialized, create an option collection.\n\t\t\tthis.listenTo( nfRadio.channel( 'fieldset' ), 'init:settingModel', this.createSettingsCollection );\n\t\t},\n\n\t\tgetSettingChildView: function( model ) {\n\t\t\treturn fieldsetView;\n\t\t},\n\n\t\t/**\n\t\t * Instantiate settings collection when a fieldset type is initialized.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \tfield model being initialized\n\t\t * @return void\n\t\t */\n\t\tcreateSettingsCollection: function( model ) {\n\t\t\tmodel.set( 'settings', new settingCollection( model.get( 'settings' ) ) );\n\t\t},\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to our toggle field.\n * When we change the toggle, the setting value will be 'on' or ''.\n * We need to change this to 1 or 0.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/toggleSetting',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// We don't want the RTE setting to re-render when the value changes.\n\t\t\tnfRadio.channel( 'setting-type-toggle' ).reply( 'renderOnChange', function(){ return false } );\n\n\t\t\t// Respond to requests for field setting filtering.\n\t\t\tnfRadio.channel( 'toggle' ).reply( 'before:updateSetting', this.updateSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * Return either 1 or 0, depending upon the toggle position.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tfieldModel field model\n\t\t * @param string \t\t\tname setting name\n\t\t * @param backbone.model \tsettingTypeModel field type model\n\t\t * @return int 1 or 0\n\t\t */\n\t\tupdateSetting: function( e, fieldModel, name, settingTypeModel ) {\n\t\t\tif ( jQuery( e.target ).prop( 'checked' ) ) {\n\t\t\t\tvar value = 1;\n\t\t\t} else {\n\t\t\t\tvar value = 0;\n\t\t\t}\n\n\t\t\treturn value;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to our toggle field.\n * When we change the toggle, the setting value will be 'on' or ''.\n * We need to change this to 1 or 0.\n *\n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/buttonToggleSetting',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// We don't want the RTE setting to re-render when the value changes.\n\t\t\tnfRadio.channel( 'setting-type-button-toggle' ).reply( 'renderOnChange', function(){ return false; } );\n\n\t\t\t// Respond to requests for field setting filtering.\n\t\t\tnfRadio.channel( 'button-toggle' ).reply( 'before:updateSetting', this.updateSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * Return either 1 or 0, depending upon the toggle position.\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tfieldModel field model\n\t\t * @param string \t\t\tname setting name\n\t\t * @param backbone.model \tsettingTypeModel field type model\n\t\t * @return int 1 or 0\n\t\t */\n\t\tupdateSetting: function( e, fieldModel, name, settingTypeModel ) {\n\t\t\treturn e.target.value;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to number field settings.\n *\n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/numberSetting',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for field setting filtering.\n\t\t\tnfRadio.channel( 'number' ).reply( 'before:updateSetting', this.updateSetting, this );\n\t\t},\n\n\t\t/**\n\t\t * Resets value if user enters value below min value or above max value\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object \t\t\te event\n\t\t * @param backbone.model \tfieldModel field model\n\t\t * @param string \t\t\tname setting name\n\t\t * @param backbone.model \tsettingTypeModel field type model\n\t\t * @return int 1 or 0\n\t\t */\n\t\tupdateSetting: function( e, fieldModel, name, settingTypeModel ) {\n\t\t\tvar minVal = settingTypeModel.get( 'min_val' );\n\t\t\tvar maxVal = settingTypeModel.get( 'max_val' );\n\n\t\t\t/*\n\t\t\t * if we gave a min value set, revert to that if the user enters\n\t\t\t * a lower number\n\t\t\t*/\n\t\t\tif( 'undefined' != typeof minVal && null !== minVal ){\n\t\t\t\tif ( e.target.value < minVal ) {\n\t\t\t\t\tfieldModel.set('value', minVal);\n\t\t\t\t\te.target.value = minVal;\n\t\t\t\t}\n\t\t\t}\n\t\t\t/*\n\t\t\t * if we gave a max value set, revert to that if the user enters\n\t\t\t * a higher number\n\t\t\t*/\n\t\t\tif( 'undefined' != typeof maxVal && null !== maxVal ){\n\t\t\t\tif ( e.target.value > maxVal ) {\n\t\t\t\t\tfieldModel.set('value', maxVal);\n\t\t\t\t\te.target.value = maxVal;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn e.target.value;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n\ndefine( 'controllers/app/radioSetting',[], function() {\n var controller = Marionette.Object.extend({\n initialize: function () {\n // Respond to requests for field setting filtering.\n\n console.log( nfRadio.channel( 'radio' ) );\n nfRadio.channel('radio').reply( 'before:updateSetting', this.updateSetting, this);\n },\n\n\n updateSetting: function( e, fieldModel, name, settingTypeModel ) {\n console.log( 'test' );\n }\n });\n return controller;\n} );\n/**\n * Listens for clicks on our action item action buttons.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Main Sortable\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/itemControls',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\n\t\tdeleting: false, // block edit functionality while deleting field\n\n\t\tinitialize: function() {\n\t\t\t// Listen for clicks to edit, delete, duplicate actions.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:edit', this.clickEdit );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:delete', this.maybeDelete );\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:duplicate', this.clickDuplicate );\n\n\t\t\t// Listen for our drawer close and remove our active edit state\n\t\t},\n\n\t\t/**\n\t\t * Open a drawer with our action model for editing settings.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tclickEdit: function( e, model ) {\n\t\t\t// if we are deleting a field, we don't want to the edit drawer to open\n\t\t\tif( ! this.deleting ) {\n\t\t\t\tvar currentDomain = nfRadio.channel('app').request('get:currentDomain');\n\t\t\t\tvar currentDomainID = currentDomain.get('id');\n\t\t\t\tvar type = nfRadio.channel(currentDomainID).request('get:type', model.get('type'));\n\t\t\t\tnfRadio.channel('app').request('open:drawer', 'editSettings', {\n\t\t\t\t\tmodel: model,\n\t\t\t\t\tgroupCollection: type.get('settingGroups')\n\t\t\t\t});\n\t\t\t\t//loop through repeater fields to reset active state if needed\n\t\t\t\tnfRadio.channel( 'fields-repeater' ).trigger( 'clearEditActive', model );\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Let user know that all data will be lost before actually deleting\n\t\t *\n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tmaybeDelete: function( e, dataModel ) {\n\t\t\t// we set deleting to true, so the edit event doesn't open drawer\n\t\t\tthis.deleting = true;\n\t\t\tvar modelID = dataModel.get( 'id' );\n\t\t\tvar modelType = dataModel.get( 'objectType' );\n\n\t\t\t// Build a lookup table for fields that we don't save\n\t\t\tvar nonSaveFields = [ 'html', 'submit', 'hr',\n\t\t\t\t'recaptcha', 'spam', 'creditcard', 'creditcardcvc',\n\t\t\t\t'creditcardexpiration', 'creditcardfullname',\n\t\t\t\t'creditcardnumber', 'creditcardzip' ];\n\n\t\t\t/*\n\t\t\t* If this is a new field that hasn't been saved, then we don't\n\t\t\t * need to check for data\n\t\t\t */\n\t\t\tif( 'field' != modelType.toLowerCase() ) {\n\t\t\t\tthis.clickDelete( e, dataModel );\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t* If the field has been saved, then we need to check for\n\t\t\t\t * submission data for this field\n\t\t\t\t */\n\t\t\t\tif( 'tmp' === modelID.toString().substring( 0, 3 )\n\t\t\t\t\t|| -1 != jQuery.inArray( dataModel.get( 'type' ), nonSaveFields ) ) {\n\t\t\t\t\t// not a saved field so proceed as normal\n\t\t\t\t\tthis.clickDelete( e, dataModel );\n\t\t\t\t} else {\n\t\t\t\t\t// need the form id\n\t\t\t\t\tvar formModel = Backbone.Radio.channel('app').request('get:formModel');\n\t\t\t\t\tvar data = {\n\t\t\t\t\t\t'action': 'nf_maybe_delete_field',\n\t\t\t\t\t\t'security': nfAdmin.ajaxNonce,\n\t\t\t\t\t\t'formID': formModel.get('id'),\n\t\t\t\t\t\t'fieldKey': dataModel.get('key'),\n\t\t\t\t\t\t'fieldID': modelID\n\t\t\t\t\t};\n\t\t\t\t\tvar that = this;\n\n\t\t\t\t\t// make call to see if field has submission data\n\t\t\t\t\tjQuery.post(ajaxurl, data)\n\t\t\t\t\t\t.done(function (response) {\n\t\t\t\t\t\t\tvar res = JSON.parse(response);\n\n\t\t\t\t\t\t\tif (res.data.hasOwnProperty('errors')) {\n\t\t\t\t\t\t\t\tvar errors = res.data.errors;\n\t\t\t\t\t\t\t\tvar errorMsg = '';\n\n\t\t\t\t\t\t\t\tif (Array.isArray(errors)) {\n\t\t\t\t\t\t\t\t\terrors.forEach(function(error) {\n\t\t\t\t\t\t\t\t\t\terrors += error + \"\\n\";\n\t\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\terrors = errors;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconsole.log('Maybe Delete Field Errors: ', errors);\n\t\t\t\t\t\t\t\talert(errors);\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (res.data.field_has_data) {\n\t\t\t\t\t\t\t\t// if it does, show warning modal\n\t\t\t\t\t\t\t\tthat.doDeleteFieldModal(e, dataModel);\n\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t// if not, proceed like normal\n\t\t\t\t\t\t\t\tthat.clickDelete(e, dataModel);\n\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Create the field delete warning modal\n\t\t *\n\t\t * @param e\n\t\t * @param dataModel\n\t\t */\n\t\tdoDeleteFieldModal: function( e, dataModel ) {\n\t\t\t// Build warning modal to warn user a losing all data related to field\n var that = this;\n var modalData = {\n width: 400,\n closeOnClick: false,\n closeOnEsc: true,\n content: nfi18n.fieldDataDeleteMsg,\n btnPrimary: {\n text: nfi18n.delete,\n callback: function() {\n // close and destory modal.\n deleteModal.toggleModal( false );\n deleteModal.destroy();\n // proceed as normal, data will be deleted in backend on publish\n that.clickDelete( e, dataModel );\n }\n },\n btnSecondary: {\n text: nfi18n.cancel,\n callback: function() {\n // close and destory modal\n deleteModal.toggleModal( false );\n deleteModal.destroy();\n // set deleting to false so edit can work as normal\n that.deleting = false;\n }\n }\n };\n var deleteModal = new NinjaModal( modalData );\n\t\t},\n\n\t\t/**\n\t\t * Delete a action model from our collection\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tclickDelete: function( e, dataModel ) {\n\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', dataModel );\n\n\t\t\t// Add our action deletion to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Removed',\n\t\t\t\tdashicon: 'dismiss'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: dataModel.collection\n\t\t\t};\n\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tvar results = changeCollection.where( { model: dataModel } );\n\n\t\t\t_.each( results, function( changeModel ) {\n\t\t\t\tvar data = changeModel.get( 'data' );\n\t\t\t\tif ( 'undefined' != typeof data.fields ) {\n\t\t\t\t\t_.each( data.fields, function( field, index ) {\n\t\t\t\t\t\tif ( field.model == dataModel ) {\n\t\t\t\t\t\t\tdata.fields[ index ].model = newModel;\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tchangeModel.set( 'data', data );\n\t\t\t\tchangeModel.set( 'model', newModel );\n\t\t\t\tchangeModel.set( 'disabled', true );\n\t\t\t} );\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'removeObject', newModel, null, label, data );\n\t\t\t\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\t\t\tnfRadio.channel( currentDomainID ).request( 'delete', dataModel );\n\t\t\tthis.deleting = false;\n\t\t},\n\n\t\t/**\n\t\t * Duplicate a action within our collection, adding the word \"copy\" to the label.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te \tevent\n\t\t * @param backbone.model \tmodel \taction model\n\t\t * @return void\n\t\t */\n\t\tclickDuplicate: function( e, model ) {\n\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', model );\n\t\t\tvar currentDomain = nfRadio.channel( 'app' ).request( 'get:currentDomain' );\n\t\t\tvar currentDomainID = currentDomain.get( 'id' );\n\n\t\t\t// Change our label.\n\t\t\t// Make sure this update is silent to avoid triggering key change events down the waterfall.\n\t\t\tnewModel.set( 'label', newModel.get( 'label' ) + ' Copy', {silent: true} );\n\t\t\t// Update our ID to the new tmp id.\n\t\t\tvar tmpID = nfRadio.channel( currentDomainID ).request( 'get:tmpID' );\n\t\t\tnewModel.set( 'id', tmpID );\n\t\t\t// Add new model.\n\t\t\t// Params are: model, silent, renderTrigger, action\n\t\t\tnfRadio.channel( currentDomainID ).request( 'add', newModel, false, false, 'duplicate' );\n\t\t\t\n\t\t\t// Add our action addition to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: model.get( 'objectType' ),\n\t\t\t\tlabel: model.get( 'label' ),\n\t\t\t\tchange: 'Duplicated',\n\t\t\t\tdashicon: 'admin-page'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: nfRadio.channel( currentDomainID ).request( 'get:collection' )\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'duplicateObject', newModel, null, label, data );\n\t\t\t\n\t\t\tmodel.trigger( 'change:label', model );\n\n\t\t\t// Update preview.\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Config file for our merge tags.\n *\n * this.collection represents all of our registered merge tags.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/mergeTags',[\n\t'models/app/mergeTagCollection'\n\t], function(\n\tmergeTagCollection\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.tagSectionCollection = new mergeTagCollection();\n\t\t\tvar that = this;\n\t\t\t_.each( mergeTags, function( tagSection ) {\n\t\t\t\tif ( tagSection.tags ) {\n\t\t\t\t\tvar tags = new mergeTagCollection( tagSection.tags );\n\t\t\t\t} else {\n\t\t\t\t\tvar tags = '';\n\t\t\t\t}\n\n\t\t\t\tthat.tagSectionCollection.add( {\n\t\t\t\t\tid: tagSection.id,\n\t\t\t\t\tlabel: tagSection.label,\n\t\t\t\t\ttags: tags,\n\t\t\t\t\tdefault_group: tagSection.default_group\n\t\t\t\t} );\n\t\t\t} );\n\n\t\t\tvar fieldTags = this.tagSectionCollection.get( 'fields').get( 'tags' );\n\n\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t_.each( fieldCollection.models, function( field ) {\n\t\t\t\t// TODO: Make this dynamic\n\t\t\t\tif ( 'submit' !== field.get( 'type' ) ) {\n\t\t\t\t\tfieldTags.add( {\n\t\t\t\t\t\tid: field.get( 'id' ),\n\t\t\t\t\t\tlabel: field.get( 'label' ),\n\t\t\t\t\t\ttag: that.getFieldKeyFormat( field.get( 'key' ) )\n\t\t\t\t\t} );\t\t\t\t\t\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tvar calcTags = new mergeTagCollection();\n\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\tvar calcCollection = formModel.get( 'settings' ).get( 'calculations' );\n\t\t\t_.each( calcCollection.models, function( calcModel ) {\n\t\t\t\tcalcTags.add( {\n\t\t\t\t\tlabel: calcModel.get( 'name' ),\n\t\t\t\t\ttag: '{calc:' + calcModel.get( 'name' ) + '}'\n\t\t\t\t} );\n\t\t\t} );\n\n\t\t\tthis.tagSectionCollection.get( 'calcs' ).set( 'tags', calcTags );\n\n\t\t\tthis.currentElement = {};\n\t\t\tthis.settingModel = {};\n\t\t\tthis.open = false;\n\n\t\t\t// Unhook jBox Merge Tag stuff.\n\t\t\t// nfRadio.channel( 'mergeTags' ).reply( 'init', this.initMergeTags, this );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'mergeTags' ), 'click:mergeTag', this.clickMergeTag );\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'add:field', this.addFieldTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'delete:field', this.deleteFieldTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater-calculations' ), 'update:option', this.updateCalcTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater-calculations' ), 'remove:option', this.updateCalcTags );\n\n\t\t\t\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'update:currentElement', this.updateCurrentElement, this );\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'update:currentSetting', this.updateCurrentSetting, this );\n\n\t\t\t// Listen for requests for our mergeTag collection.\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'get:collection', this.getCollection, this );\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'get:mergeTag', this.getSectionModel, this );\n\n\t\t\t// When a field's ID is changed (ie from a tmpID), update the merge tag.\n this.listenTo( nfRadio.channel( 'fieldSetting-id' ), 'update:setting', this.updateID );\n\n\t\t\t// When we edit a key, check for places that key might be used.\n\t\t\tthis.listenTo( nfRadio.channel( 'fieldSetting-key' ), 'update:setting', this.updateKey );\n\n\t\t\t// Reply to requests to check a data model for a field key when one is updated.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'replace:fieldKey', this.replaceFieldKey );\n\n\t\t\t// Reply to requests to check a data model for a field key when one is updated.\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:fieldKeyFormat', this.getFieldKeyFormat, this );\n\n\t\t\t/*\n\t\t\t * TODO: Hotkey support for adding tags.\n\t\t\t *\n\t\t\t\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'open:mergeTags', this.openMergeTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'up:mergeTags', this.upMergeTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'down:mergeTags', this.downMergeTags );\n\t\t\tthis.listenTo( nfRadio.channel( 'hotkeys' ), 'return:mergeTags', this.returnMergeTags );\n\t\t\tnfRadio.channel( 'mergeTags' ).reply( 'update:open', this.updateOpen, this );\n\t\t\t*/\n\t\t},\n\n\t\t/**\n\t\t * Init merge tags within the passed view.\n\t\t * @since 3.0\n\t\t * @param backbone.view view to be searched for merge tags.\n\t\t * @return void\n\t\t */\n\t\tinitMergeTags: function( view ) {\n\t\t\tvar mergeTagsView = nfRadio.channel( 'mergeTags' ).request( 'get:view' );\n\t\t\tvar that = this;\n\t\t\t/*\n\t\t\t * Apply merge tags jQuery plugin.\n\t\t\t *\n\t\t\t * Prevent jBox from being called multiple times on the same element\n\t\t\t */\n\t\t\tthis.jBoxes = {};\n\t\t\tvar that = this;\n\n\t\t\tjQuery( view.el ).find( '.merge-tags' ).each(function() {\n\t\t\t\tif ( 'undefined' == typeof jQuery( this ).data( 'jBox-id' ) ) {\n\t\t\t\t\tvar jBox = jQuery( this ).jBox( 'Tooltip', {\n\t\t\t\t\t\ttitle: 'Insert Merge Tag',\n\t\t\t\t\t\ttrigger: 'click',\n\t\t\t\t\t\tposition: {\n\t\t\t\t\t\t\tx: 'center',\n\t\t\t\t\t\t\ty: 'bottom'\n\t\t\t\t\t\t},\n\t\t\t\t\t\tcloseOnClick: 'body',\n\t\t\t\t\t\tcloseOnEsc: true,\n\t\t\t\t\t\ttheme: 'TooltipBorder',\n\t\t\t\t\t\tmaxHeight: 200,\n\n\t\t\t\t\t\tonOpen: function() {\n\t\t\t\t\t\t\tmergeTagsView.reRender( view.model );\n\t\t\t\t\t\t\tthis.setContent( jQuery( '.merge-tags-content' ) );\n\t\t\t\t\t\t\tvar currentElement = jQuery( this.target ).prev( '.setting' );\n\t\t\t\t\t\t\tif ( 0 == currentElement.length ) {\n\t\t\t\t\t\t\t\tcurrentElement = jQuery( view.el ).find( '.setting' );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\tthat.updateCurrentSetting( view.model );\n\t\t\t\t\t\t\tthat.updateCurrentElement( currentElement );\n\t\t\t\t\t\t\t// nfRadio.channel( 'drawer' ).request( 'prevent:close', 'merge-tags' );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonClose: function() {\n\t\t\t\t\t\t\t// nfRadio.channel( 'drawer' ).request( 'enable:close', 'merge-tags' );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\t\n\t\t\t\t\tjQuery( this ).data( 'jBox-id', jBox.id );\t\t\t\t\t\n\t\t\t\t}\n\t\t });\n\t\t},\n\n\t\tclickMergeTag: function( e, tagModel ) {\n\t\t\t/*\n\t\t\t * TODO: Make this more dynamic.\n\t\t\t * Currently, the RTE is the only section that modifies how merge tags work,\n\t\t\t * but another type of setting might need to do this in the future.\n\t\t\t */\n\n\t\t\tif( 'undefined' != typeof this.settingModel.get( 'settingModel' ) && 'calculations' == this.settingModel.get( 'settingModel' ).get( 'name' ) ) {\n\n\t\t\t\tconsole.log( tagModel );\n\n\t\t\t\tvar currentValue = jQuery( this.currentElement ).val();\n\t\t\t\tvar currentPos = jQuery( this.currentElement ).caret();\n\t\t\t\tvar newPos = currentPos + tagModel.get( 'tag' ).length;\n\n\t\t\t\tvar tag = ( 'undefined' != typeof tagModel.get( 'calcTag' ) ) ? tagModel.get( 'calcTag' ) : tagModel.get( 'tag' );\n\n\t\t\t\tcurrentValue = currentValue.substr( 0, currentPos ) + tag + currentValue.substr( currentPos );\n\t\t\t\tjQuery( this.currentElement ).val( currentValue ).caret( newPos ).trigger( 'change' );\n\t\t\t} else if( 'rte' == this.settingModel.get( 'type' ) ) {\n\t\t\t\tjQuery( this.currentElement ).summernote( 'insertText', tagModel.get( 'tag' ) );\n\t\t\t} else {\n\t\t\t\tvar currentValue = jQuery( this.currentElement ).val();\n\t\t\t\tvar currentPos = jQuery( this.currentElement ).caret();\n\t\t\t\tvar newPos = currentPos + tagModel.get( 'tag' ).length;\n\t\t\t\tcurrentValue = currentValue.substr( 0, currentPos ) + tagModel.get( 'tag' ) + currentValue.substr( currentPos );\n\t\t\t\tjQuery( this.currentElement ).val( currentValue ).caret( newPos ).trigger( 'change' );\n\t\t\t}\n\t\t},\n\n\t\taddFieldTags: function( fieldModel ) {\n\t\t\t// TODO: Make this dynamic\n\t\t\tif ( 'submit' !== fieldModel.get( 'type' ) ) {\n\t\t\t\tthis.tagSectionCollection.get( 'fields' ).get( 'tags' ).add( {\n\t\t\t\t\tid: fieldModel.get( 'id' ),\n\t\t\t\t\tlabel: fieldModel.get( 'label' ),\n\t\t\t\t\ttag: this.getFieldKeyFormat( fieldModel.get( 'key' ) ),\n\t\t\t\t\tcalcTag: this.getFieldKeyFormatCalc( fieldModel.get( 'key' ) )\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\n\t\tdeleteFieldTags: function( fieldModel ) {\n\t\t\tvar fieldID = fieldModel.get( 'id' );\n\t\t\tvar tagModel = this.tagSectionCollection.get( 'fields' ).get( 'tags' ).get( fieldID );\n\t\t\tthis.tagSectionCollection.get( 'fields' ).get( 'tags' ).remove( tagModel );\n\t\t},\n\n\t\tupdateCalcTags: function( optionModel ) {\n\t\t\tvar calcTags = new mergeTagCollection();\n\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\tvar calcCollection = formModel.get( 'settings' ).get( 'calculations' );\n\n\t\t\t_.each( calcCollection.models, function( calc ) {\n\t\t\t\tcalcTags.add( {\n\t\t\t\t\tlabel: calc.get( 'name' ),\n\t\t\t\t\ttag: '{calc:' + calc.get( 'name' ) + '}'\n\t\t\t\t} );\n\t\t\t} );\n\n\t\t\tthis.tagSectionCollection.get( 'calcs' ).set( 'tags', calcTags );\n\t\t},\n\n\t\topenMergeTags: function( e ) {\n\t\t\tif ( 'TEXTAREA' == jQuery( e.target )[0].tagName || 'INPUT' == jQuery( e.target )[0].tagName ) {\n\t\t\t\tjQuery( e.target ).parent().find( '.merge-tags' ).click();\n\t\t\t}\n\t\t},\n\n\t\treturnMergeTags: function( e ) {\n\t\t\tif ( this.open ) {\n\t\t\t\te.preventDefault();\n\t\t\t\tvar currentModel = this.fields.where( { 'active': true } )[0];\n\t\t\t\tif ( currentModel ) {\n\t\t\t\t\tthis.clickMergeTag( e, currentModel );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tupMergeTags: function( e ) {\n\t\t\tif ( this.open ) {\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.changeActiveTag( 'up' );\n\t\t\t}\n\t\t},\n\n\t\tdownMergeTags: function( e ) {\n\t\t\tif ( this.open ) {\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.changeActiveTag( 'down' );\n\t\t\t}\n\t\t},\n\n\t\tchangeActiveTag: function( dir ) {\n\t\t\tif ( 'down' == dir ) {\n\t\t\t\tvar inc = 1;\n\t\t\t} else {\n\t\t\t\tvar inc = -1\n\t\t\t}\n\t\t\t// First, check to see if a field is currently active.\n\t\t\tif( 0 < this.fields.where( { 'active': true } ).length ) {\n\t\t\t\tvar currentModel = this.fields.where( { 'active': true } )[0];\n\t\t\t\tvar currentIndex = this.fields.indexOf( currentModel );\n\t\t\t\tcurrentModel.set( 'active', false );\n\n\t\t\t\tvar nextModel = this.fields.models[ currentIndex + inc ];\n\t\t\t\tif ( nextModel ) {\n\t\t\t\t\tnextModel.set( 'active', true );\n\t\t\t\t} else {\n\n\t\t\t\t}\n\t\t\t\t\n\t\t\t} else if ( 0 < this.fields.where( { 'active': true } ) ) { // There aren't any active fields. Check for active system tags.\n\t\t\t\tconsole.log( 'system' );\n\t\t\t} else if ( 0 < this.userInfo.where( { 'active': true } ) ) { // No active user info LIs.\n\t\t\t\tconsole.log( 'userinfo' );\n\t\t\t} else { // No active LIs. We haven't made any active yet, or we've gotten to the bottom of the list.\n\t\t\t\t// Make sure that we have fields\n\t\t\t\tif ( 0 < this.fields.models.length ) {\n\t\t\t\t\t// Set our first field to active.\n\t\t\t\t\tthis.fields.models[0].set( 'active', true );\n\t\t\t\t} else {\n\t\t\t\t\t// Set our first system model to active.\n\t\t\t\t\tthis.system.models[0].set( 'active', true );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tupdateCurrentElement: function( element ) {\n\t\t\tthis.currentElement = element;\n\t\t},\n\n\t\tupdateCurrentSetting: function( settingModel ) {\n\t\t\tthis.settingModel = settingModel;\n\t\t},\n\n\t\tgetCollection: function() {\n\t\t\treturn this.tagSectionCollection;\n\t\t},\n\n\t\tgetSectionModel: function( id ) {\n\t\t\treturn this.tagSectionCollection.get( id );\n\t\t},\n\n\t\tupdateOpen: function( open ) {\n\t\t\tthis.open = open;\n\t\t\t_.each( this.tagSectionCollection.get( 'fields' ).models, function( model ) {\n\t\t\t\tmodel.set( 'active', false );\n\t\t\t} );\n\t\t},\n\n\t\t// When a field is published, update the merge tag with the newly assigned ID (as opposed to the tmpID).\n updateID: function( fieldModel ) {\n\n\t\t\t// Get the formatted merge tag for comparison.\n\t\t\tvar targetTag = this.getFieldKeyFormat( fieldModel.get( 'key' ) );\n\n\t\t\t// Search the field tags for the matching merge tag to be updated.\n\t\t\tvar oldTag = this.tagSectionCollection.get( 'fields' ).get( 'tags' ).find( function( fieldMergeTag ){\n return targetTag == fieldMergeTag.get( 'tag' );\n });\n\n\t\t\t// If no matching tag is found, return early.\n\t\t\tif( 'undefined' == typeof oldTag ) return;\n\n\t\t\t// Update the merge tag with the \"published\" field ID.\n\t\t\toldTag.set( 'id', fieldModel.get( 'id' ) );\n\t\t},\n\n\t\tupdateKey: function( fieldModel ) {\n\t\t\tvar newKey = fieldModel.get( 'key' );\n\t\t\tvar oldTag = this.tagSectionCollection.get( 'fields' ).get( 'tags' ).get( fieldModel.get( 'id' ) );\n\t\t\tif ( 'undefined' != typeof oldTag ) {\n\t\t\t\toldTag.set( 'tag', this.getFieldKeyFormat( newKey ) );\t\t\t\t\n\t\t\t}\n\n\t\t},\n\n\t\tgetFieldKeyFormat: function( key ) {\n\t\t\treturn '{field:' + key + '}';\n\t\t},\n\n\t\tgetFieldKeyFormatCalc: function( key ) {\n\t\t\treturn '{field:' + key + ':calc}';\n\t\t},\n\n\t\treplaceFieldKey: function( dataModel, keyModel, settingModel ) {\n var oldKey = this.getFieldKeyFormat( keyModel._previousAttributes[ 'key' ] );\n\t\t\tvar newKey = this.getFieldKeyFormat( keyModel.get( 'key' ) );\n\t\t\tvar settingName = settingModel.get( 'name' );\n\t\t\tvar oldVal = dataModel.get( settingName );\n if(settingName == 'calculations' && 'undefined' != typeof(dataModel.get('calculations'))) {\n var calcModel = dataModel.get( 'calculations' );\n calcModel.each( function( model ) {\n var oldCalcKey = oldKey.slice( 0, (oldKey.length - 1) ) + ':calc}';\n var newCalcKey = newKey.slice( 0, (newKey.length - 1 ) ) + ':calc}';\n oldVal = model.get( 'eq' );\n if ( 'string' == typeof( oldVal ) ) {\n var re = new RegExp( oldCalcKey, 'g' );\n var newVal = oldVal.replace( re, newCalcKey );\n re = new RegExp( oldKey, 'g' );\n // TODO: We won't need this second replace when we no longer\n // have to append :calc to merge tags.\n newVal = newVal.replace( re, newKey );\n model.set( 'eq', newVal );\n }\n } );\n return false;\n }\n\t\t\tif ( 'string' == typeof oldVal ) {\n\t\t\t\tvar re = new RegExp( oldKey, 'g' );\n\t\t\t\tnewVal = oldVal.replace( re, newKey );\n\t\t\t\tdataModel.set( settingName, newVal );\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/mergeTagLookupCollection',['models/app/mergeTagModel'], function( mergeTagModel ) {\n var collection = Backbone.Collection.extend( {\n model: mergeTagModel\n } );\n return collection;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTag',[], function() {\n var view = Marionette.ItemView.extend({\n tagName: 'li',\n template: '#tmpl-nf-merge-tag-box-tag',\n\n events: {\n \"click\": \"insertTag\"\n },\n\n insertTag: function() {\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', this.model.get( 'tag' ) );\n }\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagList',[ 'views/app/drawer/mergeTag' ], function( mergeTagView ) {\n var view = Marionette.CollectionView.extend({\n tagName: 'ul',\n childView: mergeTagView,\n calc: false,\n\n initialize: function() {\n nfRadio.channel( 'merge-tags' ).reply( 'update:taglist', this.sectionFilter, this );\n nfRadio.channel( 'merge-tags' ).reply( 'filtersearch', this.searchFilter, this );\n },\n\n filter: function( child, index, collection ){\n return 'fields' == child.get( 'section' );\n },\n\n sectionFilter: function( section, calc ){\n this.filter = function( child, index, collection ){\n return section == child.get( 'section' );\n }\n\n if ( calc ) {\n this.calc = true;\n }\n\n if ( this.calc ) {\n var fieldsToRemove = this.excludeFromCalcs();\n\n /**\n * Filters our merge tags.\n * Make sure that we're in the right section, and then check to see if the merge tag is in our remove tracker.\n */\n this.filter = function( child, index, collection ) {\n return section == child.get( 'section' ) && -1 == fieldsToRemove.indexOf( child.get( 'tag' ) );\n }\n }\n\n this.render();\n nfRadio.channel( 'merge-tags' ).trigger( 'after:filtersearch', section );\n },\n\n searchFilter: function( term ){\n if ( this.calc ) {\n var fieldsToRemove = this.excludeFromCalcs();\n }\n\n this.filter = function( child, index, collection ){\n var label = child.get( 'label' ).toLowerCase().indexOf( term.toLowerCase().replace( ':', '' ) ) >= 0;\n var tag = child.get( 'tag' ).toLowerCase().indexOf( term.toLowerCase() ) >= 0;\n // If we are in a calculation setting and this tag is in our remove tracker, early return false.\n if ( this.calc && -1 != fieldsToRemove.indexOf( child.get( 'tag' ) ) ) {\n return false;\n }\n return label || tag;\n }\n\n this.render();\n nfRadio.channel( 'merge-tags' ).trigger( 'after:filtersearch' );\n\n },\n\n /**\n * TODO: This is a wonky fix for removing Product and Quantity fields from calcuation merge tags.\n * Merge tags don't respect the \"exclude\" merge tag settings.\n * Ultimately, the fix might include updating merge tags to respect those settings.\n */\n excludeFromCalcs: function(){\n /**\n * Remove any unwanted fields if we are in a calculation.\n * Get a list of all fields, then filter out unwanted fields.\n */\n var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n // Stores the keys of unwanted fields.\n var fieldsToRemove = [];\n // Declare blacklisted field types.\n var blacklist = ['product', 'quantity', 'total', 'shipping', 'date'];\n // Remove them from the merge tag selection box.\n _.each( fieldCollection.models, function( model ) {\n if ( -1 != blacklist.indexOf( model.get('type') ) ) {\n fieldsToRemove.push( '{field:' + model.get( 'key' ) + '}' );\n }\n });\n return fieldsToRemove;\n }\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagGroup',[], function() {\n var view = Marionette.ItemView.extend({\n tagName: 'li',\n template: '#tmpl-nf-merge-tag-box-section',\n events: {\n \"click\": \"onClick\"\n },\n\n initialize: function () {\n this.listenTo( nfRadio.channel( 'merge-tags' ), 'after:filtersearch', this.updateActive );\n },\n\n onClick: function(){\n this.updateTags();\n },\n\n updateTags: function() {\n nfRadio.channel( 'merge-tags' ).request( 'update:taglist', this.model.get( 'id' ) );\n },\n\n updateActive: function( section ) {\n this.$el.removeClass( 'active' );\n\n if ( section == this.model.get( 'id' ) ) {\n this.$el.addClass( 'active' );\n }\n },\n\n setActive: function(){\n this.$el.addClass( 'active' );\n this.$el.siblings().removeClass( 'active' );\n },\n\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagGroupList',[ 'views/app/drawer/mergeTagGroup' ], function( mergeTagGroupView ) {\n var view = Marionette.CollectionView.extend({\n tagName: 'ul',\n childView: mergeTagGroupView,\n\n initialize: function(){\n this.listenTo( nfRadio.channel( 'merge-tags' ), 'open', this.render, this );\n },\n\n // TODO: Update filter when a new tag is added. ie Calculations.\n filter: function( child, index, collection ){\n return 0 < child.get( 'tags' ).length;\n },\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagFilter',[], function() {\n var view = Marionette.ItemView.extend({\n template: '#tmpl-nf-merge-tag-box-filter',\n events: {\n \"keyup input\": \"updateFilter\",\n },\n updateFilter: function( event ) {\n\n if( /* ENTER */ 13 == event.keyCode ){ // Copied from Keyup Callback.\n // Get top listed merge tag.\n var firstFilteredTag = jQuery( '#merge-tags-box .merge-tag-list ul li span' ).first().data( 'tag' );\n\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', firstFilteredTag );\n\n // COPIED FROM BELOW\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n return;\n }\n var value = this.$el.find( 'input' ).val();\n nfRadio.channel( 'merge-tags' ).request( 'filtersearch', value );\n }\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'views/app/drawer/mergeTagBox',[], function() {\n var view = Marionette.LayoutView.extend({\n el: '#merge-tags-box',\n template: \"#tmpl-nf-merge-tag-box\",\n\n regions: {\n filter: '.merge-tag-filter',\n sections: '.merge-tag-sections',\n tags: '.merge-tag-list'\n },\n });\n\n return view;\n} );\n/**\n * @package Ninja Forms builder\n * @subpackage Merge Tag Box\n * @copyright (c) 2017 WP Ninjas\n * @since 3.1\n */\n\ndefine( 'controllers/app/mergeTagBox',[\n 'models/app/mergeTagModel',\n 'models/app/mergeTagLookupCollection',\n 'views/app/drawer/mergeTag',\n 'views/app/drawer/mergeTagList',\n 'views/app/drawer/mergeTagGroup',\n 'views/app/drawer/mergeTagGroupList',\n 'views/app/drawer/mergeTagFilter',\n 'views/app/drawer/mergeTagBox'\n], function(\n MergeTagModel,\n MergeTagLookupCollection,\n MergeTagView,\n MergeTagListView,\n MergeTagGroupView,\n MergeTagGroupListView,\n MergeTagFilterView,\n MergeTagBoxLayout\n) {\n var controller = Marionette.Object.extend( {\n\n caret: 0, // Track the caret position of the current setting's input.\n old: '', // THe old merge tag that will be replaced.\n\n initialize: function(){\n\n this.listenTo( nfRadio.channel( 'drawer' ), 'render:settingGroup', function(){\n jQuery( '.merge-tags' ).off( 'click' );\n jQuery( '.merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n });\n\n this.listenTo( nfRadio.channel( 'app' ), 'after:appStart', this.afterAppStart );\n this.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n this.listenTo( nfRadio.channel( 'drawer' ), 'before:close', this.beforeDrawerClose );\n\n var that = this;\n nfRadio.channel( 'mergeTags' ).reply( 'set:caret', function( position ){\n that.caret = position;\n });\n nfRadio.channel( 'mergeTags' ).reply( 'get:caret', function(){\n return that.caret;\n });\n\n var that = this;\n nfRadio.channel( 'mergeTags' ).reply( 'set:old', function( value ){\n that.old = value;\n });\n nfRadio.channel( 'mergeTags' ).reply( 'get:old', function(){\n return that.old;\n });\n\n nfRadio.channel( 'mergeTags' ).reply( 'insert:tag', this.insertTag.bind( this ) );\n\n /** OPTION REPEATER */\n this.listenTo( nfRadio.channel( 'option-repeater' ), 'add:option', function( model ){\n var selector = '#' + model.cid + ' .has-merge-tags input.setting';\n jQuery( selector ).on( 'focus', function( event ){\n that.focusCallback( event, selector, 'option-repeater' );\n });\n jQuery( selector ).on( 'keyup', function( event ){\n that.keyupCallback( event, selector, 'option-repeater' );\n });\n jQuery( selector ).siblings( '.nf-list-options .merge-tags' ).off( 'click' );\n jQuery( selector ).siblings( '.nf-list-options .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', function(){\n jQuery( '.nf-list-options .merge-tags' ).off( 'click' );\n jQuery( '.nf-list-options .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n /* CALCULATIONS */\n this.listenTo( nfRadio.channel( 'setting-calculations-option' ), 'render:setting', this.renderSetting );\n // this.listenTo( nfRadio.channel( 'setting-calculations-option' ), 'render:setting', function( settingModel, dataModel, view ){\n // view.$el.find( '.merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n // } );\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', function(){\n jQuery( '.nf-list-options.calculations .merge-tags' ).off( 'click' );\n jQuery( '.nf-list-options.calculations .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n /* SUMMERNOTE */\n this.listenTo( nfRadio.channel( 'summernote' ), 'focus', function( e, selector ) {\n that.focusCallback( false, selector, 'rte' );\n } );\n this.listenTo( nfRadio.channel( 'summernote' ), 'keydown', function( e, selector ){\n jQuery( selector ).closest( '.nf-setting' ).find( '.setting' ).summernote( 'saveRange' );\n } );\n this.listenTo( nfRadio.channel( 'summernote' ), 'keyup', function( e, selector ){\n that.keyupCallback( e, selector, 'rte' );\n } );\n\n // When an RTE setting is shown, make sure merge tags are hooked up.\n this.listenTo( nfRadio.channel( 'setting-type-rte' ), 'render:setting', function(){\n jQuery( '.note-editor .merge-tags' ).off( 'click' );\n jQuery( '.note-editor .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', function(){\n jQuery( '.note-editor .merge-tags' ).off( 'click' );\n jQuery( '.note-editor .merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n } );\n\n jQuery( document ).on( 'keyup', function( event ){\n if( 27 == event.keyCode ){\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n // Copied from KeyupCallback.\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).blur();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n });\n\n /**\n * Listen to the Field Changes (add, delete, update) and update the Merge Tags.\n */\n this.listenTo( Backbone.Radio.channel( 'fields' ), 'add:field', this.afterAppStart );\n this.listenTo( Backbone.Radio.channel( 'fields' ), 'delete:field', this.afterAppStart );\n this.listenTo( Backbone.Radio.channel( 'fieldSetting-key' ), 'update:setting', this.afterAppStart );\n\n /** ... and Calc updates. */\n this.listenTo( Backbone.Radio.channel( 'calcs' ), 'update:calc', this.afterAppStart );\n\n this.listenTo( Backbone.Radio.channel( 'app' ), 'change:currentDomain', this.afterAppStart );\n },\n\n afterAppStart: function() {\n\n var currentDomain = Backbone.Radio.channel( 'app' ).request( 'get:currentDomain' );\n\n var mergeTagCollection = nfRadio.channel( 'mergeTags' ).request( 'get:collection' );\n var mergeTags = [];\n mergeTagCollection.each( function( section ){\n\n section.get( 'tags' ).each( function( tag ){\n\n if( 'fields' == currentDomain.get( 'id' ) && '{submission:sequence}' == tag.get( 'tag' ) ) return;\n\n mergeTags.push({\n label: tag.get( 'label' ),\n tag: tag.get( 'tag' ),\n section: section.get( 'id' )\n });\n });\n });\n var layout = new MergeTagBoxLayout();\n layout.render();\n var tagCollection = new MergeTagLookupCollection( mergeTags );\n var mergeTagListView = new MergeTagListView({\n collection: tagCollection\n });\n var mergeTagGroupListView = new MergeTagGroupListView({\n collection: mergeTagCollection\n });\n\n layout.getRegion('tags').show(mergeTagListView);\n layout.getRegion('sections').show(mergeTagGroupListView);\n layout.getRegion('filter').show(new MergeTagFilterView);\n },\n\n beforeRenderSetting: function( settingModel, dataModel ){\n if( 'undefined' == typeof settingModel.get( 'use_merge_tags' ) ) return;\n if( ! settingModel.get( 'use_merge_tags' ) ) return;\n var name = settingModel.get( 'name' );\n this.listenTo( nfRadio.channel( 'setting-' + name ), 'render:setting', this.renderSetting );\n },\n\n renderSetting: function( settingModel, dataModel, view ){\n\n view.$el.find( '.merge-tags' ).off( 'click' );\n view.$el.find( '.merge-tags' ).on( 'click', this.mergeTagsButtonClick );\n\n if( 0 == jQuery( '#merge-tags-box' ).length ) this.afterAppStart();\n\n // Track Scrolling.\n jQuery( '#nf-drawer' ).on( 'scroll', function(){\n // COPIED AND MODIFIED FROM FOCUS\n if( 0 == jQuery( '.merge-tag-focus' ).length ) return;\n\n var rteEditor = jQuery( '.merge-tag-focus' ).closest( '.nf-setting' ).find( '.note-editor' );\n if( 0 != rteEditor.length ){\n var posY = rteEditor.offset().top - jQuery(window).scrollTop();\n var height = rteEditor.outerHeight();\n } else {\n var posY = jQuery('.merge-tag-focus').offset().top - jQuery(window).scrollTop();\n var height = jQuery('.merge-tag-focus').outerHeight();\n }\n\n\t // Find out if merge tag box will go below bottom of the page.\n\t var tagBoxY = posY + height;\n\t var windowHeight = window.innerHeight;\n\t var tagBoxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n\n\t // If merge tag box will render below the bottom of the page,\n\t // change it to render above the field\n\n\t if ( ( tagBoxY + tagBoxHeight ) > windowHeight ) {\n tagBoxY = posY - tagBoxHeight;\n }\n\n if ( 0 > tagBoxY ) {\n tagBoxY = posY;\n }\n\n jQuery( '#merge-tags-box' ).css( 'top', tagBoxY );\n\n var boxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n jQuery( '#nf-drawer' ).css( 'padding-bottom', boxHeight + 'px' );\n\n var repeaterRow = jQuery( '.merge-tag-focus' ).closest( '.nf-list-options-tbody' );\n if( 0 != repeaterRow.length ){\n var left = repeaterRow.offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', left );\n } else {\n var posX = jQuery( '.merge-tag-focus' ).closest( '.nf-settings' ).offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', posX );\n jQuery( '#merge-tags-box' ).css( 'width', jQuery( '.merge-tag-focus' ).closest( '.nf-settings' ).width() );\n }\n });\n\n // On input focus, move the Merge Tag Box into position.\n jQuery( view.el ).find( '.setting' ).on( 'focus', this.focusCallback );\n\n // TODO: Maybe move to view events.\n // On input keyup, maybe show Merge Tag Box.\n jQuery( view.el ).find( '.setting' ).on( 'keyup', this.keyupCallback );\n },\n\n // TODO: Maybe move to view class.\n beforeDrawerClose: function(){\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n // jQuery( 'body' ).append( jQuery( '#merge-tags-box' ) );\n },\n\n insertTag: function( tag ) {\n\n var $input = jQuery( '.merge-tag-focus' );\n\n if( 0 != $input.closest( '.nf-setting' ).first().find( '.note-editable' ).length ){\n $input = $input.closest( '.nf-setting' ).first().find( '.note-editable' );\n }\n\n if( 1 < $input.length ){ $input = $input.first(); }\n\n if( $input.hasClass( 'note-editable' ) ){\n var str = $input.closest( '.nf-setting' ).find( '.setting' ).summernote( 'code' );\n } else {\n var str = $input.val();\n }\n\n var find = nfRadio.channel( 'mergeTags' ).request( 'get:old' );\n var replace = tag;\n var caretPos = nfRadio.channel( 'mergeTags' ).request( 'get:caret' );\n\n var patt = /{([a-zA-Z0-9]|:|_||-})*/g;\n\n // Loop through matches to find insert/replace index range.\n // Reference: http://codepen.io/kjohnson/pen/36c3a782644dfff40fe3c1f05f8739d9?editors=0012\n while (match = patt.exec(str)) {\n if (find != match[0]) continue; // This isn't the match you are looking for...\n var string = str.slice(0, match.index) + replace + str.slice(patt.lastIndex); // Fancy replace for the specifc match, using the index/position.\n\n if( $input.hasClass( 'note-editable' ) ){\n $input.closest( '.nf-setting' ).find( '.setting' ).summernote( 'code', string );\n\n // Reposition the caret. http://stackoverflow.com/a/6249440 TODO: Determine the appropriate childNode.\n var el = $input;\n var childNode = null; // Default to first childNode.\n _.each( el[0].childNodes, function( node, index ){\n if( childNode ) return;\n if( ! node.nodeValue && ! node.innerHTML ) return;\n if( node.nodeValue ) {\n var value = node.nodeValue;\n } else if( node.innerHTML ){\n var value = node.innerHTML;\n }\n\n if( -1 == value.indexOf(replace) ) return; // Replace not found in this node.\n\n value = value.replace( / /g, ' ' );\n var position = value.indexOf(replace) + find.length;\n\n /*\n * If no caretPos, determine based on the node. ie Merge Tag Button context.\n * Note: We can't just check for '{', because they could just be inserting the first tag.\n */\n if( -1 == caretPos ){\n caretPos = value.indexOf( replace ) + 1;\n }\n\n if (caretPos == position) childNode = el[0].childNodes[index];\n });\n if( ! childNode ) childNode = el[0].childNodes[0];\n var offset = caretPos - find.length + replace.length;\n var range = document.createRange();\n var sel = window.getSelection();\n if( 0 != childNode.childNodes.length ) {\n try{\n range.setStart(childNode.childNodes[0], offset); \n } catch( err ) {\n console.log( childNode );\n console.log( 'error' );\n }\n \n } else {\n try {\n range.setStart(childNode, offset);\n } catch( err ) {\n console.log( 'error' );\n }\n \n }\n range.collapse(true);\n sel.removeAllRanges();\n sel.addRange(range);\n\n\n } else {\n $input.val(string); // Update input value with parsed string.\n $input.change(); // Trigger a change event after inserting the merge tag so that it saves to the model.\n $input.caret(caretPos - find.length + replace.length); // Update Carept Position.\n }\n\n }\n\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n $input.removeClass( 'merge-tag-focus' );\n $input.closest( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n },\n\n mergeTagsButtonClick: function( e ){\n var $this = jQuery( this );\n\n if ($this.hasClass('open-media-manager')) {\n return;\n }\n\n if( $this.siblings().hasClass( 'merge-tag-focus' ) ){\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n return;\n }\n\n if( 0 !== $this.closest( '.nf-setting, .nf-table-row' ).find( '.note-tools' ).length ){\n var $inputSetting = $this.closest( '.note-editor' ).siblings( '.setting' ).first();\n $this.closest( '.nf-setting' ).find( '.setting' ).summernote( 'insertText', '{' );\n // Since we haven't determined the caretPos, set to -1 as a flag to determine later.\n nfRadio.channel('mergeTags').request( 'set:caret', -1 );\n } else {\n var $inputSetting = $this.siblings( '.setting' ).first();\n var text = $inputSetting.val() || '';\n $inputSetting.val( text + '{' ).change();\n nfRadio.channel('mergeTags').request('set:caret', text.length + 1 );\n }\n\n if( $this.parent().hasClass( 'note-tools' ) ){\n // $this.closest( '.nf-setting' ).find( '.setting' ).summernote( 'insertText', '{' );\n }\n\n nfRadio.channel('mergeTags').request('set:old', '{' );\n\n $inputSetting.addClass( 'merge-tag-focus' );\n\n // Disable browser autocomplete.\n var autocomplete = $this.attr( 'autocomplete' );\n $this.attr( 'autocomplete', 'off' );\n $this.data( 'autocomplete', autocomplete );\n\n var $overlayElement = $this.closest( '.nf-setting, .nf-table-row' );\n if( 0 != $overlayElement.find( '.note-editor' ).length ){\n $overlayElement.find('.note-editor' ).addClass('merge-tag-focus-overlay');\n } else {\n $overlayElement.addClass('merge-tag-focus-overlay');\n }\n\n /**\n * TODO: This is a wonky work around for removing Product and Quantity fields from calculation merge tags.\n * The merge tag system doesn't currently respect \"exclude\" merge tag settings.\n *\n * If 'eq' is the textarea next to the merge tag icon, then we're in a calculation setting.\n */\n if ( 'eq' == jQuery( e.target ).prev( 'textarea' ).data( 'id' ) ) {\n var calc = true;\n } else {\n var calc = false;\n }\n\n // Request that our merge tag box update its tag list, passing whether or not we're in a calculation setting.\n nfRadio.channel( 'merge-tags' ).request( 'update:taglist', 'fields', calc );\n \n jQuery( '#merge-tags-box' ).css( 'display', 'block' );\n nfRadio.channel( 'drawer' ).request( 'prevent:close' );\n\n jQuery( '.merge-tag-focus-overlay' ).off( 'click' );\n jQuery( '.merge-tag-focus-overlay' ).on( 'click', function( e ) {\n if ( jQuery( e.target ).hasClass( 'note-editor' ) ) {\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n } );\n\n setTimeout(function(){\n jQuery( '#merge-tags-box' ).find( '.merge-tag-filter' ).find( 'input' ).focus();\n }, 500 );\n },\n\n focusCallback: function( e, target, type ){\n\n var type = type || 'setting';\n var $this = ( 'undefined' == typeof target ) ? jQuery( this ) : jQuery( target );\n\n jQuery( '.merge-tag-focus' ).each(function(index, el){\n if( this == el ) return;\n el.removeClass( 'merge-tag-focus' );\n });\n\n if( 'rte' == type ) {\n var posY = $this.closest( '.nf-setting' ).find( '.note-editor' ).offset().top - jQuery(window).scrollTop();\n var height = $this.closest( '.nf-setting' ).find( '.note-editor' ).outerHeight();\n } else {\n var posY = $this.offset().top - jQuery(window).scrollTop();\n var height = $this.outerHeight();\n }\n\n // Find out if merge tag box will go below bottom of the page.\n\t var tagBoxY = posY + height;\n\t var windowHeight = window.innerHeight;\n\t var tagBoxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n\n\t // If merge tag box will render below the bottom of the page,\n // change it to render above the field\n\n\t if ( ( tagBoxY + tagBoxHeight ) > windowHeight ) {\n\t\t tagBoxY = posY - tagBoxHeight;\n\t }\n\n if ( 0 > tagBoxY ) {\n tagBoxY = posY;\n }\n\n jQuery( '#merge-tags-box' ).css( 'top', tagBoxY );\n\n var repeaterRow = $this.closest( '.nf-list-options-tbody' );\n if( 0 != repeaterRow.length ) {\n var left = repeaterRow.offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', left );\n } else if( 'rte' == type ) {\n var posX = $this.closest( '.nf-setting' ).find( '.note-editor' ).offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', posX );\n jQuery( '#merge-tags-box' ).css( 'width', $this.closest( '.nf-setting' ).find( '.note-editor' ).width() );\n }\n else\n {\n var posX = jQuery( this ).closest( '.nf-settings' ).offset().left - jQuery(window).scrollLeft();\n jQuery( '#merge-tags-box' ).css( 'left', posX );\n jQuery( '#merge-tags-box' ).css( 'width', $this.closest( '.nf-settings' ).width() );\n }\n\n var dataID = jQuery( this ).data( 'id' );\n if( dataID && 'eq' != dataID ) return;\n\n // var offset = jQuery( view.el ).find( '.setting' ).parent().outerHeight();\n // jQuery( view.el ).find( '.setting' ).parent().append( jQuery( '#merge-tags-box' ) );\n // jQuery( '#merge-tags-box' ).css( 'top', offset );\n },\n\n keyupCallback: function( event, target, type ){\n var type = type || 'setting';\n\n if( /* ENTER */ 13 == event.keyCode ){\n\n // Get top listed merge tag.\n var firstFilteredTag = jQuery( '#merge-tags-box .merge-tag-list ul li span' ).first().data( 'tag' );\n\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', firstFilteredTag );\n\n // COPIED FROM BELOW\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n\n return;\n }\n\n // Get the value.\n // var value = jQuery( summernote ).summernote( 'code' );\n // Update the value.\n // jQuery( summernote ).closest( '.nf-setting' ).find( '.note-editable' ).html( value );\n\n if( 'undefined' != typeof target ) {\n var $this = jQuery(target);\n } else {\n var $this = jQuery( this );\n }\n\n // TODO: Disable Browser Autocomplete\n // $this.attr()\n\n\n var dataID = jQuery( this ).data( 'id' );\n if( dataID && 'eq' == dataID ) return;\n\n // Store the current caret position.\n if( 'rte' == type ){\n var range = $this.summernote('createRange');\n if( range ) {\n var caretPos = range.so; // or .eo?\n } else {\n var caretPos = 0;\n }\n $this.closest( '.nf-setting' ).find( '.setting' ).summernote( 'saveRange' );\n } else {\n var caretPos = $this.caret();\n }\n nfRadio.channel( 'mergeTags' ).request( 'set:caret', caretPos );\n\n // Find merge tags.\n if( 'rte' == type ) {\n var mergetags = $this.summernote( 'code' ).match(new RegExp(/{([a-zA-Z0-9]|:|_|-|})*/g));\n } else {\n var mergetags = $this.val().match(new RegExp(/{([a-zA-Z0-9]|:|_|-|})*/g));\n }\n\n // Filter out closed merge tags.\n mergetags = _.filter(mergetags, function(mergetag) {\n return -1 == mergetag.indexOf( '}' ); // Filter out \"closed\" merge tags.\n });\n\n // If an open merge tag is found, show the Merge Tag Box, else hide.\n if( 0 !== mergetags.length ) {\n\n nfRadio.channel( 'mergeTags' ).request( 'set:old', mergetags[0] );\n \n jQuery('#merge-tags-box').css( 'display', 'block' );\n nfRadio.channel( 'drawer' ).request( 'prevent:close' );\n $this.addClass('merge-tag-focus');\n\n var boxHeight = jQuery( '#merge-tags-box' ).outerHeight();\n jQuery( '#nf-drawer' ).css( 'padding-bottom', boxHeight + 'px' );\n\n // Disable browser autocomplete.\n var autocomplete = $this.attr( 'autocomplete' );\n $this.attr( 'autocomplete', 'off' );\n $this.data( 'autocomplete', autocomplete );\n\n var $overlayElement = $this.closest( '.nf-setting, .nf-table-row' );\n if( 0 != $overlayElement.find( '.note-editor' ).length ){\n $overlayElement.find('.note-editor' ).addClass('merge-tag-focus-overlay');\n } else {\n $overlayElement.addClass('merge-tag-focus-overlay');\n }\n\n $overlayElement.off( 'click' );\n $overlayElement.on( 'click', function( event ){\n var elementClasses = jQuery( event.target ).attr( 'class' ) || [];\n if( -1 !== elementClasses.indexOf( 'merge-tag-focus-overlay' ) ){\n nfRadio.channel( 'mergeTags' ).request( 'insert:tag', '' );\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n });\n\n var value = mergetags[0].replace( '{', '' );\n } else {\n jQuery( '#merge-tags-box' ).css( 'display', 'none' );\n nfRadio.channel( 'drawer' ).request( 'enable:close' );\n jQuery( '#merge-tags-box' ).removeClass();\n jQuery( '.merge-tag-focus' ).removeClass( 'merge-tag-focus' );\n jQuery( '.merge-tag-focus-overlay' ).removeClass( 'merge-tag-focus-overlay' );\n }\n }\n\n } );\n\n return controller;\n} );\n\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * If we're about to render a setting model that's a select and has 'fields' as the 'fill' setting, add all our field models to its options.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/itemSettingFill',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for messages that are fired before a setting view is rendered.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'before:renderSetting', this.beforeRenderSetting );\n\t\t},\n\n\t\tbeforeRenderSetting: function( settingModel, dataModel ) {\n\t\t\tif ( 'fields' == settingModel.get( 'fill' ) ) {\n\t\t\t\t\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Modify the user's browser history when they click on a domain\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/confirmPublish',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:confirmPublish', this.confirmPublish );\n\t\t},\n\n\t\tconfirmPublish: function() {\n\t\t\tvar formModel = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\t\t\t// Check to see if we need to add a submit button.\n\t\t\tif ( 1 == formModel.get( 'settings' ).get( 'add_submit' ) ) {\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'add', { type: 'submit', label: 'Submit', order: 9999 } );\n\t\t\t}\n\t\t\tformModel.set( 'show_publish_options', false );\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db', 'publish' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to settings that utilise the Rich Text Editor\n *\n * @package Ninja Forms builder\n * @subpackage App - Settings Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/rte',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// We don't want the RTE setting to re-render when the value changes.\n\t\t\tnfRadio.channel( 'setting-type-rte' ).reply( 'renderOnChange', function(){ return false } );\n\n\t\t\tthis.listenTo( nfRadio.channel( 'rte' ), 'init:settingModel', this.initSettingModel );\n\n\t\t\t// When an RTE setting is shown, re-render RTE.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-type-rte' ), 'render:setting', this.renderSetting );\n\n\t\t\t// When an RTE setting view is destroyed, remove our RTE.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-type-rte' ), 'destroy:setting', this.destroySetting );\n\n\t\t\t// When an element within the RTE is clicked, check to see if we should insert a link.\n\t\t\tthis.listenTo( nfRadio.channel( 'setting-type-rte' ), 'click:extra', this.clickExtra );\n\n\t\t\t// Instantiates the variable that holds the media library frame.\n\t\t\tthis.meta_image_frame;\n\n\t\t\tjQuery.summernote.options.icons = {\n\t\t 'align': 'dashicons dashicons-editor-alignleft',\n\t\t 'alignCenter': 'dashicons dashicons-editor-aligncenter',\n\t\t 'alignJustify': 'dashicons dashicons-editor-justify',\n\t\t 'alignLeft': 'dashicons dashicons-editor-alignleft',\n\t\t 'alignRight': 'dashicons dashicons-editor-alignright',\n\t\t 'indent': 'dashicons dashicons-editor-indent',\n\t\t 'outdent': 'dashicons dashicons-editor-outdent',\n\t\t // 'arrowsAlt': 'dashicons fa-arrows-alt',\n\t\t 'bold': 'dashicons dashicons-editor-bold',\n\t\t 'caret': 'dashicons dashicons-arrow-down',\n\t\t // 'circle': 'dashicons fa-circle',\n\t\t 'close': 'dashicons dashicons-dismiss',\n\t\t 'code': 'dashicons dashicons-editor-code',\n\t\t 'eraser': 'dashicons dashicons-editor-removeformatting',\n\t\t // 'font': 'dashicons fa-font',\n\t\t // 'frame': 'dashicons fa-frame',\n\t\t 'italic': 'dashicons dashicons-editor-italic',\n\t\t 'link': 'dashicons dashicons-admin-links',\n\t\t 'unlink': 'dashicons dashicons-editor-unlink',\n\t\t 'magic': 'dashicons dashicons-editor-paragraph',\n\t\t // 'menuCheck': 'dashicons fa-check',\n\t\t 'minus': 'dashicons dashicons-minus',\n\t\t 'orderedlist': 'dashicons dashicons-editor-ol',\n\t\t // 'pencil': 'dashicons fa-pencil',\n\t\t // 'picture': 'dashicons fa-picture-o',\n\t\t // 'question': 'dashicons fa-question',\n\t\t 'redo': 'dashicons dashicons-redo',\n\t\t 'square': 'dashicons fa-square',\n\t\t // 'strikethrough': 'dashicons fa-strikethrough',\n\t\t // 'subscript': 'dashicons fa-subscript',\n\t\t // 'superscript': 'dashicons fa-superscript',\n\t\t 'table': 'dashicons dashicons-editor-table',\n\t\t // 'textHeight': 'dashicons fa-text-height',\n\t\t // 'trash': 'dashicons fa-trash',\n\t\t 'underline': 'dashicons dashicons-editor-underline',\n\t\t 'undo': 'dashicons dashicons-undo',\n\t\t 'unorderedlist': 'dashicons dashicons-editor-ul',\n\t\t // 'video': 'dashicons fa-youtube-play'\n\t\t }\n\n\t\t this.currentContext = {};\n\t\t},\n\n\t\tinitSettingModel: function( settingModel ) {\n\t\t\tsettingModel.set( 'hide_merge_tags', true );\n\t\t},\n\n\t\tinitRTE: function( settingModel, dataModel, settingView ) {\n\t\t\t/*\n\t\t\t * Custom Button for links\n\t\t\t */\n\t\t\tvar that = this;\n\t\t\t// var linkButton = this.linkButton();\n\t\t\tvar linkButton = function( context ) {\n\t\t\t\treturn that.linkButton( context );\n\t\t\t}\n\t\t\tvar mediaButton = function( context ) {\n\t\t\t\treturn that.mediaButton( context );\n\t\t\t}\n\t\t\tvar mergeTags = this.mergeTags();\n\n\t\t\tvar toolbar = [\n\t\t\t\t[ 'paragraphStyle', ['style'] ],\n\t\t\t\t[ 'fontStyle', [ 'bold', 'italic', 'underline','clear' ] ],\n\t\t\t\t[ 'lists', [ 'ul', 'ol' ] ],\n\t\t\t [ 'paragraph', [ 'paragraph' ] ],\n\t\t\t [ 'customGroup', [ 'linkButton', 'unlink' ] ],\n\t\t\t [ 'table', [ 'table' ] ],\n\t\t\t [ 'actions', [ 'undo', 'redo' ] ],\n\t\t\t [ 'tools', [ 'mediaButton', 'mergeTags', 'codeview' ] ]\n\t\t\t];\n\n\t\t\tjQuery( settingView.el ).find( 'div.setting' ).summernote( {\n\t\t\t\ttoolbar: toolbar,\n\t\t\t\tbuttons: {\n\t\t\t\t\tlinkButton: linkButton,\n\t\t\t\t\tmergeTags: mergeTags,\n\t\t\t\t\tmediaButton: mediaButton\n\t\t\t\t},\n\t\t\t\theight: 150, //set editable area's height\n\t\t\t\tcodemirror: { // codemirror options\n\t\t\t\t theme: 'monokai',\n\t\t\t\t lineNumbers: true,\n lineWrapping: true,\n\t\t\t\t callbacks: {\n\t\t\t\t \tonBlur: function( editor ) {\n\t\t\t\t \t\tvar value = editor.getValue();\n\t\t\t\t \t\tthat.updateDataModel( settingModel, dataModel, value );\n\t\t\t\t \t}\n\t\t\t\t }\n\t\t\t\t},\n\t\t\t\tprettifyHtml: true,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tonBlur: function( e, context ) {\n\t\t\t\t\t\tvar value = jQuery( this ).summernote( 'code' );\n\t\t\t\t\t\tthat.updateDataModel( settingModel, dataModel, value );\n nfRadio.channel( 'summernote' ).trigger( 'blur', settingModel, dataModel, value );\n\t\t\t\t\t},\n onFocus: function( e, context ) {\n nfRadio.channel( 'summernote' ).trigger( 'focus', e, this, context );\n },\n onKeydown: function( e, context ) {\n nfRadio.channel( 'summernote' ).trigger( 'keydown', e, this, context );\n },\n onKeyup: function( e, context ) {\n nfRadio.channel( 'summernote' ).trigger( 'keyup', e, this, context );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tupdateDataModel: function( settingModel, dataModel, value ) {\n\t\t\tvar name = settingModel.get( 'name' );\n\t\t\tvar before = dataModel.get( name );\n\t\t\tvar after = value;\n\n\t\t\tvar changes = {\n\t\t\t\tattr: name,\n\t\t\t\tbefore: before,\n\t\t\t\tafter: after\n\t\t\t}\n\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Changed ' + settingModel.get( 'label' ) + ' from ' + before + ' to ' + after\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'changeSetting', dataModel, changes, label );\n\n\t\t\tdataModel.set( settingModel.get( 'name' ), after );\n\t\t},\n\n\t\trenderSetting: function( settingModel, dataModel, settingView ) {\n\t\t\tthis.initRTE( settingModel, dataModel,settingView );\n\t\t\tvar linkMenu = jQuery( settingView.el ).find( '.link-button' ).next( '.dropdown-menu' ).find( 'button' );\n\t\t\tlinkMenu.replaceWith(function () {\n\t\t\t return jQuery( '<div/>', {\n\t\t\t class: jQuery( linkMenu ).attr( 'class' ),\n\t\t\t html: this.innerHTML\n\t\t\t } );\n\t\t\t} );\n\t\t},\n\n\t\tdestroySetting: function( settingModel, dataModel, settingView ) {\n\t\t\tthis.removeRTE( settingModel, dataModel, settingView );\n\t\t},\n\n\t\tremoveRTE: function( settingModel, dataModel, settingView ) {\n\t\t\tjQuery( settingView.el ).find( 'div.setting' ).summernote( 'destroy' );\n\t\t},\n\n\t\tdrawerOpened: function( settingModel, dataModel, settingView ) {\n\t\t\tthis.initRTE( settingModel, dataModel, settingView );\n\t\t},\n\n\t\tlinkButton: function( context ) {\n\t\t\tvar that = this;\n\t\t\tvar ui = jQuery.summernote.ui;\n\t\t\tvar linkButton = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-link-button' );\n\t\t\tvar linkDropdown = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-link-dropdown' );\n\t\t\treturn ui.buttonGroup([\n\t\t\t\tui.button({\n\t className: 'dropdown-toggle link-button',\n\t contents: linkButton({}),\n\t tooltip: 'Insert Link',\n\t click: function( e ) {\n\t \tthat.clickLinkButton( e, context );\n\t },\n\t data: {\n\t toggle: 'dropdown'\n\t }\n\t }),\n\t\t\t\tui.dropdown([\n\t ui.buttonGroup({\n\t children: [\n\t ui.button({\n\t contents: linkDropdown({}),\n\t tooltip: ''\n\t }),\n\t ]\n\t })\n\t ])\n\t\t\t]).render();\n\t\t},\n\n\t\tmergeTags: function( context ) {\n\t\t\tvar ui = jQuery.summernote.ui;\n\t\t\tvar mergeTagsButton = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-merge-tags-button' );\n\t\t\treturn ui.button({\n\t\t\t\tclassName: 'dropdown-toggle merge-tags',\n\t\t\t\tcontents: mergeTagsButton({}),\n\t\t\t\ttooltip: 'Merge Tags'\n\t\t\t}).render();\n\t\t},\n\n\t\tmediaButton: function( context ) {\n\t\t\tvar that = this;\n\t\t\tvar ui = jQuery.summernote.ui;\n\t\t\tvar mediaButton = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-rte-media-button' );\n\t\t\treturn ui.button({\n\t className: 'dropdown-toggle',\n\t contents: mediaButton({}),\n\t tooltip: 'Insert Media',\n\t click: function( e ) {\n\t \tthat.openMediaManager( e, context );\n\t }\n\t }).render();\n\t\t},\n\n\t\topenMediaManager: function( e, context ) {\n\t\t\tcontext.invoke( 'editor.createRange' );\n\t\t\tcontext.invoke( 'editor.saveRange' );\n\t\t\tthis.currentContext = context;\n\t\t\t\n\t\t\t// If the frame already exists, re-open it.\n\t\t\tif ( this.meta_image_frame ) {\n\t\t\t\tthis.meta_image_frame.open();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Sets up the media library frame\n\t\t\tthis.meta_image_frame = wp.media.frames.meta_image_frame = wp.media({\n\t\t\t\ttitle: 'Select a file',\n\t\t\t\tbutton: { text: 'insert' }\n\t\t\t});\n\n\t\t\tvar that = this;\n\n\t\t\t// Runs when an image is selected.\n\t\t\tthis.meta_image_frame.on('select', function(){\n\n\t\t\t\t// Grabs the attachment selection and creates a JSON representation of the model.\n\t\t\t\tvar media_attachment = that.meta_image_frame.state().get('selection').first().toJSON();\n\t\t\t\tthat.insertMedia( media_attachment, context );\n\t\t\t});\n\n\t\t\t// Opens the media library frame.\n\t\t\tthis.meta_image_frame.open();\n\t\t},\n\n\t\tclickLinkButton: function ( e, context ) {\n\t\t\tvar range = context.invoke( 'editor.createRange' );\n\t\t\tcontext.invoke( 'editor.saveRange' );\n\t\t\tvar text = range.toString()\n\t\t\tthis.currentContext = context;\n\n\t\t\tjQuery( e.target ).closest( '.note-customGroup > .note-btn-group' ).on ('hide.bs.dropdown', function ( e ) {\n\t\t\t\treturn false;\n\t\t\t});\n\n\t\t\tjQuery( e.target ).closest( '.note-customGroup > .note-btn-group' ).on ('shown.bs.dropdown', function ( e ) {\n\t\t\t\tjQuery( e.target ).parent().parent().find( '.link-text' ).val( text );\n\t\t\t\tjQuery( e.target ).parent().parent().find( '.link-url' ).focus();\n\t\t\t});\n\t\t},\n\n\t\tclickExtra: function( e, settingModel, dataModel, settingView ) {\n\t\t\tvar textEl = jQuery( e.target ).parent().find( '.link-text' );\n\t\t\tvar urlEl = jQuery( e.target ).parent().find( '.link-url' );\n\t\t\tvar isNewWindowEl = jQuery( e.target ).parent().find( '.link-new-window' );\n\t\t\tthis.currentContext.invoke( 'editor.restoreRange' );\n\t\t\tif ( jQuery( e.target ).hasClass( 'insert-link' ) ) {\n\t\t\t\tvar text = textEl.val();\n\t\t\t\tvar url = urlEl.val();\n\t\t\t\tvar isNewWindow = ( isNewWindowEl.prop( 'checked' ) ) ? true: false;\n\t\t\t\tif ( 0 != text.length && 0 != url.length ) {\n\t\t\t\t\tthis.currentContext.invoke( 'editor.createLink', { text:text, url: url, isNewWindow: isNewWindow } );\n\t\t\t\t}\n\t\t\t}\n\t\t\ttextEl.val( '' );\n\t\t\turlEl.val( '' );\n\t\t\tisNewWindowEl.prop( 'checked', false );\n\t\t\tjQuery( e.target ).closest( 'div.note-btn-group.open' ).removeClass( 'open' );\n\t\t},\n\n\t\tinsertMedia: function( media, context ) {\n\t\t\tthis.currentContext.invoke( 'editor.restoreRange' );\n\t\t\tif ( 'image' == media.type ) {\n\t\t\t\tthis.currentContext.invoke( 'editor.insertImage', media.url );\n\t\t\t} else {\n\t\t\t\tthis.currentContext.invoke( 'editor.createLink', {\n\t\t\t\t\ttext: media.title || media.filename,\n\t\t\t\t\turl: media.url\n\t\t\t\t} );\n\t\t\t}\n\n\t\t}\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/settingFieldSelect',[], function() {\n var controller = Marionette.Object.extend( {\n\n initialize: function() {\n\n // Bind field key listener to field-select setting type.\n this.listenTo( nfRadio.channel( 'field-select' ), 'init:settingModel', this.trackKeyChanges );\n\n // The first time settingModel and the dataModel meet.\n this.listenTo( nfRadio.channel( 'setting-type-field-select' ), 'before:renderSetting', this.beforeRender );\n\n // Add setting change listener only in drawers with a field-select setting.\n this.listenTo( nfRadio.channel( 'field-select' ), 'init:settingModel', function() {\n this.listenTo( nfRadio.channel( 'app' ), 'change:setting', this.maybeSwitchToFieldsDomain );\n });\n\n this.listenTo( nfRadio.channel( 'app' ), 'change:currentDomain', this.autoOpenDrawer );\n\n this.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.filterDrawerContents );\n this.listenTo( nfRadio.channel( 'drawer' ), 'closed', this.SwitchToFieldsDomain );\n },\n\n trackKeyChanges: function( settingModel ) {\n settingModel.listenTo( nfRadio.channel( 'app' ), 'update:fieldKey', settingModel.updateKey );\n\n // Update selected field if the selected field's key changes.\n this.listenTo( nfRadio.channel( 'app' ), 'replace:fieldKey', this.updateFieldMap );\n },\n\n updateFieldMap: function( dataModel, keyModel, settingModel ) {\n\n var oldKey = keyModel._previousAttributes[ 'key' ];\n var newKey = keyModel.get( 'key' );\n\n if( 'field-select' == settingModel.get( 'type' ) && dataModel.get( settingModel.get( 'name' ) ) == oldKey ) {\n\n dataModel.set( settingModel.get( 'name' ), newKey );\n }\n },\n\n beforeRender: function( settingModel, dataModel ) {\n\n var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n var fieldTypes = settingModel.get( 'field_types' );\n\n var options = [\n {\n label: '--',\n value: 0\n }\n ];\n _.each( fieldCollection.models, function( field ){\n\n if( dataModel.cid == field.cid ) return;\n\n if( 'undefined' != typeof fieldTypes && 0 != fieldTypes.length && ! _.contains( fieldTypes, field.get( 'type' ) ) ) return;\n\n var fieldFilter = settingModel.get( 'field_filter' );\n if( fieldFilter && 'undefined' != typeof fieldFilter[ field.get( 'type' ) ] ) {\n var bail = false;\n _.each( fieldFilter[ field.get( 'type' ) ], function( value, setting ){\n console.log( value + \":\" + field.get( setting ) );\n if( value != field.get( setting ) ) bail = true;\n } );\n if( bail ) return;\n }\n\n var value = field.get( 'key' );\n switch ( settingModel.get( 'field_value_format' ) ) {\n case 'key':\n value = field.get( 'key' );\n break;\n case 'merge_tag':\n default:\n value = '{field:' + field.get( 'key' ) + '}';\n }\n\n options.push({\n label: field.get( 'label' ),\n value: value\n });\n });\n\n if( 'undefined' != typeof fieldTypes && 0 != fieldTypes.length ) {\n _.each( fieldTypes, function( fieldType ){\n\n var fieldTypeModel = nfRadio.channel( 'fields' ).request( 'get:type', fieldType );\n\n options.push({\n label: '-- Add ' + fieldTypeModel.get( 'nicename' ) + ' Field',\n value: 'addField:' + fieldType,\n });\n } );\n }\n\n settingModel.set( 'options', options );\n },\n\n maybeSwitchToFieldsDomain: function( e, model, dataModel ) {\n\n if( 'field-select' != model.get( 'type' ) ) return;\n\n var name = model.get( 'name' );\n var value = dataModel.get( name );\n\n if( ! value ) return;\n\n var rubble = value.split( ':' );\n\n if( 'addField' != rubble[0] ) return;\n\n this.openDrawer = 'addField';\n this.filterDrawer = rubble[1];\n\n dataModel.set( name, '' );\n\n this.switchDomain = true;\n nfRadio.channel( 'app' ).request( 'close:drawer' );\n },\n\n SwitchToFieldsDomain: function() {\n if( this.switchDomain ) {\n var fieldDomainModel = nfRadio.channel( 'app' ).request( 'get:domainModel', 'fields' );\n nfRadio.channel('app').request('change:currentDomain', null, fieldDomainModel);\n this.switchDomain = null;\n }\n },\n\n autoOpenDrawer: function() {\n if( this.openDrawer ) {\n nfRadio.channel( 'app' ).request( 'open:drawer', this.openDrawer );\n this.openDrawer = null;\n }\n },\n\n filterDrawerContents: function() {\n if( this.filterDrawer ) {\n nfRadio.channel('drawer-addField').trigger('change:filter', this.filterDrawer);\n this.filterDrawer = null;\n }\n }\n });\n\n return controller;\n} );\n/**\n * The Field List setting is a container of settings (like the Fieldset setting), in which its children are instantiated.\n * Unlike the Fieldset setting, Field List settings are dynamically created based on the list of form fields.\n *\n * Note: Field references in the dynamic setting names are based on field keys, which may change.\n * Unlike regular field key tracking, a new setting needs to be created with the same value as the previous.\n *\n * @package Ninja Forms builder\n * @subpackage Action Settings\n * @copyright (c) 2016 WP Ninjas\n * @author Kyle B. Johnson\n * @since 3.0\n */\ndefine( 'controllers/app/settingFieldList',['views/app/drawer/typeSettingFieldset','models/app/settingCollection'], function( fieldsetView, settingCollection ) {\n return Marionette.Object.extend( {\n\n /**\n * A reference list of Field List setting models.\n */\n fieldListSettings: [],\n\n initialize: function() {\n this.listenTo( nfRadio.channel( 'field-list' ), 'init:settingModel', this.registerFieldListSettings );\n this.listenTo( nfRadio.channel( 'fields' ), 'update:setting', this.updateFieldListSettingKeys );\n nfRadio.channel( 'field-list' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n },\n\n /**\n * Build a reference list of Field List setting models for later reference.\n *\n * @param settingModel\n */\n registerFieldListSettings: function( settingModel ){\n this.fieldListSettings.push( settingModel.get( 'name' ) );\n },\n\n /**\n * Field List settings contain field keys in the setting names.\n * When a field key changes, so too must the Field List setting name.\n *\n * @param fieldModel\n */\n updateFieldListSettingKeys: function( fieldModel ){\n\n // We are only interested in field key changes.\n if( 'undefined' == typeof fieldModel.changed.key ) return;\n\n var oldKey = fieldModel._previousAttributes.key;\n var newKey = fieldModel.changed.key;\n\n /*\n * This is an absolute (functional) mess of nesting. I apologize to my future self, or Kenny.\n *\n * Each setting of each action model must be checked against each registered Field List setting.\n */\n var that = this;\n _.each( Backbone.Radio.channel( 'actions' ).request( 'get:collection' ).models, function( actionModel ) {\n _.each( actionModel.attributes, function( value, setting ) {\n var lastChanged = ''; // Used to avoid resetting the change with a duplicate call.\n _.each( that.fieldListSettings, function( prefix ) {\n if( setting != prefix + '-' + oldKey || lastChanged == oldKey ) return;\n var oldValue = actionModel.get( prefix + '-' + oldKey );\n actionModel.set( prefix + '-' + newKey, oldValue );\n actionModel.set( prefix + '-' + oldKey, 0 );\n lastChanged = oldKey;\n });\n });\n });\n },\n\n /**\n * Set the view for Field List sub-settings, just like the Fieldset setting.\n *\n * @param settingModel\n * @returns {*}\n */\n getSettingChildView: function( settingModel ) {\n\n /**\n * Dynamically build field-list settings as needed for the view.\n */\n\n // Filter fields based on the field_types setting property.\n var fields = _.filter( nfRadio.channel( 'fields' ).request( 'get:collection' ).models, function( field ) {\n return _.contains( settingModel.get( 'field_types' ), field.get( 'type' ) );\n });\n\n // Map fields into setting definitions.\n var settings = _.map( fields, function( field ) {\n return {\n name: settingModel.get( 'name' ) + '-' + field.get( 'key' ),\n type: 'toggle',\n label: field.get( 'label' ),\n width: 'full'\n };\n });\n\n settingModel.set( 'settings', new settingCollection( settings ) );\n\n // return the child view.\n return fieldsetView;\n },\n\n });\n} );\n\n/**\n * Listens to our app channel for settings views being rendered.\n *\n *\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/settingHTML',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n\n // The first time settingModel and the dataModel meet.\n this.listenTo( nfRadio.channel( 'setting-type-html' ), 'before:renderSetting', this.init );\n },\n\n init: function( settingModel, dataModel ) {\n\n if( 'undefined' == settingModel.get( 'mirror' ) ) return;\n\n // Listen to a setting change inside of the dataModel.\n dataModel.on( 'change:' + settingModel.get( 'mirror' ), this.update, settingModel );\n },\n\n update: function( dataModel, changedSettingValue ) {\n\n // Mirror the default value setting value.\n dataModel.set( this.get( 'name' ), changedSettingValue );\n }\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel for settings views being rendered.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/settingColor',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n // We don't want to re-render this setting type when the data changes.\n nfRadio.channel( 'setting-type-color' ).reply( 'renderOnChange', this.setRenderFalse );\n // We want to close any color pickers before we close our styling tab or drawer.\n this.listenTo( nfRadio.channel( 'setting-type-color' ), 'destroy:setting', this.closeColorPickers );\n\n // The first time settingModel and the dataModel meet.\n this.listenTo( nfRadio.channel( 'setting-type-color' ), 'render:setting', this.initColorPicker );\n },\n\n initColorPicker: function( settingModel, dataModel, view ) {\n\n var name = settingModel.get( 'name' );\n var el = jQuery( view.el ).find( 'input' );\n\n jQuery( el ).wpColorPicker( {\n change: function( event, ui ){\n nfRadio.channel( 'app' ).request( 'change:setting', event, settingModel, dataModel, ui.color.toString() );\n }\n } );\n },\n\n setRenderFalse: function() {\n return false;\n },\n\n closeColorPickers: function( settingModel, dataModel, view ) {\n jQuery( view.el ).find( '.wp-color-picker' ).wpColorPicker( 'close' );\n }\n });\n\n return controller;\n} );\n/**\n * Listens to our app channel for the app to start.\n *\n * If the form is a new form, then highlight the Add New submenu item.\n * Otherwise, append an Edit Form submenu for context.\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/changeMenu',[], function() {\n var controller = Marionette.Object.extend({\n\n editFormText: '',\n\n initialize: function () {\n this.editFormText = nfAdmin.editFormText || 'Edit Form';\n this.listenTo(nfRadio.channel('app'), 'after:appStart', this.changeMenu);\n this.listenTo( nfRadio.channel( 'app' ), 'response:updateDB', this.formPublish );\n },\n\n changeMenu: function () {\n var form = nfRadio.channel( 'app' ).request( 'get:formModel' );\n\n if ( this.isNewForm( form.id ) ) {\n this.highlightAddNew();\n } else {\n this.appendEditForm();\n }\n },\n\n isNewForm: function( form_id ) {\n return isNaN( form_id );\n },\n\n highlightAddNew: function() {\n jQuery( '.wp-submenu li' ).removeClass( 'current' );\n jQuery( 'a[href=\"admin.php?page=ninja-forms&form_id=new\"]' ).parent().addClass( 'current' );\n },\n\n /**\n * Append 'Edit Form'\n * When editing a form, add an 'Edit Form' submenu item to\n * the WordPress Admin Dashboard menu, specifically under\n * the Ninja Forms Menu Item and after the 'Add New' item.\n */\n appendEditForm: function() {\n // Singleton check. Only add this menu item one time.\n if ( jQuery( 'li a:contains(\"' + this.editFormText + '\")' ).length > 0 ) return;\n\n var editFormLinkText, editFormLink, editFormListItem;\n\n // Create the 'Edit Form' submenu item.\n editFormLinkText = document.createTextNode(this.editFormText);\n editFormLink = document.createElement(\"a\");\n editFormLink.appendChild(editFormLinkText);\n\n editFormListItem = document.createElement(\"li\");\n editFormListItem.appendChild(editFormLink);\n editFormListItem.classList.add(\"current\");\n\n // Remove the `current` class from any existing list items.\n jQuery( '.wp-submenu li' ).removeClass( 'current' );\n\n // Insert the 'Edit Form' item after the 'Add New' item;\n jQuery( 'a[href=\"admin.php?page=ninja-forms#new-form\"]' ).parent().after( editFormListItem );\n },\n\n formPublish: function( response ) {\n if ( 'publish' !== response.action ) return false;\n this.changeMenu();\n }\n });\n\n return controller;\n});\n\n/**\n * When we click on a domain link, close the mobile menu.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/mobile',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for clicks on our app menu.\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'click:menu', this.closeMobileMenu );\n\t\t},\n\n\t\tcloseMobileMenu: function() {\n\t\t\tvar builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );\n\t\t\tjQuery( builderEl ).removeClass( 'nf-menu-expand' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Add a jBox notice to the screen.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/notices',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'notices' ).reply( 'add', this.addNotice, this );\n\t\t\tnfRadio.channel( 'notices' ).reply( 'close', this.closeNotice, this );\n\t\t\tthis.notices = {};\n\t\t},\n\n\t\taddNotice: function( key, msg, options ) {\n\n\t\t\tvar appDefaults = {\n\t\t\t\tcontent: msg,\n\t\t\t\tcolor: 'green',\n\t\t\t\tzIndex:10000000,\n\t\t\t\tconstructOnInit: true,\n\t\t\t\tstack: true,\n\t\t\t\tanimation: {\n\t\t\t\t\topen: 'flip',\n\t\t\t\t\tclose: 'flip'\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tvar mobileDefaults = {\n\t\t\t\tposition: {\n\t\t\t\t\tx: 'center',\n\t\t\t\t\ty: 'top'\n\t\t\t\t},\n\t\t\t\tanimation: {\n\t\t\t\t\topen:'slide:top',\n\t\t\t\t\tclose:'slide:left'\n\t\t\t\t},\n\t\t\t\tautoClose: 2000,\n\t\t\t\toffset: {\n\t\t\t\t\tx: 0,\n\t\t\t\t\ty: 55\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tvar desktopDefaults = {\n\t\t\t\tattributes: {\n\t\t\t\t\tx: 'left',\n\t\t\t\t\ty: 'bottom'\n\t\t\t\t},\n\t\t\t\tautoClose: 4000\n\t\t\t};\n\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tvar defaults = mobileDefaults;\t\n\t\t\t} else {\n\t\t\t\tvar defaults = desktopDefaults;\n\t\t\t}\n\t\t\tdefaults = jQuery.extend( defaults, appDefaults );\n\n\t\t\tvar options = jQuery.extend( defaults, options );\n\t\t\t// console.log( options );\n\t\t\tthis.notices[ key ] = new jBox( 'Notice', options );\n\t\t},\n\n\t\tcloseNotice: function( key ) {\n\t\t\tif ( 'undefined' != typeof this.notices[ key ] ) {\n\t\t\t\tthis.notices[ key ].close();\n\t\t\t}\n\t\t},\n\n\t\topenNotice: function( key ) {\n\t\t\tif ( 'undefined' != typeof this.notices[ key ] ) {\n\t\t\t\tthis.notices[ key ].open();\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Prompt the user to save if they attempt to leave the page with unsaved changes.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/unloadCheck',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tjQuery( window ).bind( 'beforeunload', this.maybePrompt );\n\t\t},\n\n\t\tmaybePrompt: function( model ) {\n\t\t\t// If our app is clean, don't show a warning.\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'get:setting', 'clean' ) ) {\n\t\t\t\treturn 'You have unsaved changes.';\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Before we save data to the database (on preview update or publish), we check to see if we have anyone\n * that wants to update the 'formContent' form setting. This setting is used on the front-end to allow\n * for custom display of form fields. i.e. layout rows.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/formContentFilters',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Init our formContent view filter array.\n\t\t\t */\n\t\t\tthis.viewFilters = [];\n\t\t\tthis.saveFilters = [];\n\t\t\tthis.loadFilters = [];\n\n\t\t\t/*\n\t\t * Listen for requests to add formContent filters.\n\t\t\t */\n\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'add:viewFilter', this.addViewFilter, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'add:saveFilter', this.addSaveFilter, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'add:loadFilter', this.addLoadFilter, this );\n\n\t\t\t/*\n\t\t\t * Listen for requests to get our formContent filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'get:viewFilters', this.getViewFilters, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'get:saveFilters', this.getSaveFilters, this );\n\t\t\tnfRadio.channel( 'formContent' ).reply( 'get:loadFilters', this.getLoadFilters, this );\n\t\t\t\n\t\t\t/*\n\t\t\t * -- DEPRECATED RADIO REPLIES --\n\t\t\t * \n\t\t\t * The 'fieldContents' channel has been deprecated as of 3.0 (it was present in the RC) in favour of 'formContent'.\n\t\t\t * Listen for requests to add new fieldContent filters.\n\t\t\t * \n\t\t\t * TODO: These radio listeners on the 'fieldContents' channels are here for backwards compatibility and should be removed eventually.\n\t\t\t */\n\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'add:viewFilter', this.addViewFilter, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'add:saveFilter', this.addSaveFilter, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'add:loadFilter', this.addLoadFilter, this );\n\n\t\t\t/*\n\t\t\t * Listen for requests to get our fieldContent filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'get:viewFilters', this.getViewFilters, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'get:saveFilters', this.getSaveFilters, this );\n\t\t\tnfRadio.channel( 'fieldContents' ).reply( 'get:loadFilters', this.getLoadFilters, this );\n\t\t\n\t\t\t/*\n\t\t\t * -- END DEPRECATED --\n\t\t\t */\n\t\t},\n\n\t\taddViewFilter: function( callback, priority ) {\n\t\t\tthis.viewFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetViewFilters: function() {\n\t\t\treturn this.viewFilters;\n\t\t},\n\n\t\taddSaveFilter: function( callback, priority ) {\n\t\t\tthis.saveFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetSaveFilters: function() {\n\t\t\treturn this.saveFilters;\n\t\t},\n\n\t\taddLoadFilter: function( callback, priority ) {\n\t\t\tthis.loadFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetLoadFilters: function() {\n\t\t\treturn this.loadFilters;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles filters for our main content gutter views.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/formContentGutterFilters',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * Init our gutter view filter array.\n\t\t\t */\n\t\t\tthis.leftFilters = [];\n\t\t\tthis.rightFilters = [];\n\t\t\t/*\n\t\t * Listen for requests to add gutter filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'add:leftFilter', this.addLeftFilter, this );\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'add:rightFilter', this.addRightFilter, this );\n\n\t\t\t/*\n\t\t\t * Listen for requests to get our content gutter filters.\n\t\t\t */\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'get:leftFilters', this.getLeftFilters, this );\n\t\t\tnfRadio.channel( 'formContentGutters' ).reply( 'get:rightFilters', this.getRightFilters, this );\n\t\t},\n\n\t\taddLeftFilter: function( callback, priority ) {\n\t\t\tthis.leftFilters[ priority ] = callback;\n\t\t},\n\n\t\taddRightFilter: function( callback, priority ) {\n\t\t\tthis.rightFilters[ priority ] = callback;\n\t\t},\n\n\t\tgetLeftFilters: function() {\n\t\t\treturn this.leftFilters;\n\t\t},\n\n\t\tgetRightFilters: function() {\n\t\t\treturn this.rightFilters;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns a clone of a backbone collection with all the models' attributes looped through so that collections contained within are propely cloned.\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/cloneCollectionDeep',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tnfRadio.channel( 'app' ).reply( 'clone:collectionDeep', this.cloneCollectionDeep, this );\n\t\t},\n\n\t\tcloneCollectionDeep: function( collection ) {\n\t\t\tvar models = [];\n\t\t\t// Loop through every model in our collection, clone it, and add it to our model array\n\t\t\t_.each( collection.models, function( model ) {\n\t\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', model );\n\t\t\t\tmodels.push( newModel );\n\t\t\t} );\n\t\t\t// Create a new instance of our collection\n\t\t\treturn new collection.constructor( models, collection.options );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Tracks which keys have been pressed.\n * Currently only used by fields to see if they should duplicate or delete on click.\n * (Shift + D + click = delete) (Shift + C + click = duplicate)\n * \n * @package Ninja Forms builder\n * @subpackage Fields - Edit Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/trackKeyDown',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tkeys: [],\n\n\t\tinitialize: function() {\n\t\t\tvar that = this;\n\t\t\t/*\n\t\t\t * Track keydowns and store the keys pressed.\n\t\t\t */\n\t\t\t\n\t\t\tjQuery( document ).on( 'keydown', function( e ) {\n\t\t\t\tthat.keyDown( e, that );\n\t\t\t} );\n\n\t\t\tjQuery( document ).on( 'keyup', function( e ) {\n\t\t\t\tthat.keyUp( e, that );\n\t\t\t} );\n\n\t\t\t/*\n\t\t\t * Get the keys currently being pressed, if any\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:keydown', this.getKeyDown, this );\n\t\t},\n\n\t\tkeyDown: function( e, context ) {\n\t\t\t/*\n\t\t\t * Add our keycode to our keys array.\n\t\t\t */\n\t\t\tcontext.keys[ e.keyCode ] = e.keyCode;\n\t\t},\n\n\t\tkeyUp: function( e, context ) {\n\t\t\t/*\n\t\t\t * Remove our keycode from our keys array.\n\t\t\t */\n\t\t\tif ( -1 != context.keys.indexOf( e.keyCode ) ) {\n\t\t\t\tdelete context.keys[ e.keyCode ];\n\t\t\t}\n\t\t},\n\n\t\tgetKeyDown: function() {\n\t\t\treturn this.keys;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Initialize the perfectscroll jQuery plugin\n * \n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/perfectScroll',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tmovedPos: false,\n\n\t\tinitialize: function() {\n\t\t\t/*\n\t\t\t * When we init the main view, init our perfectscroll\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'main' ), 'show:main', this.initPerfectScroll );\n\n\t\t\t/*\n\t\t\t * When our drawer opens and closes, change the position of our scroll rail.\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'opened', this.moveRail );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'before:closeDrawer', this.resetRail );\n\t\t},\n\n\t\tinitPerfectScroll: function( view ) {\n\t\t\tif ( ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( view.el ).parent().perfectScrollbar( {\n\t\t\t\t\tsuppressScrollX: true\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tjQuery( 'head' ).append( '<style id=\"ps-scrollbar-css\" type=\"text/css\"></style>' );\n\t\t},\n\n\t\tmoveRail: function() {\n\t\t\tvar drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tvar movedPos = jQuery( drawerEl ).outerWidth();\n\n\t\t\tjQuery( '#ps-scrollbar-css' ).text( '.ps-scrollbar-moved { right: ' + movedPos + 'px !important; } ' );\n\t\t\tjQuery( '#nf-main .ps-scrollbar-y-rail' ).addClass( 'ps-scrollbar-moved ' );\n\t\t\t\n\t\t},\n\n\t\tresetRail: function() {\n\t\t\tjQuery( '.ps-scrollbar-y-rail' ).removeClass( 'ps-scrollbar-moved ' );\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Returns a new setting group collection.\n * Used to settings drawers for custom data models (i.e. not fields, actions, or advanced)\n * \n * @package Ninja Forms builder\n * @subpackage App - Edit Settings Drawer\n * @copyright (c) 2016 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/getNewSettingGroupCollection',[ 'models/app/settingGroupCollection' ], function( SettingGroupCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for a new setting group collection\n\t\t\tnfRadio.channel( 'app' ).reply( 'get:settingGroupCollectionDefinition', this.getNewSettingGroupCollection, this );\n\t\t},\n\n\t\t/**\n\t\t * Return a new instance of the setting group collection.\n\t\t *\n\t\t * @since 3.0\n\t\t * @return backbone.collection\n\t\t */\n\t\tgetNewSettingGroupCollection: function() {\n\t\t\treturn SettingGroupCollection;\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n *\n * @package Ninja Forms builder\n * @subpackage Main App\n * @copyright (c) 2017 WP Ninjas\n * @since 3.0.30\n */\ndefine( 'controllers/app/settingMedia',[], function() {\n var controller = Marionette.Object.extend( {\n initialize: function() {\n // When the media button is clicked, open the media manager.\n this.listenTo( nfRadio.channel( 'setting-type-media' ), 'click:extra', this.clickExtra );\n },\n\n clickExtra: function( e, settingModel, dataModel, settingView ) {\n var textEl = jQuery( e.target ).parent().find( '.setting' );\n\n if ( jQuery( e.target ).hasClass( 'open-media-manager' ) ) {\n // If the frame already exists, re-open it.\n if ( this.meta_image_frame ) {\n this.meta_image_frame.open();\n return;\n }\n\n // Sets up the media library frame\n this.meta_image_frame = wp.media.frames.meta_image_frame = wp.media({\n title: 'Select a file',\n button: { text: 'insert' }\n });\n\n var that = this;\n\n // Runs when an image is selected.\n this.meta_image_frame.on('select', function(){\n // Grabs the attachment selection and creates a JSON representation of the model.\n var media_attachment = that.meta_image_frame.state().get('selection').first().toJSON();\n textEl.val( media_attachment.url ).change();\n });\n\n // Opens the media library frame.\n this.meta_image_frame.open();\n }\n },\n });\n\n return controller;\n} );\n/**\n * Handles changing our public link when we request a new one or when it's set improperly.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2019 WP Ninjas\n * @since UPDATE_VERSION_ON_MERGE\n */\ndefine( 'controllers/app/publicLink',[], function() {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\tthis.listenTo( nfRadio.channel( 'app' ), 'after:appStart', this.validatePublicLink, this );\n nfRadio.channel( 'app' ).reply( 'generate:publicLinkKey', this.newPublicLinkKey, this );\n },\n \n newPublicLinkKey: function() {\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n var public_link_key = nfRadio.channel('app').request('get:formModel').get('id');\n for (var i = 0; i < 4; i++) {\n var char = Math.random().toString(36).slice(-1);\n public_link_key += char;\n };\n // Apply the public link key to form settings\n formSettingsDataModel.set('public_link_key', public_link_key);\n return public_link_key;\n },\n\n validatePublicLink: function() {\n var formID = nfRadio.channel('app').request('get:formModel').get('id');\n var formSettingsDataModel = nfRadio.channel( 'settings' ).request( 'get:settings' );\n if ( 'undefined' === typeof formSettingsDataModel.get('public_link_key') ) return false;\n if ( 0 === formSettingsDataModel.get( 'public_link_key' ).indexOf( formID ) ) return false;\n var public_link_key = this.newPublicLinkKey();\n var publicLink = nfAdmin.publicLinkStructure.replace('[FORM_ID]', public_link_key);\n formSettingsDataModel.set('public_link', publicLink);\n }\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Model that represents our field type section on the add new field drawer.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/typeSectionModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\tclasses: ''\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Collection that holds our field models.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/fields/typeSectionCollection',['models/fields/typeSectionModel'], function( typeSectionModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: typeSectionModel\n\t} );\n\treturn collection;\n} );\n/**\n * Creates and stores a collection of field types. This includes all of the settings shown when editing a field.\n *\n * 1) Create our settings sections config\n * 2) Loops over our preloaded data and adds that to our field type collection\n *\n * Also responds to requests for data about field types\n *\n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/types',[\n\t\t'models/app/typeCollection',\n\t\t'models/fields/typeSectionCollection'\n\t],\n\tfunction(\n\t\tTypeCollection,\n\t\tSectionCollection\n\t) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Config for our settings sections\n\t\t\tthis.sections = new SectionCollection( fieldTypeSections );\n\t\t\tthis.listenTo( nfRadio.channel( 'fields' ), 'init:typeModel', this.registerSection );\n\n\t\t\t// Create our field type collection\n\t\t\tthis.collection = new TypeCollection( fieldTypeData, { type: 'fields' } );\n\n\t\t\t// Respond to requests to get field type, collection, settings, and sections\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:type', this.getFieldType, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:typeCollection', this.getTypeCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:typeSections', this.getTypeSections, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:savedFields', this.getSavedFields, this );\n\n\t\t\t// Listen to clicks on field types\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer' ), 'click:fieldType', this.addField );\n\t\t},\n\n\t\tregisterSection: function( typeModel ) {\n\t\t\tif ( 'fields' != typeModel.collection.type || ! typeModel.get( 'section' ) ) return;\n\n\t\t\tthis.sections.get( typeModel.get( 'section' ) ).get( 'fieldTypes' ).push( typeModel.get( 'id' ) );\n\t\t},\n\n\t\t/**\n\t\t * Return a field type by id\n\t\t *\n\t\t * @since 3.0\n\t\t * @param string \t\t\tid \tfield type\n\t\t * @return backbone.model \tfield type model\n\t\t */\n\t\tgetFieldType: function( id ) {\n \treturn this.collection.get( id );\n },\n\n /**\n * Return the entire field type collection\n *\n * @since 3.0\n * @param string \t\t\t\tid \t[description]\n * @return backbone.collection \tfield type collection\n */\n\t\tgetTypeCollection: function( id ) {\n \treturn this.collection;\n },\n\n /**\n * Add a field type to our fields sortable when the field type button is clicked.\n *\n * @since 3.0\n * @param Object e event\n * @return void\n */\n addField: function( e ) {\n\t\t\tvar type = jQuery( e.target ).data( 'id' );\n\n\t\t\tif( e.shiftKey ){\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'add:stagedField', type );\n\t\t\t\treturn;\n\t\t\t}\n\n \tvar fieldModel = nfRadio.channel( 'fields' ).request( 'add', {\n\t\t\t\ttype: type,\n\n\t\t\t\tlabel: nfRadio.channel( 'fields' ).request( 'get:type', type ).get( 'nicename' )\n\t\t\t});\n\n\t\t\tconsole.log( fieldModel );\n\n\t\t\tvar label = {\n\t\t\t\tobject: 'Field',\n\t\t\t\tlabel: fieldModel.get( 'label' ),\n\t\t\t\tchange: 'Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: nfRadio.channel( 'fields' ).request( 'get:collection' )\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', fieldModel, null, label, data );\n\n\t\t\t// Re-Draw the Field Collection\n\t\t\tnfRadio.channel( 'fields' ).request( 'redraw:collection' );\n },\n\n /**\n * Return our field type settings sections\n *\n * @since 3.0\n * @return backbone.collection field type settings sections\n */\n getTypeSections: function() {\n return this.sections;\n },\n\n /**\n * Return our saved fields\n *\n * @since 3.0\n * @return backbone.collection\n */\n getSavedFields: function() {\n \tthis.sections.get( 'saved' );\n }\n\t});\n\n\treturn controller;\n} );\n\n/**\n * Handles the logic for our field type draggables.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/fieldTypeDrag',[], function( ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our field type draggables and run the appropriate function.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:type', this.startDrag );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:type', this.stopDrag );\n\t\t\t/*\n\t\t\t * Respond to requests for our helper clone.\n\t\t\t * This is used by other parts of the application to modify what the user is dragging in real-time.\n\t\t\t */ \n\t\t\tnfRadio.channel( 'drawer-addField' ).reply( 'get:typeHelperClone', this.getCurrentDraggableHelperClone, this );\n\t\t},\n\n\t\t/**\n\t\t * When we start dragging:\n\t\t * get our drawer element\n\t\t * set its overflow property to visible !important -> forces the type drag element to be on at the top of the z-index.\n\t\t * get our main element\n\t\t * est its overflow propery to visible !important -> forces the type drag element to be on top of the z-index.\n\t\t * set our dragging helper clone\n\t\t * \n\t\t * @since 3.0\n\t\t * @param object context \tThis function is going to be called from a draggable. Context is the \"this\" reference to the draggable.\n\t\t * @param object ui \tObject sent by jQuery UI draggable.\n\t\t * @return void\n\t\t */\n\t\tstartDrag: function( context, ui ) {\n\t\t\tthis.drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tthis.mainEl = nfRadio.channel( 'app' ).request( 'get:mainEl' );\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\n\t\t\tthis.draggableHelperClone = jQuery( ui.helper ).clone();\n\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging, reset our overflow property to hidden !important.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param object context \tThis function is going to be called from a draggable. Context is the \"this\" reference to the draggable.\n\t\t * @param object ui \tObject sent by jQuery UI draggable.\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tstopDrag: function( context, ui ) {\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t},\n\n\t\tgetCurrentDraggableHelperClone: function() {\n\t\t\treturn this.draggableHelperClone;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles the dragging of our field staging area\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/stagingDrag',[], function( ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen for the start and stop of our field staging dragging\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:fieldStaging', this.startDrag );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:fieldStaging', this.stopDrag );\n\t\t},\n\n\t\t/**\n\t\t * When the user starts dragging the staging area, we have to:\n\t\t * set the overflow property of the drawer to visible !important. If we don't, the button goes underneath the main section.\n\t\t * set the overflow proerty of the main to visible !important. If we don't, the dragged element goes underneath the drawer.\n\t\t * replace our helper with the stacked \"x fields\" template.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t context jQuery UI Draggable\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartDrag: function( context, ui ) {\n\t\t\tthis.drawerEl = nfRadio.channel( 'app' ).request( 'get:drawerEl' );\n\t\t\tthis.mainEl = nfRadio.channel( 'app' ).request( 'get:mainEl' );\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\t\t\t// jQuery( this.mainEl )[0].style.setProperty( 'overflow', 'visible', 'important' );\n\n\t\t\tvar stagedFields = nfRadio.channel( 'fields' ).request( 'get:staging' );\n\t\t\tvar html = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-staged-fields-drag' );\n\t\t\tjQuery( ui.helper ).html( html( { num: stagedFields.models.length } ) );\n\t\t\tjQuery( ui.helper ).prop( 'id', 'nf-staged-fields-drag' );\n\t\t\tjQuery( ui.item ).css( 'opacity', '0.7' );\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging the staging area, we have to set the overflow property to hidden !important\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t context jQuery UI Draggable\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopDrag: function( context, ui ) {\n\t\t\tjQuery( this.drawerEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t\t// jQuery( this.mainEl )[0].style.setProperty( 'overflow', 'hidden', 'important' );\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles most things related to our staging area:\n * 1) Creates a collection\n * 2) Listens for requests to CRUD items from the collection\n * 3) Adds our staged fields to the fields sortable when the drawer is closed\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/staging',['models/fields/stagingCollection'], function( stagingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Create our staged fields collection\n\t\t\tthis.collection = new stagingCollection();\n\t\t\t// Respond to requests related to our staging area.\n\t\t nfRadio.channel( 'fields' ).reply( 'add:stagedField', this.addStagedField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'remove:stagedField', this.removeStagedField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:staging', this.getStagingCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'sort:staging', this.sortStagedFields, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'clear:staging', this.clearStagedFields, this );\n\t\t\t// Listen to our remove staged field click event.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'click:removeStagedField', this.removeStagedField );\n\t\t\t// Listen to our event that fires just before a drawer is closed.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'before:closeDrawer', this.beforeCloseDrawer );\n\t\t},\n\n\t\tgetStagingCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\t/**\n\t\t * Add a field to our staging area\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string type Type of field we're adding\n\t\t * @return tmpID\n\t\t */\n\t\taddStagedField: function( type, silent ) {\n\t\t\tvar silent = silent || false;\n\t\t\t// Get our type model from the string.\n\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\t\t\t// Our tmp ID is a string with the time appended to make it unique.\n\t\t\tvar tmpID = 'nf-staged-field-' + jQuery.now();\n\t\t\t// Object that will be added to our staging collection.\n\t\t\tvar data = {\n\t\t\t\tid: tmpID,\n\t\t\t\t// i.e. firstname, textbox, etc.\n\t\t\t\tslug: fieldType.get( 'type' ),\n\t\t\t\t// i.e. First Name, Textbox, etc.\n\t\t\t\tnicename: fieldType.get( 'nicename' ),\n\t\t\t\t// i.e. calendar, envelope, etc.\n\t\t\t\ticon: fieldType.get( 'icon' )\n\t\t\t}\n\t\t\t// \n\t\t\tvar model = this.collection.add( data );\n\n\t\t\tif( ! silent ) nfRadio.channel( 'fields').trigger( 'add:stagedField', model );\n\n\t\t\treturn tmpID;\n\t\t},\n\n\t\t/**\n\t\t * Remove a field from staging\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \t\t\te \tEvent\n\t\t * @param Backbone.model \tmodel \tstaged field model to remove\n\t\t * @return void\n\t\t */\n\t\tremoveStagedField: function( e, model ) {\n\t\t\tthis.collection.remove( model );\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'remove:stagedField', model );\n\t\t},\n\n\t\t/**\n\t\t * Adds our staged fields to the main fields sortable before the drawer is closed.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tbeforeCloseDrawer: function() {\n\t\t\tif ( 0 != this.collection.models.length ) { // Make sure that we have models\n\t\t\t\t// Get our field collection.\n\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n\t\t\t\tvar fields = [];\n\t\t\t\t// Loop through our staging collection\n\t\t\t\t_.each( this.collection.models, function( model ) {\n\t\t\t\t\t// Get a tmp ID for our new field.\n\t\t\t\t\tvar tmpID = nfRadio.channel( 'fields' ).request( 'get:tmpID' );\n\t\t\t\t\t// Create an object that can be added as a model.\n\t\t\t\t\tvar tmpField = { id: tmpID, label: model.get( 'nicename' ), type: model.get( 'slug' ) };\n\t\t\t\t\t// Add our new field.\n\t\t\t\t\tvar newModel = nfRadio.channel( 'fields' ).request( 'add', tmpField, false );\n\t\t\t\t\t// Add our field addition to our change log.\n\t\t\t\t\tvar label = {\n\t\t\t\t\t\tobject: 'Field',\n\t\t\t\t\t\tlabel: newModel.get( 'label' ),\n\t\t\t\t\t\tchange: 'Added',\n\t\t\t\t\t\tdashicon: 'plus-alt'\n\t\t\t\t\t};\n\t\t\t\t\tvar data = {\n\t\t\t\t\t\tcollection: fieldCollection\n\t\t\t\t\t}\n\t\t\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', newModel, null, label, data );\n\t\t\t\n\t\t\t\t} );\n\t\t\t\t// Trigger a reset on our field collection so that our view re-renders\n\t\t\t\tfieldCollection.trigger( 'reset', fieldCollection );\n\t\t\t\t// Empty the staging collection\n\t\t\t\tthis.collection.reset();\n\t\t\t}\n\t\t\t// Sort our fields.\n\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields', null, null, false );\n\t\t},\n\n\t\t/**\n\t\t * Sort our staging area by the 'order' attribute.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tsortStagedFields: function() {\n\t\t\t// Get our staged fields sortable.\n\t\t\tvar sortableEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\t// Get the current order using jQuery sortable. Will be an array of IDs: [tmp-blah, tmp-blah]\n\t\t\tvar order = jQuery( sortableEl ).sortable( 'toArray' );\n\t\t\t// Loop through our models\n\t\t\t_.each( this.collection.models, function( field ) {\n\t\t\t\t// Search our order array for this field.\n\t\t\t\tvar search = field.get( 'id' );\n\t\t\t\tvar pos = order.indexOf( search );\n\t\t\t\t// Update our staged field model with the new order.\n\t\t\t\tfield.set( 'order', pos );\n\t\t\t} );\n\t\t\t// Sort our staging collection.\n\t\t\tthis.collection.sort();\n\t\t},\n\n\t\tclearStagedFields: function() {\n\t\t\tthis.collection.reset();\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles actions related to our staged fields sortable.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/stagingSortable',['models/fields/stagingCollection'], function( stagingCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our field type draggables\n\t\t\t// this.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:type', this.addActiveClass );\n\t\t\t// this.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:type', this.removeActiveClass );\n\t\t\t// Listen to our sortable events\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'receive:stagedFields', this.receiveStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'over:stagedFields', this.overStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'out:stagedFields', this.outStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'start:stagedFields', this.startStagedFields );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stop:stagedFields', this.stopStagedFields );\n\t\t},\n\n\t\t/**\n\t\t * Change our dropped field type helper so that it matches the other items in our sortable.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI item\n\t\t * @return void\n\t\t */\n\t\treceiveStagedFields: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) {\n\t\t\t\tvar type = jQuery( ui.item ).data( 'id' );\n\t\t\t\tvar tmpID = nfRadio.channel( 'fields' ).request( 'add:stagedField', type );\n\t\t\t\tjQuery( ui.helper ).prop( 'id', tmpID );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:staging' );\n\t\t\t\tjQuery( ui.helper ).remove();\n\t\t\t\tnfRadio.channel( 'drawer-addField' ).trigger( 'drop:fieldType', type );\t\t\t\t\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add an active class to our sortable when a field type item is dragged\n\t\t * \n\t\t * @since 3.0\n\t\t */\n\t\taddActiveClass: function() {\n\t\t\tvar stagedFieldsEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\tjQuery( stagedFieldsEl ).addClass( 'nf-droppable-active' );\n\t\t},\n\n\t\t/**\n\t\t * Remove the active class from our sortable when the field type item is dropped.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tremoveActiveClass: function() {\n\t\t\tvar stagedFieldsEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\tjQuery( stagedFieldsEl ).removeClass( 'nf-droppable-active' );\n\t\t},\n\n\t\t/**\n\t\t * When the field type item is dragged over our sortable, we change the helper to match the sortable items.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \te event\n\t\t * @param Object \tui jQuery UI Element\n\t\t * @return void\n\t\t */\n\t\toverStagedFields: function( e, ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) {\n\t\t\t\tvar type = jQuery( ui.item ).data( 'id' );\n\t\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\t\t\t\tvar nicename = fieldType.get( 'nicename' );\n\t\t\t\tthis.currentHelper = ui.helper \n\t\t\t\tjQuery( ui.helper ).html( nicename + '<span class=\"dashicons dashicons-dismiss\"></span>' );\n\t\t\t\tjQuery( ui.helper ).removeClass( 'nf-field-type-button' ).addClass( 'nf-item-dock' ).css( { 'opacity': '0.8', 'width': '', 'height': '' } );\n\t\t\t\tvar sortableEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).addClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t},\n\n\t\t/**\n\t\t * When a field type item is moved away from our sortable, we change the helper to its previous appearance\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toutStagedFields: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) {\n\t\t\t\tvar helperClone = nfRadio.channel( 'drawer-addField' ).request( 'get:typeHelperClone' );\t\n\t\t\t\tjQuery( this.currentHelper ).html( jQuery( helperClone ).html() );\n\t\t\t\tjQuery( this.currentHelper ).removeClass( 'nf-item-dock' ).addClass( 'nf-field-type-button' );\n\t\t\t\tvar sortableEl = nfRadio.channel( 'app' ).request( 'get:stagedFieldsEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\t\t\n\t\t},\n\n\t\t/**\n\t\t * When a user starts to drag a sortable item, we need to set a few properties on the item and the helper.\n\t\t * These keep the original item in place while dragging and changes the opacity of the helper.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartStagedFields: function( ui ) {\n\t\t\tjQuery( ui.item ).show();\n\t\t\tjQuery( ui.item ).css( { 'display': 'inline', 'opacity': '0.7' } );\n\t\t\tjQuery( ui.helper ).css( 'opacity', '0.5' );\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging a sortable item, remove our opacity setting and remove the helper item.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopStagedFields: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t\tjQuery( ui.helper ).remove();\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\n/**\n * Filters our field type collection.\n * \n * @package Ninja Forms builder\n * @subpackage Fields - New Field Drawer\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/filterTypes',['models/fields/typeSectionCollection'], function( fieldTypeSectionCollection ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Listen to our change filter event.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'change:filter', this.filterFieldTypes );\n\t\t},\n\n\t\t/**\n\t\t * Filter our field types in the add new field drawer\n\t\t * \n\t\t * Takes a search string and finds any field types that match either the name or alias.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string\t search \tstring being searched for\n\t\t * @param object \t e \tKeyup event\n\t\t * @return void\n\t\t */\n\t\tfilterFieldTypes: function( search, e ) {\n\t\t\t// Make sure that we aren't dealing with an empty string.\n\t\t\tif ( '' != jQuery.trim( search ) ) {\n \t\tvar filtered = [];\n \t\t/**\n \t\t * Call the function that actually filters our collection,\n \t\t * and then loop through our collection, adding each model to our filtered array.\n \t\t */\n \t\t_.each( this.filterCollection( search ), function( model ) {\n \t\t\tfiltered.push( model.get( 'id' ) );\n \t\t} );\n\n \t\t// Create a new Field Type Section collection with the filtered array.\n \t\tvar filteredSectionCollection = new fieldTypeSectionCollection( [\n\t\t\t\t{ \n\t\t\t\t\tid: 'filtered',\n\t\t\t\t\tnicename: 'Filtered Fields',\n\t\t\t\t\tfieldTypes: filtered\n\t\t\t\t}\n\t\t\t\t] );\n \n // Declare array of fields to hide.\n\t\t\t\tvar hiddenFields = nfRadio.channel( 'app' ).request( 'update:hiddenFields' ) || [];\n\t\t\t\thiddenFields = hiddenFields.concat([\n\t\t\t\t\t'product',\n\t\t\t\t\t'quantity',\n\t\t\t\t\t'shipping',\n\t\t\t\t\t'total'\n\t\t\t\t]);\n\n // Search our results of hidden fields.\n for ( var i = filteredSectionCollection.models[ 0 ].get( 'fieldTypes' ).length -1; i >= 0; i-- ) {\n var target = hiddenFields.indexOf( filteredSectionCollection.models[ 0 ].get( 'fieldTypes' )[ i ] );\n // If we find any...\n if ( -1 < target ) {\n // Remove them from the collection.\n filteredSectionCollection.models[ 0 ].get( 'fieldTypes' ).splice( i, 1 );\n }\n }\n\n \t\t// Request that our field types filter be applied, passing the collection we created above.\n \t\tnfRadio.channel( 'drawer' ).trigger( 'filter:fieldTypes', filteredSectionCollection );\n \t\t// If we've pressed the 'enter' key, add the field to staging and clear the filter.\n \t\tif ( 'undefined' != typeof e && e.addObject ) {\n \t\t\tif ( 0 < filtered.length ) {\n \t\t\t\tnfRadio.channel( 'fields' ).request( 'add:stagedField', filtered[0] );\n \t\t\t\tnfRadio.channel( 'drawer' ).request( 'clear:filter' );\n \t\t\t}\n \t\t}\n \t} else {\n \t\t// Clear our filter if the search text is empty.\n \t\tnfRadio.channel( 'drawer' ).trigger( 'clear:filter' );\n \t}\n },\n\n /**\n * Search our field type collection for the search string.\n * \n * @since 3.0\n * @param string\t search \tstring being searched for\n * @return backbone.collection\n */\n filterCollection: function( search ) {\n \tsearch = search.toLowerCase();\n \t// Get our list of field types\n \tvar collection = nfRadio.channel( 'fields' ).request( 'get:typeCollection' );\n \t/*\n \t * Backbone collections have a 'filter' method that loops through every model,\n \t * waiting for you to return true or false. If you return true, the model is kept.\n \t * If you return false, it's removed from the filtered result.\n \t */\n\t\t\tvar filtered = collection.filter( function( model ) {\n\t\t\t\tvar found = false;\n\t\t\t\t\n\t\t\t\t// If we match either the ID or nicename, return true.\n\t\t\t\tif ( model.get( 'type' ).toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\tfound = true;\n\t\t\t\t} else if ( model.get( 'nicename' ).toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\tfound = true;\n\t\t\t\t}\n\n\t\t\t\t/*\n\t\t\t\t * TODO: Hashtag searching. Doesn't really do anything atm.\n\t\t\t\t */\n\t\t\t\tif ( model.get( 'tags' ) && 0 == search.indexOf( '#' ) ) {\n\t\t\t\t\t_.each( model.get( 'tags' ), function( tag ) {\n\t\t\t\t\t\tif ( search.replace( '#', '' ).length > 1 ) {\n\t\t\t\t\t\t\tif ( tag.toLowerCase().indexOf( search.replace( '#', '' ) ) != -1 ) {\n\t\t\t\t\t\t\t\tfound = true;\n\t\t\t\t\t\t\t}\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\t// If we match any of the aliases, return true.\n\t\t\t\tif ( model.get( 'alias' ) ) {\n\t\t\t\t\t_.each( model.get( 'alias' ), function( alias ) {\n\t\t\t\t\t\tif ( alias.toLowerCase().indexOf( search ) != -1 ) {\n\t\t\t\t\t\t\tfound = true;\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn found;\n\t\t\t} );\n\t\t\t// Return our filtered collection.\n\t\t\treturn filtered;\n }\n\t});\n\n\treturn controller;\n} );\ndefine( 'views/fields/preview/element',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-field-input',\n\n\t\tinitialize: function() {\n\t\t\t\n\t\t\tvar type = this.model.get('type');\n\n\t\t\tthis.model.set('value', this.model.get('default'));\n\t\t\t\n\t\t\tif('date' == type && this.model.get('date_default')){\n\t\t\t\tvar format = this.model.get('date_format');\n\t\t\t\tif('default' == format || '' == format) format = this.convertDateFormat(nfAdmin.dateFormat);\n\t\t\t\tthis.model.set('value', moment().format(format) );\n\t\t\t}\n\n\t\t\tif('phone' == type) type = 'tel';\n\t\t\tif('spam' == type) type = 'input';\n\t\t\t// if('date' == type) type = 'input';\n\t\t\tif('confirm' == type) type = 'input';\n\t\t\tif('password' == type) type = 'input';\n\t\t\tif('passwordconfirm' == type) type = 'input';\n\t\t\tif('quantity' == type) type = 'number';\n\t\t\tif('terms' == type) type = 'listcheckbox';\n\t\t\tif('liststate' == type) type = 'listselect';\n\t\t\tif('listcountry' == type) type = 'listselect';\n\t\t\tif('listmultiselect' == type) type = 'listselect';\n\t\t\tif('save' == type) type = 'submit';\n\n\t\t\t// If a builder-specific template exists for this type, use that.\n\t\t\tif ( 1 == jQuery( '#tmpl-nf-builder-field-' + type ).length ) {\n\t\t\t\tthis.template = '#tmpl-nf-builder-field-' + type;\n\t\t\t} else {\n\t\t\t\tthis.template = '#tmpl-nf-field-' + type;\n\t\t\t}\t\t\t\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif(this.model.get('container_class').includes('two-col-list')) {\n\t\t\t\tjQuery(this.el).find('> ul').css('display', 'grid');\n\t\t\t\tjQuery(this.el).find('> ul').css('grid-template-columns', 'repeat(2, 1fr)');\n\t\t\t}\n\t\t\tif(this.model.get('container_class').includes('three-col-list')) {\n\t\t\t\tjQuery(this.el).find('> ul').css('display', 'grid');\n\t\t\t\tjQuery(this.el).find('> ul').css('grid-template-columns', 'repeat(3, 1fr)');\n\t\t\t}\n\t\t\tif(this.model.get('container_class').includes('four-col-list')) {\n\t\t\t\tjQuery(this.el).find('> ul').css('display', 'grid');\n\t\t\t\tjQuery(this.el).find('> ul').css('grid-template-columns', 'repeat(4, 1fr)');\n\t\t\t}\n\t\t},\n \n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderClasses: function() {\n\t \t\t\t// ...\n },\n renderPlaceholder: function() {\n if('undefined' == typeof this.placeholder) return;\n\t\t\t\t\treturn 'placeholder=\"' + jQuery.trim( this.placeholder ) + '\"';\n },\n maybeDisabled: function() {\n if('undefined' == typeof this.disable_input) return;\n if(!this.disable_input) return;\n return 'disabled=\"disabled\"';\n },\n maybeRequired: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\tmaybeInputLimit: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\tmaybeDisableAutocomplete: function() {\n\t\t\t\t\t// ..\n\t\t\t\t},\n\t\t\t\tmaybeChecked: function() {\n\t\t\t\t\tif('checked' == this.default_value) return ' checked=\"checked\"';\n\t\t\t\t},\n\t\t\t\trenderOptions: function() {\n\t\t\t\t\tswitch(this.type) {\n\t\t\t\t\t\tcase 'terms':\n\n\t\t\t\t\t\t\tif( ! this.taxonomy ){\n\t\t\t\t\t\t\t\treturn '(No taxonomy selected)';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tvar taxonomyTerms = fieldTypeData.find(function(typeData){\n\t\t\t\t\t\t\t\treturn 'terms' == typeData.id;\n\t\t\t\t\t\t\t}).settingGroups.find(function(settingGroup){\n\t\t\t\t\t\t\t\treturn 'primary' == settingGroup.id;\n\t\t\t\t\t\t\t}).settings.find(function(setting){\n\t\t\t\t\t\t\t\treturn 'taxonomy_terms' == setting.name;\n\t\t\t\t\t\t\t}).settings;\n\n\t\t\t\t\t\t\tvar attributes = Object.keys(this);\n\t\t\t\t\t\t\tvar enabledTaxonomyTerms = attributes.filter(function(attribute){\n\t\t\t\t\t\t\t\treturn 0 == attribute.indexOf('taxonomy_term_') && this[attribute];\n\t\t\t\t\t\t\t}.bind(this));\n\n\t\t\t\t\t\t\tif(0 == enabledTaxonomyTerms.length) {\n\t\t\t\t\t\t\t\treturn '(No available terms selected)';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn enabledTaxonomyTerms.reduce(function(html, enabledTaxonomyTerm) {\n\t\t\t\t\t\t\t\tvar term = taxonomyTerms.find(function(terms){\n\t\t\t\t\t\t\t\t\treturn enabledTaxonomyTerm == terms.name;\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\tif( 'undefined' == typeof term ) return html;\n\t\t\t\t\t\t\t\treturn html += '<li><input type=\"checkbox\"><div>' + term.label + '</div></li>';\n\t\t\t\t\t\t\t}.bind(this), '');\n\t\t\t\t\t\tcase 'liststate':\n\t\t\t\t\t\tcase 'listselect':\n\n\t\t\t\t\t\t\t// Check if there are any options.\n\t\t\t\t\t\t\tif(0 == this.options.models.length) return '';\n\n\t\t\t\t\t\t\t// Filter by :selected\" options.\n\t\t\t\t\t\t\tvar options = this.options.models.filter(function(option){\n\t\t\t\t\t\t\t\treturn option.get('selected');\n\t\t\t\t\t\t\t});\n\n\t\t\t\t\t\t\t// If no option set as \"selected\", then reset the previous filter.\n\t\t\t\t\t\t\tif(0 == options.length) options = this.options.models;\n\n\t\t\t\t\t\t\t// Set the first option to display in the field preview.\n\t\t\t\t\t\t\treturn '<option>' + options[0].get('label') + '</option>';\n\t\t\t\t\t\tcase 'listmultiselect':\n\t\t\t\t\t\t\treturn this.options.models.reduce(function(html, option) {\n\t\t\t\t\t\t\t\tvar selected = (option.get('selected')) ? ' selected=\"selected\"' : '';\n\t\t\t\t\t\t\t\treturn html += '<option' + selected + '>' + option.get('label') + '</option>';\n\t\t\t\t\t\t\t}, '');\n\t\t\t\t\t\tcase 'listcheckbox':\n\t\t\t\t\t\t\treturn this.options.models.reduce(function(html, option) {\n\t\t\t\t\t\t\t\tvar checked = (option.get('selected')) ? ' checked=\"checked\"' : '';\n\t\t\t\t\t\t\t\treturn html += '<li><input type=\"checkbox\"' + checked + '><div>' + option.get('label') + '</div></li>';\n\t\t\t\t\t\t\t}, '');\n\t\t\t\t\t\tcase 'listradio':\n\t\t\t\t\t\t\tvar checked = false; // External flag to only select one radio item.\n\t\t\t\t\t\t\treturn this.options.models.reduce(function(html, option) {\n\t\t\t\t\t\t\t\tchecked = (option.get('selected') && !checked) ? ' checked=\"checked\"' : '';\n\t\t\t\t\t\t\t\treturn html += '<li><input type=\"radio\"' + checked + '><div>' + option.get('label') + '</div></li>';\n\t\t\t\t\t\t\t}, '');\n\t\t\t\t\t\tcase 'listcountry':\n\t\t\t\t\t\t\tvar defaultValue = this.default;\n\t\t\t\t\t\t\tvar defaultOption = window.fieldTypeData.find(function(data) {\n\t\t\t\t\t\t\t\treturn 'listcountry' == data.id;\n\t\t\t\t\t\t\t}).settingGroups.find(function(group){\n\t\t\t\t\t\t\t\treturn 'primary' == group.id;\n\t\t\t\t\t\t\t}).settings.find(function(setting){\n\t\t\t\t\t\t\t\treturn 'default' == setting.name;\n\t\t\t\t\t\t\t}).options.find(function(option) {\n\t\t\t\t\t\t\t\treturn defaultValue == option.value;\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tvar optionLabel = ('undefined' !== typeof defaultOption ) ? defaultOption.label : '--';\n\t\t\t\t\t\t\treturn '<option>' + optionLabel + '</option>';\n\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\trenderOtherAttributes: function() {\n\t\t\t\t\tvar attributes = [];\n\t\t\t\t\tif('listmultiselect' == this.type) {\n\t\t\t\t\t\tattributes.push('multiple');\n\n\t\t\t\t\t\tvar multi_size = this.multi_size || '5';\n\t\t\t\t\t\tattributes.push('size=\"' + multi_size + '\"');\n\t\t\t\t\t}\n\n\t\t\t\t\treturn attributes.join(' ');\n\t\t\t\t},\n\t\t\t\trenderProduct: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\trenderNumberDefault: function() {\n\t\t\t\t\treturn this.value;\n\t\t\t\t},\n\t\t\t\trenderCurrencyFormatting: function() {\n\t\t\t\t\t// ...\n\t\t\t\t},\n\t\t\t\trenderRatings: function() {\n\t\t\t\t\tvar ratingOutput = '';\n\t\t\t\t\tfor (var i = 0; i < this.number_of_stars; i++) {\n\t\t\t\t\t\tratingOutput += '<i class=\"fa fa-star\" aria-hidden=\"true\"></i> ';\n\t\t\t\t\t }\n\t\t\t\t\treturn ratingOutput;\n\t\t\t\t},\n\t\t\t\trenderHourOptions: function() {\n html = '';\n let hours = 12;\n\n if ( 'undefined' != typeof this.hours_24 && 1 == this.hours_24 ) {\n hours = 24;\n }\n\n for (var i = 0; i < hours; i++) {\n let value = label = i;\n\n if ( i < 10 ) {\n value = label = '0' + i;\n }\n html += '<option value=\"' + value + '\">' + label + '</option>';\n i = i++;\n }\n\n return html;\n },\n\n renderMinuteOptions: function() {\n var html = '';\n let minute_increment = 5;\n\n if ( 'undefined' != typeof this.minute_increment ) {\n minute_increment = this.minute_increment;\n }\n\n let i = 0;\n\n while( i < 60 ) {\n let value = label = i;\n\n if ( i < 10 ) {\n value = label = '0' + i;\n }\n html += '<option value=\"' + value + '\">' + label + '</option>';\n i = i + minute_increment;\n }\n\n return html;\n },\n\n maybeRenderAMPM: function() {\n if ( 'undefined' == typeof this.hours_24 || 1 == this.hours_24 ) {\n return;\n }\n\n return '<div style=\"float:left;\"><select class=\"ampm\" style=\"float:left;\"><option value=\"am\">AM</option><option value=\"pm\">PM</option></select></div>'\n },\n \t\t\t\tmaybeRenderTime: function() {\n\t\t\t\t\tif ( 'time_only' == this.date_mode || 'date_and_time' == this.date_mode ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\t},\n\n }\n\t\t},\n\t\t\n convertDateFormat: function( dateFormat ) {\n // http://php.net/manual/en/function.date.php\n // https://github.com/dbushell/Pikaday/blob/master/README.md#formatting\n // Note: Be careful not to add overriding replacements. Order is important here.\n\n /** Day */\n dateFormat = dateFormat.replace( 'D', 'ddd' ); // @todo Ordering issue?\n dateFormat = dateFormat.replace( 'd', 'DD' );\n dateFormat = dateFormat.replace( 'l', 'dddd' );\n dateFormat = dateFormat.replace( 'j', 'D' );\n dateFormat = dateFormat.replace( 'N', '' ); // Not Supported\n dateFormat = dateFormat.replace( 'S', '' ); // Not Supported\n dateFormat = dateFormat.replace( 'w', 'd' );\n dateFormat = dateFormat.replace( 'z', '' ); // Not Supported\n\n /** Week */\n dateFormat = dateFormat.replace( 'W', 'W' );\n\n /** Month */\n dateFormat = dateFormat.replace( 'M', 'MMM' ); // \"M\" before \"F\" or \"m\" to avoid overriding.\n dateFormat = dateFormat.replace( 'F', 'MMMM' );\n dateFormat = dateFormat.replace( 'm', 'MM' );\n dateFormat = dateFormat.replace( 'n', 'M' );\n dateFormat = dateFormat.replace( 't', '' ); // Not Supported\n\n // Year\n dateFormat = dateFormat.replace( 'L', '' ); // Not Supported\n dateFormat = dateFormat.replace( 'o', 'YYYY' );\n dateFormat = dateFormat.replace( 'Y', 'YYYY' );\n dateFormat = dateFormat.replace( 'y', 'YY' );\n\n // Time - Not supported\n dateFormat = dateFormat.replace( 'a', '' );\n dateFormat = dateFormat.replace( 'A', '' );\n dateFormat = dateFormat.replace( 'B', '' );\n dateFormat = dateFormat.replace( 'g', '' );\n dateFormat = dateFormat.replace( 'G', '' );\n dateFormat = dateFormat.replace( 'h', '' );\n dateFormat = dateFormat.replace( 'H', '' );\n dateFormat = dateFormat.replace( 'i', '' );\n dateFormat = dateFormat.replace( 's', '' );\n dateFormat = dateFormat.replace( 'u', '' );\n dateFormat = dateFormat.replace( 'v', '' );\n\n // Timezone - Not supported\n dateFormat = dateFormat.replace( 'e', '' );\n dateFormat = dateFormat.replace( 'I', '' );\n dateFormat = dateFormat.replace( 'O', '' );\n dateFormat = dateFormat.replace( 'P', '' );\n dateFormat = dateFormat.replace( 'T', '' );\n dateFormat = dateFormat.replace( 'Z', '' );\n\n // Full Date/Time - Not Supported\n dateFormat = dateFormat.replace( 'c', '' );\n dateFormat = dateFormat.replace( 'r', '' );\n dateFormat = dateFormat.replace( 'u', '' );\n\n return dateFormat;\n }\n\n\t});\n\n\treturn view;\n} );\n/**\n * This is a copy of the 'views/fields/mainContentEmpty.js' file.\n * It is also the file that handles dropping new field types on our repeater field.\n * \n */\n\ndefine( 'views/fields/preview/repeaterElementEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-repeater-content-fields-empty',\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.repeaterFieldModel = data.repeaterFieldModel;\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tjQuery( this.el ).parent().removeClass( 'nf-fields-empty-droppable' ).droppable( 'destroy' );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\t\t},\n\n\t\tonShow: function() {\n\t\t\tif ( jQuery( this.el ).parent().hasClass( 'ui-sortable' ) ) {\n\t\t\t\tjQuery( this.el ).parent().sortable( 'destroy' );\n\t\t\t}\n\t\t\tjQuery( this.el ).parent().addClass( 'nf-fields-empty-droppable' );\n\t\t\tlet that = this;\n\t\t\tjQuery( this.el ).parent().droppable( {\n\t\t\t\taccept: function( draggable ) {\n\t\t\t\t\tif ( jQuery( draggable ).hasClass( 'nf-stage' ) || jQuery( draggable ).hasClass( 'nf-field-type-button' ) ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\tactiveClass: 'nf-droppable-active',\n\t\t\t\thoverClass: 'nf-droppable-hover',\n\t\t\t\ttolerance: 'pointer',\n\n\t\t\t\tover: function( e, ui ) {\t\n\t\t\t\t\t\n\t\t\t\t\tui.item = ui.draggable;\n\t\t\t\t\tjQuery(ui.item).addClass(\"nf-over-repeater\");\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'over:fieldsSortable', ui );\n\t\t\t\t},\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\n\t\t\t\t\tui.item = ui.draggable;\n\t\t\t\t\tjQuery(ui.item).removeClass(\"nf-over-repeater\");\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'out:fieldsSortable', ui );\n\t\t\t\t},\n\t\t\t\t/**\n\t\t\t\t * Handles the dropping of items into our EMPTY repeater field.\n\t\t\t\t * \n\t\t\t\t */\n\t\t\t\tdrop: function( e, ui ) {\n\t\t\t\t\tui.item = null != ui.item ? ui.item : ui.draggable;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'add:childField', ui, that, e );\n\t\t\t\t},\n\t\t\t} );\n\t\t}\n\t});\n\n\treturn view;\n} );\n/**\n * Collection View that outputs our repeater field collection to the screen.\n */\ndefine( 'views/fields/preview/repeaterElementCollection',[ 'views/fields/preview/repeaterElementEmpty' ], function( emptyView ) {\n\tvar view = Marionette.CollectionView.extend( {\n\t\ttagName: 'div',\n\t\temptyView: emptyView,\n\n\t\tgetChildView: function() {\n\t\t\tlet view = nfRadio.channel( 'views' ).request( 'get:fieldItem' );\n\t\t\treturn view;\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.emptyViewOptions = {\n\t\t\t\trepeaterFieldModel: data.repeaterFieldModel,\n\t\t\t};\n\t\t\tthis.repeaterFieldModel = data.repeaterFieldModel;\n\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'init:sortable', this.initSortable, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'get:sortableEl', this.getSortableEl, this );\n\t\t\tnfRadio.channel( 'fields-repeater' ).reply( 'get:repeaterFieldsCollection', this.getRepeaterFieldsCollection, this );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tif ( this.collection.models.length > 0 ) {\n\t\t\t\tjQuery( this.el ).addClass( 'nf-field-type-droppable' );\n\t\t\t\tvar that = this;\n\t\t\t\tthis.initSortable();\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * This sortable is a copy with modifications of the main field list sortable.\n\t\t * \n\t\t * @since version\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tinitSortable: function() {\n\t\t\t// If the sortable has already been instantiated, return early.\n\t\t\tif ( 'undefined' != typeof jQuery( this.el ).sortable( 'instance' ) ) return false;\n\n\t\t\tjQuery( this.el ).addClass( 'nf-field-type-droppable' ).addClass( 'nf-fields-sortable' );\n\n\t\t\tlet that = this;\n\t\t\tjQuery( this.el ).sortable( {\n\t\t\t\tcontainment: 'parent',\n\t\t\t\thelper: 'clone',\n\t\t\t\tcancel: '.nf-item-controls',\n\t\t\t\tplaceholder: 'nf-fields-sortable-placeholder',\n\t\t\t\topacity: 0.95,\n\t\t\t\tgrid: [ 5, 5 ],\n\t\t\t\tappendTo: '#nf-main',\n\t\t\t\tscrollSensitivity: 10,\n\t\t\t\t//connectWith would allow drag and drop between fields already in the builder and the repeatable fieldset ( this is currently an issue until we deal with existing data stored)\n\t\t\t\t//connectWith: '.nf-fields-sortable', \n\n\t\t\t\treceive: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'receive:fields', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tover: function( e, ui ) {\n\t\t\t\t\tjQuery(ui.item).addClass(\"nf-over-repeater\");\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'over:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tout: function( e, ui ) {\n\t\t\t\t\tjQuery(ui.item).removeClass(\"nf-over-repeater\");\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'out:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'start:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tremove: function( e, ui ) {\n\t\t\t\t\t// The field is removed from repeater Fields collection and a new one is created for main Fields collection from controllers/fields/sortable/js\n\t\t\t\t\tlet droppedFieldID = jQuery( ui.item ).data( 'id' );\n\t\t\t\t\tlet collection = that.repeaterFieldModel.get( 'fields' );\n\t\t\t\t\tlet droppedFieldModel = collection.get( droppedFieldID );\n\t\t\t\t\t\n\t\t\t\t\t// Remove the field from the repeater field collection making sure we alert the user the field data is being deleted\n\t\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:delete', e, droppedFieldModel );\n\t\t\t\t},\n\t\t\t\t\n\t\t\t\t// When we update the sort order of our repeater field children, run our sort function.\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'update:repeaterField', ui, that, e );\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tif ( ui.item.dropping ) return;\n\t\t\t\t\tnfRadio.channel( 'fields-repeater' ).request( 'stop:repeaterField', ui, that, e );\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\n\t\tdestroySortable: function() {\n\t\t\tjQuery( this.el ).sortable( 'destroy' );\n\t\t},\n\n\t\t/**\n\t\t * When we add our first child, we need to init the sortable.\n\t\t * \n\t\t * @since version\n\t\t * @param {[type]} childView [description]\n\t\t * @return {[type]} [description]\n\t\t */\n\t\tonAddChild: function( childView ) {\n\t\t\tif ( nfRadio.channel( 'fields' ).request( 'get:adding' ) ) {\n\t\t\t\tchildView.$el.hide().show( 'clip' );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'set:adding', false);\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Get Element holding child fields\n\t\t */\n\t\tgetSortableEl: function() {\n\t\t\treturn this.el;\n\t\t},\n\n\t\t/**\n\t\t * Getter for the repeater Fields collection\n\t\t */\n\t\tgetRepeaterFieldsCollection: function() {\n\t\t\treturn this.repeaterFieldModel.get( 'fields' );\n\t\t}\n\t\t\n\t} );\n\n\treturn view;\n} );\n\ndefine( 'views/fields/preview/repeaterElementLayout',[ 'views/fields/preview/repeaterElementCollection' ], function( previewRepeaterElementCollectionView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-field-repeater',\n\n\t\tregions: {\n\t\t\tfields: '.nf-repeater-fieldsets',\n\t\t},\n\n\t\tinitialize: function( data ) {\n\t\t\tthis.collection = data.collection;\n\t\t\tthis.model = data.model;\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t// Populate the fields region with our collection view.\n\t\t\tthis.fields.show( new previewRepeaterElementCollectionView( { collection: this.collection, repeaterFieldModel: this.model } ) );\n\t\t},\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/preview/label',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-field-label',\n\n\t\tinitialize: function( data ) {\n\t\t\t// this.$el = jQuery( data.itemView.el ).find( '.nf-realistic-field--label' );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t// ...\n\t\t\t// console.log( jQuery( this.$el ) );\n\t\t},\n \n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderLabelClasses: function() {\n // ...\n },\n maybeRenderHelp: function() {\n // ...\n }\n }\n }\n\n\t});\n\n\treturn view;\n} );\ndefine( 'views/fields/fieldItem',['views/app/itemControls', 'views/fields/preview/element', 'views/fields/preview/repeaterElementLayout', 'views/fields/preview/label'], function( itemControlsView, previewElementView, previewRepeaterElementView, previewLabelView ) {\n\tvar view = Marionette.LayoutView.extend({\n\t\ttagName: 'div',\n\t\ttemplate: '#tmpl-nf-main-content-field',\n\t\tdoingShortcut: false,\n\n\t\tregions: {\n\t\t\titemControls: '.nf-item-controls',\n\t\t\tpreviewLabel: '.nf-realistic-field--label',\n\t\t\tpreviewElement: '.nf-realistic-field--element',\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\tthis.model.on( 'change:editActive', this.render, this );\n\t\t\tthis.model.on( 'change:label', this.render, this );\n\t\t\tthis.model.on( 'change:required', this.render, this );\n\t\t\tthis.model.on( 'change:id', this.render, this );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tthis.model.off( 'change:editActive', this.render );\n\t\t\tthis.model.off( 'change:label', this.render );\n\t\t\tthis.model.off( 'change:required', this.render );\n\t\t\tthis.model.off( 'change:id', this.render );\n\t\t},\n\n\t\tonRender: function() {\n\t\t\tthis.$el = this.$el.children();\n\t\t\tthis.$el.unwrap();\n\t\t\tthis.setElement( this.$el );\n\n\t\t\tthis.itemControls.show( new itemControlsView( { model: this.model } ) );\n\t\t\tjQuery( this.el ).disableSelection();\n\n\t\t\tvar type = this.model.get('type');\n\t\t\tif('phone' == type) type = 'tel';\n\t\t\tif('spam' == type) type = 'input';\n\t\t\t// if('date' == type) type = 'input';\n\t\t\tif('confirm' == type) type = 'input';\n\t\t\tif('password' == type) type = 'input';\n\t\t\tif('passwordconfirm' == type) type = 'input';\n\t\t\tif('quantity' == type) type = 'number';\n\t\t\tif('terms' == type) type = 'listcheckbox';\n\t\t\tif('liststate' == type) type = 'listselect';\n\t\t\tif('listcountry' == type) type = 'listselect';\n\t\t\tif('listmultiselect' == type) type = 'listselect';\n\t\t\tif('save' == type) type = 'submit';\n\n\t\t\t// Only show preview / realisitic fields when not `html`, `hidden`, `note`, or `recaptcha`.\n\t\t\tvar previewFieldTypeBlacklist = ['html', 'hidden', 'note', 'recaptcha'];\n\t\t\tvar isFieldTypeTemplateAvailable = jQuery('#tmpl-nf-field-' + type).length;\n\t\t\tif(-1 == previewFieldTypeBlacklist.indexOf(this.model.get('type')) && isFieldTypeTemplateAvailable) {\n\t\t\t\t\n\t\t\t\t// If we have a repeater field, then we have to load a specific collection view.\n\t\t\t\tif ( 'repeater' == type ) {\n\t\t\t\t\tthis.previewElement.show( new previewRepeaterElementView( { collection: this.model.get( 'fields' ), model: this.model } ) );\n\t\t\t\t} else {\n\t\t\t\t\tthis.previewElement.show( new previewElementView( { model: this.model } ) );\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t// Only show the preview label when not `submit`, or `hr`.\n\t\t\t\tvar showLabelFieldTypeBlacklist = ['submit', 'save', 'hr'];\n\t\t\t\tif(-1 == showLabelFieldTypeBlacklist.indexOf(this.model.get('type'))) {\n\t\t\t\t\tthis.previewLabel.show( new previewLabelView( { model: this.model, itemView: this } ) );\n\t\t\t\t}\n\n\t\t\t\tjQuery( this.el ).find('.nf-placeholder-label').hide();\n\t\t\t}\n\n\t\t\tif ( nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( this.el ).on( 'taphold', function( e, touch ) {\n\t\t\t\t\tif ( ! jQuery( e.target ).hasClass( 'nf-edit-settings' ) ) {\n\t\t\t\t\t\tjQuery( this ).addClass( 'ui-sortable-helper drag-selected' );\n\t\t\t\t\t\tjQuery( this ).ClassyWiggle( 'start', { degrees: ['.65', '1', '.65', '0', '-.65', '-1', '-.65', '0'], delay: 50 } );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'fields-' + type ).trigger( 'render:itemView', this );\n\t\t},\n\n\t\ttemplateHelpers: function () {\n\t \treturn {\n\t \t\trenderClasses: function() {\n\t \t\t\tvar classes = 'nf-field-wrap ' + this.type;\n\t \t\t\tif ( this.editActive ) {\n\t \t\t\t\tclasses += ' active';\n\t \t\t\t}\n\t \t\t\treturn classes;\n\t \t\t},\n\t \t\trenderRequired: function() {\n\t \t\t\tif ( 1 == this.required ) {\n\t \t\t\t\treturn '<span class=\"required\">*</span>';\n\t \t\t\t} else {\n\t \t\t\t\treturn '';\n\t \t\t\t}\n\t \t\t},\n\t \t\tgetFieldID: function() {\n\t\t\t\t\tif ( jQuery.isNumeric( this.id ) ) {\n\t\t\t\t\t\treturn 'field-' + this.id;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn this.id;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\trenderIcon: function() {\n\t \t\t\tvar type, icon;\n\n\t\t\t\t\ttype = nfRadio.channel( 'fields' ).request( 'get:type', this.type );\n\n\t\t\t\t\ticon = document.createElement( 'span' );\n\t\t\t\t\ticon.classList.add( 'fa', 'fa-' + type.get( 'icon' ) );\n\n\t\t\t\t\treturn icon.outerHTML;\n\t\t\t\t},\n\t\t\t\tlabelPosition: function() {\n\t\t\t\t\treturn this.label_pos;\n\t\t\t\t},\n\t\t\t\trenderDescriptionText: function() {\n\t\t\t\t\treturn jQuery.trim(this.desc_text);\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\n\t\tevents: {\n\t\t\t'mouseover .nf-item-control': 'mouseoverItemControl',\n\t\t\t'mousedown': 'maybeShortcut',\n\t\t\t'click': 'maybeClickEdit',\n\t\t\t'singletap': 'maybeTapEdit',\n\t\t\t'swipeleft': 'swipeLeft',\n\t\t\t'swiperight': 'swipeRight',\n\t\t\t'tapend': 'tapend'\n\t\t},\n\n\t\tmaybeClickEdit: function( e ) {\n\t\t\tif ( this.doingShortcut ) {\n\t\t\t\tthis.doingShortcut = false;\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\tif ( ( jQuery( e.target ).parent().hasClass( 'nf-fields-sortable' ) || jQuery( e.target ).parent().hasClass( 'nf-field-wrap' ) || jQuery( e.target ).hasClass( 'nf-field-wrap' ) ) && ! nfRadio.channel( 'app' ).request( 'is:mobile' ) ) {\n\t\t\t\tjQuery( ':focus' ).blur();\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tmaybeShortcut: function( e ) {\n\t\t\tvar keys = nfRadio.channel( 'app' ).request( 'get:keydown' );\n\t\t\t/*\n\t\t\t * If the shift key isn't held down, return.\n\t\t\t */\n\t\t\tif ( -1 == keys.indexOf( 16 ) ) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\t/*\n\t\t\t * If we are pressing D, delete this field.\n\t\t\t */\n\t\t\tif ( -1 != keys.indexOf( 68 ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:delete', e, this.model );\n\t\t\t\tthis.doingShortcut = true;\n\t\t\t\treturn false;\n\t\t\t} else if ( -1 != keys.indexOf( 67 ) ) {\n\t\t\t\tthis.doingShortcut = true;\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:duplicate', e, this.model );\n\t\t\t\treturn false;\n\t\t\t}\n\t\t},\n\n\t\tmaybeTapEdit: function( e ) {\n\t\t\tif ( jQuery( e.target ).parent().hasClass( 'nf-fields-sortable' ) ) {\n\t\t\t\tnfRadio.channel( 'app' ).trigger( 'click:edit', e, this.model );\n\t\t\t}\n\t\t},\n\n\t\tswipeLeft: function( e, touch ) {\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-duplicate' ).show();\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-delete' ).show();\n\t\t},\n\n\t\tswipeRight: function( e, touch ) {\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-duplicate' ).hide();\n\t\t\tjQuery( touch.startEvnt.target ).closest( 'div' ).find( '.nf-item-delete' ).hide();\n\t\t},\n\n\t\ttapend: function( e, touch ) {\n\t\t\tjQuery( this.el ).ClassyWiggle( 'stop' );\n\t\t\tjQuery( this.el ).removeClass( 'ui-sortable-helper drag-selected' );\n\t\t},\n\n\t\tremove: function(){\n\t\t\tif ( nfRadio.channel( 'fields' ).request( 'get:removing' ) ) {\n\t\t\t\tthis.$el.hide( 'clip', function(){\n\t\t\t\t\tjQuery( this ).remove();\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tthis.$el.remove();\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'fields' ).request( 'set:removing', false );\n\t\t},\n\n\t\tmouseoverItemControl: function( e ) {\n\t\t\tjQuery( this.el ).find( '.nf-item-control' ).css( 'display', '' );\n\t\t}\n\n\t});\n\n\treturn view;\n} );\n/**\n * Handles all the actions/functions related to our main field sortable.\n * All of the actual logic for our sortable is held here; the view just calls it using nfRadio.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/sortable',['models/fields/fieldModel', 'views/fields/fieldItem'], function(FieldModel, FieldItemView) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// When our field type buttons are dragged, we need to add or remove the active (blue) class.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:type', this.addActiveClass );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:type', this.removeActiveClass );\n\t\t\t// When our field staging is dragged, we need to add or remove the active (blue) class.\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:fieldStaging', this.addActiveClass );\n\t\t\tthis.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:fieldStaging', this.removeActiveClass );\n\t\t\t\n\t\t\t/*\n\t\t\t * Handles all the events fired by our sortable:\n\t\t\t * receive - dropped from type button or staging\n\t\t\t * over - dragging within or over the sortable\n\t\t\t * out - leaving the sortable\n\t\t\t * stop - stopped sorting/dragging\n\t\t\t * start - started sorting/dragging\n\t\t\t * update - stopped sorting/dragging and order has changed\n\t\t\t */\n\t\t\tnfRadio.channel( 'app' ).reply( 'receive:fieldsSortable', this.receiveFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'over:fieldsSortable', this.overfieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'out:fieldsSortable', this.outFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'stop:fieldsSortable', this.stopFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'start:fieldsSortable', this.startFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'update:fieldsSortable', this.updateFieldsSortable, this );\n\t\t\tnfRadio.channel( 'app' ).reply( 'receive:repeaterField', this.receiveRepeaterField, this );\n\t\t},\n\n\t\t/**\n\t\t * Add the active class to our sortable so that its border is blue.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\taddActiveClass: function() {\n\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\tjQuery( sortableEl ).addClass( 'nf-droppable-active' );\t\n\t\t},\n\n\t\t/**\n\t\t * Remove the active class from our sortable\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tremoveActiveClass: function() {\n\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-active' );\n\t\t},\n\n\t\t/**\n\t\t * Fires when we drop a field type button or staging onto our sortable\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\treceiveFieldsSortable: function( ui ) {\n\t\t\t//Check for fields coming from a repeater field\n\t\t\tui = this.receiveRepeaterField(ui);\n\t\t\t/*\n\t\t\t * We have to do different things if we're dealing with a field type button or staging area.\n\t\t\t */ \n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type Button\n\t\t\t\t// Get our type string\n\t\t\t\tvar type = jQuery( ui.item ).data( 'id' );\n\t\t\t\t// Add a field (returns the tmp ID )\n\t\t\t\tvar tmpID = this.addField( type, false );\n\t\t\t\t/*\n\t\t\t\t * Update our helper id to the tmpID.\n\t\t\t\t * We do this so that when we sort, we have the proper ID.\n\t\t\t\t */ \n\t\t\t\tjQuery( ui.helper ).prop( 'id', tmpID );\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields' );\n\t\t\t\t// Remove the helper. Gets rid of a weird type artifact.\n\t\t\t\tjQuery( ui.helper ).remove();\n\t\t\t\t// Trigger a drop field type event.\n\t\t\t\tnfRadio.channel( 'fields' ).trigger( 'drop:fieldType', type, tmpID );\n\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// Later, we want to reference 'this' context, so we define it here.\n\t\t\t\tvar that = this;\n\t\t\t\t// Make sure that our staged fields are sorted properly.\t\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:staging' );\n\t\t\t\t// Grab our staged fields.\n\t\t\t\tvar stagedFields = nfRadio.channel( 'fields' ).request( 'get:staging' );\n\t\t\t\t// Get our current field order.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\t\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) { // Sortable isn't empty\n\t\t\t\t\t// If we're dealing with a sortable that isn't empty, get the order.\n\t\t\t\t\tvar order = jQuery( sortableEl ).sortable( 'toArray' );\n\t\t\t\t} else { // Sortable is empty\n\t\t\t\t\t// Sortable is empty, all we care about is our staged field draggable.\n\t\t\t\t\tvar order = ['nf-staged-fields-drag'];\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t// Get the index of our droped element.\n\t\t\t\tvar insertedAt = order.indexOf( 'nf-staged-fields-drag' );\n\n\t\t\t\t// Loop through each staged fields model and insert a field.\n\t\t\t\tvar tmpIDs = [];\n\t\t\t\t_.each( stagedFields.models, function( field, index ) {\n\t\t\t\t\t// Add our field.\n\t\t\t\t\tvar tmpID = that.addField( field.get( 'slug' ) );\n\t\t\t\t\t// Add this newly created field to our order array.\n\t\t\t\t\torder.splice( insertedAt + index, 0, tmpID );\n\t\t\t\t} );\n\n\t\t\t\t// Remove our dropped element from our order array.\n\t\t\t\tvar insertedAt = order.indexOf( 'nf-staged-fields-drag' );\n\t\t\t\torder.splice( insertedAt, 1 );\n\t\t\t\t// Sort our fields\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields', order );\n\t\t\t\t// Clear our staging\n\t\t\t\tnfRadio.channel( 'fields' ).request( 'clear:staging' );\n\t\t\t\t// Remove our helper. Fixes a weird artifact.\n\t\t\t\tjQuery( ui.helper ).remove();\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add a field.\n\t\t * Builds the object necessary to add a field to the field model collection.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param string \ttype field type\n\t\t * @param boolean \tsilent add silently\n\t\t * @return string \ttmpID\n\t\t */\n\t\taddField: function( type, silent ) {\n\t\t\t// Default to false\n\t\t\tsilent = silent || false;\n\t\t\t// Get our field type model\n\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type ); \n\t\t\t// Get our tmp ID\n\t\t\tvar tmpID = nfRadio.channel( 'fields' ).request( 'get:tmpID' );\n\t\t\t// Add our field\n\t\t\tvar newModel = nfRadio.channel( 'fields' ).request( 'add', { id: tmpID, label: fieldType.get( 'nicename' ), type: type }, silent );\n\t\t\t// Add our field addition to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: 'Field',\n\t\t\t\tlabel: newModel.get( 'label' ),\n\t\t\t\tchange: 'Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: nfRadio.channel( 'fields' ).request( 'get:collection' )\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addObject', newModel, null, label, data );\n\n\t\t\treturn tmpID;\n\t\t},\n\n\t\t/**\n\t\t * When the user drags a field type or staging over our sortable, we need to modify the helper.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toverfieldsSortable: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type\n\t\t\t\t// String type\n\t\t\t\tvar type = jQuery( ui.helper ).data( 'id' );\n\t\t\t\t// Get our field type model.\n\t\t\t\tvar fieldType = nfRadio.channel( 'fields' ).request( 'get:type', type );\n\t\t\t\t// Get our field type nicename.\n\t\t\t\tvar label = fieldType.get( 'nicename' );\n\t\t\t\t// Get our sortable element.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\t// Get our fieldwidth.\n\t\t\t\tvar fieldWidth = jQuery( sortableEl ).width();\n\t\t\t\t// Set our currentHelper to an object var so that we can access it later.\n\t\t\t\tthis.currentHelper = ui.helper;\n\n\t\t\t\t// Render a fieldItemView using a mock fieldModel.\n\t\t\t\tvar fieldModel = new FieldModel({ label: fieldType.get( 'nicename' ), type: type });\n\t\t\t\tvar fieldItemView = new FieldItemView({model:fieldModel});\n\t\t\t\tvar renderedFieldItemView = fieldItemView.render();\n\t\t\t\tvar fieldTypeEl = renderedFieldItemView.$el[0];\n\t\t\t\tjQuery( ui.helper ).html( fieldTypeEl.outerHTML );\n\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// Get our sortable, and if it's initialized add our hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).addClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When the user moves a draggable outside of the sortable, we need to change the helper.\n\t\t * This returns the item to its pre-over state.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\toutFieldsSortable: function( ui ) {\n\t\t\tif( jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) ) { // Field Type\n\t\t\t\t/*\n\t\t\t\t * Get our helper clone.\n\t\t\t\t * This will let us access the previous label and classes of our helper.\n\t\t\t\t */ \n\t\t\t\tvar helperClone = nfRadio.channel( 'drawer-addField' ).request( 'get:typeHelperClone' );\n\t\t\t\t// Set our helper label, remove our sortable class, and add the type class back to the type draggable.\n\t\t\t\tjQuery( this.currentHelper ).html( jQuery( helperClone ).html() );\n\t\t\t\tjQuery( this.currentHelper ).removeClass( 'nf-field-wrap' ).addClass( 'nf-field-type-button' ).css( { 'width': '', 'height': '' } );\n\t\t\t\t// Get our sortable and if it has been intialized, remove the droppable hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t} else if ( jQuery( ui.item ).hasClass( 'nf-stage' ) ) { // Staging\n\t\t\t\t// If we've initialized our sortable, remove the droppable hover class.\n\t\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) {\n\t\t\t\t\tjQuery( sortableEl ).removeClass( 'nf-droppable-hover' );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * When we stop dragging in the sortable:\n\t\t * remove our opacity setting\n\t\t * remove our ui helper\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopFieldsSortable: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t\tjQuery( ui.helper ).remove();\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'sortable:stop', ui );\n\t\t},\n\n\t\t/**\n\t\t * When we start dragging in the sortable:\n\t\t * add an opacity setting of 0.5\n\t\t * show our item (jQuery hides the original item by default)\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartFieldsSortable: function( ui ) {\n\t\t\t// If we aren't dragging an item in from types or staging, update our change log.\n\t\t\tif( ! jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) && ! jQuery( ui.item ).hasClass( 'nf-stage' ) ) { \n\t\t\t\t\n\t\t\t\t// Maintain origional visibility during drag/sort.\n\t\t\t\tjQuery( ui.item ).show();\n\n\t\t\t\t// Determine helper based on builder/layout type.\n\t\t\t\tif(jQuery(ui.item).hasClass('nf-field-wrap')){\n\t\t\t\t\tvar newHelper = jQuery(ui.item).clone();\n\t\t\t\t} else if(jQuery(ui.item).parent().hasClass('layouts-cell')) {\n\t\t\t\t\tvar newHelper = $parentHelper.clone();\n\t\t\t\t} else {\n\t\t\t\t\tvar newHelper = jQuery(ui.item).clone();\n\t\t\t\t}\n\n\t\t\t\t// Remove unecessary item controls from helper.\n\t\t\t\tnewHelper.find('.nf-item-controls').remove();\n\n\t\t\t\t// Update helper with clone's content.\n\t\t\t\tjQuery( ui.helper ).html( newHelper.html() );\n\n\t\t\t\tjQuery( ui.helper ).css( 'opacity', '0.5' );\n\t\t\t\t\n\t\t\t\t// Add de-emphasize origional.\n\t\t\t\tjQuery( ui.item ).css( 'opacity', '0.25' );\n\t\t\t}\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'sortable:start', ui );\n\t\t},\n\n\t\t/**\n\t\t * Sort our fields when we change the order.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tupdateFieldsSortable: function( ui, sortable ) {\n\t\t\t\n\t\t\tnfRadio.channel( 'fields' ).request( 'sort:fields' );\n\n\t\t\t// If we aren't dragging an item in from types or staging, update our change log.\n\t\t\tif( ! jQuery( ui.item ).hasClass( 'nf-field-type-draggable' ) && ! jQuery( ui.item ).hasClass( 'nf-stage' ) ) { \n\n\t\t\t\tvar fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\t\t\t\tvar dragFieldID = jQuery( ui.item ).prop( 'id' ).replace( 'field-', '' );\n\t\t\t\tvar dragModel = fieldCollection.get( dragFieldID );\n\n\t\t\t\t// Add our change event to the change tracker.\n\t\t\t\tvar data = { fields: [] };\n\t\t\t\t_.each( fieldCollection.models, function( field ) {\n\t\t\t\t\tvar oldPos = field._previousAttributes.order;\n\t\t\t\t\tvar newPos = field.get( 'order' );\n\t\t\t\t\t\n\t\t\t\t\tdata.fields.push( {\n\t\t\t\t\t\tmodel: field,\n\t\t\t\t\t\tattr: 'order',\n\t\t\t\t\t\tbefore: oldPos,\n\t\t\t\t\t\tafter: newPos\n\t\t\t\t\t} );\n\n\t\t\t\t} );\n\n\t\t\t\tvar label = {\n\t\t\t\t\tobject: 'Field',\n\t\t\t\t\tlabel: dragModel.get( 'label' ),\n\t\t\t\t\tchange: 'Re-ordered from ' + dragModel._previousAttributes.order + ' to ' + dragModel.get( 'order' ),\n\t\t\t\t\tdashicon: 'sort'\n\t\t\t\t};\n\n\t\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'sortFields', dragModel, null, label, data );\n\t\t\t}\n\n\t\t},\n\n\t\treceiveRepeaterField: function( ui ){\n\t\t\t//If the field was already saved as a Repeater child field we'll delete it and create a new one for the main collection\n\t\t\tif( String( jQuery( ui.item ).data('id') ).indexOf('.') !== -1){\n\t\t\t\tjQuery( ui.item ).removeClass('nf-field-wrap');\n\t\t\t\tlet type = jQuery( ui.item ).attr('class');\n\t\t\t\tjQuery( ui.item ).data('id', type);\n\t\t\t\tjQuery( ui.item ).addClass('nf-field-type-draggable');\n\t\t\t}\n\n\t\t\treturn ui;\n\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Handles interactions with our field collection.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/fields/data',['models/fields/fieldCollection', 'models/fields/fieldModel'], function( fieldCollection, fieldModel ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tadding: false,\n\t\tremoving: false,\n\t\t\n\t\tinitialize: function() {\n\t\t\t// Load our field collection from our localized form data\n\t\t\tthis.collection = new fieldCollection( preloadedFormData.fields );\n\t\t\t// Set our removedIDs to an empty object. This will be populated when a field is removed so that we can add it to our 'deleted_fields' object.\n\t\t\tthis.collection.removedIDs = {};\n\n\t\t\t// Respond to requests for data about fields and to update/change/delete fields from our collection.\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:collection', this.getFieldCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:field', this.getField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'redraw:collection', this.redrawFieldCollection, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:tmpID', this.getTmpFieldID, this );\n\n\t\t\tnfRadio.channel( 'fields' ).reply( 'add', this.addField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'delete', this.deleteField, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'sort:fields', this.sortFields, this );\n\n\t\t\t/*\n\t\t\t * Respond to requests to set our 'adding' and 'removing' state. This state is used to track whether or not\n\t\t\t * we should run animations in our fields collection.\n\t\t\t */\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:adding', this.getAdding, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'set:adding', this.setAdding, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'get:removing', this.getRemoving, this );\n\t\t\tnfRadio.channel( 'fields' ).reply( 'set:removing', this.setRemoving, this );\n\t\t},\n\n\t\tgetFieldCollection: function() {\n\t\t\treturn this.collection;\n\t\t},\n\n\t\tredrawFieldCollection: function() {\n\t\t\tthis.collection.trigger( 'reset', this.collection );\n\t\t},\n\n\t\tgetField: function( id ) {\n\t\t\tif ( this.collection.findWhere( { key: id } ) ) {\n\t\t\t\t/*\n\t\t\t\t * First we check to see if a key matches what we were sent.\n\t\t\t\t */\t\t\t\t\n\t\t\t\treturn this.collection.findWhere( { key: id } );\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t * If it doesn't, we try to return an ID that matches.\n\t\t\t\t */\n\t\t\t\treturn this.collection.get( id );\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add a field to our collection. If silent is passed as true, no events will trigger.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object \tdata \t\t\tfield data to insert\n\t\t * @param bool \t\tsilent \t\t\tprevent events from firing as a result of adding\n\t\t * @param bool \trenderTrigger\tshould this cause the view to re-render?\n\t\t * @param string \taction\t\t\taction context - are we performing a higher level action? i.e. duplicate\n\t\t */\n\t\taddField: function( data, silent, renderTrigger, action ) {\n\n\t\t\t/*\n\t\t\t * Set our fields 'adding' value to true. This enables our add field animation.\n\t\t\t */\n\t\t\tnfRadio.channel( 'fields' ).request( 'set:adding', true );\n\n\t\t\tsilent = silent || false;\n\t\t\taction = action || '';\n\t\t\trenderTrigger = ( 'undefined' == typeof renderTrigger ) ? true : renderTrigger;\n\n\t\t\tif ( false === data instanceof Backbone.Model ) {\n\t\t\t\tif ( 'undefined' == typeof ( data.id ) ) {\n\t\t\t\t\tdata.id = this.getTmpFieldID();\n\t\t\t\t}\n\t\t\t\tvar model = new fieldModel( data );\n\t\t\t} else {\n\t\t\t\tvar model = data;\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * TODO: Add an nfRadio message filter for the model variable.\n\t\t\t * Currently, we manually replace for saved fields; this should be moved to a separate controller.\n\t\t\t * \n\t\t\t * If we're adding a saved field, make sure that we set the type to the parentType.\n\t\t\t */\n\n\t\t\tif ( jQuery.isNumeric( model.get( 'type' ) ) ) {\n\t\t\t\tvar savedType = nfRadio.channel( 'fields' ).request( 'get:type', model.get( 'type' ) );\n\t\t\t\tmodel.set( 'type', savedType.get( 'parentType' ) );\n\t\t\t}\n\n\t\t\tvar newModel = this.collection.add( model, { silent: silent } );\n\t\t\t\n\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'add:field', model );\n\t\t\tif ( renderTrigger ) {\n\t\t\t\tnfRadio.channel( 'fields' ).trigger( 'render:newField', newModel, action );\n\t\t\t}\n\t\t\tif( 'duplicate' == action ){\n nfRadio.channel( 'fields' ).trigger( 'render:duplicateField', newModel, action );\n\t\t\t}\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'after:addField', model );\n\t\t\t\n\t\t\treturn model;\n\t\t},\n\n\t\t/**\n\t\t * Update a field setting by ID\n\t\t * \n\t\t * @since 3.0\n\t\t * @param int \t\tid field id\n\t\t * @param string \tname setting name\n\t\t * @param mixed \tvalue setting value\n\t\t * @return void\n\t\t */\n\t\tupdateFieldSetting: function( id, name, value ) {\n\t\t\tvar fieldModel = this.collection.get( id );\n\t\t\tfieldModel.set( name, value );\n\t\t},\n\n\t\t/**\n\t\t * Get our fields sortable EL\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Array \torder optional order array like: [field-1, field-4, field-2]\n\t\t * @return void\n\t\t */\n\t\tsortFields: function( order, ui, updateDB ) {\n\t\t\tif ( null == updateDB ) {\n\t\t\t\tupdateDB = true;\n\t\t\t}\n\t\t\t// Get our sortable element\n\t\t\tvar sortableEl = nfRadio.channel( 'fields' ).request( 'get:sortableEl' );\n\t\t\tif ( jQuery( sortableEl ).hasClass( 'ui-sortable' ) ) { // Make sure that sortable is enabled\n\t\t\t\t// JS ternerary for setting our order\n\t\t\t\tvar order = order || jQuery( sortableEl ).sortable( 'toArray' );\n\n\t\t\t\t// Loop through all of our fields and update their order value\n\t\t\t\t_.each( this.collection.models, function( field ) {\n\t\t\t\t\t// Get our current position.\n\t\t\t\t\tvar oldPos = field.get( 'order' );\n\t\t\t\t\tvar id = field.get( 'id' );\n\t\t\t\t\tif ( jQuery.isNumeric( id ) ) {\n\t\t\t\t\t\tvar search = 'field-' + id;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tvar search = id;\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\t// Get the index of our field inside our order array\n\t\t\t\t\tvar newPos = order.indexOf( search ) + 1;\n\t\t\t\t\tfield.set( 'order', newPos );\n\t\t\t\t} );\n\t\t\t\tthis.collection.sort();\n\n\t\t\t\tif ( updateDB ) {\n\t\t\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\t\t\t// Update our preview\n\t\t\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\t\t\t\t\t\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Delete a field from our collection.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \tfield model to be deleted\n\t\t * @return void\n\t\t */\n\t\tdeleteField: function( model ) {\n\t\t\tnfRadio.channel( 'fields' ).trigger( 'delete:field', model );\n\t\t\tthis.removing = true;\n\t\t\tthis.collection.remove( model );\n\n\t\t\t// Set our 'clean' status to false so that we get a notice to publish changes\n\t\t\tnfRadio.channel( 'app' ).request( 'update:setting', 'clean', false );\n\t\t\tnfRadio.channel( 'app' ).request( 'update:db' );\n\n\t\t},\n\n\t\t/**\n\t\t * Return a new tmp id for our fields.\n\t\t * Gets the field collection length, adds 1, then returns that prepended with 'tmp-'.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return string\n\t\t */\n\t\tgetTmpFieldID: function() {\n\t\t\tvar tmpNum = this.collection.tmpNum;\n\t\t\tthis.collection.tmpNum++;\n\t\t\treturn 'tmp-' + tmpNum;\n\t\t},\n\n\t\tgetAdding: function() {\n\t\t\treturn this.adding;\n\t\t},\n\n\t\tsetAdding: function( val ) {\n\t\t\tthis.adding = val;\n\t\t},\n\n\t\tgetRemoving: function() {\n\t\t\treturn this.removing;\n\t\t},\n\n\t\tsetRemoving: function( val ) {\n\t\t\tthis.removing = val;\n\t\t}\n\t});\n\n\treturn controller;\n} );\n/**\n * Model for our repeater option.\n * \n * @package Ninja App builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/optionRepeaterModel',[], function() {\n\tvar model = Backbone.Model.extend( {\n\t\tdefaults: {\n\t\t\terrors: {},\n max_options: 0,\n\t\t},\n\n\t\tinitialize: function() {\n\t\t\t// When we add errors to the option row, run a function.\n\t\t\tthis.on( 'change:errors', this.changeErrors, this );\n\t\t},\n\n\t\t/**\n\t\t * When we change the errors on our model, check to see if we should add or remove \n\t\t * the error from the setting that this option is a part of.\n\t\t *\n\t\t * Adding an error to the setting model simply disables the drawer and other\n\t\t * navigation. As long as we have one option with an error, it should be set to true.\n\t\t * \n\t\t * @since 3.0\n\t\t * @return void\n\t\t */\n\t\tchangeErrors: function( model ) {\n\t\t\t/*\n\t\t\t * The errors attribute will be an object, so if we don't have any keys, it's empty.\n\t\t\t * If we have an empty object, check to see if we can remove the error from our setting model.\n\t\t\t */\n\n\t\t\tif ( 0 == _.size( model.get( 'errors' ) ) ) {\n\t\t\t\t/*\n\t\t\t\t * Loop through our collection to see if we have any other errors.\n\t\t\t\t */\n\t\t\t\tvar errorsFound = false;\n\t\t\t\t_.each( model.collection.models, function( opt ) {\n\t\t\t\t\tif ( 0 != _.size( opt.get( 'errors' ) ) ) {\n\t\t\t\t\t\terrorsFound = true;\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\tif ( ! errorsFound ) {\n\t\t\t\t\tmodel.collection.settingModel.set( 'error', false );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t * We have errors, so make sure that the setting model has an error set.\n\t\t\t\t */\n\t\t\t\tmodel.collection.settingModel.set( 'error', true );\n\t\t\t}\n\t\t}\n\t} );\n\t\n\treturn model;\n} );\n/**\n * Model that represents our list options.\n * \n * @package Ninja Forms builder\n * @subpackage Fields\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'models/app/optionRepeaterCollection',['models/app/optionRepeaterModel'], function( listOptionModel ) {\n\tvar collection = Backbone.Collection.extend( {\n\t\tmodel: listOptionModel,\n\t\tcomparator: function( model ){\n\t\t\treturn parseInt( model.get( 'order' ) );\n\t\t},\n\n\t\tinitialize: function( models, options ) {\n\t\t\t// Listen to the 'sort' event\n\t\t\tthis.on( 'sort', this.changeCollection, this );\n\t\t\t// Listen to the 'add' event\n\t\t\tthis.on( 'add', this.addOption, this );\n\t\t\tthis.settingModel = options.settingModel;\n\t\t},\n\n\t\tchangeCollection: function() {\n\t\t\t// Trigger a 'sort:options' event so that our field model can update\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'sort:options', this );\n\n\t\t\tif ('undefined' !== typeof this.settingModel ) {\n\t\t\t\tnfRadio.channel('option-repeater-' + this.settingModel.get('name')).trigger('sort:options', this);\n\t\t\t}\n\t\t},\n\n\t\taddOption: function( model, collection ) {\n\t\t\tmodel.set( 'settingModel', this.settingModel );\n\t\t}\n\t} );\n\treturn collection;\n} );\ndefine( 'views/app/drawer/optionRepeaterError',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'div',\n\t\tclassName: 'nf-error',\n\t\ttemplate: '#tmpl-nf-edit-setting-option-repeater-error',\n\n\t\ttemplateHelpers: function() {\n\t\t\tvar that = this;\n\t\t\treturn {\n\t\t\t\trenderErrors: function() {\n\t\t\t\t if ( 'undefined' != typeof that.errors ) {\n \t\t\t\t\treturn that.errors[ Object.keys( errors )[0] ];\n \t\t\t\t\t} else {\n \t\t\t\t\t\treturn '';\n \t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/optionRepeaterOption',['views/app/drawer/optionRepeaterError'], function( ErrorView ) {\n var view = Marionette.LayoutView.extend({\n tagName: 'div',\n className: 'nf-table-row',\n template: '#tmpl-nf-edit-setting-option-repeater-default-row',\n id: function() {\n return this.model.cid;\n },\n\n regions: {\n error: '.nf-option-error'\n },\n\n initialize: function( data ) {\n this.settingModel = data.settingModel;\n this.dataModel = data.dataModel;\n this.collection = data.collection;\n this.columns = data.columns;\n this.parentView = data.parentView;\n this.model.on( 'change:errors', this.renderErrors, this );\n\n // Removed because the re-render was breaking tag insertion for merge tags.\n // this.model.on( 'change', this.render, this );\n\n if ( 'undefined' != typeof this.settingModel.get( 'tmpl_row' ) ) {\n this.template = '#' + this.settingModel.get( 'tmpl_row' );\n }\n\n this.hasErrors = false;\n },\n\n onBeforeDestroy: function() { \n this.model.off( 'change', this.render );\n this.model.off( 'change:errors', this.renderErrors );\n },\n\n onBeforeRender: function() {\n /*\n * We want to escape any HTML being output for our label.\n */\n if ( this.model.get( 'label' ) ) {\n var label = this.model.get( 'label' );\n this.model.set( 'label', _.escape( label ), { silent: true } );\n }\n \n },\n\n onRender: function() {\n nfRadio.channel( 'mergeTags' ).request( 'init', this );\n /*\n * Send out a radio message.\n */\n nfRadio.channel( 'setting-' + this.settingModel.get( 'name' ) + '-option' ).trigger( 'render:setting', this.model, this.dataModel, this );\n /*\n * We want to unescape any HTML being output for our label.\n */\n if ( this.model.get( 'label' ) ) {\n var label = this.model.get( 'label' );\n this.model.set( 'label', _.unescape( label ), { silent: true } );\n }\n },\n\n onShow: function() {\n if ( this.model.get( 'new' ) ) {\n jQuery( this.el ).find( 'input:first' ).focus();\n this.model.set( 'new', false );\n }\n },\n\n events: {\n 'change .setting': 'changeOption',\n 'click .nf-delete': 'deleteOption',\n 'keyup': 'keyupOption'\n },\n\n changeOption: function( e ) {\n nfRadio.channel( 'option-repeater' ).trigger( 'change:option', e, this.model, this.dataModel, this.settingModel, this );\n },\n\n deleteOption: function( e ) {\n nfRadio.channel( 'option-repeater' ).trigger( 'click:deleteOption', this.model, this.collection, this.dataModel, this );\n },\n\n keyupOption: function( e ) {\n this.maybeAddOption( e );\n nfRadio.channel( 'option-repeater' ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n nfRadio.channel( 'option-repeater-' + this.settingModel.get( 'name' ) ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n },\n\n maybeAddOption: function( e ) {\n if ( 13 == e.keyCode && 'calculations' != this.settingModel.get( 'name' ) ) {\n nfRadio.channel( 'option-repeater' ).trigger( 'click:addOption', this.collection, this.dataModel, this );\n jQuery( this.parentView.children.findByIndex(this.parentView.children.length - 1).el ).find( '[data-id=\"label\"]' ).focus();\n }\n },\n\n renderErrors: function() {\n \n // if ( jQuery.isEmptyObject( this.model.get( 'errors' ) ) ) {\n // return false;\n // }\n\n /*\n * We don't want to redraw the entire row, which would remove focus from the eq textarea,\n * so we add and remove error classes manually.\n */\n if ( 0 == Object.keys( this.model.get( 'errors' ) ) ) {\n if ( this.hasErrors ) {\n this.error.empty();\n jQuery( this.el ).removeClass( 'nf-error' );\n }\n } else {\n this.hasErrors = true;\n this.error.show( new ErrorView( { model: this.model } ) );\n jQuery( this.el ).addClass( 'nf-error' );\n }\n },\n\n templateHelpers: function() {\n var that = this;\n return {\n getColumns: function() {\n var columns = that.columns;\n if(!nfAdmin.devMode){\n delete columns.value;\n delete columns.calc;\n }\n return columns;\n },\n renderFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, label;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.label = '--';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n fields.each( function( field ){\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.label = field.formatLabel();\n select.appendChild( option );\n });\n\n label = document.createElement( 'label' );\n label.classList.add( 'nf-select' );\n label.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n label.appendChild( emptyContainer );\n\n // The template requires a string.\n return label.innerHTML;\n },\n renderNonSaveFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, label;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.label = '--';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n // Build a lookup table for fields we want to remove from our fields list.\n var removeFieldsLookup = [ 'html', 'submit', 'hr',\n 'recaptcha', 'spam', 'creditcard', 'creditcardcvc',\n 'creditcardexpiration', 'creditcardfullname',\n 'creditcardnumber', 'creditcardzip' ];\n\n fields.each( function( field ){\n // Check for the field type in our lookup array and...\n if( jQuery.inArray( field.get( 'type' ), removeFieldsLookup ) !== -1 ) {\n // Return if the type is in our lookup array.\n return '';\n }\n\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.label = field.formatLabel();\n select.appendChild( option );\n });\n\n label = document.createElement( 'label' );\n label.classList.add( 'nf-select' );\n label.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n label.appendChild( emptyContainer );\n\n // The template requires a string.\n return label.innerHTML;\n },\n renderOptions: function( column, value ) {\n\n if( 'undefined' == typeof that.options.columns[ column ] ) return;\n\n var select = document.createElement( 'select' );\n \n _.each( that.options.columns[ column ].options, function( option ){\n var optionNode = document.createElement( 'option' );\n if ( value === option.value ) {\n optionNode.setAttribute( 'selected', 'selected' );\n }\n optionNode.setAttribute( 'value', option.value );\n optionNode.setAttribute( 'label', option.label );\n optionNode.innerText = option.label;\n select.appendChild( optionNode );\n });\n\n // The template only needs the options.\n return select.innerHTML;\n }\n\n }\n }\n\n });\n\n return view;\n} );\n\ndefine( 'views/app/drawer/optionRepeaterEmpty',[], function() {\n\tvar view = Marionette.ItemView.extend({\n\t\ttagName: 'tr',\n\t\ttemplate: '#tmpl-nf-edit-setting-option-repeater-empty'\n\t});\n\n\treturn view;\n} );\ndefine( 'views/app/drawer/optionRepeaterComposite',['views/app/drawer/optionRepeaterOption', 'views/app/drawer/optionRepeaterEmpty', 'models/app/optionRepeaterCollection'], function( listOptionView, listEmptyView, listOptionCollection ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-edit-setting-option-repeater-wrap',\n\t\tchildView: listOptionView,\n\t\temptyView: listEmptyView,\n\t\treorderOnSort: false,\n\n\t\tinitialize: function( data ) {\n\n\t\t\t/*\n\t\t\t * Our options are stored in our database as objects, not collections.\n\t\t\t * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n\t\t\t */ \n\t\t\tvar optionCollection = data.dataModel.get( this.model.get( 'name' ) );\n\n\t\t\tif ( false == optionCollection instanceof Backbone.Collection ) {\n\t\t\t\toptionCollection = new listOptionCollection( [], { settingModel: this.model } );\n\t\t\t\toptionCollection.add( data.dataModel.get( this.model.get( 'name' ) ) );\n\t\t\t\tdata.dataModel.set( this.model.get( 'name' ), optionCollection, { silent: true } );\n\t\t\t}\n\n\t\t\tthis.collection = optionCollection;\n\t\t\tthis.dataModel = data.dataModel;\n\t\t\tthis.childViewOptions = { parentView: this, settingModel: this.model, collection: this.collection, dataModel: data.dataModel, columns: this.model.get( 'columns' ) };\n\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\t// If we don't have a 'settings' property, this is a legacy depdency setup.\n\t\t\t\tif ( 'undefined' == typeof deps.settings ) {\n\t\t\t\t\tdeps.settings = [];\n\t\t\t\t\t_.each(deps, function(dep, name){\n\t\t\t\t\t\tif( 'settings' !== name ) {\n\t\t\t\t\t\t\tdeps.settings.push( { name: name, value: dep } );\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tdeps.match = 'all';\n\t\t\t\t}\n\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tlet name = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.on( 'change:' + name, this.render, this );\n\t\t\t\t}\n\t\t\t}\n this.listenTo( nfRadio.channel( 'option-repeater' ), 'added:option', this.maybeHideNew );\n this.listenTo( nfRadio.channel( 'option-repeater' ), 'removed:option', this.maybeHideNew );\n\t\t},\n\n\t\tonBeforeDestroy: function() {\n\t\t\tvar deps = this.model.get( 'deps' );\n\t\t\tif ( deps ) {\n\t\t\t\tfor (var i = deps.settings.length - 1; i >= 0; i--) {\n\t\t\t\t\tname = deps.settings[i].name;\n\t\t\t\t\tthis.dataModel.off( 'change:' + name, this.render );\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tonRender: function() {\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\n\t\t\t// this.$el = this.$el.children();\n\t\t\t// this.$el.unwrap();\n\t\t\t// this.setElement( this.$el );\n\t\t\n\t\t\tvar that = this;\n\t\t\tjQuery( this.el ).find( '.nf-list-options-tbody' ).sortable( {\n\t\t\t\thandle: '.handle',\n\t\t\t\thelper: 'clone',\n\t\t\t\tplaceholder: 'nf-list-options-sortable-placeholder',\n\t\t\t\tforcePlaceholderSize: true,\n\t\t\t\topacity: 0.95,\n\t\t\t\ttolerance: 'pointer',\n\n\t\t\t\tstart: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).request( 'start:optionSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tstop: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).request( 'stop:optionSortable', ui );\n\t\t\t\t},\n\n\t\t\t\tupdate: function( e, ui ) {\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).request( 'update:optionSortable', ui, this, that );\n\t\t\t\t}\n\t\t\t} );\n\n that.setupTooltip();\n that.maybeHideNew( that.collection );\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'render:setting', this.model, this.dataModel, this );\n\t\t\n\t\t},\n\n\t\tonAttach: function() {\n \n\t\t\tvar importLink = jQuery( this.el ).find( '.nf-open-import-tooltip' );\n\t\t\tvar jBox = jQuery( importLink ).jBox( 'Tooltip', {\n title: '<h3>Please enter your options below:</h3>',\n content: ( \"1\" == nfAdmin.devMode ? jQuery( this.el ).find( '.nf-dev-import-options' ) : jQuery( this.el ).find( '.nf-import-options' ) ),\n trigger: 'click',\n closeOnClick: 'body',\n closeButton: 'box',\n offset: { x: 20, y: 0 },\n addClass: 'import-options',\n\n onOpen: function() {\n \tvar that = this;\n \tsetTimeout( function() { jQuery( that.content ).find( 'textarea' ).focus(); }, 200 );\n }\n } );\n\n\t\t\tjQuery( this.el ).find( '.nf-import' ).on( 'click', { view: this, jBox: jBox }, this.clickImport );\n\n\t\t\t/*\n\t\t\t * Send out a radio message.\n\t\t\t */\n\t\t\tnfRadio.channel( 'setting-' + this.model.get( 'name' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t\tnfRadio.channel( 'setting-type-' + this.model.get( 'type' ) ).trigger( 'attach:setting', this.model, this.dataModel, this );\n\t\t},\n \n /**\n * Function to append jBox modals to each tooltip element in the option repeater.\n */\n setupTooltip: function() {\n // For each .nf-help in the option repeater...\n jQuery( this.el ).find( '.nf-list-options' ).find( '.nf-help' ).each(function() {\n // Get the content.\n var content = jQuery(this).next('.nf-help-text');\n // Declare the modal.\n jQuery( this ).jBox( 'Tooltip', {\n content: content,\n maxWidth: 200,\n theme: 'TooltipBorder',\n trigger: 'click',\n closeOnClick: true\n })\n });\n },\n\n\t\ttemplateHelpers: function () {\n\t\t\tvar that = this;\n\n\t \treturn {\n\t \t\trenderHeaders: function() {\n // If this is a Field...\n // AND If the type includes 'list'...\n if ( 'Field' == that.dataModel.get( 'objectType' ) && -1 !== that.dataModel.get( 'type' ).indexOf( 'list' ) ) {\n // Declare help text.\n var helpText, helpTextContainer, helpIcon, helpIconLink, helpTextWrapper;\n\n helpText = document.createTextNode( nfi18n.valueChars );\n helpTextContainer = document.createElement( 'div' );\n helpTextContainer.classList.add( 'nf-help-text' );\n helpTextContainer.appendChild( helpText );\n\n helpIcon = document.createElement( 'span' );\n helpIcon.classList.add( 'dashicons', 'dashicons-admin-comments' );\n helpIconLink = document.createElement( 'a' );\n helpIconLink.classList.add( 'nf-help' );\n helpIconLink.setAttribute( 'href', '#' );\n helpIconLink.setAttribute( 'tabindex', '-1' );\n helpIconLink.appendChild( helpIcon );\n\n helpTextWrapper = document.createElement( 'span' );\n helpTextWrapper.appendChild( helpIconLink );\n helpTextWrapper.appendChild( helpTextContainer );\n\n\t\t\t\t\t\t// Append the help text to the 'value' header.\n\t\t\t\t\t\tif('undefined' !== typeof that.model.get('columns') ){\n\t\t\t\t\t\t\tif('undefined' !== typeof that.model.get('columns').value ){\n\t\t\t\t\t\t\t\tif ( -1 == that.model.get('columns').value.header.indexOf( helpTextWrapper.innerHTML ) ) {\n\t\t\t\t\t\t\t\t\tthat.model.get('columns').value.header += helpTextWrapper.innerHTML;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n }\n\t \t\t\tvar columns, beforeColumns, afterColumns;\n\n\t \t\t\tbeforeColumns = document.createElement( 'div' );\n\n\t \t\t\tcolumns = document.createElement( 'span' );\n\t \t\t\tcolumns.appendChild( beforeColumns );\n\n\t\t\t\t\tif(!nfAdmin.devMode){\n\t\t\t\t\t\tdelete this.columns.value;\n\t\t\t\t\t\tdelete this.columns.calc;\n\t\t\t\t\t}\n\n\t \t\t\t_.each( this.columns, function( col ) {\n\t \t\t\t\tvar headerText, headerContainer;\n\n\t \t\t\t\t// Use a fragment to support HTML in the col.header property, ie Dashicons.\n headerText = document.createRange().createContextualFragment( col.header );\n\t \t\t\t\theaderContainer = document.createElement( 'div' );\n\t \t\t\t\theaderContainer.appendChild( headerText );\n\n\t \t\t\t\tcolumns.appendChild( headerContainer );\n\t \t\t\t} );\n\n afterColumns = document.createElement( 'div' );\n columns.appendChild( afterColumns );\n\n\t\t\t\t\treturn columns.innerHTML;\n\t\t\t\t},\n\n\t \t\trenderSetting: function() {\n\t \t\t\tvar setting = nfRadio.channel( 'app' ).request( 'get:template', '#tmpl-nf-edit-setting-' + this.type );\n\t\t\t\t\treturn setting( this );\n\t\t\t\t},\n\n\t\t\t\trenderClasses: function() {\n\t\t\t\t\tvar classes = '';\n\t\t\t\t\tif ( 'undefined' != typeof this.width ) {\n\t\t\t\t\t\tclasses += this.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclasses += ' one-half';\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\tclasses += ' nf-error';\n\t\t\t\t\t}\n\n\t\t\t\t\treturn classes;\n\t\t\t\t},\n\n\t\t\t\trenderVisible: function() {\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'check:deps', this, that );\n\t \t\t},\n\n\t\t\t\trenderError: function() {\n\t\t\t\t\tif ( this.error ) {\n\t\t\t\t\t\treturn this.error;\n\t\t\t\t\t}\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\n\t\t\t\trenderFieldsetClasses: function() {\n\t\t\t\t\treturn that.model.get( 'name' );\n\t\t\t\t},\n\n\t\t\t\tcurrencySymbol: function() {\n\t\t\t\t\treturn nfRadio.channel( 'settings' ).request( 'get:setting', 'currency' ) || nfi18n.currency_symbol;\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\n\t\tattachHtml: function( collectionView, childView ) {\n\t\t\tjQuery( collectionView.el ).find( '.nf-list-options-tbody' ).append( childView.el );\n\t\t\tnfRadio.channel( 'mergeTags' ).request( 'init', this );\n\t\t},\n\n\t\tevents: {\n\t\t\t'click .nf-add-new': 'clickAddOption',\n\t\t\t'click .extra': 'clickExtra'\n\t\t},\n \n maybeHideNew: function( collection ) {\n\t\t\tif( 'undefined' == typeof collection.settingModel ) return false;\n var limit = collection.settingModel.get( 'max_options' );\n if( 0 !== limit && collection.models.length >= ( limit ) ) {\n jQuery(this.el).find('.nf-add-new').addClass('disabled');\n } else {\n jQuery(this.el).find('.nf-add-new').removeClass('disabled');\n }\n },\n\n\t\tclickAddOption: function( e ) {\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'click:addOption', this.collection, this.dataModel );\n\t\t\tjQuery( this.children.findByIndex(this.children.length - 1).el ).find( '[data-id=\"label\"]' ).focus();\n\t\t},\n\n\t\tclickExtra: function( e ) {\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'click:extra', e, this.collection, this.dataModel );\n\t\t\tnfRadio.channel( 'option-repeater-' + this.model.get( 'name' ) ).trigger( 'click:extra', e, this.model, this.collection, this.dataModel );\n\t\t},\n\n\t\tclickImport: function( e ) {\n\t\t\tvar textarea = jQuery( e.data.jBox.content ).find( 'textarea' );\n\t\t\tvar value = textarea.val().trimLeft().trimRight();\n\t\t\t/*\n\t\t\t * Return early if we have no strings.\n\t\t\t */\n\t\t\tif ( 0 == value.length ) {\n\t\t\t\te.data.jBox.close();\n\t\t\t\treturn false;\n\t\t\t}\t\t\t\n\t\t\t/*\n\t\t\t * Split our value based on new lines.\n\t\t\t */\n\n\t\t\tvar lines = value.split(/\\n/);\n\t\t\tif ( _.isArray( lines ) ) {\n\t\t\t\t/*\n\t\t\t\t * Loop over \n\t\t\t\t */\n\t\t\t\t_.each( lines, function( line ) {\n\t\t\t\t\tvar row = line.split( ',' );\n\t\t\t\t\tvar label = row[0];\n\t\t\t\t\tvar value = row[1] || jQuery.slugify( label, { separator: '-' } );\n\t\t\t\t\tvar calc = row[2] || '';\n\n\t\t\t\t\tlabel = label.trimLeft().trimRight();\n\t\t\t\t\tvalue = value.trimLeft().trimRight();\n\t\t\t\t\tcalc = calc.trimLeft().trimRight();\n\t\t\t\t\t/*\n\t\t\t\t\t * Add our row to the collection\n\t\t\t\t\t */\n\t\t\t\t\tvar model = e.data.view.collection.add( { label: row[0], value: value, calc: calc } );\n\t\t\t\t\t// Add our field addition to our change log.\n\t\t\t\t\tvar label = {\n\t\t\t\t\t\tobject: 'field',\n\t\t\t\t\t\tlabel: row[0],\n\t\t\t\t\t\tchange: 'Option Added',\n\t\t\t\t\t\tdashicon: 'plus-alt'\n\t\t\t\t\t};\n\n\t\t\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addListOption', model, null, label );\n\t\t\t\t\tnfRadio.channel( 'option-repeater-' + e.data.view.model.get( 'name' ) ).trigger( 'add:option', model );\n\t\t\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'add:option', model );\n\t\t\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', model );\n\t\t\t\t}, this );\n\t\t\t\t/*\n\t\t\t\t * Set our state to unclean so that the user can publish.\n\t\t\t\t */\n\t\t\t} else {\n\t\t\t\t/*\n\t\t\t\t * TODO: Error Handling Here\n\t\t\t\t */\n\t\t\t}\n\t\t\ttextarea.val( '' );\n\t\t\te.data.jBox.close();\n\t\t},\n\t} );\n\n\treturn view;\n} );\n\n/**\n * Handles tasks associated with our option-repeater.\n * \n * Return our repeater child view.\n *\n * Also listens for changes to the options settings.\n * \n * @package Ninja Forms builder\n * @subpackage App\n * @copyright (c) 2015 WP Ninjas\n * @since 3.0\n */\ndefine( 'controllers/app/optionRepeater',['models/app/optionRepeaterModel', 'models/app/optionRepeaterCollection', 'views/app/drawer/optionRepeaterComposite'], function( listOptionModel, listOptionCollection, listCompositeView ) {\n\tvar controller = Marionette.Object.extend( {\n\t\tinitialize: function() {\n\t\t\t// Respond to requests for the childView for list type fields.\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'get:settingChildView', this.getSettingChildView, this );\n\t\t\t\n\t\t\t// Listen for changes to our list options.\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'change:option', this.changeOption );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'click:addOption', this.addOption );\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'click:deleteOption', this.deleteOption );\n\n\t\t\t// Respond to requests related to our list options sortable.\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'update:optionSortable', this.updateOptionSortable, this );\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'stop:optionSortable', this.stopOptionSortable, this );\n\t\t\tnfRadio.channel( 'option-repeater' ).reply( 'start:optionSortable', this.startOptionSortable, this );\n\t\t\n\t\t\t/**\n\t\t\t * When we init our setting model, we need to convert our array/objects into collections/models\n\t\t\t */\n\t\t\tthis.listenTo( nfRadio.channel( 'option-repeater' ), 'init:dataModel', this.convertSettings );\n\t\t},\n\n\t\t/**\n\t\t * Update an option value in our model.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t\t\te event\n\t\t * @param backbone.model \tmodel option model\n\t\t * @param backbone.model \tdataModel\n\t\t * @return void\n\t\t */\n\t\tchangeOption: function( e, model, dataModel, settingModel, optionView ) {\n\t\t\tvar name = jQuery( e.target ).data( 'id' );\n\t\t\tif ( 'selected' == name ) {\n\t\t\t\tif ( jQuery( e.target ).prop( 'checked' ) ) {\n\t\t\t\t\tvar value = 1;\n\t\t\t\t} else {\n\t\t\t\t\tvar value = 0;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tvar value = jQuery( e.target ).val();\n\t\t\t}\n\t\t\t\n\t\t\tvar before = model.get( name );\n\t\t\t\n\t\t\tmodel.set( name, value );\n\t\t\t// Trigger an update on our dataModel\n\t\t\tthis.triggerDataModel( model, dataModel );\n\n\t\t\tvar after = value;\n\t\t\t\n\t\t\tvar changes = {\n\t\t\t\tattr: name,\n\t\t\t\tbefore: before,\n\t\t\t\tafter: after\n\t\t\t}\n\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option ' + model.get( 'label' ) + ' ' + name + ' changed from ' + before + ' to ' + after\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'changeSetting', model, changes, label );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'update:option', model, dataModel, settingModel, optionView );\n\t\t\tnfRadio.channel( 'option-repeater-option-' + name ).trigger( 'update:option', e, model, dataModel, settingModel, optionView );\n\t\t\tnfRadio.channel( 'option-repeater-' + settingModel.get( 'name' ) ).trigger( 'update:option', model, dataModel, settingModel, optionView );\n\t\t},\n\n\t\t/**\n\t\t * Add an option to our list\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\taddOption: function( collection, dataModel ) {\n\t\t\tvar modelData = {\n\t\t\t\torder: collection.length,\n\t\t\t\tnew: true,\n\t\t\t\toptions: {}\n\t\t\t};\n\t\t\t/**\n\t\t\t * If we don't actually have a 'settingModel' duplicated fields\n\t\t\t * can't add options until publish and the builder is reloaded.\n\t\t\t * If we ignore the code if we don't have settingsModel, then it\n\t\t\t * works.\n\t\t\t */\n\t\t\tif ( 'undefined' !== typeof collection.settingModel ) {\n\t\t\t\tvar limit = collection.settingModel.get( 'max_options' );\n\t\t\t\tif ( 0 !== limit && collection.models.length >= limit ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\t_.each( collection.settingModel.get( 'columns' ), function ( col, key ) {\n\t\t\t\t\tmodelData[ key ] = col.default;\n\n\t\t\t\t\tif ( 'undefined' != typeof col.options ) {\n\t\t\t\t\t\tmodelData.options[ key ] = col.options;\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t}\n\t\t\tvar model = new listOptionModel( modelData );\n\t\t\tcollection.add( model );\n\n\t\t\t// Add our field addition to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option Added',\n\t\t\t\tdashicon: 'plus-alt'\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'addListOption', model, null, label );\n\n\t\t\tif ( 'undefined' !== typeof collection.settingModel ) {\n\t\t\t\tnfRadio.channel('option-repeater-' + collection.settingModel.get('name')).trigger('add:option', model);\n\t\t\t}\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'add:option', model );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'added:option', collection );\n\t\t\tthis.triggerDataModel( model, dataModel );\n\t\t},\n\n\t\t/**\n\t\t * Delete an option from our list\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \t\tmodel list option model\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\tdeleteOption: function( model, collection, dataModel ) {\n\t\t\tvar newModel = nfRadio.channel( 'app' ).request( 'clone:modelDeep', model );\n\n\t\t\t// Add our field deletion to our change log.\n\t\t\tvar label = {\n\t\t\t\tobject: dataModel.get( 'objectType' ),\n\t\t\t\tlabel: dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option ' + newModel.get( 'label' ) + ' Removed',\n\t\t\t\tdashicon: 'dismiss'\n\t\t\t};\n\n\t\t\tvar data = {\n\t\t\t\tcollection: collection\n\t\t\t}\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'removeListOption', newModel, null, label, data );\n\t\t\t\n\t\t\tvar changeCollection = nfRadio.channel( 'changes' ).request( 'get:collection' );\n\t\t\tvar results = changeCollection.where( { model: model } );\n\n\t\t\t_.each( results, function( changeModel ) {\n\t\t\t\tif ( 'object' == typeof changeModel.get( 'data' ) ) {\n\t\t\t\t\t_.each( changeModel.get( 'data' ), function( dataModel ) {\n\t\t\t\t\t\tif ( dataModel.model == dataModel ) {\n\t\t\t\t\t\t\tdataModel.model = newModel;\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\tchangeModel.set( 'model', newModel );\n\t\t\t\tchangeModel.set( 'disabled', true );\n\t\t\t} );\n\n\t\t\tcollection.remove( model );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'remove:option', model );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'removed:option', collection );\n\t\t\tnfRadio.channel( 'option-repeater-' + collection.settingModel.get( 'name' ) ).trigger( 'remove:option', model );\n\t\t\tthis.triggerDataModel( model, dataModel );\n\t\t},\n\n\t\t/**\n\t\t * Creates an arbitrary value on our collection, then clones and updates that collection.\n\t\t * This forces a change event to be fired on the dataModel where the list option collection data is stored.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.collection \tcollection \tlist option collection\n\t\t * @param backbone.model \t\tdataModel\n\t\t * @return void\n\t\t */\n\t\ttriggerDataModel: function( model, dataModel ) {\n\t\t\tnfRadio.channel( 'app' ).trigger( 'update:setting', model );\t\n\t\t},\n\n\t\t/**\n\t\t * Return our list composite view to the setting collection view.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param backbone.model \tmodel \tsettings model\n\t\t * @return void\n\t\t */\n\t\tgetSettingChildView: function( model ) {\n\t\t\treturn listCompositeView;\n\t\t},\n\n\t\t/**\n\t\t * When we sort our list options, change the order in our option model and trigger a change.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object\t \t\tsortable \tjQuery UI element\n\t\t * @param backbone.view \tsetting \tSetting view\n\t\t * @return void\n\t\t */\n\t\tupdateOptionSortable: function( ui, sortable, setting ) {\n\t\t\tvar newOrder = jQuery( sortable ).sortable( 'toArray' );\n\t\t\tvar dragModel = setting.collection.get( { cid: jQuery( ui.item ).prop( 'id' ) } );\n\t\t\tvar data = {\n\t\t\t\tcollection: setting.collection,\n\t\t\t\tobjModels: []\n\t\t\t};\n\n\t\t\t_.each( newOrder, function( cid, index ) {\n\t\t\t\tvar optionModel = setting.collection.get( { cid: cid } );\n\t\t\t\tvar oldPos = optionModel.get( 'order' );\n\t\t\t\toptionModel.set( 'order', index );\n\t\t\t\tvar newPos = index;\n\n\t\t\t\tdata.objModels.push( {\n\t\t\t\t\tmodel: optionModel,\n\t\t\t\t\tattr: 'order',\n\t\t\t\t\tbefore: oldPos,\n\t\t\t\t\tafter: newPos\n\t\t\t\t} );\n\t\t\t} );\n\t\t\t\n\t\t\tsetting.collection.sort( { silent: true } );\n\t\t\t\n\t\t\tvar label = {\n\t\t\t\tobject: setting.dataModel.get( 'objectType' ),\n\t\t\t\tlabel: setting.dataModel.get( 'label' ),\n\t\t\t\tchange: 'Option ' + dragModel.get( 'label' ) + ' re-ordered from ' + dragModel._previousAttributes.order + ' to ' + dragModel.get( 'order' ),\n\t\t\t\tdashicon: 'sort'\n\t\t\t};\n\n\t\t\tnfRadio.channel( 'changes' ).request( 'register:change', 'sortListOptions', dragModel, null, label, data );\n\t\t\tthis.triggerDataModel( dragModel, setting.dataModel );\n\t\t\tnfRadio.channel( 'option-repeater' ).trigger( 'sort:option', dragModel, setting );\n\t\t\tnfRadio.channel( 'option-repeater-' + setting.model.get( 'name' ) ).trigger( 'sort:option', dragModel, setting );\n\t\t},\n\n\t\t/**\n\t\t * When we stop sorting our list options, reset our item opacity.\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Object ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstopOptionSortable: function( ui ) {\n\t\t\tjQuery( ui.item ).css( 'opacity', '' );\n\t\t},\n\n\t\t/**\n\t\t * When we start sorting our list options, remove containing divs and set our item opacity to 0.5\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Objects ui jQuery UI element\n\t\t * @return void\n\t\t */\n\t\tstartOptionSortable: function( ui ) {\n\t\t\tjQuery( ui.placeholder ).find( 'div' ).remove();\n\t\t\tjQuery( ui.item ).css( 'opacity', '0.5' ).show();\n\t\t},\n\n\t\t/**\n\t\t * Convert settings from an array/object to a collection/model\n\t\t * \n\t\t * @since 3.0\n\t\t * @param Backbone.Model dataModel\n\t\t * @param Backbone.Model settingModel\n\t\t * @return void\n\t\t */\n\t\tconvertSettings: function( dataModel, settingModel ) {\n\t\t\t/*\n\t\t\t * Our options are stored in our database as objects, not collections.\n\t\t\t * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n\t\t\t */ \n\t\t\tvar optionCollection = dataModel.get( settingModel.get( 'name' ) );\n\n\t\t\tif ( false == optionCollection instanceof Backbone.Collection ) {\n\t\t\t\toptionCollection = new listOptionCollection( [], { settingModel: settingModel } );\n\t\t\t\toptionCollection.add( dataModel.get( settingModel.get( 'name' ) ) );\n\t\t\t\tdataModel.set( settingModel.get( 'name' ), optionCollection, { silent: true } );\n\t\t\t}\n\t\t}\n\n\t});\n\n\treturn controller;\n} );\ndefine( 'views/app/drawer/imageOptionRepeaterOption',['views/app/drawer/optionRepeaterError'], function( ErrorView ) {\n var view = Marionette.LayoutView.extend({\n tagName: 'div',\n className: 'nf-table-row',\n template: '#tmpl-nf-edit-setting-image-option-repeater-default-row',\n id: function() {\n return this.model.cid;\n },\n\n regions: {\n error: '.nf-option-error'\n },\n\n initialize: function( data ) {\n this.settingModel = data.settingModel;\n this.dataModel = data.dataModel;\n this.collection = data.collection;\n this.columns = data.columns;\n this.parentView = data.parentView;\n this.model.on( 'change:errors', this.renderErrors, this );\n\n // Removed because the re-render was breaking tag insertion for merge tags.\n // this.model.on( 'change', this.render, this );\n\n if ( 'undefined' != typeof this.settingModel.get( 'tmpl_row' ) ) {\n this.template = '#' + this.settingModel.get( 'tmpl_row' );\n }\n\n this.listenTo( nfRadio.channel( 'image-option-repeater' ), 'click:extra', this.clickExtra );\n\n this.hasErrors = false;\n },\n\n onBeforeDestroy: function() { \n this.model.off( 'change', this.render );\n this.model.off( 'change:errors', this.renderErrors );\n },\n\n onBeforeRender: function() {\n /*\n * We want to escape any HTML being output for our image.\n */\n if ( this.model.get( 'image' ) ) {\n var image = this.model.get( 'image' );\n this.model.set( 'image', _.escape( image ), { silent: true } );\n }\n \n },\n\n onRender: function() {\n nfRadio.channel( 'mergeTags' ).request( 'init', this );\n /*\n * Send out a radio message.\n */\n nfRadio.channel( 'setting-' + this.settingModel.get( 'name' ) + '-option' ).trigger( 'render:setting', this.model, this.dataModel, this );\n /*\n * We want to unescape any HTML being output for our image.\n */\n if ( this.model.get( 'image' ) ) {\n var image = this.model.get( 'image' );\n this.model.set( 'image', _.unescape( image ), { silent: true } );\n }\n },\n\n onShow: function() {\n if ( this.model.get( 'new' ) ) {\n jQuery( this.el ).find( 'input:first' ).focus();\n this.model.set( 'new', false );\n }\n },\n\n events: {\n 'change .setting': 'changeOption',\n 'click .nf-delete': 'deleteOption',\n 'keyup': 'keyupOption',\n // 'click .open-media-manager': 'openMediaModal'\n },\n\n changeOption: function( e ) {\n nfRadio.channel( 'image-option-repeater' ).trigger( 'change:option', e, this.model, this.dataModel, this.settingModel, this );\n },\n\n deleteOption: function( e ) {\n nfRadio.channel( 'image-option-repeater' ).trigger( 'click:deleteOption', this.model, this.collection, this.dataModel, this );\n },\n\n keyupOption: function( e ) {\n this.maybeAddOption( e );\n nfRadio.channel( 'image-option-repeater' ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n nfRadio.channel( 'image-option-repeater-' + this.settingModel.get( 'name' ) ).trigger( 'keyup:option', e, this.model, this.dataModel, this.settingModel, this )\n },\n\n maybeAddOption: function( e ) {\n if ( 13 == e.keyCode && 'calculations' != this.settingModel.get( 'name' ) ) {\n nfRadio.channel( 'image-option-repeater' ).trigger( 'click:addOption', this.collection, this.dataModel, this );\n jQuery( this.parentView.children.findByIndex(this.parentView.children.length - 1).el ).find( '[data-id=\"image\"]' ).focus();\n }\n },\n\n clickExtra: function(e, settingModel, dataModel, settingView) {\n \n var textEl = jQuery(e.target).parent().find('.setting');\n var optionContainerDiv = jQuery(e.target).parent().parent().parent();\n\n var valueEl = jQuery(optionContainerDiv[0]).find('[data-id=\"value\"]');\n\n var imageIdEl = jQuery(optionContainerDiv[0]).find('[data-id=\"image_id\"]');\n\n var labelEl = jQuery(optionContainerDiv[0]).find('[data-id=\"label\"]');\n \n if ( jQuery( e.target ).hasClass( 'open-media-manager' )\n && this.el.id === optionContainerDiv[0].id) {\n // If the frame already exists, re-open it.\n if ( this.meta_image_frame ) {\n this.meta_image_frame.open();\n return;\n }\n\n // Sets up the media library frame\n this.meta_image_frame = wp.media.frames.meta_image_frame = wp.media({\n title: 'Select a file',\n button: { text: 'insert' }\n });\n\n var that = this;\n\n // Runs when an image is selected.\n this.meta_image_frame.on('select', function(){\n // Grabs the attachment selection and creates a JSON representation of the model.\n var media_attachment = that.meta_image_frame.state().get('selection').first().toJSON();\n \n textEl.val(media_attachment.url).change();\n valueEl.val(media_attachment.filename).change();\n labelEl.val(media_attachment.title).change();\n imageIdEl.val(media_attachment.id).change();\n var img_container = optionContainerDiv.find('.option-image-container');\n\n if(img_container) {\n $imgs = jQuery(img_container).find('img');\n if($imgs.length > 0) {\n jQuery($imgs[0]).attr('src', media_attachment.url);\n } else {\n var new_img = document.createElement('img');\n new_img.style=\"max-width:100px;display:inline-block;\";\n new_img.src = media_attachment.url;\n jQuery(img_container).append(new_img);\n }\n }\n });\n\n // Opens the media library frame.\n this.meta_image_frame.open();\n }\n },\n\n renderErrors: function() {\n \n // if ( jQuery.isEmptyObject( this.model.get( 'errors' ) ) ) {\n // return false;\n // }\n\n /*\n * We don't want to redraw the entire row, which would remove focus from the eq textarea,\n * so we add and remove error classes manually.\n */\n if ( 0 == Object.keys( this.model.get( 'errors' ) ) ) {\n if ( this.hasErrors ) {\n this.error.empty();\n jQuery( this.el ).removeClass( 'nf-error' );\n }\n } else {\n this.hasErrors = true;\n this.error.show( new ErrorView( { model: this.model } ) );\n jQuery( this.el ).addClass( 'nf-error' );\n }\n },\n\n templateHelpers: function() {\n var that = this;\n return {\n getColumns: function() {\n var columns = that.columns;\n if(!nfAdmin.devMode){\n delete columns.value;\n delete columns.calc;\n }\n return columns;\n },\n renderFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, image;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.image = '';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n fields.each( function( field ){\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.image = field.formatLabel();\n select.appendChild( option );\n });\n\n image = document.createElement( 'image' );\n image.classList.add( 'nf-select' );\n image.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n image.appendChild( emptyContainer );\n\n // The template requires a string.\n return image.innerHTML;\n },\n renderNonSaveFieldSelect: function( dataID, value ){\n var initialOption, select, emptyContainer, image;\n\n var fields = nfRadio.channel( 'fields' ).request( 'get:collection' );\n\n initialOption = document.createElement( 'option' );\n initialOption.value = '';\n initialOption.image = '';\n initialOption.innerHTML = '--';\n\n select = document.createElement( 'select' );\n select.classList.add( 'setting' );\n select.setAttribute( 'data-id', dataID );\n select.appendChild( initialOption );\n\n // Build a lookup table for fields we want to remove from our fields list.\n var removeFieldsLookup = [ 'html', 'submit', 'hr',\n 'recaptcha', 'spam', 'creditcard', 'creditcardcvc',\n 'creditcardexpiration', 'creditcardfullname',\n 'creditcardnumber', 'creditcardzip' ];\n\n fields.each( function( field ){\n // Check for the field type in our lookup array and...\n if( jQuery.inArray( field.get( 'type' ), removeFieldsLookup ) !== -1 ) {\n // Return if the type is in our lookup array.\n return '';\n }\n\n var option = document.createElement( 'option' );\n if ( value == field.get( 'key' ) ) {\n option.setAttribute( 'selected', 'selected' );\n }\n option.value = field.get( 'key' );\n option.innerHTML = field.formatLabel();\n option.image = field.formatLabel();\n select.appendChild( option );\n });\n\n image = document.createElement( 'image' );\n image.classList.add( 'nf-select' );\n image.appendChild( select );\n\n // Select Lists need an empty '<div></div>' for styling purposes.\n emptyContainer = document.createElement( 'div' );\n emptyContainer.style.bottom = '6px';\n image.appendChild( emptyContainer );\n\n // The template requires a string.\n return image.innerHTML;\n },\n renderOptions: function( column, value ) {\n\n if( 'undefined' == typeof that.options.columns[ column ] ) return;\n\n var select = document.createElement( 'select' );\n \n _.each( that.options.columns[ column ].options, function( option ){\n var optionNode = document.createElement( 'option' );\n if ( value === option.value ) {\n optionNode.setAttribute( 'selected', 'selected' );\n }\n optionNode.setAttribute( 'value', option.value );\n optionNode.setAttribute( 'image_id', option.image_id);\n optionNode.setAttribute( 'image', option.image );\n optionNode.innerText = option.image;\n select.appendChild( optionNode );\n });\n\n // The template only needs the options.\n return select.innerHTML;\n }\n\n }\n }\n\n });\n\n return view;\n} );\n\ndefine( 'views/app/drawer/imageOptionRepeaterComposite',['views/app/drawer/imageOptionRepeaterOption', 'views/app/drawer/optionRepeaterEmpty', 'models/app/optionRepeaterCollection'], function( listOptionView, listEmptyView, listOptionCollection ) {\n\tvar view = Marionette.CompositeView.extend( {\n\t\ttemplate: '#tmpl-nf-edit-setting-image-option-repeater-wrap',\n\t\tchildView: listOptionView,\n\t\temptyView: listEmptyView,\n\t\treorderOnSort: false,\n\n\t\tinitialize: function( data ) {\n\n\t\t\t/*\n\t\t\t * Our options are stored in our database as objects, not collections.\n\t\t\t * Before we attempt to render them, we need to convert them to a collection if they aren't already one.\n\t\t\t */ \n\t\t\tvar optionCollection = data.dataModel.get( this.model.get( 'name' ) );\n\n\t\t\tif ( false == optionCollection instanceof Backbone.Collection ) {\n\t\t\t\toptionCollection = new listOptionCollection( [], { settingModel: this.model } );\n\t\t\t\toptionCollection.add( data.dataModel.get( this.mo

Ninja Forms – The Easy and Powerful Forms Builder - Version 3.5.8.3

Version Description

Release Info

Code changes from version 3.5.8.2 to 3.5.8.3