uv-charts-dashboard
Version:
A dashboard for uvCharts examples
405 lines (355 loc) • 18.9 kB
JavaScript
webpackJsonp([3],{
/***/ 146:
/***/ function(module, exports, __webpack_require__) {
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = __webpack_require__(2);
var router_1 = __webpack_require__(53);
var common_service_1 = __webpack_require__(15);
var entry_components_1 = __webpack_require__(191);
var ChartDetailsWrapper = (function () {
function ChartDetailsWrapper(router, route, commonService) {
this.router = router;
this.route = route;
this.commonService = commonService;
this.componentData = null;
this.entryComponents = new entry_components_1.EntryComponents();
}
ChartDetailsWrapper.prototype.ngOnInit = function () {
var _this = this;
this.route.params.subscribe(function (params) {
if (params['chartType']) {
_this.createChartComponent(params['chartType']);
_this.chartType = _this.commonService.getChartTypeName(params['chartType']);
}
});
};
ChartDetailsWrapper.prototype.createChartComponent = function (chartType) {
var component = this.entryComponents.getComponentForChartType(chartType);
this.componentData = {
component: component
};
};
ChartDetailsWrapper = __decorate([
core_1.Component({
selector: 'chart-details-wrapper',
styles: [__webpack_require__(373)],
template: "<div class=\"wrapper\">\n <h2>{{chartType}}</h2>\n <div>\n <chart-details [componentData]=\"componentData\"></chart-details>\n <chart-description></chart-description>\n </div>\n <chart-code></chart-code>\n </div>\n "
}),
__metadata('design:paramtypes', [(typeof (_a = typeof router_1.Router !== 'undefined' && router_1.Router) === 'function' && _a) || Object, (typeof (_b = typeof router_1.ActivatedRoute !== 'undefined' && router_1.ActivatedRoute) === 'function' && _b) || Object, (typeof (_c = typeof common_service_1.CommonService !== 'undefined' && common_service_1.CommonService) === 'function' && _c) || Object])
], ChartDetailsWrapper);
return ChartDetailsWrapper;
var _a, _b, _c;
}());
exports.ChartDetailsWrapper = ChartDetailsWrapper;
/***/ },
/***/ 188:
/***/ function(module, exports, __webpack_require__) {
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = __webpack_require__(2);
var router_1 = __webpack_require__(53);
var http_1 = __webpack_require__(57);
var ChartCodeComponent = (function () {
function ChartCodeComponent(router, route, http) {
this.router = router;
this.route = route;
this.http = http;
}
ChartCodeComponent.prototype.ngOnInit = function () {
var _this = this;
this.route.params.subscribe(function (params) {
_this.populateDescription(params['chartType']);
});
this.activeTab = 'ts';
};
ChartCodeComponent.prototype.populateDescription = function (chartType) {
var _this = this;
if (chartType) {
this.populateFileData(chartType, 'ts').subscribe(function (code) {
_this.typescriptCode = code;
setTimeout(function name() {
var w = window;
w.SyntaxHighlighter.highlight();
}, 100);
});
this.populateFileData(chartType, 'css').subscribe(function (code) { return _this.cssCode = code; });
}
};
ChartCodeComponent.prototype.populateFileData = function (chartType, suffix) {
var filePath = 'app/components/' + chartType + '/' + chartType + '.' + suffix;
return this.http.get(filePath).map(this.extractData);
};
ChartCodeComponent.prototype.extractData = function (res) {
return res._body;
};
ChartCodeComponent.prototype.checkVisibility = function () {
var code;
switch (this.activeTab) {
case 'ts':
code = this.typescriptCode;
break;
case 'css':
code = this.cssCode;
break;
case 'html':
code = this.htmlCode;
break;
default:
code = '';
}
return (!code || code.trim() === '');
};
ChartCodeComponent.prototype.showTab = function (tab) {
this.activeTab = tab;
};
ChartCodeComponent.prototype.isCurrentTab = function (tab) {
return this.activeTab === tab;
};
ChartCodeComponent.prototype.copyToClipboard = function (event) {
var target = event.target || event.srcElement || event.currentTarget;
var textarea = document.getElementById('code-content');
var code = '';
switch (this.activeTab) {
case 'ts':
code = this.typescriptCode;
break;
case 'css':
code = this.cssCode;
break;
case 'html':
code = this.htmlCode;
}
target.innerHTML = 'COPIED!';
textarea.innerHTML = code;
textarea.select();
try {
document.execCommand('copy');
}
catch (e) {
console.error(e);
}
};
ChartCodeComponent.prototype.blurAction = function (event) {
var target = event.target || event.srcElement || event.currentTarget;
target.innerHTML = 'COPY CODE';
};
ChartCodeComponent = __decorate([
core_1.Component({
selector: 'chart-code',
template: __webpack_require__(367),
styles: [__webpack_require__(372)]
}),
__metadata('design:paramtypes', [(typeof (_a = typeof router_1.Router !== 'undefined' && router_1.Router) === 'function' && _a) || Object, (typeof (_b = typeof router_1.ActivatedRoute !== 'undefined' && router_1.ActivatedRoute) === 'function' && _b) || Object, (typeof (_c = typeof http_1.Http !== 'undefined' && http_1.Http) === 'function' && _c) || Object])
], ChartCodeComponent);
return ChartCodeComponent;
var _a, _b, _c;
}());
exports.ChartCodeComponent = ChartCodeComponent;
/***/ },
/***/ 189:
/***/ function(module, exports, __webpack_require__) {
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = __webpack_require__(2);
var router_1 = __webpack_require__(53);
var common_service_1 = __webpack_require__(15);
var ChartDescriptionComponent = (function () {
function ChartDescriptionComponent(route, commonService) {
this.route = route;
this.commonService = commonService;
}
ChartDescriptionComponent.prototype.ngOnInit = function () {
var _this = this;
this.route.params.subscribe(function (params) {
_this.description = _this.commonService.getChartDescription(params['chartType']);
});
};
ChartDescriptionComponent = __decorate([
core_1.Component({
selector: 'chart-description',
template: "<h3>About the graph</h3> \n <div>{{description}}</div>\n "
}),
__metadata('design:paramtypes', [(typeof (_a = typeof router_1.ActivatedRoute !== 'undefined' && router_1.ActivatedRoute) === 'function' && _a) || Object, (typeof (_b = typeof common_service_1.CommonService !== 'undefined' && common_service_1.CommonService) === 'function' && _b) || Object])
], ChartDescriptionComponent);
return ChartDescriptionComponent;
var _a, _b;
}());
exports.ChartDescriptionComponent = ChartDescriptionComponent;
/***/ },
/***/ 190:
/***/ function(module, exports, __webpack_require__) {
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = __webpack_require__(2);
var entry_components_1 = __webpack_require__(191);
var ChartDetailsComponent = (function () {
function ChartDetailsComponent(resolver) {
this.resolver = resolver;
this.currentComponent = null;
}
Object.defineProperty(ChartDetailsComponent.prototype, "componentData", {
// component: Class for the component you want to create
// inputs: An object with key/value pairs mapped to input name/input value
set: function (data) {
if (!data) {
return;
}
// We create an injector out of the data we want to pass down and this components injector
var injector = core_1.ReflectiveInjector.fromResolvedProviders([], this.dynamicComponentContainer.parentInjector);
// We create a factory out of the component we want to create
var factory = this.resolver.resolveComponentFactory(data.component);
// We create the component using the factory and the injector
var component = factory.create(injector);
// We insert the component into the dom container
this.dynamicComponentContainer.insert(component.hostView);
// We can destroy the old component is we like by calling destroy
if (this.currentComponent) {
this.currentComponent.destroy();
}
this.currentComponent = component;
},
enumerable: true,
configurable: true
});
__decorate([
core_1.ViewChild('dynamicComponentContainer', { read: core_1.ViewContainerRef }),
__metadata('design:type', (typeof (_a = typeof core_1.ViewContainerRef !== 'undefined' && core_1.ViewContainerRef) === 'function' && _a) || Object)
], ChartDetailsComponent.prototype, "dynamicComponentContainer", void 0);
__decorate([
core_1.Input(),
__metadata('design:type', Object),
__metadata('design:paramtypes', [Object])
], ChartDetailsComponent.prototype, "componentData", null);
ChartDetailsComponent = __decorate([
core_1.Component({
selector: 'chart-details',
entryComponents: entry_components_1.entryList.slice(),
template: "<div #dynamicComponentContainer></div>"
}),
__metadata('design:paramtypes', [(typeof (_b = typeof core_1.ComponentFactoryResolver !== 'undefined' && core_1.ComponentFactoryResolver) === 'function' && _b) || Object])
], ChartDetailsComponent);
return ChartDetailsComponent;
var _a, _b;
}());
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = ChartDetailsComponent;
/***/ },
/***/ 354:
/***/ function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(23)();
// imports
// module
exports.push([module.id, ".nav-pills li {\n cursor: pointer;\n}\n\n.tab-content {\n position: relative;\n}\n\n.tab-content pre {\n background: #FFFFFF;\n}\n\n.copy-to-clipboard {\n position: absolute;\n right: 20px;\n z-index: 2;\n top: 20px;\n width: 110px;\n}\n\n.code-content {\n overflow: hidden;\n height: 0;\n border: 1px solid #f8f8f8;\n}\n\n.button {\n background: white;\n border: 1px solid #AAAAAA;\n border-radius: 2px;\n padding: 6px 10px;\n}\n\n.button:hover {\n background: #AAAAAA;\n}", ""]);
// exports
/***/ },
/***/ 355:
/***/ function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(23)();
// imports
// module
exports.push([module.id, "chart-details, chart-description {\n display: inline-block;\n vertical-align: top;\n line-height: 2.2;\n width: 50%;\n}\n\nchart-description {\n width: 40%;\n padding-left: 20px;\n}\n.wrapper {\n background: #f8f8f8;\n padding: 20px;\n}\n", ""]);
// exports
/***/ },
/***/ 367:
/***/ function(module, exports) {
module.exports = "<div>\n <h3>Code</h3>\n <ul class=\"nav nav-pills\">\n <li (click)=\"showTab('ts')\" [ngClass]=\"{'active': isCurrentTab('ts')}\"><a data-toggle=\"pill\">Typescript</a></li>\n <li (click)=\"showTab('css')\" [ngClass]=\"{'active': isCurrentTab('css')}\"><a data-toggle=\"pill\">CSS</a></li>\n <!--<li (click)=\"showTab('html')\" [ngClass]=\"{'active': isCurrentTab('html')}\"><a data-toggle=\"pill\">HTML</a></li>-->\n </ul>\n <br>\n <div class=\"tab-content\">\n <button class=\"button copy-to-clipboard\" (mousedown)=\"copyToClipboard($event)\" (blur)=\"blurAction($event)\" [hidden]=\"checkVisibility()\">COPY CODE</button>\n <div class='code-wrapper' [hidden]=\"!isCurrentTab('ts')\">\n <pre id=\"ts\" class=\"brush: js\">{{typescriptCode}}</pre>\n </div>\n <div class='code-wrapper' [hidden]=\"!isCurrentTab('css')\">\n <pre id=\"css\">{{cssCode}}</pre>\n </div>\n <div class='code-wrapper' [hidden]=\"!isCurrentTab('html')\">\n <pre id=\"html\">{{htmlCode}}</pre>\n </div>\n <div [hidden]=\"!isCurrentTab('customize')\">\n\n </div>\n </div>\n\n <textarea id=\"code-content\" class=\"code-content\"></textarea>\n</div>\n"
/***/ },
/***/ 372:
/***/ function(module, exports, __webpack_require__) {
var result = __webpack_require__(354);
if (typeof result === "string") {
module.exports = result;
} else {
module.exports = result.toString();
}
/***/ },
/***/ 373:
/***/ function(module, exports, __webpack_require__) {
var result = __webpack_require__(355);
if (typeof result === "string") {
module.exports = result;
} else {
module.exports = result.toString();
}
/***/ },
/***/ 385:
/***/ function(module, exports, __webpack_require__) {
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = __webpack_require__(2);
var router_1 = __webpack_require__(53);
var chart_details_wrapper_1 = __webpack_require__(146);
var chart_code_1 = __webpack_require__(188);
var chart_description_1 = __webpack_require__(189);
var chart_details_1 = __webpack_require__(190);
var entry_components_1 = __webpack_require__(191);
var routes = [
{ path: ':chartType', component: chart_details_wrapper_1.ChartDetailsWrapper }
];
var ChartDetailsModule = (function () {
function ChartDetailsModule() {
}
ChartDetailsModule = __decorate([
core_1.NgModule({
imports: [
router_1.RouterModule.forChild(routes)
],
exports: [],
declarations: entry_components_1.entryList.concat([
chart_details_wrapper_1.ChartDetailsWrapper,
chart_details_1.default,
chart_code_1.ChartCodeComponent,
chart_description_1.ChartDescriptionComponent
]),
providers: [],
}),
__metadata('design:paramtypes', [])
], ChartDetailsModule);
return ChartDetailsModule;
}());
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = ChartDetailsModule;
/***/ }
});
//# sourceMappingURL=3.map