IT4Change/ohmyform
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added routable tabs for share form config panel

Browse Source
This commit is contained in:
David Baldwynn 2017-11-15 10:47:57 -08:00
parent 69f1f42816
commit 2a0cdcca20
12 changed files with 150 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/modules/forms/admin/controllers/admin-form.client.controller.js
View File

@ -53,7 +53,7 @@ angular.module('forms').controller('AdminFormController', ['$rootScope', '$windo
},
{
heading: $filter('translate')('SHARE_TAB'),
route: 'viewForm.share',
route: 'viewForm.share.share_form',
active: false
},
{

11
public/modules/forms/admin/css/admin-form.css
View File

@ -143,7 +143,7 @@
visibility: visible !important;
border: none;
padding:1px;
background: #000;
background: #000;
background:rgba(0, 0, 0, 0.5) !important;
}
@ -168,11 +168,6 @@
margin-bottom: none;
}
/*Styles for admin view tabs */
.admin-form .tab-content {
padding-top: 3em;
}
/*Styles for add fields tab*/
.admin-form .add-field {
background-color: #ddd;
@ -189,10 +184,6 @@
border-radius: 4px;
}
.admin-form .oscar-field-select {
margin: 10px 0 10px;
}
.view-form-btn {
border: none;
}

7
public/modules/forms/admin/css/configure-form.css
View File

