Skip to content

Commit

Permalink
Onboarding (#128)
Browse files Browse the repository at this point in the history 
* starting to add ngOnboarding

* initial onboarding test

* trying hopscotch instead

* changing vendor files

* remove unnecesary files

* make jshint ignore hopscotch

* remove i18next dependency in avAdminElections directive

* adding vendor css

* trying to add vendor css

* solving css problems

* fixing a typo

* trying to fix css

* add missing option to grunt

* using abs paths

* trying to not use minimized vendor hopscotch files

* fix hopscotch css

* adding jquery integration for state changes

* making easier to find through paths dashboard actions

* making easier to find through paths dashboard actions 2

* adding onboarding tour

* hopscotch ignore

* moving start election to the end

* improving onboarding tour service

* make it compile

* missing semicolon

* removing jslint ignore

* fix nextTour

* fix help tour

* adding OnboardingTourService to head scope so that it can be shown in helpList

* testing onboarding translations

* fix typo

* adding onboarding tour i18n

* launch wizard on first time too

* fix typo
  • Loading branch information
@edulix
edulix authored Oct 4, 2017
1 parent b22234e commit 26da725
Show file tree
Hide file tree
Showing 16 changed files with 3,662 additions and 89 deletions.
50 changes: 35 additions & 15 deletions Gruntfile.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ module.exports = function (grunt) {
fs.readFile('avPluginsConfig.js', function(err, data) {
if (err) {
grunt.log.ok('No avPluginsConfig.js file found, creating...');
var avPluginsConfigText =
var avPluginsConfigText =
"var AV_PLUGINS_CONFIG_VERSION = '" + AV_CONFIG_VERSION + "';\n" +
"angular.module('avPluginsConfig', [])\n" +
" .factory('PluginsConfigService', function() {\n" +
Expand All @@ -103,19 +103,19 @@ module.exports = function (grunt) {
" return new PluginsConfigServiceProvider();\n" +
" }];\n" +
" });";
fs.writeFile("avPluginsConfig.js",
avPluginsConfigText,
fs.writeFile("avPluginsConfig.js",
avPluginsConfigText,
function(err) {
if(err) {
grunt.log.error(
'Error creating avPluginsConfig.js file');
done(false);
} else {
grunt.log.ok('Created avPluginsConfig.js file, ' +
grunt.log.ok('Created avPluginsConfig.js file, ' +
'trying to read it again...');
checkAvPluginsConfig();
}
});
});
} else {
var match = data.toString().match(
/AV_PLUGINS_CONFIG_VERSION = [\'\"]([\w\.]*)[\'\"];/);
Expand Down Expand Up @@ -164,7 +164,11 @@ module.exports = function (grunt) {
main: {
options: {
jshintrc: '.jshintrc',
reporter: require('jshint-stylish')
reporter: require('jshint-stylish'),
ignores: [
'vendor/hopscotch-0.3.1/js/hopscotch.js'
]

},
src: createFolderGlobs('*.js')
}
Expand Down Expand Up @@ -220,6 +224,12 @@ module.exports = function (grunt) {
main: {
files: [
{src: ['img/**'], dest: 'dist/'},
{
expand: true,
cwd:'vendor/hopscotch-0.3.1/img/',
src: ['**'],
dest: 'dist/img/'
},
{src: ['img/**'], dest: 'dist/'},
{src: ['temp_data/**'], dest: 'dist/'},
{src: ['bower_components/avCommon/dist/img/flags.png'], dest: 'dist/img/flags.png'},
Expand Down Expand Up @@ -281,7 +291,8 @@ module.exports = function (grunt) {
{selector:'body',html:'<script src="/admin/avPlugins-v103111.5.js"></script>'},
{selector:'head',html:'<link rel="stylesheet" id="theme" data-base="/admin/" href="/admin/themes/default/app.min.css">'},
{selector:'head',html:'<link rel="stylesheet" id="plugins" data-base="/admin/" href="/admin/plugins.css">'},
{selector:'head',html:'<link rel="stylesheet" href="election/intlTelInput.css" />'}
{selector:'head',html:'<link rel="stylesheet" href="election/intlTelInput.css" />'},
{selector:'head',html:'<link rel="stylesheet" id="vendor-css" data-base="/admin/" href="/admin/vendor.min.css">'}
]
},
src:'index.html',
Expand All @@ -290,20 +301,29 @@ module.exports = function (grunt) {
},
cssmin: {
main: {
files: [{
expand: true,
cwd:'temp/bower_components/avCommon/themes',
src: ['**/app.css'],
dest: 'dist/themes/',
ext: '.min.css',
extDot: 'first'
}]
files: [
{
expand: true,
cwd:'temp/bower_components/avCommon/themes',
src: ['**/app.css'],
dest: 'dist/themes/',
ext: '.min.css',
extDot: 'first'
},
{
src: ['vendor/hopscotch-0.3.1/css/hopscotch.css'],
dest: 'dist/vendor.min.css'
}
]
},
},
concat: {
main: {
files: {
'dist/plugins.css': ['temp/plugins/**/*.css'],
'dist/vendor.css': [
'vendor/hopscotch-0.3.1/css/hopscotch.css'
],
'temp/libcompat.js': [
'vendor/jquery.compat/jquery-1.11.1.js',
'vendor/json3/json-v3.3.2.js',
Expand Down
2 changes: 2 additions & 0 deletions app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ angular.module(
'avPluginsConfig',
'jm.i18next',
'avUi',
'ngOnboarding',
'avRegistration',
'avTest',
'avAdmin',
Expand Down Expand Up @@ -271,6 +272,7 @@ angular.module('agora-gui-admin').run(function($http, $rootScope, ConfigService)
function(event, toState, toParams, fromState, fromParams) {
console.log("change success");
$("#angular-preloading").hide();
$(window).trigger("angular-state-change-success", [event, toState, toParams, fromState, fromParams]);
});
});

Expand Down
6 changes: 3 additions & 3 deletions avAdmin/admin-directives/dashboard/dashboard.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ <h2>
</span>
</div>
<div class="dropdown pull-right actions-div">
<button
<button
class="btn btn-success actionbtn ng-scope btn-primary dropdown-toggle"
type="button"
data-toggle="dropdown"
Expand Down Expand Up @@ -45,8 +45,8 @@ <h2>
<i class="fa fa-sw fa-2x fa-circle" ng-if="index < $index"></i>
</div>
<div class="small" ng-i18next ng-if="index != $index">{{ status }}</div>
<button ng-click="doActionConfirm($index)" class="actionbtn btn btn-success" ng-if="index == $index && nextaction">
<div class="small" ng-i18next>{{ nextaction }}</div>
<button ng-click="doActionConfirm($index)" class="actionbtn btn btn-success" ng-if="index == $index && nextaction" ng-class="['election-status-action-' + index]">
<div class="small {{ nextaction }}" ng-i18next>{{ nextaction }}</div>
<strong ng-i18next>avAdmin.dashboard.donow</strong>
</button>
<button
Expand Down
128 changes: 67 additions & 61 deletions avAdmin/admin-directives/elections/elections.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,72 +16,78 @@
**/

angular.module('avAdmin')
.directive('avAdminElections', ['Authmethod', 'ElectionsApi', '$state', 'Plugins', function(Authmethod, ElectionsApi, $state, Plugins) {
// we use it as something similar to a controller here
function link(scope, element, attrs) {
scope.page = 1;
scope.loading = false;
scope.nomore = false;
scope.elections = [];
.directive(
'avAdminElections',
function(Authmethod, ElectionsApi, $state, Plugins, $window)
{
// we use it as something similar to a controller here
function link(scope, element, attrs) {
scope.page = 1;
scope.loading = false;
scope.nomore = false;
scope.elections = [];

function loadMoreElections() {
if (scope.loading || scope.nomore) {
return;
}
scope.loading = true;
function loadMoreElections() {
if (scope.loading || scope.nomore) {
return;
}
scope.loading = true;

function getAllElections(list) {
list.forEach(function (perm) {
ElectionsApi.getElection(perm.object_id)
.then(function(d) {
scope.elections.push(d);
scope.loading -= 1;
})
.catch(function(d) {
// election doesn't exists in agora-elections
console.log("Not in agora elections: " + perm.object_id);
scope.loading -= 1;
});
});
}
function getAllElections(list) {
list.forEach(function (perm) {
ElectionsApi.getElection(perm.object_id)
.then(function(d) {
scope.elections.push(d);
scope.loading -= 1;
})
.catch(function(d) {
// election doesn't exists in agora-elections
console.log("Not in agora elections: " + perm.object_id);
scope.loading -= 1;
});
});
}

Authmethod.electionsIds(scope.page)
.success(function(data) {
scope.page += 1;
Authmethod.electionsIds(scope.page)
.success(function(data) {
scope.page += 1;

if (data.end_index === data.total_count) {
scope.nomore = true;
}
$window.electionsTotalCount = data.total_count;

// here we've the elections id, then we need to ask to
// ElectionsApi for each election and load it.
scope.loading = data.perms.length;
getAllElections(data.perms);
})
.error(function(data) {
scope.loading = false;
scope.error = data;
});
}
if (data.end_index === data.total_count) {
scope.nomore = true;
}

scope.exhtml = [];
Plugins.hook(
'admin-elections-list-extra-html',
{
'exhtml': scope.exhtml
}
);
// here we've the elections id, then we need to ask to
// ElectionsApi for each election and load it.
scope.loading = data.perms.length;
getAllElections(data.perms);
})
.error(function(data) {
scope.loading = false;
scope.error = data;
});
}

angular.extend(scope, {
loadMoreElections: loadMoreElections,
});
}
scope.exhtml = [];
Plugins.hook(
'admin-elections-list-extra-html',
{
'exhtml': scope.exhtml
}
);

angular.extend(scope, {
loadMoreElections: loadMoreElections,
});
}

return {
restrict: 'AE',
scope: {
},
link: link,
templateUrl: 'avAdmin/admin-directives/elections/elections.html'
};
}]);
return {
restrict: 'AE',
scope: {
},
link: link,
templateUrl: 'avAdmin/admin-directives/elections/elections.html'
};
}
);
3 changes: 2 additions & 1 deletion avAdmin/admin-head-directive/admin-head-directive.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
**/

angular.module('avAdmin')
.directive('avAdminHead', function(Authmethod, $state, $cookies, $i18next, $modal, ConfigService, AdminProfile, $sce) {
.directive('avAdminHead', function(Authmethod, $state, $cookies, $i18next, $modal, OnboardingTourService, ConfigService, AdminProfile, $sce) {
// we use it as something similar to a controller here
function link(scope, element, attrs) {
var autheventid = Authmethod.getAuthevent();
Expand All @@ -28,6 +28,7 @@ angular.module('avAdmin')
scope.nologin = ('nologin' in attrs) || scope.admin;
scope.helpurl = ConfigService.helpUrl;
scope.signupLink = ConfigService.signupLink;
scope.OnboardingTourService = OnboardingTourService;
scope.helpList = _.map(ConfigService.helpList, function (item, index) {
return $sce.trustAsHtml(item);
});
Expand Down
31 changes: 27 additions & 4 deletions avAdmin/admin-profile/admin-profile.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,17 @@

angular.module('avAdmin')
.controller('AdminProfileController',
function($scope, $modalInstance, ConfigService, $sce, Authmethod, fields_def, user_fields) {
function(
$scope,
$window,
OnboardingTourService,
$modalInstance,
ConfigService,
$sce,
Authmethod,
fields_def,
user_fields
) {
var field;
for (var i = 0; i < fields_def.length; i++) {
field = fields_def[i];
Expand All @@ -27,7 +37,7 @@ angular.module('avAdmin')
}
// give an initial value to fields
if (_.isUndefined(user_fields[field.name])) {
if (-1 !== ["text", "password", "regex", "email", "tlf", "textarea",
if (-1 !== ["text", "password", "regex", "email", "tlf", "textarea",
"dni"].indexOf(field.type)) {
field.value = "";
} else if ("int" === field.type) {
Expand All @@ -44,7 +54,7 @@ angular.module('avAdmin')
$scope.fields_def = fields_def;
$scope.user_fields = user_fields;
$scope.showWorking = false;

// true if some value has been changed and needs to be saved
function values_changed() {
var ret = false;
Expand All @@ -65,10 +75,23 @@ angular.module('avAdmin')
var changed = values_changed();
if (false === changed) {
$modalInstance.close();

// launch the onboarding tour if the profile has been correctly
// filled up and the election list is zero
if ($window.electionsTotalCount !== undefined && $window.electionsTotalCount === 0)
{
OnboardingTourService();
}
} else {
$scope.showWorking = true;
Authmethod.updateUserExtra(changed)
.success(function (d) {
// launch the onboarding tour if the profile has been correctly
// filled up and the election list is zero
if ($window.electionsTotalCount !== undefined && $window.electionsTotalCount === 0)
{
OnboardingTourService();
}
$modalInstance.close(changed);
})
.error(function (e) {
Expand All @@ -82,4 +105,4 @@ angular.module('avAdmin')
};

$scope.html = $sce.trustAsHtml(ConfigService.profileHtml);
});
});
2 changes: 1 addition & 1 deletion avAdmin/admin-sidebar-directive/admin-sidebar-directive.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@

<div class="nav nav-pills nav-stacked" ng-repeat="l in sidebarlinks" ng-if="'adminFields' !== l.name || !!hasAdminFields">
<li role="presentation" class="sub1" ng-class="{active:state == 'admin.'+p.name}" ng-repeat="p in l.plugins" ng-if="!!p.sidebarlink">
<a ui-sref="{{ p.link+'({id:current.id})' }}">
<a id="admin-sidebar-{{p.link}}" ui-sref="{{ p.link+'({id:current.id})' }}">
<span ng-if="p.menu.html" ng-bind-html="p.menu.html()"></span>
<span ng-if="!p.menu.html">
<i class="fa-fw fa fa-{{ p.menu.icon }}" ng-if="p.menu.icon"></i>
Expand Down
Loading

0 comments on commit 26da725

Please sign in to comment.