bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-17 08:43:33 +00:00
Code Issues Releases Wiki Activity

Setup Webpack & TypeScript (#316)

Browse Source 
* TypeScript and WebPack.

* Minor cleanup.

* Add background.js as entry point to webpack.

* Use downloaded fonts for better performance.
Remove google-fonts-webpack-plugin.

* Add the remaining entry points and setup notification bar.

* Update readme for webpack.

* Convert CipherItems to TypeScript to demonstrate how a component looks in TS.

* Fix edge requirering a custom angular version.

* Rewrite gulp tasks for packaging releases.

* Re-add the webpack gulp plugin.

* Remove unessesary line in analytics.
This commit is contained in:
Oscar Hinton
2017-10-29 03:14:14 +01:00
committed by Kyle Spearrin
parent e57f3fe5f0
commit 59754cd530
36 changed files with 574 additions and 34585 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/popup/app/app.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
declare module '*.html';

94
src/popup/app/app.js
View File

@@ -1,4 +1,37 @@
angular
require('jquery');
require('bootstrap');
require('papaparse');
require('clipboard');
require('angular');
require('angular-animate');
require('angular-ui-router');
require('angular-toastr');
require('ngclipboard');
require('sweetalert');
require('angular-sweetalert');
require('angulartics');
require('angulartics-google-analytics');
require('ng-infinite-scroll');
require('../../scripts/analytics.js');
require('../../scripts/duo.js');
require('../../scripts/u2f.js');
require('../../models/api/requestModels.js');
require('../../models/api/responseModels.js');
require('../../models/dataModels.js');
require('../../models/domainModels.js');
require('../less/libs.less');
require('../less/popup.less');
import ComponentsModule from './components/components.module';
angular
.module('bit', [
'ui.router',
'ngAnimate',
@@ -7,7 +40,7 @@
'angulartics.google.analytics',
'bit.directives',
'bit.components',
ComponentsModule,
'bit.services',
'bit.global',
@@ -18,3 +51,60 @@
'bit.tools',
'bit.lock'
]);
require('./services/services.module');
require('./config');
require('./directives/directivesModule.js');
require('./directives/formDirective.js');
require('./directives/stopClickDirective.js');
require('./directives/stopPropDirective.js');
require('./directives/fallbackSrcDirective.js');
require('./components/iconComponent.js');
require('./components/actionButtonsComponent.js');
require('./services/backgroundService.js');
require('./services/authService.js');
require('./services/validationService.js');
require('./global/globalModule.js');
require('./global/mainController.js');
require('./global/tabsController.js');
require('./global/baseController.js');
require('./global/privateModeController.js');
require('./accounts/accountsModule.js');
require('./accounts/accountsLoginController.js');
require('./accounts/accountsLoginTwoFactorController.js');
require('./accounts/accountsTwoFactorMethodsController.js');
require('./accounts/accountsHintController.js');
require('./accounts/accountsRegisterController.js');
require('./current/currentModule.js');
require('./current/currentController.js');
require('./vault/vaultModule.js');
require('./vault/vaultController.js');
require('./vault/vaultViewFolderController.js');
require('./vault/vaultAddCipherController.js');
require('./vault/vaultEditCipherController.js');
require('./vault/vaultViewCipherController.js');
require('./vault/vaultAttachmentsController.js');
require('./settings/settingsModule.js');
require('./settings/settingsController.js');
require('./settings/settingsHelpController.js');
require('./settings/settingsAboutController.js');
require('./settings/settingsCreditsController.js');
require('./settings/settingsFeaturesController.js');
require('./settings/settingsSyncController.js');
require('./settings/settingsFoldersController.js');
require('./settings/settingsAddFolderController.js');
require('./settings/settingsEditFolderController.js');
require('./settings/settingsPremiumController.js');
require('./settings/settingsEnvironmentController.js');
require('./tools/toolsModule.js');
require('./tools/toolsController.js');
require('./tools/toolsPasswordGeneratorController.js');
require('./tools/toolsPasswordGeneratorHistoryController.js');
require('./tools/toolsExportController.js');
require('./lock/lockModule.js');
require('./lock/lockController.js');
// Bootstrap the angular application
angular.element(function() {
angular.bootstrap(document, ['bit']);
});

0
src/popup/app/components/views/cipherItems.html → src/popup/app/components/cipher-items.component.html
View File

30
src/popup/app/components/cipher-items.component.ts Normal file
View File

@@ -0,0 +1,30 @@
import * as template from './cipher-items.component.html';
class CipherItemsController implements ng.IController {
onSelected: Function;
onView: Function;
constructor(private i18nService: any) {
}
public view(cipher: any) {
return this.onView()(cipher);
}
public select(cipher: any) {
return this.onSelected()(cipher);
}
}
export const CipherItemsComponent = {
bindings: {
ciphers: '<',
selectionTitle: '<',
onView: '&',
onSelected: '&'
},
template: template,
controller: CipherItemsController
}

27
src/popup/app/components/cipherItemsComponent.js
View File

@@ -1,27 +0,0 @@
angular
.module('bit.components')
.component('cipherItems', {
bindings: {
ciphers: '<',
selectionTitle: '<',
onView: '&',
onSelected: '&'
},
templateUrl: 'app/components/views/cipherItems.html',
controller: function (i18nService) {
var ctrl = this;
ctrl.$onInit = function () {
ctrl.i18n = i18nService;
ctrl.view = function (cipher) {
ctrl.onView()(cipher);
};
ctrl.select = function (cipher) {
ctrl.onSelected()(cipher);
};
};
}
});

7
src/popup/app/components/components.module.ts Normal file
View File

@@ -0,0 +1,7 @@
import * as angular from 'angular';
import { CipherItemsComponent } from './cipher-items.component';
export default angular
.module('bit.components', [])
.component('cipherItems', CipherItemsComponent)
.name;

5
src/popup/app/services/services.module.js Normal file
View File

@@ -0,0 +1,5 @@
import StateService from './state.service';
angular
.module('bit.services', ['toastr'])
.service('stateService', StateService);

2
src/popup/app/services/servicesModule.js
View File

@@ -1,2 +0,0 @@
angular
.module('bit.services', ['toastr']);

36
src/popup/app/services/state.service.ts Normal file
View File

@@ -0,0 +1,36 @@
class StateService {
private state: any = {};
constructor (private utilsService: any, private constantsService: any) {
}
async init() {
const faviconsDisabled = await this.utilsService
.getObjFromStorage(this.constantsService.disableFaviconKey);
this.saveState('faviconEnabled', !faviconsDisabled);
}
saveState(key: string, data: any) {
this.state[key] = data;
}
getState(key: string): any {
if (key in this.state) {
return this.state[key];
}
return null;
}
removeState(key: string) {
delete this.state[key];
}
purgeState() {
this.state = {};
}
}
export default StateService;

35
src/popup/app/services/stateService.js
View File

@@ -1,35 +0,0 @@
angular
.module('bit.services')
.factory('stateService', function (utilsService, constantsService) {
var _service = {},
_state = {};
_service.init = function () {
utilsService.getObjFromStorage(constantsService.disableFaviconKey).then(function (disabledFavicons) {
_service.saveState('faviconEnabled', !disabledFavicons);
});
};
_service.saveState = function (key, data) {
_state[key] = data;
};
_service.getState = function (key) {
if (key in _state) {
return _state[key];
}
return null;
};
_service.removeState = function (key) {
delete _state[key];
};
_service.purgeState = function () {
_state = {};
};
return _service;
});

110
src/popup/index.html
View File

@@ -1,121 +1,13 @@
<!DOCTYPE html>
<html ng-app="bit" ng-csp>
<html ng-csp class="__BROWSER__">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>bitwarden</title>
<!-- @if true !>
<link rel="stylesheet" href="css/popup.css">
<!-- @endif -->
<!-- @exclude -->
<link rel="stylesheet" href="css/webfonts.css">
<link rel="stylesheet" href="../lib/font-awesome/css/font-awesome.css">
<link rel="stylesheet" href="../lib/angular-toastr/angular-toastr.css">
<link rel="stylesheet" href="../lib/sweetalert/sweetalert.css">
<link rel="stylesheet" href="css/popup.css">
<!-- @endexclude -->
</head>
<body ng-controller="mainController as main" class="{{main.animation}}"
ng-class="{sm: main.smBody, xs: main.xsBody }">
<div ui-view class="main-view"></div>
<!-- @if true !>
<script src="lib.js"></script>
<script src="app.js"></script>
<!-- @endif -->
<!-- @exclude -->
<script src="../lib/jquery/jquery.js"></script>
<script src="../lib/bootstrap/js/bootstrap.js"></script>
<script src="../lib/papaparse/papaparse.js"></script>
<script src="../lib/clipboard/clipboard.js"></script>
<script src="../lib/angular/angular.js"></script>
<script src="../lib/angular-animate/angular-animate.js"></script>
<script src="../lib/angular-ui-router/angular-ui-router.js"></script>
<script src="../lib/angular-toastr/angular-toastr.tpls.js"></script>
<script src="../lib/ngclipboard/ngclipboard.js"></script>
<script src="../lib/sweetalert/sweetalert-dev.js"></script>
<script src="../lib/sweetalert/SweetAlert.js"></script>
<script src="../lib/angulartics/angulartics.js"></script>
<script src="../lib/angulartics/angulartics-ga.js"></script>
<script src="../lib/ng-infinite-scroll/ng-infinite-scroll.js"></script>
<script src="../scripts/analytics.js"></script>
<script src="../scripts/duo.js"></script>
<script src="../scripts/u2f.js"></script>
<script src="../models/api/requestModels.js"></script>
<script src="../models/api/responseModels.js"></script>
<script src="../models/dataModels.js"></script>
<script src="../models/domainModels.js"></script>
<script src="app/app.js"></script>
<script src="app/config.js"></script>
<script src="app/directives/directivesModule.js"></script>
<script src="app/directives/formDirective.js"></script>
<script src="app/directives/stopClickDirective.js"></script>
<script src="app/directives/stopPropDirective.js"></script>
<script src="app/directives/fallbackSrcDirective.js"></script>
<script src="app/components/componentsModule.js"></script>
<script src="app/components/iconComponent.js"></script>
<script src="app/components/actionButtonsComponent.js"></script>
<script src="app/components/cipherItemsComponent.js"></script>
<script src="app/services/servicesModule.js"></script>
<script src="app/services/backgroundService.js"></script>
<script src="app/services/authService.js"></script>
<script src="app/services/validationService.js"></script>
<script src="app/services/stateService.js"></script>
<script src="app/global/globalModule.js"></script>
<script src="app/global/mainController.js"></script>
<script src="app/global/tabsController.js"></script>
<script src="app/global/baseController.js"></script>
<script src="app/global/privateModeController.js"></script>
<script src="app/accounts/accountsModule.js"></script>
<script src="app/accounts/accountsLoginController.js"></script>
<script src="app/accounts/accountsLoginTwoFactorController.js"></script>
<script src="app/accounts/accountsTwoFactorMethodsController.js"></script>
<script src="app/accounts/accountsHintController.js"></script>
<script src="app/accounts/accountsRegisterController.js"></script>
<script src="app/current/currentModule.js"></script>
<script src="app/current/currentController.js"></script>
<script src="app/vault/vaultModule.js"></script>
<script src="app/vault/vaultController.js"></script>
<script src="app/vault/vaultViewFolderController.js"></script>
<script src="app/vault/vaultAddCipherController.js"></script>
<script src="app/vault/vaultEditCipherController.js"></script>
<script src="app/vault/vaultViewCipherController.js"></script>
<script src="app/vault/vaultAttachmentsController.js"></script>
<script src="app/settings/settingsModule.js"></script>
<script src="app/settings/settingsController.js"></script>
<script src="app/settings/settingsHelpController.js"></script>
<script src="app/settings/settingsAboutController.js"></script>
<script src="app/settings/settingsCreditsController.js"></script>
<script src="app/settings/settingsFeaturesController.js"></script>
<script src="app/settings/settingsSyncController.js"></script>
<script src="app/settings/settingsFoldersController.js"></script>
<script src="app/settings/settingsAddFolderController.js"></script>
<script src="app/settings/settingsEditFolderController.js"></script>
<script src="app/settings/settingsPremiumController.js"></script>
<script src="app/settings/settingsEnvironmentController.js"></script>
<script src="app/tools/toolsModule.js"></script>
<script src="app/tools/toolsController.js"></script>
<script src="app/tools/toolsPasswordGeneratorController.js"></script>
<script src="app/tools/toolsPasswordGeneratorHistoryController.js"></script>
<script src="app/tools/toolsExportController.js"></script>
<script src="app/lock/lockModule.js"></script>
<script src="app/lock/lockController.js"></script>
<!-- @endexclude -->
</body>
</html>

4
src/popup/less/libs.less Normal file
View File

@@ -0,0 +1,4 @@
@import "~font-awesome/less/font-awesome.less";
@import "~angular-toastr/src/toastr.less";
@import (inline) "~sweetalert/dist/sweetalert.css";

20
src/popup/less/popup.less
View File

@@ -1,31 +1,29 @@
@import "../../../node_modules/bootstrap/less/bootstrap.less";
@import (less) "../../../node_modules/angular/angular-csp.css";
@import "~bootstrap/less/bootstrap.less";
@import (less) "~angular/angular-csp.css";
@import "variables.less";
@import "mixins.less";
@import "components.less";
@import "animations.less";
@import "plugins.less";
@import "pages.less";
@import (less) "../css/webfonts.css";
html {
-webkit-font-smoothing: antialiased;
}
body {
width: 320px !important;
height: 568px !important;
width: 375px !important;
height: 667px !important;
background-color: @background-color;
overflow: hidden;
}
/* @ifndef firefox */
/* @ifndef edge */
body {
width: 375px !important;
height: 667px !important;
html.firefox body,
html.edge body {
width: 320px !important;
height: 568px !important;
}
/* @endif */
/* @endif */
body.sm {
width: 375px !important;

6
src/popup/less/variables.less
View File

@@ -1,6 +1,6 @@
@import (reference) "../../../node_modules/bootstrap/less/bootstrap.less";
@import (reference) "../../../node_modules/bootstrap/less/mixins.less";
@import (reference) "../../../node_modules/bootstrap/less/variables.less";
@import (reference) "~bootstrap/less/bootstrap.less";
@import (reference) "~bootstrap/less/mixins.less";
@import (reference) "~bootstrap/less/variables.less";
@font-family-sans-serif: "Open Sans", sans-serif;
@text-color: #000000;