Updated OpenVPN Dashboard
diff --git a/views/ngXosViews/openVPNDashboard/bower.json b/views/ngXosViews/openVPNDashboard/bower.json
index 01b2715..66d7af1 100644
--- a/views/ngXosViews/openVPNDashboard/bower.json
+++ b/views/ngXosViews/openVPNDashboard/bower.json
@@ -2,9 +2,9 @@
"name": "xos-openVPNDashboard",
"version": "0.0.0",
"authors": [
- "Jeremy Mowery <jermowery@email.arizona.edu>"
+ "Matteo Scandolo <teo@onlab.us>"
],
- "description": "The OpenVPN Dashboard",
+ "description": "The openVPNDashboard view",
"license": "MIT",
"ignore": [
"**/.*",
@@ -22,8 +22,11 @@
"angular": "1.4.7",
"angular-ui-router": "0.2.15",
"angular-cookies": "1.4.7",
+ "angular-animate": "1.4.7",
"angular-resource": "1.4.7",
- "ng-lodash": "0.3.0",
- "bootstrap-css": "2.3.2"
+ "lodash": "~4.11.1",
+ "bootstrap-css": "3.3.6",
+ "angular-chart.js": "~0.10.2",
+ "d3": "~3.5.17"
}
}
diff --git a/views/ngXosViews/openVPNDashboard/env/default.js b/views/ngXosViews/openVPNDashboard/env/default.js
index 5b198ec..5f463b3 100644
--- a/views/ngXosViews/openVPNDashboard/env/default.js
+++ b/views/ngXosViews/openVPNDashboard/env/default.js
@@ -7,7 +7,7 @@
// (works only for local environment as both application are served on the same domain)
module.exports = {
- host: '',
- xoscsrftoken: '',
- xossessionid: ''
+ host: 'http://xos.dev:9999/',
+ xoscsrftoken: 'rDX21sz1qNQeClOj1zvDu1yMqUBtzl0i',
+ xossessionid: '7ouvstt0dgpq2um4cak8uunp1ssl8cs6'
};
diff --git a/views/ngXosViews/openVPNDashboard/gulp/build.js b/views/ngXosViews/openVPNDashboard/gulp/build.js
index 625e3ee..33a2cac 100644
--- a/views/ngXosViews/openVPNDashboard/gulp/build.js
+++ b/views/ngXosViews/openVPNDashboard/gulp/build.js
@@ -13,7 +13,7 @@
var uglify = require('gulp-uglify');
var templateCache = require('gulp-angular-templatecache');
var runSequence = require('run-sequence');
-var concat = require('gulp-concat');
+var concat = require('gulp-concat-util');
var del = require('del');
var wiredep = require('wiredep');
var angularFilesort = require('gulp-angular-filesort');
@@ -27,16 +27,22 @@
var mqpacker = require('css-mqpacker');
var csswring = require('csswring');
-var TEMPLATE_FOOTER = `}]);
-angular.module('xos.openVPNDashboard').run(function($location){$location.path('/')});
-angular.bootstrap(angular.element('#xosOpenVPNDashboard'), ['xos.openVPNDashboard']);`;
+const TEMPLATE_FOOTER = `
+angular.module('xos.openVPNDashboard')
+.run(['$location', function(a){
+ a.path('/');
+}])
+`
module.exports = function(options){
-
+
// delete previous builded file
gulp.task('clean', function(){
return del(
- [options.dashboards + 'xosOpenVPNDashboard.html'],
+ [
+ options.dashboards + 'xosOpenVPNDashboard.html',
+ options.static + 'css/xosOpenVPNDashboard.css'
+ ],
{force: true}
);
});
@@ -57,7 +63,8 @@
.pipe(gulp.dest(options.tmp + '/css/'));
});
- gulp.task('copyCss', ['css'], function(){
+ // copy css in correct folder
+ gulp.task('copyCss', ['wait'], function(){
return gulp.src([`${options.tmp}/css/*.css`])
.pipe(concat('xosOpenVPNDashboard.css'))
.pipe(gulp.dest(options.static + 'css/'))
@@ -71,6 +78,8 @@
.pipe(ngAnnotate())
.pipe(angularFilesort())
.pipe(concat('xosOpenVPNDashboard.js'))
+ .pipe(concat.header('//Autogenerated, do not edit!!!\n'))
+ .pipe(concat.footer(TEMPLATE_FOOTER))
.pipe(uglify())
.pipe(gulp.dest(options.static + 'js/'));
});
@@ -80,21 +89,17 @@
return gulp.src('./src/templates/*.html')
.pipe(templateCache({
module: 'xos.openVPNDashboard',
- root: 'templates/',
- templateFooter: TEMPLATE_FOOTER
+ root: 'templates/'
}))
.pipe(gulp.dest(options.tmp));
});
// copy html index to Django Folder
- gulp.task('copyHtml', ['clean'], function(){
+ gulp.task('copyHtml', function(){
return gulp.src(options.src + 'index.html')
// remove dev dependencies from html
- .pipe(replace(/<!-- bower:css -->(\n.*)*\n<!-- endbower --><!-- endcss -->/, ''))
- .pipe(replace(/<!-- bower:js -->(\n.*)*\n<!-- endbower --><!-- endjs -->/, ''))
- .pipe(replace(/ng-app=".*"\s/, ''))
- // rewriting css path
- // .pipe(replace(/(<link.*">)/, ''))
+ .pipe(replace(/<!-- bower:css -->(\n^<link.*)*\n<!-- endbower -->/gmi, ''))
+ .pipe(replace(/<!-- bower:js -->(\n^<script.*)*\n<!-- endbower -->/gmi, ''))
// injecting minified files
.pipe(
inject(
@@ -135,16 +140,25 @@
.pipe(eslint.failAfterError());
});
+ gulp.task('wait', function (cb) {
+ // setTimeout could be any async task
+ setTimeout(function () {
+ cb();
+ }, 1000);
+ });
+
gulp.task('build', function() {
runSequence(
- 'lint',
+ 'clean',
+ 'sass',
'templates',
'babel',
'scripts',
'wiredep',
- 'copyHtml',
+ 'css',
'copyCss',
+ 'copyHtml',
'cleanTmp'
);
});
-};
+};
\ No newline at end of file
diff --git a/views/ngXosViews/openVPNDashboard/gulp/server.js b/views/ngXosViews/openVPNDashboard/gulp/server.js
index 7605294..c0678d9 100644
--- a/views/ngXosViews/openVPNDashboard/gulp/server.js
+++ b/views/ngXosViews/openVPNDashboard/gulp/server.js
@@ -9,6 +9,7 @@
var wiredep = require('wiredep').stream;
var httpProxy = require('http-proxy');
var del = require('del');
+var sass = require('gulp-sass');
const environment = process.env.NODE_ENV;
@@ -34,12 +35,8 @@
module.exports = function(options){
- // open in browser with sync and proxy to 0.0.0.0
gulp.task('browser', function() {
browserSync.init({
- // reloadDelay: 500,
- // logLevel: 'debug',
- // logConnections: true,
startPath: '#/',
snippetOptions: {
rule: {
@@ -49,14 +46,16 @@
server: {
baseDir: options.src,
routes: {
- '/api': options.api,
- '/xosHelpers/src': options.helpers
+ '/xos/core/xoslib/static/js/vendor': options.helpers,
+ '/xos/core/static': options.static + '../../static/'
},
middleware: function(req, res, next){
if(
- req.url.indexOf('/xos/') !== -1 ||
- req.url.indexOf('/xoslib/') !== -1 ||
- req.url.indexOf('/hpcapi/') !== -1
+ // to be removed, deprecated API
+ // req.url.indexOf('/xos/') !== -1 ||
+ // req.url.indexOf('/xoslib/') !== -1 ||
+ // req.url.indexOf('/hpcapi/') !== -1 ||
+ req.url.indexOf('/api/') !== -1
){
if(conf.xoscsrftoken && conf.xossessionid){
req.headers.cookie = `xoscsrftoken=${conf.xoscsrftoken}; xossessionid=${conf.xossessionid}`;
@@ -78,6 +77,26 @@
gulp.watch(options.src + '**/*.html', function(){
browserSync.reload();
});
+ gulp.watch(options.css + '**/*.css', function(){
+ browserSync.reload();
+ });
+ gulp.watch(`${options.sass}/**/*.scss`, ['sass'], function(){
+ browserSync.reload();
+ });
+
+ gulp.watch([
+ options.helpers + 'ngXosHelpers.js',
+ options.static + '../../static/xosNgLib.css'
+ ], function(){
+ browserSync.reload();
+ });
+ });
+
+ // compile sass
+ gulp.task('sass', function () {
+ return gulp.src(`${options.sass}/**/*.scss`)
+ .pipe(sass().on('error', sass.logError))
+ .pipe(gulp.dest(options.css));
});
// transpile js with sourceMaps
@@ -94,8 +113,7 @@
inject(
gulp.src([
options.tmp + '**/*.js',
- options.api + '*.js',
- options.helpers + '**/*.js'
+ options.helpers + 'ngXosHelpers.js'
])
.pipe(angularFilesort()),
{
@@ -111,7 +129,10 @@
return gulp.src(options.src + 'index.html')
.pipe(
inject(
- gulp.src(options.src + 'css/*.css'),
+ gulp.src([
+ options.src + 'css/*.css',
+ options.static + '../../static/xosNgLib.css'
+ ]),
{
ignorePath: [options.src]
}
@@ -137,6 +158,7 @@
gulp.task('serve', function() {
runSequence(
+ 'sass',
'bower',
'injectScript',
'injectCss',
diff --git a/views/ngXosViews/openVPNDashboard/gulpfile.js b/views/ngXosViews/openVPNDashboard/gulpfile.js
index a3523ee..08df554 100644
--- a/views/ngXosViews/openVPNDashboard/gulpfile.js
+++ b/views/ngXosViews/openVPNDashboard/gulpfile.js
@@ -6,11 +6,12 @@
var options = {
src: 'src/',
css: 'src/css/',
+ sass: 'src/sass/',
scripts: 'src/js/',
tmp: 'src/.tmp',
dist: 'dist/',
api: '../../ngXosLib/api/',
- helpers: '../../ngXosLib/xosHelpers/src/',
+ helpers: '../../../xos/core/xoslib/static/js/vendor/',
static: '../../../xos/core/xoslib/static/', // this is the django static folder
dashboards: '../../../xos/core/xoslib/dashboards/' // this is the django html folder
};
diff --git a/views/ngXosViews/openVPNDashboard/karma.conf.js b/views/ngXosViews/openVPNDashboard/karma.conf.js
index dbd344a..4123be9 100644
--- a/views/ngXosViews/openVPNDashboard/karma.conf.js
+++ b/views/ngXosViews/openVPNDashboard/karma.conf.js
@@ -26,9 +26,8 @@
// list of files / patterns to load in the browser
files: bowerComponents.concat([
- 'src/css/**/*.css',
- '../../static/js/xosApi.js',
- '../../static/js/vendor/ngXosHelpers.js',
+ '../../../xos/core/xoslib/static/js/vendor/ngXosVendor.js',
+ '../../../xos/core/xoslib/static/js/vendor/ngXosHelpers.js',
'src/js/**/*.js',
'spec/**/*.mock.js',
'spec/**/*.test.js',
diff --git a/views/ngXosViews/openVPNDashboard/package.json b/views/ngXosViews/openVPNDashboard/package.json
index 412afec..093c76d 100644
--- a/views/ngXosViews/openVPNDashboard/package.json
+++ b/views/ngXosViews/openVPNDashboard/package.json
@@ -8,6 +8,7 @@
"prebuild": "npm install && bower install",
"build": "gulp",
"test": "karma start",
+ "test:ci": "karma start --single-run",
"lint": "eslint src/js/"
},
"keywords": [
@@ -15,31 +16,48 @@
"Angular",
"XOSlib"
],
- "author": "Jeremy Mowery",
+ "author": "Matteo Scandolo",
"license": "MIT",
"dependencies": {},
"devDependencies": {
+ "autoprefixer": "^6.3.3",
"browser-sync": "^2.9.11",
+ "css-mqpacker": "^4.0.0",
+ "csswring": "^4.2.1",
"del": "^2.0.2",
+ "easy-mocker": "^1.2.0",
+ "eslint": "^1.8.0",
+ "eslint-plugin-angular": "linkmesrl/eslint-plugin-angular",
"gulp": "^3.9.0",
"gulp-angular-filesort": "^1.1.1",
"gulp-angular-templatecache": "^1.8.0",
"gulp-babel": "^5.3.0",
"gulp-concat": "^2.6.0",
+ "gulp-concat-util": "^0.5.5",
+ "gulp-eslint": "^1.0.0",
"gulp-inject": "^3.0.0",
"gulp-minify-html": "^1.0.4",
+ "gulp-ng-annotate": "^1.1.0",
+ "gulp-postcss": "^6.0.1",
"gulp-rename": "^1.2.2",
"gulp-replace": "^0.5.4",
+ "gulp-sass": "^2.2.0",
"gulp-uglify": "^1.4.2",
"http-proxy": "^1.12.0",
+ "ink-docstrap": "^0.5.2",
+ "jasmine-core": "~2.3.4",
+ "karma": "^0.13.14",
+ "karma-babel-preprocessor": "~5.2.2",
+ "karma-coverage": "^0.5.3",
+ "karma-jasmine": "~0.3.6",
+ "karma-mocha-reporter": "~1.1.1",
+ "karma-ng-html2js-preprocessor": "^0.2.0",
+ "karma-phantomjs-launcher": "~0.2.1",
+ "lodash": "^3.10.1",
+ "phantomjs": "^1.9.19",
"proxy-middleware": "^0.15.0",
"run-sequence": "^1.1.4",
"wiredep": "^3.0.0-beta",
- "wrench": "^1.5.8",
- "gulp-ng-annotate": "^1.1.0",
- "lodash": "^3.10.1",
- "eslint": "^1.8.0",
- "eslint-plugin-angular": "linkmesrl/eslint-plugin-angular",
- "gulp-eslint": "^1.0.0"
+ "wrench": "^1.5.8"
}
}
diff --git a/views/ngXosViews/openVPNDashboard/spec/sample.test.js b/views/ngXosViews/openVPNDashboard/spec/sample.test.js
index 822c114..522ce75 100644
--- a/views/ngXosViews/openVPNDashboard/spec/sample.test.js
+++ b/views/ngXosViews/openVPNDashboard/spec/sample.test.js
@@ -11,7 +11,7 @@
httpBackend = $httpBackend;
// Setting up mock request
- $httpBackend.expectGET('/xos/users/?no_hyperlinks=1').respond([
+ $httpBackend.expectGET('/api/tenant/openvpn/list/?no_hyperlinks=1').respond([
{
email: 'jermowery@email.arizona.edu',
firstname: 'Jeremy',
@@ -20,18 +20,15 @@
]);
scope = $rootScope.$new();
- element = angular.element('<users-list></users-list>');
+ element = angular.element('<vpn-list></vpn-list>');
$compile(element)(scope);
scope.$digest();
isolatedScope = element.isolateScope().vm;
}));
- it('should load 1 users', () => {
+ it('should load 1 vpn', () => {
httpBackend.flush();
- expect(isolatedScope.users.length).toBe(1);
- expect(isolatedScope.users[0].email).toEqual('jermowery@email.arizona.edu');
- expect(isolatedScope.users[0].firstname).toEqual('Jeremy');
- expect(isolatedScope.users[0].lastname).toEqual('Mowery');
+ expect(isolatedScope.vpns.length).toBe(1);
});
});
\ No newline at end of file
diff --git a/views/ngXosViews/openVPNDashboard/src/css/main.css b/views/ngXosViews/openVPNDashboard/src/css/main.css
new file mode 100644
index 0000000..554a43a
--- /dev/null
+++ b/views/ngXosViews/openVPNDashboard/src/css/main.css
@@ -0,0 +1,10 @@
+#xosOpenVPNDashboard {
+ width: 70%;
+ margin: auto; }
+ #xosOpenVPNDashboard .vpn-row {
+ display: table-row; }
+ #xosOpenVPNDashboard .vpn-cell {
+ display: table-cell;
+ padding: 5px; }
+ #xosOpenVPNDashboard .vpn-header {
+ font-weight: bold; }
diff --git a/views/ngXosViews/openVPNDashboard/src/css/openVPNDashboard.css b/views/ngXosViews/openVPNDashboard/src/css/openVPNDashboard.css
deleted file mode 100644
index 085d5d4..0000000
--- a/views/ngXosViews/openVPNDashboard/src/css/openVPNDashboard.css
+++ /dev/null
@@ -1,14 +0,0 @@
-#xosOpenVPNDashboard{
- width: 70%;
- margin: auto;
-}
-.vpn-row {
- display: table-row;
-}
-.vpn-cell {
- display: table-cell;
- padding: 5px;
-}
-.vpn-header {
- font-weight: bold;
-}
diff --git a/views/ngXosViews/openVPNDashboard/src/index.html b/views/ngXosViews/openVPNDashboard/src/index.html
index 83048df..96dca68 100644
--- a/views/ngXosViews/openVPNDashboard/src/index.html
+++ b/views/ngXosViews/openVPNDashboard/src/index.html
@@ -1,9 +1,12 @@
<!-- browserSync -->
<!-- bower:css -->
-<link rel="stylesheet" href="vendor/bootstrap-css/css/bootstrap.css" />
+<link rel="stylesheet" href="vendor/bootstrap-css/css/bootstrap.min.css" />
+<link rel="stylesheet" href="vendor/angular-chart.js/dist/angular-chart.css" />
<!-- endbower --><!-- endcss -->
<!-- inject:css -->
+<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/css/openVPNDashboard.css">
+<link rel="stylesheet" href="/../../../xos/core/static/xosNgLib.css">
<!-- endinject -->
<div ng-app="xos.openVPNDashboard" id="xosOpenVPNDashboard">
@@ -16,19 +19,15 @@
<script src="vendor/angular-mocks/angular-mocks.js"></script>
<script src="vendor/angular-ui-router/release/angular-ui-router.js"></script>
<script src="vendor/angular-cookies/angular-cookies.js"></script>
+<script src="vendor/angular-animate/angular-animate.js"></script>
<script src="vendor/angular-resource/angular-resource.js"></script>
-<script src="vendor/ng-lodash/build/ng-lodash.js"></script>
-<script src="vendor/bootstrap-css/js/bootstrap.js"></script>
+<script src="vendor/lodash/lodash.js"></script>
+<script src="vendor/bootstrap-css/js/bootstrap.min.js"></script>
+<script src="vendor/Chart.js/Chart.js"></script>
+<script src="vendor/angular-chart.js/dist/angular-chart.js"></script>
+<script src="vendor/d3/d3.js"></script>
<!-- endbower --><!-- endjs -->
<!-- inject:js -->
-<script src="/xosHelpers/src/xosHelpers.module.js"></script>
-<script src="/xosHelpers/src/ui_components/table/table.component.js"></script>
-<script src="/xosHelpers/src/ui_components/ui-components.module.js"></script>
-<script src="/xosHelpers/src/services/noHyperlinks.interceptor.js"></script>
-<script src="/xosHelpers/src/services/csrfToken.interceptor.js"></script>
-<script src="/xosHelpers/src/services/api.services.js"></script>
-<script src="/api/ng-xoslib.js"></script>
-<script src="/api/ng-xos.js"></script>
-<script src="/api/ng-hpcapi.js"></script>
+<script src="/../../../xos/core/xoslib/static/js/vendor/ngXosHelpers.js"></script>
<script src="/.tmp/main.js"></script>
<!-- endinject -->
diff --git a/views/ngXosViews/openVPNDashboard/src/js/main.js b/views/ngXosViews/openVPNDashboard/src/js/main.js
index b16c2fb..6f6bce2 100644
--- a/views/ngXosViews/openVPNDashboard/src/js/main.js
+++ b/views/ngXosViews/openVPNDashboard/src/js/main.js
@@ -3,7 +3,6 @@
angular.module('xos.openVPNDashboard', [
'ngResource',
'ngCookies',
- 'ngLodash',
'ui.router',
'xos.helpers'
])
diff --git a/views/ngXosViews/openVPNDashboard/src/sass/main.scss b/views/ngXosViews/openVPNDashboard/src/sass/main.scss
new file mode 100644
index 0000000..96b8ce5
--- /dev/null
+++ b/views/ngXosViews/openVPNDashboard/src/sass/main.scss
@@ -0,0 +1,16 @@
+@import '../../../../style/sass/lib/_variables.scss';
+
+#xosOpenVPNDashboard {
+ width: 70%;
+ margin: auto;
+ .vpn-row {
+ display: table-row;
+ }
+ .vpn-cell {
+ display: table-cell;
+ padding: 5px;
+ }
+ .vpn-header {
+ font-weight: bold;
+ }
+}
\ No newline at end of file
diff --git a/views/ngXosViews/openVPNDashboard/src/templates/users-list.tpl.html b/views/ngXosViews/openVPNDashboard/src/templates/users-list.tpl.html
new file mode 100644
index 0000000..1fee0e2
--- /dev/null
+++ b/views/ngXosViews/openVPNDashboard/src/templates/users-list.tpl.html
@@ -0,0 +1 @@
+<xos-table config="vm.tableConfig" data="vm.users"></xos-table>
\ No newline at end of file