[{"__symbolic":"module","version":4,"metadata":{"GallerySysComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../../../../../../shared/configure-component-base","name":"ConfigureComponentBase","line":15,"character":41},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"gallery-sys","styles":[".gallery-wrap { ul { list-style: none; padding: 0; margin: 0; } li { cursor: pointer; } a:focus, a:hover { color: #2889d0; border: none; } a:active, a:hover { outline: 0; } .listLink { display: block; text-decoration: none; color: #303030; padding: 8px 12px 8px 10px; text-overflow: ellipsis; } .listLink:hover { text-decoration: none; background: #EEEEEE; } .listLinkSelected { display: block; text-decoration: none; padding: 8px 12px 8px 10px; background: #EEEEEE; border: 1px solid #EEEEEE; } a { color: #EEEEEE; text-decoration: none; } .graphSettingBox { height: 255px; border: 1px solid #ddd; overflow-x: auto; display: block; .font12Size { font-size: 12px; } .selectedType { background: #EEEEEE; } } .graphType { width: 140px; float: left; height: 400px; margin-right: 10px; } .graphBoxes { width: 78%; } .stateBox { height: 140px; margin-top: 5px; border: none; } .colorPick { width: 50px; } .span-inline-block { display: inline-block; width: 100%; } .backgroundBorder { padding: 5px; border: 1px solid #ddd; } .graphBtns button { height: 26px; line-height: 22px; margin-right: 10px; } }"],"template":"<div id='system-gallery' class='gallery-wrap clearfix' style=\"border: 0;\"> <div class=\"form-group border-group\"> <div class=\"graphSettingBox graphType\"> <ul *ngFor=\"let category of graphCategories\"> <li [class.selectedType]=\"category.id==selectedCategory.id\"> <a class=\"listLink\" tooltip=\"{{category.name}}\" (click)=\"changeCategory(category)\">{{category.name}}</a> </li> </ul> </div> <div style=\"display: flow-root;\"> <div class=\"graphSettingBox graphBox\"> <graph-list [graphList]=\"graphList\" (graphSelected)=\"changeGraph($event)\" [selectedGraphId]=\"selectedGraph?.id\"></graph-list> </div> <div class=\"graphSettingBox stateBox\"> <div>{{lc(\"State\")}}:</div> <graph-state-list [stateList]=\"currentGraphStateList\" [selectedStateId]=\"currentGraphStateId\"></graph-state-list> </div> </div> </div> </div> "}]}],"members":{"selectedGraphChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":28,"character":26},{"__symbolic":"reference","module":"../../../../../../shared/service-proxies/service-proxies","name":"SystemGalleryServiceProxy","line":29,"character":44}]}],"loadGraphCategoies":[{"__symbolic":"method"}],"changeCategory":[{"__symbolic":"method"}],"changeGraph":[{"__symbolic":"method"}]}}}}]