199 lines
9 KiB
HTML
199 lines
9 KiB
HTML
<header data-ng-include="'/static/modules/core/views/header.client.view.html'"></header>
|
|
|
|
<section class="admin-form container-fluid">
|
|
|
|
<!-- Modal Delete Dialog Template -->
|
|
<script type="text/ng-template" id="formDeleteModal.html">
|
|
<div class="modal-header">
|
|
<h2 class="modal-title hidden-md hidden-lg">{{ 'ARE_YOU_SURE' | translate }}</h2>
|
|
<h3 class="modal-title hidden-xs hidden-sm">{{ 'ARE_YOU_SURE' | translate }}</h3>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="modal-body-alert">
|
|
{{ 'READ_WARNING' | translate }}
|
|
</div>
|
|
<p class="hidden-xs hidden-sm">
|
|
{{ 'DELETE_WARNING1' | translate }} <strong>{{myform.title}}</strong> {{ 'DELETE_WARNING2' | translate }}
|
|
</p>
|
|
<p>{{ 'DELETE_CONFIRM' | translate }}</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<input type="text" style="width:100%" data-ng-model="deleteConfirm" class="input-block" autofocus required aria-label="Type in the name of the form to confirm that you want to delete this form.">
|
|
<button type="submit" ng-click="removeCurrentForm()" class="btn btn-block btn-danger" ng-disabled="myform.title != deleteConfirm">
|
|
{{ 'I_UNDERSTAND' | translate }}
|
|
</button>
|
|
</div>
|
|
</script>
|
|
|
|
<div class="page-header row" style="padding-bottom: 1em;">
|
|
<div class="col-xs-10 col-sm-8">
|
|
<h1 class="hidden-sm hidden-xs" data-ng-bind="myform.title" style="margin-bottom: 0px;"></h1>
|
|
<h2 class="hidden-md hidden-lg" data-ng-bind="myform.title" style="margin-bottom: 0px;"></h2>
|
|
</div>
|
|
<div class="col-xs-1 col-sm-2">
|
|
<small class="pull-right">
|
|
<button class="btn btn-danger" ng-click="openDeleteModal()">
|
|
<i class="fa fa-trash-o"></i>
|
|
<span class="show-sm hidden-lg hidden-md hidden-xs">{{ 'DELETE_FORM_SM' | translate}}</span>
|
|
<span class="hidden-xs hidden-sm">{{ 'DELETE_FORM_MD' | translate}}</span>
|
|
</button>
|
|
</small>
|
|
</div>
|
|
<div class="col-xs-1 col-sm-2">
|
|
<small class="pull-right">
|
|
<a class="btn btn-secondary view-form-btn" href="{{actualFormURL}}">
|
|
<span class="hidden-xs hidden-sm">
|
|
{{ 'VIEW' | translate }}
|
|
<span ng-show="myform.isLive">
|
|
{{ 'LIVE' | translate }}
|
|
</span>
|
|
<span ng-hide="myform.isLive">{{ 'PREVIEW' | translate }}</span>
|
|
</span>
|
|
<i class="status-light status-light-on fa fa-dot-circle-o" ng-if="myform.isLive"></i>
|
|
<i class="status-light status-light-off fa fa-dot-circle-o" ng-if="!myform.isLive"></i>
|
|
</a>
|
|
</small>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-xs-12">
|
|
<uib-tabset active="activePill" vertical="true" type="pills">
|
|
<uib-tab index="0" heading="{{ 'CREATE_TAB' | translate }}">
|
|
<edit-form-directive myform="myform"></edit-form-directive>
|
|
</uib-tab>
|
|
<uib-tab ng-repeat="tab in tabData" index="{{$index+1}}" heading="{{tab.heading}}">
|
|
<div class='row' data-ng-include="'/static/modules/forms/admin/views/adminTabs/'+tab.templateName+'.html'"></div>
|
|
</uib-tab>
|
|
<uib-tab index="2" heading="{{ 'ANALYZE_TAB' | translate }}">
|
|
<edit-submissions-form-directive myform="myform" user="myform.admin"></edit-submissions-form-directive>
|
|
</uib-tab>
|
|
<uib-tab ng-if="tabData" heading="{{ 'SHARE_TAB' | translate }}" index="{{tabData.length}}">
|
|
<div class="config-form">
|
|
<div class="row">
|
|
<div class="col-sm-12">
|
|
<uib-tabset active="activePill" vertical="true" type="pills">
|
|
<uib-tab index="0" heading="{{ 'SHARE_YOUR_FORM' | translate }}">
|
|
<div class="row">
|
|
<div class="col-sm-12">
|
|
{{ 'TELLFORM_URL' | translate }}
|
|
</div>
|
|
<div class="col-sm-8 form-input">
|
|
<span ngclipboard data-clipboard-target="#copyURL"> <input id="copyURL" ng-value="actualFormURL" class="form-control ng-pristine ng-untouched ng-valid"> </span>
|
|
</div>
|
|
<div class="col-sm-4">
|
|
<button class="btn btn btn-secondary view-form-btn" ngclipboard data-clipboard-target="#copyURL">
|
|
{{ 'COPY' | translate }} <i class="fa fa-clipboard" aria-hidden="true"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</uib-tab>
|
|
<uib-tab index="1" heading="{{ 'EMBED_YOUR_FORM' | translate }}">
|
|
<div class="row">
|
|
<div class="col-sm-12">
|
|
{{ 'COPY_AND_PASTE' | translate }}
|
|
</div>
|
|
<div class="col-sm-8 form-input">
|
|
<span ngclipboard data-clipboard-target="#copyEmbedded">
|
|
<textarea id="copyEmbedded" class="form-control ng-pristine ng-untouched ng-valid" style="min-height:200px; width:100%; background-color: #FFFFCC; color: #30313F;">
|
|
<!-- {{ 'CHANGE_WIDTH_AND_HEIGHT' | translate }} -->
|
|
<iframe id="iframe" src="{{actualFormURL}}" style="width:100%;height:500px;"></iframe>
|
|
<div style="font-family: Sans-Serif;font-size: 12px;color: #999;opacity: 0.5; padding-top: 5px;">{{ 'POWERED_BY' | translate }} <a href="https://www.tellform.com" style="color: #999" target="_blank">TellForm</a></div>
|
|
</textarea>
|
|
</span>
|
|
</div>
|
|
<div class="col-sm-4">
|
|
<button class="btn btn btn-secondary view-form-btn" ngclipboard data-clipboard-target="#copyEmbedded">
|
|
{{ 'COPY' | translate }} <i class="fa fa-clipboard" aria-hidden="true"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</uib-tab>
|
|
</uib-tabset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</uib-tab>
|
|
<uib-tab ng-if="tabData && myform.form_fields.length" heading="{{ 'DESIGN_TAB' | translate }}" index="{{tabData.length}}+1">
|
|
<div class="config-form design container">
|
|
<div class="row">
|
|
<div class="col-sm-4 col-xs-12">
|
|
<div class="row field">
|
|
<div class="field-title col-sm-5">
|
|
<h5>{{ 'BACKGROUND_COLOR' | translate }}</h5>
|
|
</div>
|
|
<div class="field-input col-sm-6">
|
|
<input class="form-control" colorpicker="hex" type="text"
|
|
ng-model="myform.design.colors.backgroundColor"
|
|
ng-pattern="/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/"
|
|
ng-style="{ 'background-color': myform.design.colors.backgroundColor }"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row field">
|
|
<div class="field-title col-sm-5">
|
|
<h5>{{ 'QUESTION_TEXT_COLOR' | translate }}</h5>
|
|
</div>
|
|
|
|
<div class="field-input col-sm-6">
|
|
<input class="form-control" colorpicker="hex" type="text" ng-model="myform.design.colors.questionColor" ng-pattern="/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/"ng-style="{ 'background-color': myform.design.colors.questionColor }"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row field">
|
|
<div class="field-title col-sm-5">
|
|
<h5>{{ 'ANSWER_TEXT_COLOR' | translate }}</h5>
|
|
</div>
|
|
|
|
<div class="field-input col-sm-6">
|
|
<input class="form-control" colorpicker="hex" type="text" ng-model="myform.design.colors.answerColor" ng-pattern="/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/" ng-style="{ 'background-color': myform.design.colors.answerColor }"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row field">
|
|
<div class="field-title col-sm-5">
|
|
<h5>{{ 'BTN_BACKGROUND_COLOR' | translate }}</h5>
|
|
</div>
|
|
|
|
<div class="field-input col-sm-6">
|
|
<input class="form-control" colorpicker="hex" type="text"
|
|
ng-model="myform.design.colors.buttonColor"
|
|
ng-pattern="/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/"
|
|
ng-style="{ 'background-color': myform.design.colors.buttonColor }"/>
|
|
</div>
|
|
</div>
|
|
<div class="row field">
|
|
<div class="field-title col-sm-5">
|
|
<h5>{{ 'BTN_TEXT_COLOR' | translate }}</h5>
|
|
</div>
|
|
|
|
<div class="field-input col-sm-6">
|
|
<input class="form-control" colorpicker="hex" type="text"
|
|
ng-model="myform.design.colors.buttonTextColor"
|
|
ng-pattern="/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/"
|
|
ng-style="{ 'background-color': myform.design.colors.buttonTextColor }"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-8 hidden-xs">
|
|
<div class="public-form" ng-style="{ 'background-color': myform.design.colors.backgroundColor }">
|
|
<iframe id="iframe" ng-if="!!formURL" ng-src="{{formURL | trustSrc}}" style="border: none; box-shadow: 0px 0px 10px 0px grey; overflow: hidden; height: 400px; width: 90%; position: absolute;"></iframe>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-sm-offset-4 col-sm-2">
|
|
<button class="btn btn-signup btn-rounded" type="button" ng-click="update(false, myform, false, false, null)"><i class="icon-arrow-left icon-white"></i>{{ 'SAVE_CHANGES' | translate }}</button>
|
|
</div>
|
|
<div class="col-sm-1">
|
|
<button class="btn btn-secondary btn-rounded" type="button" ng-click="resetForm()"><i class="icon-eye-open icon-white"></i>{{ 'CANCEL' | translate }}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</uib-tab>
|
|
</uib-tabset>
|
|
</div>
|
|
</div>
|
|
</section>
|