angular.module('brightForms').run([
  '$templateCache',
  'FormioUtils',
  function($templateCache, FormioUtils) {
    $templateCache.put('formio/components/udf/udf_type_1.html', 
      FormioUtils.fieldWrap('<input class="form-control" type="text" ng-required="component.validate.required" ng-disabled="readOnly || component.readOnly" ng-model="data[component.key].data" />'));
    $templateCache.put('formio/components/udf/udf_type_2.html', 
      FormioUtils.fieldWrap('<textarea class="form-control" ng-required="component.validate.required" ng-disabled="readOnly || component.readOnly" ng-model="data[component.key].data"></textarea>'));
    $templateCache.put('formio/components/udf/udf_type_3.html', 
      FormioUtils.fieldWrap(
      '<div class="checkbox">'
		+ '  <label>'
		+ '    <input type="checkbox" ng-checked="data[component.key].data == \'true\'"'
		+ '    id="udf-{{data[component.key].fieldGk}}" '
		+ '    ng-model="data[component.key].data"'
        + '    ng-disabled="readOnly || component.readOnly"'
		+ '    ng-required="component.validate.required">'
		+ '    {{ component.label | formioTranslate }}'
		+ '  </label>'
		+ '</div>'));
    $templateCache.put('formio/components/udf/udf_type_4.html', 
      FormioUtils.fieldWrap('<span>'
      + ' <bm-select class="form-control" default-hidden default-disabled '
      + ' ng-required="component.validate.required" ng-disabled="readOnly || component.readOnly" '
      + ' ng-model="data[component.key]" ng-options="option as option.name for option in field.options track by option.optionGk"></bm-select>'
      + '<input class="form-control" type="hidden" ng-required="component.validate.required" ng-disabled="readOnly || component.readOnly" ng-model="data[component.key].data" />'
      + '</span>'));
    $templateCache.put('formio/components/udf/udf_type_5.html', 
      FormioUtils.fieldWrap('<input class="form-control" type="number" min="0" ng-required="component.validate.required" ng-disabled="readOnly || component.readOnly" ng-model="data[component.key].data" />'));
    $templateCache.put('formio/components/udf/udf_type_6.html', 
      FormioUtils.fieldWrap('<input class="form-control" type="number" min="0" ng-required="component.validate.required" ng-disabled="readOnly || component.readOnly" ng-model="data[component.key].data" />'));
    $templateCache.put('formio/components/udf/udf_type_7.html', 
      FormioUtils.fieldWrap(
        '<input class="form-control" uib-datepicker-popup="{{FORMATS.date}}" '
        + ' onshow="openPicker(data[component.key].fieldGk)" onhide="closePicker(data[component.key].fieldGk)" '
        + ' is-open="picker[data[component.key].fieldGk]" date-type="string" '
        + ' datepicker-options="dateOptions" placeholder="{{FORMATS.date.toLowerCase()}}" '
        + ' ng-model="data[component.key].date" ng-click="openPicker(data[component.key].fieldGk)" '
        + ' ng-disabled="readOnly || component.readOnly" ng-required="component.validate.required" />'
        + '<span class="input-group-btn">'
        + '       <button type="button" class="btn btn-default" ng-click="openPicker(data[component.key].fieldGk)">'
        + '         <i class="glyphicon glyphicon-calendar"></i>'
        + '        </button>'
        + ' </span>'
        ));
    $templateCache.put('formio/components/udf/udf_type_10.html', 
      FormioUtils.fieldWrap(
        '<div class="input-group">'
        + '<input class="form-control" uib-datepicker-popup="{{FORMATS.date}}" '
        + ' onshow="openPicker(data[component.key].fieldGk)" onhide="closePicker(data[component.key].fieldGk)" ' 
        + ' is-open="picker[data[component.key].fieldGk]" '
        + ' datepicker-options="dateOptions" placeholder="{{FORMATS.date.toLowerCase()}}" '
        + ' ng-model="data[component.key].date" ng-click="openPicker(data[component.key].fieldGk)" '
        + ' ng-disabled="readOnly || component.readOnly" ng-required="component.validate.required" />'
        + '<span class="input-group-btn">'
        + '<button type="button" class="btn btn-default" ng-click="openPicker(data[component.key].fieldGk)">'
        + '<i class="glyphicon glyphicon-calendar"></i>'
        + '</button>'
        + '</span>'
        + '</div>'
        + '<div uib-timepicker ng-model="data[component.key].date" ng-disabled="readOnly || component.readOnly"></div>'
        ));
    // Create the settings markup.
    $templateCache.put('formio/components/udf/display/udf.html',
      '<ng-form>' +
        '<form-builder-option property="placeholder"></form-builder-option>' +
        '<form-builder-option property="prefix"></form-builder-option>' +
        '<form-builder-option property="suffix"></form-builder-option>' +
        '<form-builder-option property="customClass"></form-builder-option>' +
        '<div class="checkbox" property="readOnly">' +
        '<label for="readOnly" form-builder-tooltip="Disables the input and does not allow the user to change the data.">' +
        '<input id="readOnly" name="readOnly" property="readOnly" type="checkbox" ng-model="component.readOnly" /> Read Only' +
        '</label>' +
        '</div>' +
      '</ng-form>'
    );

    // Create the API markup.
    $templateCache.put('formio/components/udf/validate/udf/validate.html',
      '<ng-form>' +
        '<form-builder-option property="validate.required"></form-builder-option>' +
      '</ng-form>'
    );
  }
]);