@ -15,10 +15,6 @@ configure-form-directive .placeholder-tag {
width: 100%;
}
configure-form-directive .tab-content {
padding-top: 0;
}
configure-form-directive .ui-select input.form-control {
height: 34px;
padding: 6px;
@ -51,9 +47,6 @@ configure-form-directive .config-form .row.field {
configure-form-directive .config-form > .row > .container:nth-of-type(odd){
border-right: 1px #ddd solid;
}
configure-form-directive .config-form.design > .row > .container:nth-of-type(odd){
border-right: none;
}
configure-form-directive .config-form .row > .field-input {
padding-left:0.1em;

33
public/modules/forms/admin/css/design-form.css Normal file
View File

@ -0,0 +1,33 @@
design-form-directive .ui-select input.form-control {
height: 34px;
padding: 6px;
}
design-form-directive .config-form .btn-secondary {
border-color: #DDDDDD;
}
design-form-directive .config-form .row.field {
padding-top: 1.5em;
}
design-form-directive .config-form > .row > .container{
border-right: 1px #ddd solid;
border-right: none;
}
design-form-directive .config-form {
max-width: 100%;
}
design-form-directive .config-form > .row {
padding: 19px;
margin-bottom: 20px;
background-color: #f5f5f5;
border: 1px solid #e3e3e3;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
}

15
public/modules/forms/admin/css/share-form.css
View File

@ -8,4 +8,19 @@ share-form-directive #copyEmbedded {
share-form-directive .tab-content {
padding-top: 50px;
}
share-form-directive .config-form {
max-width: 100%;
}
share-form-directive .config-form > .row {
padding: 19px;
margin-bottom: 20px;
background-color: #f5f5f5;
border: 1px solid #e3e3e3;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
}

31
public/modules/forms/admin/css/ta-theme.css
View File

@ -1,31 +0,0 @@
.placeholder-tag {
background-color: #999;
border-radius: 3px 3px 3px 3px;
border: 0;
color: #FFFFFF;
font-style: inherit;
font-size: 11px;
padding: 4px 5px;
margin: 0 2px 2px 2px;
font-family: inherit;
white-space: nowrap;
vertical-align: middle;
cursor: pointer !important;
display: inline!important;
width: 100%;
}
.email-subject.ta-root .ta-editor.ta-html, .email-subject .ta-scroll-window.form-control {
min-height: 0;
overflow: hidden;
height: auto;
border-radius: 4px;
box-shadow: none;
font-size: 18px;
padding-top: 10px;
}
.email-subject.ta-root .ta-scroll-window > .ta-bind {
min-height: 0;
outline: 0;
}

41
public/modules/forms/admin/directives/configure-form.client.directive.js
View File

@ -1,7 +1,7 @@
'use strict';
angular.module('forms').directive('configureFormDirective', ['$rootScope', '$filter', '$state', '$translate', '$timeout', '$window',
function ($rootScope, $filter, $state, $translate, $timeout, $window) {
angular.module('forms').directive('configureFormDirective', ['$rootScope', '$state', '$translate', '$timeout', '$window',
function ($rootScope, $state, $translate, $timeout, $window) {
return {
templateUrl: 'modules/forms/admin/views/directiveViews/form/configure-form.client.view.html',
restrict: 'E',
@ -28,30 +28,31 @@ angular.module('forms').directive('configureFormDirective', ['$rootScope', '$fil
}
};
$scope.configureTabs = [
{
heading: $filter('translate')('GENERAL_TAB'),
route: 'viewForm.configure.general',
active: false
},
{
heading: $filter('translate')('SELF_NOTIFICATIONS_TAB'),
route: 'viewForm.configure.self_notifications',
active: false
},
{
heading: $filter('translate')('RESPONDENT_NOTIFICATIONS_TAB'),
route: 'viewForm.configure.respondent_notifications',
active: false
}
];
$scope.emailFields = $scope.myform.form_fields.filter(function(field){
return field.fieldType === 'email';
});
$scope.formHasEmailField = ($scope.emailFields.length > 0);
/* Tab Routing Logic */
$scope.configureTabs = [
{
heading: $translate.instant('GENERAL_TAB'),
route: 'viewForm.configure.general',
active: false
},
{
heading: $translate.instant('SELF_NOTIFICATIONS_TAB'),
route: 'viewForm.configure.self_notifications',
active: false
},
{
heading: $translate.instant('RESPONDENT_NOTIFICATIONS_TAB'),
route: 'viewForm.configure.respondent_notifications',
active: false
}
];
$scope.go = function(tab){
tab.active = true;
$state.go(tab.route);

37
public/modules/forms/admin/directives/share-form.client.directive.js
View File

@ -1,7 +1,7 @@
'use strict';
angular.module('forms').directive('shareFormDirective', ['$rootScope', '$translate',
function ($rootScope, $translate) {
angular.module('forms').directive('shareFormDirective', ['$rootScope', '$translate', '$state',
function ($rootScope, $translate, $state) {
return {
templateUrl: 'modules/forms/admin/views/directiveViews/form/share-form.client.view.html',
restrict: 'E',
@ -11,12 +11,41 @@ angular.module('forms').directive('shareFormDirective', ['$rootScope', '$transla
controller: function($scope){
$scope.actualFormURL = $scope.actualformurl;
$scope.fullScreen = "<iframe id='iframe' src='{{actualFormURL}}' style='width:100%;height:500px;'></iframe>"+
$scope.fullScreen = "<iframe id='iframe' src='" + $scope.actualFormURL + "' style='width:100%;height:500px;'></iframe>"+
"<div style='font-family: Sans-Serif;font-size: 12px;color: #999;opacity: 0.5; padding-top: 5px;'>"+
$translate.instant('POWERED_BY')+
"<a href='https://www.tellform.com' style='color: #999' target='_blank'>TellForm</a>"+
"</div>";
/* Tab Routing Logic */
$scope.shareTabs = [
{
heading: $translate.instant('SHARE_YOUR_FORM'),
route: 'viewForm.share.share_form',
active: false
},
{
heading: $translate.instant('EMBED_YOUR_FORM'),
route: 'viewForm.share.embed_form',
active: false
}
];
$scope.go = function(tab){
tab.active = true;
$state.go(tab.route);
};
function setActiveTab() {
$scope.shareTabs.forEach(function(tab) {
tab.active = ($state.current.name === tab.route);
});
}
setActiveTab();
$scope.$on("$stateChangeSuccess", setActiveTab());
}
};
}

17
public/modules/forms/admin/views/adminTabs/shareTabs/embed_form.html Normal file
View File

@ -0,0 +1,17 @@
<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">
<div id="copyEmbedded" class="form-control">
{{ fullScreen }}
</div>
</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>

13
public/modules/forms/admin/views/adminTabs/shareTabs/share_form.html Normal file
View File

@ -0,0 +1,13 @@
<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>

37
public/modules/forms/admin/views/directiveViews/form/share-form.client.view.html
View File

@ -1,39 +1,8 @@
<div class="config-form row">
<div class="config-form container">
<div class="row">
<uib-tabset active="activePill" 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">
<div id="copyEmbedded" class="form-control">
{{ fullScreen }}
</div>
</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 ng-repeat="tab in shareTabs" active="tab.active" select="go(tab)" heading="{{tab.heading}}">
<div ui-view></div>
</uib-tab>
</uib-tabset>
</div>

17
public/modules/forms/config/forms.client.routes.js
View File

@ -84,13 +84,22 @@ angular.module('forms').config(['$stateProvider',
templateUrl: 'modules/forms/admin/views/adminTabs/configureTabs/respondent-notifications.html'
})
.state('viewForm.share', {
abstract: true,
url: '/share',
templateUrl: 'modules/forms/admin/views/adminTabs/share.html'
}).state('viewForm.share.share_form', {
url: '/share_form',
templateUrl: 'modules/forms/admin/views/adminTabs/shareTabs/share_form.html'
}).state('viewForm.share.embed_form', {
url: '/embed_form',
templateUrl: 'modules/forms/admin/views/adminTabs/shareTabs/embed_form.html'
})
.state('viewForm.design', {
url: '/design',
templateUrl: 'modules/forms/admin/views/adminTabs/design.html'
}).state('viewForm.share', {
url: '/share',
templateUrl: 'modules/forms/admin/views/adminTabs/share.html'
}).state('viewForm.analyze', {
}).state('viewForm.analyze', {
url: '/analyze',
templateUrl: 'modules/forms/admin/views/adminTabs/analyze.html'
});