191 lines
8.6 KiB
HTML
191 lines
8.6 KiB
HTML
<header data-ng-include="'/static/modules/core/views/header.client.view.html'"></header>
|
|
|
|
<div class="container" cg-busy="{promise:updatePromise,templateUrl:'modules/forms/admin/views/directiveViews/cgBusy/update-form-message-TypeB.html',message:'Updating form...', backdrop:false, wrapperClass:'.busy-updating-wrapper'}"></div>
|
|
|
|
<section class="admin-form">
|
|
|
|
<!-- 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" 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'" onload="form_url = trustSrc(formURL)"></div>
|
|
</uib-tab>
|
|
<uib-tab ng-if="tabData" heading="Share" 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">
|
|
<div class="row">
|
|
<div class="col-sm-12">
|
|
Your TellForm is permanently at this URL
|
|
</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 <i class="fa fa-clipboard" aria-hidden="true"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</uib-tab>
|
|
<uib-tab index="1" heading="Embed your Form">
|
|
<div class="row">
|
|
<div class="col-sm-12">
|
|
Copy and Paste this to add your TellForm to your website
|
|
</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 the width and height values to suit you best -->
|
|
<iframe id="iframe" ng-if="!!formURL" src="{{trustSrc(formURL)}}" 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<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 <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" index="{{tabData.length}}+1">
|
|
<div class="config-form design container">
|
|
<div class="row">
|
|
<div class="col-md-4 col-sm-12 container">
|
|
<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-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-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-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-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-style="{ 'background-color': myform.design.colors.buttonTextColor }"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-8 hide-md hide-lg">
|
|
<iframe id="iframe" ng-if="!!formURL" src="{{trustSrc(formURL)}}" style="border: none; box-shadow: 0px 0px 10px 0px grey; overflow: hidden; height: 400px; width: 90%; position: absolute;"></iframe>
|
|
</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, 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>
|