(window["webpackJsonp"] = window["webpackJsonp"] || []).push([["main"],{ /***/ "./$$_lazy_route_resource lazy recursive": /*!******************************************************!*\ !*** ./$$_lazy_route_resource lazy namespace object ***! \******************************************************/ /*! no static exports found */ /***/ (function(module, exports) { function webpackEmptyAsyncContext(req) { // Here Promise.resolve().then() is used instead of new Promise() to prevent // uncaught exception popping up in devtools return Promise.resolve().then(function() { var e = new Error("Cannot find module '" + req + "'"); e.code = 'MODULE_NOT_FOUND'; throw e; }); } webpackEmptyAsyncContext.keys = function() { return []; }; webpackEmptyAsyncContext.resolve = webpackEmptyAsyncContext; module.exports = webpackEmptyAsyncContext; webpackEmptyAsyncContext.id = "./$$_lazy_route_resource lazy recursive"; /***/ }), /***/ "./node_modules/raw-loader/dist/cjs.js!./src/app/_modal/modal-skills.component.html": /*!******************************************************************************************!*\ !*** ./node_modules/raw-loader/dist/cjs.js!./src/app/_modal/modal-skills.component.html ***! \******************************************************************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony default export */ __webpack_exports__["default"] = ("\r\n"); /***/ }), /***/ "./node_modules/raw-loader/dist/cjs.js!./src/app/_modal/modal.component.html": /*!***********************************************************************************!*\ !*** ./node_modules/raw-loader/dist/cjs.js!./src/app/_modal/modal.component.html ***! \***********************************************************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony default export */ __webpack_exports__["default"] = ("\r\n"); /***/ }), /***/ "./node_modules/raw-loader/dist/cjs.js!./src/app/app.component.html": /*!**************************************************************************!*\ !*** ./node_modules/raw-loader/dist/cjs.js!./src/app/app.component.html ***! \**************************************************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony default export */ __webpack_exports__["default"] = ("\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n"); /***/ }), /***/ "./node_modules/raw-loader/dist/cjs.js!./src/app/threejs-bg/threejs-bg.component.html": /*!********************************************************************************************!*\ !*** ./node_modules/raw-loader/dist/cjs.js!./src/app/threejs-bg/threejs-bg.component.html ***! \********************************************************************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony default export */ __webpack_exports__["default"] = ("

\n"); /***/ }), /***/ "./src/app/_modal/index.ts": /*!*********************************!*\ !*** ./src/app/_modal/index.ts ***! \*********************************/ /*! exports provided: ModalModule, ModalService */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _modal_module__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./modal.module */ "./src/app/_modal/modal.module.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ModalModule", function() { return _modal_module__WEBPACK_IMPORTED_MODULE_0__["ModalModule"]; }); /* harmony import */ var _modal_service__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./modal.service */ "./src/app/_modal/modal.service.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ModalService", function() { return _modal_service__WEBPACK_IMPORTED_MODULE_1__["ModalService"]; }); /***/ }), /***/ "./src/app/_modal/modal-skills.component.ts": /*!**************************************************!*\ !*** ./src/app/_modal/modal-skills.component.ts ***! \**************************************************/ /*! exports provided: ModalSkillsComponent */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ModalSkillsComponent", function() { return ModalSkillsComponent; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var chart_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! chart.js */ "./node_modules/chart.js/dist/chart.esm.js"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var _modal_component__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modal.component */ "./src/app/_modal/modal.component.ts"); /* harmony import */ var _modal_service__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./modal.service */ "./src/app/_modal/modal.service.ts"); chart_js__WEBPACK_IMPORTED_MODULE_1__["Chart"].register(chart_js__WEBPACK_IMPORTED_MODULE_1__["ArcElement"], chart_js__WEBPACK_IMPORTED_MODULE_1__["LineElement"], chart_js__WEBPACK_IMPORTED_MODULE_1__["BarElement"], chart_js__WEBPACK_IMPORTED_MODULE_1__["PointElement"], chart_js__WEBPACK_IMPORTED_MODULE_1__["BarController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["BubbleController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["DoughnutController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["LineController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["PieController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["PolarAreaController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["RadarController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["ScatterController"], chart_js__WEBPACK_IMPORTED_MODULE_1__["CategoryScale"], chart_js__WEBPACK_IMPORTED_MODULE_1__["LinearScale"], chart_js__WEBPACK_IMPORTED_MODULE_1__["LogarithmicScale"], chart_js__WEBPACK_IMPORTED_MODULE_1__["RadialLinearScale"], chart_js__WEBPACK_IMPORTED_MODULE_1__["TimeScale"], chart_js__WEBPACK_IMPORTED_MODULE_1__["TimeSeriesScale"], chart_js__WEBPACK_IMPORTED_MODULE_1__["Decimation"], chart_js__WEBPACK_IMPORTED_MODULE_1__["Filler"], chart_js__WEBPACK_IMPORTED_MODULE_1__["Legend"], chart_js__WEBPACK_IMPORTED_MODULE_1__["Title"], chart_js__WEBPACK_IMPORTED_MODULE_1__["Tooltip"]); let ModalSkillsComponent = class ModalSkillsComponent extends _modal_component__WEBPACK_IMPORTED_MODULE_3__["ModalComponent"] { constructor(modalService, el) { super(modalService, el); this.modalService = modalService; this.el = el; this.color_cyan = 'rgba(0, 223, 255, 1)'; this.color_cyan_transparent = 'rgba(0, 223, 255, 0.2)'; this.lang_c_sharp = 'C#'; this.lang_c_plus_plus = 'C++'; this.lang_java = 'Java'; this.lang_python = 'Python'; this.lang_javascript = 'JavaScript'; this.lang_typescript = 'TypeScript'; this.tooltip_c_sharp = `Three years of writing and maintaining enterprise level nUnit framework. Got recognition for innovative automation strategies. Proved that it's possible to build API automation with nUnit and RestSharp and save money on ReadyAPI license as well as benefit from UI test performance improvements by reusing API endpoints in preconditions and dispose. I like to go a step further then Page Object Model and with the help of generics reduce maintenance overhead to a minimum. Aside from work I study how to build back-end with .NET and fiddle around in Unity game engine. To reach next level I need to get more practice with Entity Framework, MVC and software security. At work I still experience difficulties understanding Stored Procedures in developer's code. Not ready to develop enterprise applications.`; this.tooltip_c_plus_plus = `By far my most favorite language. Ability to visualize code is my favorite activity so I use C++ in conjunction with OpenGL. For several years I've tried to build a 3D Editor completely rebuilding it as my knowledge expands. This language truly has no limits and it helps me understand other languages and patterns. Loki library offers good mental exercise. It's hard to self evaluate C++ skill level. The amount of information one has to know has no end in sight. In the near future I want to learn memory management and build MVC from scratch to understand it better.`; this.tooltip_java = `Before C# I used to do automation with Java and JUnit for 3 years. Nothing as fancy as I do now, just UI automation against single stage environment. In a spare time I used to study Android app development using Java with OpenGL integration. Published one app to the google app store. Not growing developer skills in this area. For android app development I would use Kotlin as recommended by Google. And for back-end I prefer .NET instead of Java EE.`; this.tooltip_python = `Writing automated tests using PyTest framework. Creating internal tools using python. Used Python to aggregate data parsed from TestRail to help identify coverage gaps. Wrote a plugin for SoftImage XSI.`; this.tooltip_javascript = `Using on the basic level inside selenium script executioner to help automate actions that cannot be automated otherwise, like endless scroll, drag-and-drop. Studied how event system works. Completed tutorials on WebGL.`; this.tooltip_typescript = `Studying as a part of Angular tutorials. This website is build with Angular; Chart.JS and ThreeJS libraries.`; } ngOnInit() { super.ngOnInit(); var myChart = new chart_js__WEBPACK_IMPORTED_MODULE_1__["Chart"]("skills-chart", { type: 'bar', data: { labels: [ this.lang_python, this.lang_c_sharp, this.lang_java, this.lang_c_plus_plus, this.lang_javascript, this.lang_typescript ], datasets: [{ label: 'Level', data: [3, 3, 2, 2, 1, 1], backgroundColor: [ this.color_cyan_transparent, ], borderColor: [ this.color_cyan, ], borderWidth: 1 }] }, options: { responsive: true, maintainAspectRatio: true, scales: { x: { ticks: { color: this.color_cyan, }, grid: { color: this.color_cyan_transparent }, }, y: { min: 0, max: 5, ticks: { callback: function (value) { switch (value) { case 0: return 'Never Tried'; case 1: return 'Beginner'; case 2: return 'Intermediate'; case 3: return 'Advanced'; case 4: return 'Pro'; case 5: return 'Bjarne Stroustrup'; default: return ''; } }, color: this.color_cyan, }, grid: { color: this.color_cyan_transparent } } }, plugins: { legend: { display: false }, tooltip: { callbacks: { footer: (tooltipItems) => { let label = ''; tooltipItems.forEach(function (tooltipItem) { label = tooltipItem.label; }); switch (label) { case this.lang_c_sharp: return this.tooltip_c_sharp; case this.lang_c_plus_plus: return this.tooltip_c_plus_plus; case this.lang_java: return this.tooltip_java; case this.lang_javascript: return this.tooltip_javascript; case this.lang_python: return this.tooltip_python; case this.lang_typescript: return this.tooltip_typescript; default: return ''; } } } } } } }); } }; ModalSkillsComponent.ctorParameters = () => [ { type: _modal_service__WEBPACK_IMPORTED_MODULE_4__["ModalService"] }, { type: _angular_core__WEBPACK_IMPORTED_MODULE_2__["ElementRef"] } ]; ModalSkillsComponent = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_2__["Component"])({ selector: 'modal-skills', template: Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! raw-loader!./modal-skills.component.html */ "./node_modules/raw-loader/dist/cjs.js!./src/app/_modal/modal-skills.component.html")).default, styles: [Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! ./modal.component.css */ "./src/app/_modal/modal.component.css")).default] }) ], ModalSkillsComponent); /***/ }), /***/ "./src/app/_modal/modal.component.css": /*!********************************************!*\ !*** ./src/app/_modal/modal.component.css ***! \********************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony default export */ __webpack_exports__["default"] = ("\r\n.modal {\r\n position: relative;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n z-index: 3;\r\n overflow: auto;\r\n}\r\n\r\n.content {\r\n overflow: auto;\r\n margin: 3vh;\r\n flex-wrap: wrap;\r\n align-content: center;\r\n color: aliceblue;\r\n z-index: 4;\r\n}\r\n\r\na.btn {\r\n display: inline-block;\r\n padding: 0.35em 1.2em;\r\n border: 0.1em solid #00dfff;\r\n margin: 6em 1em 2em 0em;\r\n border-radius: 0.2em;\r\n box-sizing: border-box;\r\n text-decoration: none;\r\n color: #00dfff;\r\n text-align: center;\r\n transition: all 0.2s;\r\n font-weight: 300;\r\n -webkit-user-select: none;\r\n user-select: none;\r\n cursor: pointer;\r\n}\r\n\r\na.btn:hover{\r\n color: #040e17;\r\n background-color: #00dfff;\r\n}\r\n\r\n@media all and (max-width:30em){\r\n a.btn {\r\n display: block;\r\n margin: 0.4em auto;\r\n }\r\n}\r\n\r\n.back-btn {\r\n position: fixed;\r\n float: right;\r\n right: 5vh;\r\n top: 0;\r\n z-index: 10;\r\n}\r\n\r\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNyYy9hcHAvX21vZGFsL21vZGFsLmNvbXBvbmVudC5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUNBO0VBQ0Usa0JBQWtCO0VBQ2xCLE1BQU07RUFDTixPQUFPO0VBQ1AsUUFBUTtFQUNSLFVBQVU7RUFDVixjQUFjO0FBQ2hCOztBQUVBO0VBQ0UsY0FBYztFQUNkLFdBQVc7RUFDWCxlQUFlO0VBQ2YscUJBQXFCO0VBQ3JCLGdCQUFnQjtFQUNoQixVQUFVO0FBQ1o7O0FBRUE7RUFDRSxxQkFBcUI7RUFDckIscUJBQXFCO0VBQ3JCLDJCQUEyQjtFQUMzQix1QkFBdUI7RUFDdkIsb0JBQW9CO0VBQ3BCLHNCQUFzQjtFQUN0QixxQkFBcUI7RUFDckIsY0FBYztFQUNkLGtCQUFrQjtFQUNsQixvQkFBb0I7RUFDcEIsZ0JBQWdCO0VBQ2hCLHlCQUFpQjtVQUFqQixpQkFBaUI7RUFDakIsZUFBZTtBQUNqQjs7QUFFQTtFQUNFLGNBQWM7RUFDZCx5QkFBeUI7QUFDM0I7O0FBRUE7RUFDRTtJQUNFLGNBQWM7SUFDZCxrQkFBa0I7RUFDcEI7QUFDRjs7QUFFQTtFQUNFLGVBQWU7RUFDZixZQUFZO0VBQ1osVUFBVTtFQUNWLE1BQU07RUFDTixXQUFXO0FBQ2IiLCJmaWxlIjoic3JjL2FwcC9fbW9kYWwvbW9kYWwuY29tcG9uZW50LmNzcyIsInNvdXJjZXNDb250ZW50IjpbIlxyXG4ubW9kYWwge1xyXG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcclxuICB0b3A6IDA7XHJcbiAgbGVmdDogMDtcclxuICByaWdodDogMDtcclxuICB6LWluZGV4OiAzO1xyXG4gIG92ZXJmbG93OiBhdXRvO1xyXG59XHJcblxyXG4uY29udGVudCB7XHJcbiAgb3ZlcmZsb3c6IGF1dG87XHJcbiAgbWFyZ2luOiAzdmg7XHJcbiAgZmxleC13cmFwOiB3cmFwO1xyXG4gIGFsaWduLWNvbnRlbnQ6IGNlbnRlcjtcclxuICBjb2xvcjogYWxpY2VibHVlO1xyXG4gIHotaW5kZXg6IDQ7XHJcbn1cclxuXHJcbmEuYnRuIHtcclxuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XHJcbiAgcGFkZGluZzogMC4zNWVtIDEuMmVtO1xyXG4gIGJvcmRlcjogMC4xZW0gc29saWQgIzAwZGZmZjtcclxuICBtYXJnaW46IDZlbSAxZW0gMmVtIDBlbTtcclxuICBib3JkZXItcmFkaXVzOiAwLjJlbTtcclxuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xyXG4gIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcclxuICBjb2xvcjogIzAwZGZmZjtcclxuICB0ZXh0LWFsaWduOiBjZW50ZXI7XHJcbiAgdHJhbnNpdGlvbjogYWxsIDAuMnM7XHJcbiAgZm9udC13ZWlnaHQ6IDMwMDtcclxuICB1c2VyLXNlbGVjdDogbm9uZTtcclxuICBjdXJzb3I6IHBvaW50ZXI7XHJcbn1cclxuXHJcbmEuYnRuOmhvdmVye1xyXG4gIGNvbG9yOiAjMDQwZTE3O1xyXG4gIGJhY2tncm91bmQtY29sb3I6ICMwMGRmZmY7XHJcbn1cclxuXHJcbkBtZWRpYSBhbGwgYW5kIChtYXgtd2lkdGg6MzBlbSl7XHJcbiAgYS5idG4ge1xyXG4gICAgZGlzcGxheTogYmxvY2s7XHJcbiAgICBtYXJnaW46IDAuNGVtIGF1dG87XHJcbiAgfVxyXG59XHJcblxyXG4uYmFjay1idG4ge1xyXG4gIHBvc2l0aW9uOiBmaXhlZDtcclxuICBmbG9hdDogcmlnaHQ7XHJcbiAgcmlnaHQ6IDV2aDtcclxuICB0b3A6IDA7XHJcbiAgei1pbmRleDogMTA7XHJcbn1cclxuIl19 */"); /***/ }), /***/ "./src/app/_modal/modal.component.ts": /*!*******************************************!*\ !*** ./src/app/_modal/modal.component.ts ***! \*******************************************/ /*! exports provided: ModalComponent */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ModalComponent", function() { return ModalComponent; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var _modal_service__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modal.service */ "./src/app/_modal/modal.service.ts"); let ModalComponent = class ModalComponent { constructor(modalService, el) { this.modalService = modalService; this.el = el; this.id = ''; this.element = el.nativeElement; } ngOnInit() { if (!this.id) { console.log('modal must have an id'); return; } this.element.style.display = 'none'; document.body.appendChild(this.element); this.modalService.add(this); } ngOnDestroy() { this.modalService.remove(this.id); this.element.remove(); } open() { this.element.style.display = 'block'; } close() { this.element.style.display = 'none'; } }; ModalComponent.ctorParameters = () => [ { type: _modal_service__WEBPACK_IMPORTED_MODULE_2__["ModalService"] }, { type: _angular_core__WEBPACK_IMPORTED_MODULE_1__["ElementRef"] } ]; Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_1__["Input"])() ], ModalComponent.prototype, "id", void 0); ModalComponent = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_1__["Component"])({ selector: 'modal', template: Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! raw-loader!./modal.component.html */ "./node_modules/raw-loader/dist/cjs.js!./src/app/_modal/modal.component.html")).default, encapsulation: _angular_core__WEBPACK_IMPORTED_MODULE_1__["ViewEncapsulation"].None, styles: [Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! ./modal.component.css */ "./src/app/_modal/modal.component.css")).default] }) ], ModalComponent); /***/ }), /***/ "./src/app/_modal/modal.module.ts": /*!****************************************!*\ !*** ./src/app/_modal/modal.module.ts ***! \****************************************/ /*! exports provided: ModalModule */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ModalModule", function() { return ModalModule; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var _angular_common__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @angular/common */ "./node_modules/@angular/common/__ivy_ngcc__/fesm2015/common.js"); /* harmony import */ var _angular_flex_layout__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @angular/flex-layout */ "./node_modules/@angular/flex-layout/__ivy_ngcc__/esm2015/flex-layout.js"); /* harmony import */ var _modal_component__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modal.component */ "./src/app/_modal/modal.component.ts"); /* harmony import */ var _modal_skills_component__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./modal-skills.component */ "./src/app/_modal/modal-skills.component.ts"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); let ModalModule = class ModalModule { }; ModalModule = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_5__["NgModule"])({ imports: [_angular_common__WEBPACK_IMPORTED_MODULE_1__["CommonModule"], _angular_flex_layout__WEBPACK_IMPORTED_MODULE_2__["FlexLayoutModule"]], declarations: [_modal_component__WEBPACK_IMPORTED_MODULE_3__["ModalComponent"], _modal_skills_component__WEBPACK_IMPORTED_MODULE_4__["ModalSkillsComponent"]], exports: [_modal_component__WEBPACK_IMPORTED_MODULE_3__["ModalComponent"], _modal_skills_component__WEBPACK_IMPORTED_MODULE_4__["ModalSkillsComponent"]] }) ], ModalModule); /***/ }), /***/ "./src/app/_modal/modal.service.ts": /*!*****************************************!*\ !*** ./src/app/_modal/modal.service.ts ***! \*****************************************/ /*! exports provided: ModalService */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ModalService", function() { return ModalService; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); // import { ThreejsBgService } from '../threejs-bg/threejs-bg.service'; let ModalService = class ModalService { constructor() { this.modals = []; this.isOpen = false; } add(modal) { this.modals.push(modal); } remove(id) { this.modals = this.modals.filter(x => x.id !== id); } open(id) { this.modals.forEach(m => m.close()); const modal = this.modals.find(x => x.id === id); modal.open(); this.isOpen = true; } close() { this.modals.forEach(m => m.close()); this.isOpen = false; } isModalOpen() { return this.isOpen; } }; ModalService = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_1__["Injectable"])({ providedIn: 'root' }) ], ModalService); /***/ }), /***/ "./src/app/app-routing.module.ts": /*!***************************************!*\ !*** ./src/app/app-routing.module.ts ***! \***************************************/ /*! exports provided: AppRoutingModule */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AppRoutingModule", function() { return AppRoutingModule; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var _angular_router__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @angular/router */ "./node_modules/@angular/router/__ivy_ngcc__/fesm2015/router.js"); const routes = []; let AppRoutingModule = class AppRoutingModule { }; AppRoutingModule = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_1__["NgModule"])({ imports: [_angular_router__WEBPACK_IMPORTED_MODULE_2__["RouterModule"].forRoot(routes)], exports: [_angular_router__WEBPACK_IMPORTED_MODULE_2__["RouterModule"]] }) ], AppRoutingModule); /***/ }), /***/ "./src/app/app.component.css": /*!***********************************!*\ !*** ./src/app/app.component.css ***! \***********************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony default export */ __webpack_exports__["default"] = ("#bg-canvas {\r\n position: fixed;\r\n left: 0;\r\n top: 0;\r\n right: 0;\r\n bottom: 0;\r\n width: 100%;\r\n height: 100%;\r\n z-index: -2;\r\n box-sizing: border-box;\r\n}\r\n\r\nfooter {\r\n position: fixed;\r\n left: 0;\r\n bottom: 0;\r\n width: 100%;\r\n color: white;\r\n text-align: center;\r\n z-index: 5;\r\n font-family:'Consolas',sans-serif;\r\n /* background-color: red; */\r\n background: linear-gradient(0deg, rgba(0,0,0,1) 30%, rgba(0,212,255,0) 100%);\r\n}\r\n\r\na.link {\r\n display: inline-block;\r\n color: white;\r\n}\r\n\r\na.link:hover {\r\n display: inline-block;\r\n color: #00dfff;\r\n}\r\n\r\na.btn {\r\n display: inline-block;\r\n padding: 0.35em 1.2em;\r\n border: 0.1em solid #00dfff;\r\n margin: 6em 1em 2em 0em;\r\n border-radius: 0.2em;\r\n box-sizing: border-box;\r\n text-decoration: none;\r\n color: #00dfff;\r\n text-align: center;\r\n transition: all 0.2s;\r\n font-weight: 300;\r\n -webkit-user-select: none;\r\n user-select: none;\r\n cursor: pointer;\r\n}\r\n\r\na.btn:hover{\r\n color: #040e17;\r\n background-color: #00dfff;\r\n}\r\n\r\n@media all and (max-width:30em){\r\n a.btn {\r\n display: block;\r\n margin: 0.4em auto;\r\n }\r\n}\r\n\r\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNyYy9hcHAvYXBwLmNvbXBvbmVudC5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7RUFDRSxlQUFlO0VBQ2YsT0FBTztFQUNQLE1BQU07RUFDTixRQUFRO0VBQ1IsU0FBUztFQUNULFdBQVc7RUFDWCxZQUFZO0VBQ1osV0FBVztFQUNYLHNCQUFzQjtBQUN4Qjs7QUFFQTtFQUNFLGVBQWU7RUFDZixPQUFPO0VBQ1AsU0FBUztFQUNULFdBQVc7RUFDWCxZQUFZO0VBQ1osa0JBQWtCO0VBQ2xCLFVBQVU7RUFDVixpQ0FBaUM7RUFDakMsMkJBQTJCO0VBQzNCLDRFQUE0RTtBQUM5RTs7QUFFQTtFQUNFLHFCQUFxQjtFQUNyQixZQUFZO0FBQ2Q7O0FBRUE7RUFDRSxxQkFBcUI7RUFDckIsY0FBYztBQUNoQjs7QUFFQTtFQUNFLHFCQUFxQjtFQUNyQixxQkFBcUI7RUFDckIsMkJBQTJCO0VBQzNCLHVCQUF1QjtFQUN2QixvQkFBb0I7RUFDcEIsc0JBQXNCO0VBQ3RCLHFCQUFxQjtFQUNyQixjQUFjO0VBQ2Qsa0JBQWtCO0VBQ2xCLG9CQUFvQjtFQUNwQixnQkFBZ0I7RUFDaEIseUJBQWlCO1VBQWpCLGlCQUFpQjtFQUNqQixlQUFlO0FBQ2pCOztBQUVBO0VBQ0UsY0FBYztFQUNkLHlCQUF5QjtBQUMzQjs7QUFFQTtFQUNFO0lBQ0UsY0FBYztJQUNkLGtCQUFrQjtFQUNwQjtBQUNGIiwiZmlsZSI6InNyYy9hcHAvYXBwLmNvbXBvbmVudC5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIjYmctY2FudmFzIHtcclxuICBwb3NpdGlvbjogZml4ZWQ7XHJcbiAgbGVmdDogMDtcclxuICB0b3A6IDA7XHJcbiAgcmlnaHQ6IDA7XHJcbiAgYm90dG9tOiAwO1xyXG4gIHdpZHRoOiAxMDAlO1xyXG4gIGhlaWdodDogMTAwJTtcclxuICB6LWluZGV4OiAtMjtcclxuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xyXG59XHJcblxyXG5mb290ZXIge1xyXG4gIHBvc2l0aW9uOiBmaXhlZDtcclxuICBsZWZ0OiAwO1xyXG4gIGJvdHRvbTogMDtcclxuICB3aWR0aDogMTAwJTtcclxuICBjb2xvcjogd2hpdGU7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gIHotaW5kZXg6IDU7XHJcbiAgZm9udC1mYW1pbHk6J0NvbnNvbGFzJyxzYW5zLXNlcmlmO1xyXG4gIC8qIGJhY2tncm91bmQtY29sb3I6IHJlZDsgKi9cclxuICBiYWNrZ3JvdW5kOiBsaW5lYXItZ3JhZGllbnQoMGRlZywgcmdiYSgwLDAsMCwxKSAzMCUsIHJnYmEoMCwyMTIsMjU1LDApIDEwMCUpO1xyXG59XHJcblxyXG5hLmxpbmsge1xyXG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcclxuICBjb2xvcjogd2hpdGU7XHJcbn1cclxuXHJcbmEubGluazpob3ZlciB7XHJcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xyXG4gIGNvbG9yOiAjMDBkZmZmO1xyXG59XHJcblxyXG5hLmJ0biB7XHJcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xyXG4gIHBhZGRpbmc6IDAuMzVlbSAxLjJlbTtcclxuICBib3JkZXI6IDAuMWVtIHNvbGlkICMwMGRmZmY7XHJcbiAgbWFyZ2luOiA2ZW0gMWVtIDJlbSAwZW07XHJcbiAgYm9yZGVyLXJhZGl1czogMC4yZW07XHJcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDtcclxuICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XHJcbiAgY29sb3I6ICMwMGRmZmY7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gIHRyYW5zaXRpb246IGFsbCAwLjJzO1xyXG4gIGZvbnQtd2VpZ2h0OiAzMDA7XHJcbiAgdXNlci1zZWxlY3Q6IG5vbmU7XHJcbiAgY3Vyc29yOiBwb2ludGVyO1xyXG59XHJcblxyXG5hLmJ0bjpob3ZlcntcclxuICBjb2xvcjogIzA0MGUxNztcclxuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkZmZmO1xyXG59XHJcblxyXG5AbWVkaWEgYWxsIGFuZCAobWF4LXdpZHRoOjMwZW0pe1xyXG4gIGEuYnRuIHtcclxuICAgIGRpc3BsYXk6IGJsb2NrO1xyXG4gICAgbWFyZ2luOiAwLjRlbSBhdXRvO1xyXG4gIH1cclxufVxyXG4iXX0= */"); /***/ }), /***/ "./src/app/app.component.ts": /*!**********************************!*\ !*** ./src/app/app.component.ts ***! \**********************************/ /*! exports provided: AppComponent */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AppComponent", function() { return AppComponent; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var _modal__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./_modal */ "./src/app/_modal/index.ts"); let AppComponent = class AppComponent { constructor(modal) { this.modal = modal; this.title = 'my-homepage'; } }; AppComponent.ctorParameters = () => [ { type: _modal__WEBPACK_IMPORTED_MODULE_2__["ModalService"] } ]; AppComponent = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_1__["Component"])({ selector: 'app-root', template: Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! raw-loader!./app.component.html */ "./node_modules/raw-loader/dist/cjs.js!./src/app/app.component.html")).default, styles: [Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! ./app.component.css */ "./src/app/app.component.css")).default] }) ], AppComponent); /***/ }), /***/ "./src/app/app.module.ts": /*!*******************************!*\ !*** ./src/app/app.module.ts ***! \*******************************/ /*! exports provided: AppModule */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AppModule", function() { return AppModule; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var _app_component__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./app.component */ "./src/app/app.component.ts"); /* harmony import */ var _app_routing_module__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./app-routing.module */ "./src/app/app-routing.module.ts"); /* harmony import */ var _base_threejs_base_threejs_component__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./base-threejs/base-threejs.component */ "./src/app/base-threejs/base-threejs.component.ts"); /* harmony import */ var _angular_platform_browser__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @angular/platform-browser */ "./node_modules/@angular/platform-browser/__ivy_ngcc__/fesm2015/platform-browser.js"); /* harmony import */ var _angular_flex_layout__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @angular/flex-layout */ "./node_modules/@angular/flex-layout/__ivy_ngcc__/esm2015/flex-layout.js"); /* harmony import */ var _angular_common_http__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @angular/common/http */ "./node_modules/@angular/common/__ivy_ngcc__/fesm2015/http.js"); /* harmony import */ var _modal__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./_modal */ "./src/app/_modal/index.ts"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var _threejs_bg_threejs_bg_component__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./threejs-bg/threejs-bg.component */ "./src/app/threejs-bg/threejs-bg.component.ts"); let AppModule = class AppModule { }; AppModule = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_8__["NgModule"])({ declarations: [ _app_component__WEBPACK_IMPORTED_MODULE_1__["AppComponent"], _threejs_bg_threejs_bg_component__WEBPACK_IMPORTED_MODULE_9__["ThreejsBgComponent"], _base_threejs_base_threejs_component__WEBPACK_IMPORTED_MODULE_3__["BaseThreejsComponent"], ], imports: [ _angular_platform_browser__WEBPACK_IMPORTED_MODULE_4__["BrowserModule"], _app_routing_module__WEBPACK_IMPORTED_MODULE_2__["AppRoutingModule"], _angular_common_http__WEBPACK_IMPORTED_MODULE_6__["HttpClientModule"], _angular_flex_layout__WEBPACK_IMPORTED_MODULE_5__["FlexLayoutModule"], _modal__WEBPACK_IMPORTED_MODULE_7__["ModalModule"] ], providers: [], bootstrap: [_app_component__WEBPACK_IMPORTED_MODULE_1__["AppComponent"]], }) ], AppModule); /***/ }), /***/ "./src/app/base-threejs/base-threejs.component.ts": /*!********************************************************!*\ !*** ./src/app/base-threejs/base-threejs.component.ts ***! \********************************************************/ /*! exports provided: BaseThreejsComponent */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BaseThreejsComponent", function() { return BaseThreejsComponent; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var three__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! three */ "./node_modules/three/build/three.module.js"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var three_examples_jsm_postprocessing_EffectComposer_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! three/examples/jsm/postprocessing/EffectComposer.js */ "./node_modules/three/examples/jsm/postprocessing/EffectComposer.js"); /* harmony import */ var _angular_common_http__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @angular/common/http */ "./node_modules/@angular/common/__ivy_ngcc__/fesm2015/http.js"); /* harmony import */ var three_examples_jsm_postprocessing_RenderPass_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! three/examples/jsm/postprocessing/RenderPass.js */ "./node_modules/three/examples/jsm/postprocessing/RenderPass.js"); /* harmony import */ var three_examples_jsm_postprocessing_UnrealBloomPass_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! three/examples/jsm/postprocessing/UnrealBloomPass.js */ "./node_modules/three/examples/jsm/postprocessing/UnrealBloomPass.js"); let BaseThreejsComponent = /** * Starting class to build THREE JS canvas. * Sets up scene, camera, renderer and starts animation loop. * Adjusts canvas dimensions based on resized window. */ class BaseThreejsComponent { constructor(el, httpClient) { this.el = el; this.httpClient = httpClient; this.containerWidth = 0; this.containerHeight = 0; this._canvasSelector = ''; this.scene = new three__WEBPACK_IMPORTED_MODULE_1__["Scene"](); this.camera = new three__WEBPACK_IMPORTED_MODULE_1__["PerspectiveCamera"](75, 1, 0.1, 100); this.renderer = new three__WEBPACK_IMPORTED_MODULE_1__["WebGLRenderer"](); this.composer = new three_examples_jsm_postprocessing_EffectComposer_js__WEBPACK_IMPORTED_MODULE_3__["EffectComposer"](this.renderer); } ngOnInit() { this.renderer = new three__WEBPACK_IMPORTED_MODULE_1__["WebGLRenderer"]({ canvas: this.el.nativeElement.querySelector(this._canvasSelector), antialias: true }); this.changeSize(); this.composer = new three_examples_jsm_postprocessing_EffectComposer_js__WEBPACK_IMPORTED_MODULE_3__["EffectComposer"](this.renderer); this.composer.addPass(new three_examples_jsm_postprocessing_RenderPass_js__WEBPACK_IMPORTED_MODULE_5__["RenderPass"](this.scene, this.camera)); var bloomPass = new three_examples_jsm_postprocessing_UnrealBloomPass_js__WEBPACK_IMPORTED_MODULE_6__["UnrealBloomPass"](new three__WEBPACK_IMPORTED_MODULE_1__["Vector2"](this.containerWidth, this.containerHeight), 0.5, 0.1, 0.55); this.composer.addPass(bloomPass); this.animate(); } onResize() { this.changeSize(); } /** * Resize camera and render target based on new element dimensions. */ changeSize() { this.containerWidth = this.el.nativeElement.offsetWidth; this.containerHeight = this.el.nativeElement.offsetHeight; let aspect = this.containerWidth / this.containerHeight; this.camera.aspect = aspect; this.camera.position.z = 16 / Math.sqrt(aspect); this.camera.updateProjectionMatrix(); this.renderer.setPixelRatio(window.devicePixelRatio); this.renderer.setSize(this.containerWidth, this.containerHeight); } /** * Start render loop */ animate() { requestAnimationFrame(() => this.animate()); this.update(); this.composer.render(); } /** * Update calculations */ update() { } /** * Set canvas selector so that Renderer can send its animation to it. * @param cssSelector selector for canvas inside the element. */ setCanvasSelectorInsideElement(cssSelector) { this._canvasSelector = cssSelector; } }; BaseThreejsComponent.ctorParameters = () => [ { type: _angular_core__WEBPACK_IMPORTED_MODULE_2__["ElementRef"] }, { type: _angular_common_http__WEBPACK_IMPORTED_MODULE_4__["HttpClient"] } ]; Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_2__["HostListener"])('window:resize', ['$event']) ], BaseThreejsComponent.prototype, "onResize", null); BaseThreejsComponent = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_2__["Component"])({ selector: 'app-base-threejs', template: `` }) /** * Starting class to build THREE JS canvas. * Sets up scene, camera, renderer and starts animation loop. * Adjusts canvas dimensions based on resized window. */ ], BaseThreejsComponent); /***/ }), /***/ "./src/app/threejs-bg/particle.ts": /*!****************************************!*\ !*** ./src/app/threejs-bg/particle.ts ***! \****************************************/ /*! exports provided: Particle */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Particle", function() { return Particle; }); class Particle { constructor(x, y, z) { this.x = x; this.y = y; this.z = z; this.baseX = x; this.baseY = y; this.baseZ = z; this.density = (Math.random() * 15) + 10; } } /***/ }), /***/ "./src/app/threejs-bg/threejs-bg.component.css": /*!*****************************************************!*\ !*** ./src/app/threejs-bg/threejs-bg.component.css ***! \*****************************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony default export */ __webpack_exports__["default"] = ("\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsImZpbGUiOiJzcmMvYXBwL3RocmVlanMtYmcvdGhyZWVqcy1iZy5jb21wb25lbnQuY3NzIn0= */"); /***/ }), /***/ "./src/app/threejs-bg/threejs-bg.component.ts": /*!****************************************************!*\ !*** ./src/app/threejs-bg/threejs-bg.component.ts ***! \****************************************************/ /*! exports provided: ThreejsBgComponent */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ThreejsBgComponent", function() { return ThreejsBgComponent; }); /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.js"); /* harmony import */ var three__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! three */ "./node_modules/three/build/three.module.js"); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var _base_threejs_base_threejs_component__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../base-threejs/base-threejs.component */ "./src/app/base-threejs/base-threejs.component.ts"); /* harmony import */ var _angular_common_http__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @angular/common/http */ "./node_modules/@angular/common/__ivy_ngcc__/fesm2015/http.js"); /* harmony import */ var _modal__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../_modal */ "./src/app/_modal/index.ts"); /* harmony import */ var src_app_threejs_bg_particle__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! src/app/threejs-bg/particle */ "./src/app/threejs-bg/particle.ts"); /* harmony import */ var three_examples_jsm_libs_stats_module_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! three/examples/jsm/libs/stats.module.js */ "./node_modules/three/examples/jsm/libs/stats.module.js"); /* harmony import */ var _environments_environment__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../environments/environment */ "./src/environments/environment.ts"); let ThreejsBgComponent = class ThreejsBgComponent extends _base_threejs_base_threejs_component__WEBPACK_IMPORTED_MODULE_3__["BaseThreejsComponent"] { constructor(el, httpClient, modalService) { super(el, httpClient); this.el = el; this.httpClient = httpClient; this.modalService = modalService; this.particleCount = 22000; this.dummy = new three__WEBPACK_IMPORTED_MODULE_1__["Object3D"](); this.plane = new three__WEBPACK_IMPORTED_MODULE_1__["PlaneGeometry"](0.07, 0.07); this.material = new three__WEBPACK_IMPORTED_MODULE_1__["MeshBasicMaterial"]({ // color: 0x00ff00, color: "#00dfff", wireframe: false, }); this.instancedM = new three__WEBPACK_IMPORTED_MODULE_1__["InstancedMesh"](this.plane, this.material, this.particleCount); this.particleArray = []; this.cloudParticles = []; this.mouse = { x: 0, y: 0, radius: 150 }; this.setCanvasSelectorInsideElement("#bg-canvas"); this.stats = Object(three_examples_jsm_libs_stats_module_js__WEBPACK_IMPORTED_MODULE_7__["default"])(); this.instancedM.instanceMatrix.setUsage(three__WEBPACK_IMPORTED_MODULE_1__["DynamicDrawUsage"]); } onMouseMove(e) { this.mouse.x = e.x; this.mouse.y = e.y; } update() { // Update stats if not production if (!_environments_environment__WEBPACK_IMPORTED_MODULE_8__["environment"].production) { this.stats.update(); } if (!this.modalService.isModalOpen()) { this.updateParticlesWithMouse(); } else { this.updateParticlesNoMouse(); } this.cloudParticles.forEach(p => { p.rotation.z -= 0.001; }); } ngOnInit() { super.ngOnInit(); this.scene.fog = new three__WEBPACK_IMPORTED_MODULE_1__["FogExp2"]("#040e17", 0.01); this.renderer.setClearColor(this.scene.fog.color); let ambient = new three__WEBPACK_IMPORTED_MODULE_1__["AmbientLight"](0x555555); this.scene.add(ambient); let blueLight = new three__WEBPACK_IMPORTED_MODULE_1__["PointLight"](0x3677ac, 150, 450, 1.7); blueLight.position.set(300, 300, 200); this.scene.add(blueLight); this.httpClient.get("assets/bg-particle-positions.json", { responseType: 'json' }).toPromise().then(data => { let particlePositions = data; let count = 0; for (let i = 0; i < this.particleCount; i++) { let x = (Math.random()) * 0.05 + particlePositions.data[count++]; let y = (Math.random()) * 0.05 + particlePositions.data[count++]; let z = (Math.random()) * 0.05 + particlePositions.data[count++]; this.particleArray.push(new src_app_threejs_bg_particle__WEBPACK_IMPORTED_MODULE_6__["Particle"](x, y + 1, z)); if (count > particlePositions.data.length) count = 0; } for (let i = 0; i < this.particleCount; i++) { this.dummy.position.set(this.particleArray[i].x, this.particleArray[i].y, this.particleArray[i].z); this.dummy.updateMatrix(); this.instancedM.setMatrixAt(i, this.dummy.matrix); // this.instancedM.setColorAt(i, new THREE.Color("27ade6")) } this.scene.add(this.instancedM); }); let cloudGeo = new three__WEBPACK_IMPORTED_MODULE_1__["PlaneBufferGeometry"](200, 200); let loader = new three__WEBPACK_IMPORTED_MODULE_1__["TextureLoader"](); loader.load("assets/smoke.png", texture => { let cloudMaterial = new three__WEBPACK_IMPORTED_MODULE_1__["MeshLambertMaterial"]({ map: texture, transparent: true }); for (let p = 0; p < 50; p++) { let cloud = new three__WEBPACK_IMPORTED_MODULE_1__["Mesh"](cloudGeo, cloudMaterial); cloud.position.set(Math.random() * 80 - 50, 3, Math.random() * 60 - 143); // cloud.rotation.x = 1.16 // cloud.rotation.y = -0.12 cloud.rotation.z = Math.random() * 2 * Math.PI; cloud.material.opacity = 0.55; cloud.frustumCulled = false; this.cloudParticles.push(cloud); this.scene.add(cloud); } }); // Add stats if not production if (!_environments_environment__WEBPACK_IMPORTED_MODULE_8__["environment"].production) { document.body.appendChild(this.stats.dom); } } updateParticlesWithMouse() { var vector = new three__WEBPACK_IMPORTED_MODULE_1__["Vector3"](); var widthHalf = 0.5 * this.containerWidth; var heightHalf = 0.5 * this.containerHeight; for (let i = 0; i < this.particleCount; i++) { if (this.particleArray[i] !== undefined) { this.dummy.position.set(this.particleArray[i].x, this.particleArray[i].y, 0); this.dummy.updateMatrixWorld(); vector.setFromMatrixPosition(this.dummy.matrixWorld); vector.project(this.camera); vector.x = (vector.x * widthHalf) + widthHalf; vector.y = -(vector.y * heightHalf) + heightHalf; let dx = this.mouse.x - vector.x; let dy = this.mouse.y - vector.y; let distance = Math.sqrt(dx * dx + dy * dy); let forceDircetionX = dx / distance; let forceDirectionY = dy / distance; let maxDistance = this.mouse.radius; let force = (maxDistance - distance) / maxDistance; let directionX = forceDircetionX * force * this.particleArray[i].density; let directionY = forceDirectionY * force * this.particleArray[i].density; if (distance < this.mouse.radius) { // this.instancedM.setColorAt(i, new THREE.Color("#27ade6").lerp(new THREE.Color("#27e65a"), maxDistance/distance)) this.particleArray[i].x -= directionX * 0.01; this.particleArray[i].y += directionY * 0.01; this.dummy.position.set(this.particleArray[i].x, this.particleArray[i].y, 0); } else { // this.instancedM.setColorAt(i, new THREE.Color("#27ade6")) if (this.particleArray[i].x !== this.particleArray[i].baseX) { let _dx = this.particleArray[i].x - this.particleArray[i].baseX; this.particleArray[i].x -= _dx / 20; } if (this.particleArray[i].y !== this.particleArray[i].baseY) { let _dy = this.particleArray[i].y - this.particleArray[i].baseY; this.particleArray[i].y -= _dy / 20; } } this.dummy.updateMatrix(); this.instancedM.setMatrixAt(i, this.dummy.matrix); } } if (this.instancedM.instanceColor != null) this.instancedM.instanceColor.needsUpdate = true; if (this.instancedM.instanceMatrix != null) this.instancedM.instanceMatrix.needsUpdate = true; } updateParticlesNoMouse() { var vector = new three__WEBPACK_IMPORTED_MODULE_1__["Vector3"](); var widthHalf = 0.5 * this.containerWidth; var heightHalf = 0.5 * this.containerHeight; for (let i = 0; i < this.particleCount; i++) { if (this.particleArray[i] !== undefined) { this.dummy.position.set(this.particleArray[i].x, this.particleArray[i].y, 0); this.dummy.updateMatrixWorld(); vector.setFromMatrixPosition(this.dummy.matrixWorld); vector.project(this.camera); vector.x = (vector.x * widthHalf) + widthHalf; vector.y = -(vector.y * heightHalf) + heightHalf; let dx = widthHalf - vector.x; let dy = heightHalf - vector.y; let distance = Math.sqrt(dx * dx + dy * dy); let forceDircetionX = dx / distance; let forceDirectionY = dy / distance; let forceX = 0; let forceY = 0; let maxDistance = widthHalf > heightHalf ? widthHalf : heightHalf; if (distance < maxDistance) { forceX = 200 / (widthHalf - distance); forceY = 200 / (heightHalf - distance); } else if (distance < maxDistance * 2) { forceX = 1; forceY = 1; } else { forceX = 0; forceY = 0; } let directionX = forceDircetionX * forceX * this.particleArray[i].density; let directionY = forceDirectionY * forceY * this.particleArray[i].density; this.particleArray[i].x -= directionX * 0.05; this.particleArray[i].y += directionY * 0.05; this.dummy.position.set(this.particleArray[i].x, this.particleArray[i].y, 0); this.dummy.updateMatrix(); this.instancedM.setMatrixAt(i, this.dummy.matrix); } } if (this.instancedM.instanceColor != null) this.instancedM.instanceColor.needsUpdate = true; if (this.instancedM.instanceMatrix != null) this.instancedM.instanceMatrix.needsUpdate = true; } }; ThreejsBgComponent.ctorParameters = () => [ { type: _angular_core__WEBPACK_IMPORTED_MODULE_2__["ElementRef"] }, { type: _angular_common_http__WEBPACK_IMPORTED_MODULE_4__["HttpClient"] }, { type: _modal__WEBPACK_IMPORTED_MODULE_5__["ModalService"] } ]; Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_2__["HostListener"])('document:mousemove', ['$event']) ], ThreejsBgComponent.prototype, "onMouseMove", null); ThreejsBgComponent = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([ Object(_angular_core__WEBPACK_IMPORTED_MODULE_2__["Component"])({ selector: 'app-threejs-bg', template: Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! raw-loader!./threejs-bg.component.html */ "./node_modules/raw-loader/dist/cjs.js!./src/app/threejs-bg/threejs-bg.component.html")).default, styles: [Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__importDefault"])(__webpack_require__(/*! ./threejs-bg.component.css */ "./src/app/threejs-bg/threejs-bg.component.css")).default] }) ], ThreejsBgComponent); /***/ }), /***/ "./src/environments/environment.ts": /*!*****************************************!*\ !*** ./src/environments/environment.ts ***! \*****************************************/ /*! exports provided: environment */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "environment", function() { return environment; }); const environment = { production: true }; /***/ }), /***/ "./src/main.ts": /*!*********************!*\ !*** ./src/main.ts ***! \*********************/ /*! no exports provided */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @angular/core */ "./node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js"); /* harmony import */ var _angular_platform_browser_dynamic__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @angular/platform-browser-dynamic */ "./node_modules/@angular/platform-browser-dynamic/__ivy_ngcc__/fesm2015/platform-browser-dynamic.js"); /* harmony import */ var _app_app_module__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./app/app.module */ "./src/app/app.module.ts"); /* harmony import */ var _environments_environment__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./environments/environment */ "./src/environments/environment.ts"); if (_environments_environment__WEBPACK_IMPORTED_MODULE_3__["environment"].production) { Object(_angular_core__WEBPACK_IMPORTED_MODULE_0__["enableProdMode"])(); } Object(_angular_platform_browser_dynamic__WEBPACK_IMPORTED_MODULE_1__["platformBrowserDynamic"])().bootstrapModule(_app_app_module__WEBPACK_IMPORTED_MODULE_2__["AppModule"]) .catch(err => console.error(err)); /***/ }), /***/ 0: /*!***************************!*\ !*** multi ./src/main.ts ***! \***************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { module.exports = __webpack_require__(/*! D:\Dev\Angular\my-homepage\src\main.ts */"./src/main.ts"); /***/ }) },[[0,"runtime","vendor"]]]); //# sourceMappingURL=main.384a822574de5a7bec2e.js.map