diff --git a/gulpfile.js b/gulpfile.js index 5108156c3b..f122a1444b 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -130,6 +130,10 @@ gulp.task('lib', ['clean:lib'], function () { src: paths.npmDir + 'angular-resource/*resource*.js', dest: paths.libDir + 'angular-resource' }, + { + src: paths.npmDir + 'angular-sanitize/*sanitize*.js', + dest: paths.libDir + 'angular-sanitize' + }, { src: [paths.npmDir + 'angular-toastr/dist/**/*.css', paths.npmDir + 'angular-toastr/dist/**/*.js'], dest: paths.libDir + 'angular-toastr' diff --git a/package.json b/package.json index 2313568474..2f339570ef 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,7 @@ "bootstrap": "3.3.7", "angular": "1.6.3", "angular-resource": "1.6.3", + "angular-sanitize": "1.6.3", "angular-ui-bootstrap": "2.5.0", "angular-ui-router": "0.4.2", "angular-jwt": "0.1.9", diff --git a/src/app/config.js b/src/app/config.js index d04fe34af3..70da5607ae 100644 --- a/src/app/config.js +++ b/src/app/config.js @@ -112,6 +112,12 @@ angular controller: 'toolsController', data: { pageTitle: 'Tools' } }) + .state('backend.user.toolsReportBreach', { + url: '^/reports/breach', + templateUrl: 'app/tools/views/toolsReportBreach.html', + controller: 'toolsReportBreachController', + data: { pageTitle: 'Data Breach Report' } + }) .state('backend.user.apps', { url: '^/apps', templateUrl: 'app/views/apps.html', diff --git a/src/app/services/apiService.js b/src/app/services/apiService.js index f35b23e0e3..8c0273fa6c 100644 --- a/src/app/services/apiService.js +++ b/src/app/services/apiService.js @@ -131,6 +131,10 @@ } }); + _service.hibp = $resource('https://haveibeenpwned.com/api/v2/breachedaccount/:email', {}, { + get: { method: 'GET', params: { email: '@email' }, isArray: true}, + }); + function transformUrlEncoded(data) { return $httpParamSerializer(data); } diff --git a/src/app/tools/toolsModule.js b/src/app/tools/toolsModule.js index 98191f4998..c15cba0148 100644 --- a/src/app/tools/toolsModule.js +++ b/src/app/tools/toolsModule.js @@ -1,2 +1,2 @@ angular - .module('bit.tools', ['ui.bootstrap', 'toastr']); + .module('bit.tools', ['ui.bootstrap', 'toastr', 'ngSanitize']); diff --git a/src/app/tools/toolsReportBreachController.js b/src/app/tools/toolsReportBreachController.js new file mode 100644 index 0000000000..440e597904 --- /dev/null +++ b/src/app/tools/toolsReportBreachController.js @@ -0,0 +1,38 @@ +angular + .module('bit.tools') + + .controller('toolsReportBreachController', function ($scope, apiService, toastr, authService) { + $scope.loading = true; + $scope.error = false; + $scope.breachAccounts = []; + $scope.email = null; + + $scope.$on('$viewContentLoaded', function () { + authService.getUserProfile().then(function (userProfile) { + $scope.email = userProfile.email; + return apiService.hibp.get({ email: $scope.email }).$promise; + }).then(function (response) { + var breachAccounts = []; + for (var i = 0; i < response.length; i++) { + var breach = { + id: response[i].Name, + title: response[i].Title, + domain: response[i].Domain, + date: new Date(response[i].BreachDate), + reportedDate: new Date(response[i].AddedDate), + modifiedDate: new Date(response[i].ModifiedDate), + count: response[i].PwnCount, + description: response[i].Description, + classes: response[i].DataClasses, + image: 'https://haveibeenpwned.com/Content/Images/PwnedLogos/' + response[i].Name + '.' + response[i].LogoType + }; + breachAccounts.push(breach); + } + $scope.breachAccounts = breachAccounts; + $scope.loading = false; + }, function (response) { + $scope.error = response.status !== 404; + $scope.loading = false; + }); + }); + }); diff --git a/src/app/tools/views/toolsReportBreach.html b/src/app/tools/views/toolsReportBreach.html new file mode 100644 index 0000000000..9c8ca5e9c7 --- /dev/null +++ b/src/app/tools/views/toolsReportBreach.html @@ -0,0 +1,76 @@ +
+

+ Reports: Data Breach + have you been pwned? +

+
+
+
+

Loading...

+
+
+

An error occurred trying to load the report. Try again...

+
+
+

Oh No, Data Breaches Found!

+

+ Your email ({{email}}) was found in {{breachAccounts.length}} + different data + + online. +

+

+ A "breach" is an incident where a site's data has been illegally accessed by hackers and then released publicly. + Review the types of data that were compromised (email addresses, passwords, credit cards etc.) and take appropriate + action, such as changing passwords. +

+ Check another email +
+
+

Good News, Nothing Found!

+

Your email ({{email}}) was not found in any known data breaches.

+ Check another email +
+
+
+

{{breach.title}}

+
+
+
+
+ {{breach.id}} logo +
+
+
+
+

+
Compromised Data
+
    +
  • {{class}}
  • +
+
+
+
+
+
{{breach.domain}}
+
Users
+
{{breach.count | number: 0}}
+
Occurred
+
{{breach.date | date: format: mediumDate}}
+
Reported
+
{{breach.reportedDate | date: format: mediumDate}}
+
Updated
+
{{breach.modifiedDate | date: format: mediumDate}}
+
+
+
+
+
+
+
+

+ This data is brought to you as a service from + Have I been pwned?. + Please check out their wonderful services and subscribe to receive notifications about future data breaches. +

+
diff --git a/src/app/views/userLayout.html b/src/app/views/userLayout.html index 1c15d7ae05..0b3d88e9d4 100644 --- a/src/app/views/userLayout.html +++ b/src/app/views/userLayout.html @@ -61,8 +61,15 @@ Shared -
  • +
  • Tools +
  • + @@ -169,6 +170,7 @@ + diff --git a/src/less/vault.less b/src/less/vault.less index f41f379bd4..a2e7ed9bfd 100644 --- a/src/less/vault.less +++ b/src/less/vault.less @@ -341,6 +341,19 @@ form .btn .loading-icon { } } +.box-breach { + img { + max-height: 200px; + margin-bottom: 20px; + margin-left: auto; + margin-right: auto; + + @media (min-width: @screen-sm) { + margin-top: 10px; + } + } +} + /* Toastr */ #toast-container {