From 8739f29e614c740299eb96415cc390e76fec3d94 Mon Sep 17 00:00:00 2001 From: Youssef ABIDI Date: Fri, 18 Aug 2017 18:08:53 +0100 Subject: [PATCH] building the json & other stuff --- src/app/pages/surveys/SurveysPageCtrl.js | 66 -------- src/app/pages/surveys/SurveysPageCtrl.js.bak | 142 ++++++++++++++++++ src/app/pages/surveys/create/create.html | 116 ++++++++++++++ src/app/pages/surveys/create/create.module.js | 22 +++ src/app/pages/surveys/create/createTabCtrl.js | 142 ++++++++++++++++++ .../{ => create}/widgets/multiple.html | 68 +++++---- src/app/pages/surveys/surveys.html | 11 +- src/app/pages/surveys/surveys.module.js | 16 +- src/sass/theme/_layout.scss | 18 +++ 9 files changed, 500 insertions(+), 101 deletions(-) delete mode 100644 src/app/pages/surveys/SurveysPageCtrl.js create mode 100644 src/app/pages/surveys/SurveysPageCtrl.js.bak create mode 100644 src/app/pages/surveys/create/create.html create mode 100644 src/app/pages/surveys/create/create.module.js create mode 100644 src/app/pages/surveys/create/createTabCtrl.js rename src/app/pages/surveys/{ => create}/widgets/multiple.html (50%) diff --git a/src/app/pages/surveys/SurveysPageCtrl.js b/src/app/pages/surveys/SurveysPageCtrl.js deleted file mode 100644 index 2110177..0000000 --- a/src/app/pages/surveys/SurveysPageCtrl.js +++ /dev/null @@ -1,66 +0,0 @@ -/** - * @author v.lugovsky - * created on 16.12.2015 - */ -(function () { - 'use strict'; - - angular.module('BlurAdmin.pages.surveys') - .controller('SurveysPageCtrl', SurveysPageCtrl) - .directive('multiple', function() { - return { - templateUrl: 'app/pages/surveys/widgets/multiple.html' - }; - }); - - /** @ngInject */ - function SurveysPageCtrl($scope, $compile, $timeout) { - - $scope.isUnfolded = false; - $scope.actualId = 0; - $scope.survey = {}; - $scope.survey.name = ''; - $scope.survey.description = ''; - $scope.survey.elements = []; - - $scope.progressFunction = function() { - return $timeout(function() {}, 3000); - }; - - $scope.panelFoldToggle = function() { - $scope.isUnfolded = !$scope.isUnfolded; - console.log($scope.isUnfolded); - }; - - $scope.getTheFoldingClass = function() { - var $className = ( $scope.isUnfolded ) ? "fa fa-compress" : "fa fa-expand"; - return $className; - }; - - $scope.addElement = function(type){ - $scope.actualId = $scope.survey.elements.length + 1; - var element = $scope.createEmptyElement(type, $scope.survey.elements.length + 1); - $scope.activeElement=element; - $scope.survey.elements.push(element); - var compiledeHTML = $compile("
")($scope); - $("#newElem").append(compiledeHTML); - console.log($scope.survey.elements); - }; - - $scope.removeElement = function(index){ - console.log("#q-"+index, index); - $scope.survey.elements.splice(index,1); - $("#q-"+index).remove(); - }; - - $scope.createEmptyElement = function(type,orderNo){ - return { - id: $scope.survey.elements.length+1, // TODO : generate the ID - orderNo: orderNo, - type: type - }; - } - - } - -})(); diff --git a/src/app/pages/surveys/SurveysPageCtrl.js.bak b/src/app/pages/surveys/SurveysPageCtrl.js.bak new file mode 100644 index 0000000..1fb7712 --- /dev/null +++ b/src/app/pages/surveys/SurveysPageCtrl.js.bak @@ -0,0 +1,142 @@ +/** + * @author v.lugovsky + * created on 16.12.2015 + */ +(function () { + 'use strict'; + + angular.module('BlurAdmin.pages.surveys') + .controller('SurveysPageCtrl', SurveysPageCtrl) + .directive('multiple', function() { + return { + templateUrl: 'app/pages/surveys/widgets/multiple.html' + }; + }) + .directive("contenteditable", function() { + return { + require: "ngModel", + link: function(scope, element, attrs, ngModel) { + + function read() { + ngModel.$setViewValue(element.html()); + } + + ngModel.$render = function() { + element.html(ngModel.$viewValue || ""); + }; + + element.bind("blur keyup change", function() { + scope.$apply(read); + }); + } + }; + }); + + /** @ngInject */ + function SurveysPageCtrl($scope, $http, $compile, $timeout) { + + $scope.editmode = true; + $scope.survey = {}; + $scope.survey.name = 'Page Title'; + $scope.survey.description = 'Page Description'; + $scope.survey.elements = []; + + $scope.progressFunction = function() { + return $timeout(function() {}, 3000); + }; + + $scope.panelFoldToggle = function(index) { + $scope.survey.elements[index].isUnfolded = !$scope.survey.elements[index].isUnfolded; + console.log($scope.survey.elements[index].isUnfolded); + }; + + $scope.getTheFoldingClass = function() { + var $className = ( $scope.isUnfolded ) ? "fa fa-compress" : "fa fa-expand"; + return $className; + }; + + $scope.addElement = function(type){ + var element = $scope.createEmptyElement(type, $scope.survey.elements.length + 1); + $scope.activeElement=element; + $scope.survey.elements.push(element); + $scope.updateBuilder(); + console.log($scope.survey.elements); + }; + + $scope.removeElement = function(index){ + $scope.survey.elements.splice(index,1); + $scope.updateBuilder(); + }; + + $scope.createEmptyElement = function(type,orderNo){ + var item = { + id: 1, + orderNo: 1, + value: null + }; + return { + id: $scope.survey.elements.length+1, // TODO : generate the ID + orderNo: orderNo, + text: "", + type: type, + required: false, + multiAnswers: false, + isUnfolded: false, + comment: false, + commentLabel: '', + tags:[], + items: (type == 'multiple') ? [item] : [], + }; + } + + $scope.addNewItem=function(index){ + + var item = { + id: $scope.survey.elements[index].length + 1, + orderNo: $scope.survey.elements[index].length + 1, + value: null + }; + + $scope.survey.elements[index]['items'].push(item); + $scope.updateBuilder(); + }; + + $scope.removeItem=function(index, itemIndex){ + + console.log(index, itemIndex, $scope.survey.elements); + if(itemIndex != 0) { + $scope.survey.elements[index]['items'].splice(itemIndex,1); + $scope.updateBuilder(); + } + + + }; + + $scope.submitSurvey=function(){ + $scope.json = angular.toJson($scope.survey); + var url = "/" + var parameter = JSON.stringify($scope.json); + $http.post(url, parameter). + success(function(data, status, headers, config) { + // this callback will be called asynchronously + // when the response is available + console.log(data); + }). + error(function(data, status, headers, config) { + // called asynchronously if an error occurs + // or server returns response with an error status. + console.log("error",data); + }); + + }; + + $scope.updateBuilder=function(){ + var compiledeHTML = $compile("
")($scope); + $("#newElem").html(compiledeHTML); + console.log($scope.survey.elements); + + }; + + } + +})(); diff --git a/src/app/pages/surveys/create/create.html b/src/app/pages/surveys/create/create.html new file mode 100644 index 0000000..e403e0f --- /dev/null +++ b/src/app/pages/surveys/create/create.html @@ -0,0 +1,116 @@ +
+ +
+
+

Survey Title

+
+

Page Title

+

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum

+ +
+ +
+
+ + + +
+
+
+ +
+
+ +
+
+
+
+
+
+
+ diff --git a/src/app/pages/surveys/create/create.module.js b/src/app/pages/surveys/create/create.module.js new file mode 100644 index 0000000..1a73b61 --- /dev/null +++ b/src/app/pages/surveys/create/create.module.js @@ -0,0 +1,22 @@ +/** + * @author v.lugovsky + * created on 16.12.2015 + */ +(function () { + 'use strict'; + + angular.module('BlurAdmin.pages.surveys.create', []) + .directive('tagInput', tagInput); + + function tagInput() { + return { + restrict: 'A', + link: function( $scope, elem, attr) { + $(elem).tagsinput({ + tagClass: 'label label-' + attr.tagInput + }); + } + }; + } + +})(); diff --git a/src/app/pages/surveys/create/createTabCtrl.js b/src/app/pages/surveys/create/createTabCtrl.js new file mode 100644 index 0000000..71d4ea2 --- /dev/null +++ b/src/app/pages/surveys/create/createTabCtrl.js @@ -0,0 +1,142 @@ +/** + * @author v.lugovsky + * created on 16.12.2015 + */ +(function () { + 'use strict'; + + angular.module('BlurAdmin.pages.surveys.create') + .controller('CreateTabCtrl', CreateTabCtrl) + .directive('multiple', function() { + return { + templateUrl: 'app/pages/surveys/create/widgets/multiple.html' + }; + }) + .directive("contenteditable", function() { + return { + require: "ngModel", + link: function(scope, element, attrs, ngModel) { + + function read() { + ngModel.$setViewValue(element.html()); + } + + ngModel.$render = function() { + element.html(ngModel.$viewValue || ""); + }; + + element.bind("blur keyup change", function() { + scope.$apply(read); + }); + } + }; + }); + + /** @ngInject */ + function CreateTabCtrl($scope, $http, $compile, $timeout) { + + $scope.editmode = true; + $scope.survey = {}; + $scope.survey.name = 'Page Title'; + $scope.survey.description = 'Page Description'; + $scope.survey.elements = []; + + $scope.progressFunction = function() { + return $timeout(function() {}, 3000); + }; + + $scope.panelFoldToggle = function(index) { + $scope.survey.elements[index].isUnfolded = !$scope.survey.elements[index].isUnfolded; + console.log($scope.survey.elements[index].isUnfolded); + }; + + $scope.getTheFoldingClass = function() { + var $className = ( $scope.isUnfolded ) ? "fa fa-compress" : "fa fa-expand"; + return $className; + }; + + $scope.addElement = function(type){ + var element = $scope.createEmptyElement(type, $scope.survey.elements.length + 1); + $scope.activeElement=element; + $scope.survey.elements.push(element); + $scope.updateBuilder(); + console.log($scope.survey.elements); + }; + + $scope.removeElement = function(index){ + $scope.survey.elements.splice(index,1); + $scope.updateBuilder(); + }; + + $scope.createEmptyElement = function(type,orderNo){ + var item = { + id: 1, + orderNo: 1, + value: null + }; + return { + id: $scope.survey.elements.length+1, // TODO : generate the ID + orderNo: orderNo, + text: "", + type: type, + required: false, + multiAnswers: false, + isUnfolded: false, + comment: false, + commentLabel: '', + tags:[], + items: (type == 'multiple') ? [item] : [], + }; + } + + $scope.addNewItem=function(index){ + + var item = { + id: $scope.survey.elements[index].length + 1, + orderNo: $scope.survey.elements[index].length + 1, + value: null + }; + + $scope.survey.elements[index]['items'].push(item); + $scope.updateBuilder(); + }; + + $scope.removeItem=function(index, itemIndex){ + + console.log(index, itemIndex, $scope.survey.elements); + if(itemIndex != 0) { + $scope.survey.elements[index]['items'].splice(itemIndex,1); + $scope.updateBuilder(); + } + + + }; + + $scope.submitSurvey=function(){ + $scope.json = angular.toJson($scope.survey); + var url = "/" + var parameter = JSON.stringify($scope.json); + $http.post(url, parameter). + success(function(data, status, headers, config) { + // this callback will be called asynchronously + // when the response is available + console.log(data); + }). + error(function(data, status, headers, config) { + // called asynchronously if an error occurs + // or server returns response with an error status. + console.log("error",data); + }); + + }; + + $scope.updateBuilder=function(){ + var compiledeHTML = $compile("
")($scope); + $("#newElem").html(compiledeHTML); + console.log($scope.survey.elements); + + }; + + } + +})(); diff --git a/src/app/pages/surveys/widgets/multiple.html b/src/app/pages/surveys/create/widgets/multiple.html similarity index 50% rename from src/app/pages/surveys/widgets/multiple.html rename to src/app/pages/surveys/create/widgets/multiple.html index b154706..7508f52 100644 --- a/src/app/pages/surveys/widgets/multiple.html +++ b/src/app/pages/surveys/create/widgets/multiple.html @@ -1,48 +1,39 @@ -
+ + + + +
-

Question {{actualId}}

+

Question {{$index+1}}

- + - +
-
+
-
- +
-
- + +
+
- +
- - - -
-
- -
- -
- -
-
- - - + +
@@ -56,20 +47,27 @@
+
+ +
+
-
+
-
- +
+
@@ -78,6 +76,16 @@
+
+ + +
+ +
+ +
+
+
\ No newline at end of file diff --git a/src/app/pages/surveys/surveys.html b/src/app/pages/surveys/surveys.html index ea89712..e403e0f 100644 --- a/src/app/pages/surveys/surveys.html +++ b/src/app/pages/surveys/surveys.html @@ -74,8 +74,8 @@

Survey Title

-

Page Title

-

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum

+

Page Title

+

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum

@@ -94,7 +94,14 @@
  • Slider
    • +
    +
    + +
    +


    diff --git a/src/app/pages/surveys/surveys.module.js b/src/app/pages/surveys/surveys.module.js index 9fe5dba..04088ff 100644 --- a/src/app/pages/surveys/surveys.module.js +++ b/src/app/pages/surveys/surveys.module.js @@ -5,7 +5,9 @@ (function () { 'use strict'; - angular.module('BlurAdmin.pages.surveys', []) + angular.module('BlurAdmin.pages.surveys', [ + 'BlurAdmin.pages.surveys.create', + ]) .config(routeConfig); /** @ngInject */ @@ -13,12 +15,20 @@ $stateProvider .state('surveys', { url: '/surveys', - templateUrl: 'app/pages/surveys/surveys.html', - controller: 'SurveysPageCtrl', + template : '', title: 'Surveys', sidebarMeta: { + icon: 'ion-gear-a', order: 1500, }, + }).state('surveys.create', { + url: '/create', + templateUrl: 'app/pages/surveys/create/create.html', + controller: "CreateTabCtrl", + title: 'Create a Survey', + sidebarMeta: { + order: 0, + }, }); } diff --git a/src/sass/theme/_layout.scss b/src/sass/theme/_layout.scss index 6562bcb..9b79ac7 100644 --- a/src/sass/theme/_layout.scss +++ b/src/sass/theme/_layout.scss @@ -246,4 +246,22 @@ a { #surveys #survey-builder .new-question-options-container .panel-heading .btn-group{ margin-top: -25px; +} + +#surveys [contenteditable='true']:hover{ + cursor:pointer; + border: 1px dashed; + padding: 5px; + position:relative; +} +#surveys [contenteditable='true']:after{ + content: "\f040"; + font-family: FontAwesome; + opacity: 0; + position: absolute; + right: 10px; + top: 5px; +} +#surveys [contenteditable='true']:hover:after{ + opacity: 1; } \ No newline at end of file