[{"__symbolic":"module","version":3,"metadata":{"Slider":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"slider","template":"<!--\n     @Author: Alex Sorafumo <Yuion>\n     @Date:   13/09/2016 2:55 PM\n     @Email:  alex@yuion.net\n     @Filename: slider.template.html\n     @Last modified by:   alex.sorafumo\n     @Last modified time: 24/01/2017 9:55 AM\n     -->\n     \n     <div [class]=\"'aca slider ' + cssClass\" (window:resize)=\"resize()\">\n         <div #space class=\"block\" [class.vertical]=\"align==='vertical'\">\n             <!-- Vertical Slider -->\n             <div #bar class=\"bar c1\" (tap)=\"clickSlider($event)\" (press)=\"clickSlider($event)\" (pan)=\"moveSlider($event)\">\n                 <div #prog class=\"progress c2\"\n                     [style.width]=\"align==='vertical' ? '100%' :percent + '%'\"\n                     [style.height]=\"align==='vertical' ? (percent) + '%':'100%' \">\n                 </div>\n                 <div class=\"knob-container\"\n                     [style.left]=\"align==='vertical' ? '50%' :percent + '%'\"\n                     [style.top]=\"align==='vertical' ? (100 - percent) + '%':'50%'\">\n                     <div #knob class=\"knob c3\" (tap)=\"clickSlider($event)\" (press)=\"clickSlider($event)\" (pan)=\"moveSlider($event)\"></div>\n                 <div>\n             </div>\n         </div>\n     </div>\n     ","styles":[".slider{box-sizing:border-box;height:100%;width:100%}.slider *{box-sizing:border-box;cursor:pointer}.block{cursor:default;padding:1em 1.5em;-ms-touch-action:pan-y;touch-action:pan-y;width:100%}.bar{background-color:rgba(0,0,0,0.54);border-radius:.5em;cursor:pointer;height:1em;min-width:1em;position:relative;-ms-touch-action:pan-y;touch-action:pan-y;width:100%}.knob-container{height:0;position:absolute;top:50%;width:0}.knob-container .knob{background-color:#fff;border-radius:100%;box-shadow:0 0.1em 0.2em 0.1em rgba(0,0,0,0.2);height:2em;left:0;position:absolute;top:0;-ms-touch-action:pan-y;touch-action:pan-y;-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:2em}.progress{background-color:#2196f3;border-radius:.5em;height:100%;left:0;position:absolute;top:0;-ms-touch-action:pan-y;touch-action:pan-y}.vertical{height:100%;padding:1.5em 1em;-ms-touch-action:pan-x;touch-action:pan-x;width:auto}.vertical .bar{height:100%;min-height:1em;-ms-touch-action:pan-x;touch-action:pan-x;width:1em}.vertical .knob-container{left:50%;top:auto}.vertical .knob-container .knob{-ms-touch-action:pan-x;touch-action:pan-x}.vertical .progress{bottom:0;top:auto;-ms-touch-action:pan-x;touch-action:pan-x;width:100%}\n     "]}]}],"members":{"align":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"step":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"precision":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"space":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["space"]}]}],"bar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["bar"]}]}],"knob":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["knob"]}]}],"prog":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["prog"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../../services/animate.service","name":"Animate"}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"validate":[{"__symbolic":"method"}],"updateValue":[{"__symbolic":"method"}],"clickSlider":[{"__symbolic":"method"}],"moveSlider":[{"__symbolic":"method"}],"sliderStop":[{"__symbolic":"method"}],"resize":[{"__symbolic":"method"}],"checkStatus":[{"__symbolic":"method"}],"postValue":[{"__symbolic":"method"}],"calcValue":[{"__symbolic":"method"}],"actionPerformed":[{"__symbolic":"method"}],"getBarOffset":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"Slider":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"slider","template":"<!--\n     @Author: Alex Sorafumo <Yuion>\n     @Date:   13/09/2016 2:55 PM\n     @Email:  alex@yuion.net\n     @Filename: slider.template.html\n     @Last modified by:   alex.sorafumo\n     @Last modified time: 24/01/2017 9:55 AM\n     -->\n     \n     <div [class]=\"'aca slider ' + cssClass\" (window:resize)=\"resize()\">\n         <div #space class=\"block\" [class.vertical]=\"align==='vertical'\">\n             <!-- Vertical Slider -->\n             <div #bar class=\"bar c1\" (tap)=\"clickSlider($event)\" (press)=\"clickSlider($event)\" (pan)=\"moveSlider($event)\">\n                 <div #prog class=\"progress c2\"\n                     [style.width]=\"align==='vertical' ? '100%' :percent + '%'\"\n                     [style.height]=\"align==='vertical' ? (percent) + '%':'100%' \">\n                 </div>\n                 <div class=\"knob-container\"\n                     [style.left]=\"align==='vertical' ? '50%' :percent + '%'\"\n                     [style.top]=\"align==='vertical' ? (100 - percent) + '%':'50%'\">\n                     <div #knob class=\"knob c3\" (tap)=\"clickSlider($event)\" (press)=\"clickSlider($event)\" (pan)=\"moveSlider($event)\"></div>\n                 <div>\n             </div>\n         </div>\n     </div>\n     ","styles":[".slider{box-sizing:border-box;height:100%;width:100%}.slider *{box-sizing:border-box;cursor:pointer}.block{cursor:default;padding:1em 1.5em;-ms-touch-action:pan-y;touch-action:pan-y;width:100%}.bar{background-color:rgba(0,0,0,0.54);border-radius:.5em;cursor:pointer;height:1em;min-width:1em;position:relative;-ms-touch-action:pan-y;touch-action:pan-y;width:100%}.knob-container{height:0;position:absolute;top:50%;width:0}.knob-container .knob{background-color:#fff;border-radius:100%;box-shadow:0 0.1em 0.2em 0.1em rgba(0,0,0,0.2);height:2em;left:0;position:absolute;top:0;-ms-touch-action:pan-y;touch-action:pan-y;-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:2em}.progress{background-color:#2196f3;border-radius:.5em;height:100%;left:0;position:absolute;top:0;-ms-touch-action:pan-y;touch-action:pan-y}.vertical{height:100%;padding:1.5em 1em;-ms-touch-action:pan-x;touch-action:pan-x;width:auto}.vertical .bar{height:100%;min-height:1em;-ms-touch-action:pan-x;touch-action:pan-x;width:1em}.vertical .knob-container{left:50%;top:auto}.vertical .knob-container .knob{-ms-touch-action:pan-x;touch-action:pan-x}.vertical .progress{bottom:0;top:auto;-ms-touch-action:pan-x;touch-action:pan-x;width:100%}\n     "]}]}],"members":{"align":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"step":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"precision":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"space":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["space"]}]}],"bar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["bar"]}]}],"knob":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["knob"]}]}],"prog":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["prog"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../../services/animate.service","name":"Animate"}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"validate":[{"__symbolic":"method"}],"updateValue":[{"__symbolic":"method"}],"clickSlider":[{"__symbolic":"method"}],"moveSlider":[{"__symbolic":"method"}],"sliderStop":[{"__symbolic":"method"}],"resize":[{"__symbolic":"method"}],"checkStatus":[{"__symbolic":"method"}],"postValue":[{"__symbolic":"method"}],"calcValue":[{"__symbolic":"method"}],"actionPerformed":[{"__symbolic":"method"}],"getBarOffset":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}]}}}}]