\r
$scope.init = function(paperInstance){\r
paper = paperInstance;\r
+ $scope.loadMouseScrollEvent();\r
};\r
\r
\r
paperScale = out ? paperScale - 0.1 : paperScale >= 1 ? 1 : paperScale + 0.1;\r
paper.scale(paperScale, paperScale);\r
};\r
+\r
+ \r
+\r
+ $scope.loadMouseScrollEvent = function(){\r
+ /*mouse wheel event for zooming*/\r
+ var graph = document.getElementById('graph'),\r
+ MouseWheelHandler = function(e){\r
+ var mouseEvent = window.event || e; // old IE support\r
+ var delta = Math.max(-1, Math.min(1, (mouseEvent.wheelDelta || -mouseEvent.detail)));\r
+ $scope.zoom(delta === 1 ? false : true);\r
+ };\r
+\r
+ if (graph.addEventListener) {\r
+ // IE9, Chrome, Safari, Opera\r
+ graph.addEventListener("mousewheel", MouseWheelHandler, false);\r
+ // Firefox\r
+ graph.addEventListener("DOMMouseScroll", MouseWheelHandler, false);\r
+ }\r
+ // IE 6/7/8\r
+ else {graph.attachEvent("onmousewheel", MouseWheelHandler);}\r
+ /*mouse wheel event for zooming - end*/\r
+ };\r
\r
}]);\r
\r
display: none;\r
}\r
/*-------------------YangUI import START-------------------*/\r
-.customContainer {\r
+.gbpWrapper .customContainer {\r
border-left: 1px solid #7a7a7a;\r
margin: 35px 5px 5px 15px;\r
padding: 5px;\r
width: auto;\r
position: relative;\r
}\r
-.customContainer.withoutBorder {\r
+.gbpWrapper .customContainer.withoutBorder {\r
border-left: 0;\r
padding-bottom: 0;\r
}\r
-.customContainer.withoutBorder .treeBullet.containerBullet {\r
+.gbpWrapper .customContainer.withoutBorder .treeBullet.containerBullet {\r
left: -25px;\r
top: -25px;\r
}\r
-.topContainerPart {\r
+.gbpWrapper .topContainerPart {\r
margin-left: -19px;\r
margin-top: -28px;\r
margin-bottom: 10px;\r
}\r
-.treeBullet {\r
+.gbpWrapper .treeBullet {\r
font-size: 25px;\r
color: #7a7a7a;\r
position: absolute;\r
left: -15px;\r
top: 0;\r
}\r
-.treeBullet.containerBullet {\r
+.gbpWrapper .treeBullet.containerBullet {\r
top: -25px;\r
left: -25px;\r
}\r
-.btn-name {\r
+.gbpWrapper .btn-name {\r
-webkit-border-radius: 5px;\r
border-radius: 5px;\r
background: transparent;\r
border: 2px solid #393939;\r
cursor: auto;\r
}\r
-button.yangButton,\r
-div.yangButton {\r
+.gbpWrapper button.yangButton,\r
+.gbpWrapper div.yangButton {\r
cursor: pointer;\r
position: relative;\r
width: 24px;\r
zoom: 1;\r
*display: inline;\r
}\r
-button.yangButton.iconArrowDown,\r
-div.yangButton.iconArrowDown {\r
+.gbpWrapper button.yangButton.iconArrowDown,\r
+.gbpWrapper div.yangButton.iconArrowDown {\r
background: transparent url('images/yang-ui-icons/icon-arrow-down.tpl.html') no-repeat center top;\r
}\r
-button.yangButton.iconArrowRight,\r
-div.yangButton.iconArrowRight {\r
+.gbpWrapper button.yangButton.iconArrowRight,\r
+.gbpWrapper div.yangButton.iconArrowRight {\r
background: transparent url('images/yang-ui-icons/icon-arrow-right.tpl.html') no-repeat center top;\r
}\r
-button.yangButton.iconNext,\r
-div.yangButton.iconNext {\r
+.gbpWrapper button.yangButton.iconNext,\r
+.gbpWrapper div.yangButton.iconNext {\r
background: transparent url('images/yang-ui-icons/icon-next.tpl.html') no-repeat center top;\r
}\r
-button.yangButton.iconPrev,\r
-div.yangButton.iconPrev {\r
+.gbpWrapper button.yangButton.iconPrev,\r
+.gbpWrapper div.yangButton.iconPrev {\r
background: transparent url('images/yang-ui-icons/icon-prev.tpl.html') no-repeat center top;\r
}\r
-button.yangButton:hover,\r
-div.yangButton:hover {\r
+.gbpWrapper button.yangButton:hover,\r
+.gbpWrapper div.yangButton:hover {\r
background-position: center -24px;\r
}\r
-button.yangButton.disabled,\r
-div.yangButton.disabled {\r
+.gbpWrapper button.yangButton.disabled,\r
+.gbpWrapper div.yangButton.disabled {\r
-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity= 40 )' !important;\r
filter: alpha(opacity= 40 ) !important;\r
-moz-opacity: 0.4 !important;\r
-khtml-opacity: 0.4 !important;\r
opacity: 0.4 !important;\r
}\r
-button.yangButton.disabled:hover,\r
-div.yangButton.disabled:hover {\r
+.gbpWrapper button.yangButton.disabled:hover,\r
+.gbpWrapper div.yangButton.disabled:hover {\r
background-position: center top;\r
}\r
-.btn-slim {\r
+.gbpWrapper .btn-slim {\r
padding-top: 2px;\r
padding-bottom: 2px;\r
}\r
-.inlineBlock {\r
+.gbpWrapper .inlineBlock {\r
display: -moz-inline-stack;\r
display: inline-block;\r
vertical-align: top;\r
zoom: 1;\r
*display: inline;\r
}\r
-.leaf {\r
+.gbpWrapper .leaf {\r
margin: 5px;\r
padding-left: 5px;\r
position: relative;\r
}\r
-.leaf-label {\r
+.gbpWrapper .leaf-label {\r
margin-right: 10px;\r
font-weight: bold;\r
display: -moz-inline-stack;\r
/*width: 170px;*/\r
padding-top: 6px;\r
}\r
-.leaf-label button.iconQuestion {\r
+.gbpWrapper .leaf-label button.iconQuestion {\r
margin-top: -2px;\r
}\r
-.leaf-label i.icon-key {\r
+.gbpWrapper .leaf-label i.icon-key {\r
font-size: 1.3em;\r
padding-left: 5px;\r
}\r
-.clear {\r
+.gbpWrapper .clear {\r
clear: both;\r
}\r
-.borderArrow {\r
+.gbpWrapper .borderArrow {\r
color: #393939;\r
position: absolute;\r
bottom: -6px;\r
left: -6px;\r
font-size: 1.3em;\r
}\r
-.tooltip-inner {\r
+.gbpWrapper .tooltip-inner {\r
color: #fff;\r
white-space: pre-wrap;\r
/* CSS3 */\r
*/\r
/*GBP END*/\r
\r
-.btn-like-tab {\r
+.gbpWrapper .btn-like-tab {\r
text-decoration: none;\r
color: #464646;\r
border: 0;\r
-o-transition: all 150ms linear;\r
transition: all 150ms linear;\r
}\r
-.btn-like-tab.btn-selected,\r
-.btn-like-tab:hover {\r
+.gbpWrapper .btn-like-tab.btn-selected,\r
+.gbpWrapper .btn-like-tab:hover {\r
border-bottom: 3px solid #1baafd;\r
background: transparent !important;\r
}\r
\r
+.gbpWrapper h1, .gbpWrapper h2, .gbpWrapper h3 {\r
+ color: #393939;\r
+}\r
+\r
#page_logo {\r
display:none;\r
}\r
\r
-h1, h2, h3 {\r
- color: #393939;\r
-}\r
\r
/*-------------------YangUI import START-------------------*/\r
\r
@iconsRootPath : 'images/yang-ui-icons/';\r
-\r
-.customContainer{\r
- border-left: 1px solid #7a7a7a;\r
- margin: 35px 5px 5px 15px;\r
- padding: 5px;\r
- /*z-index: 10;*/\r
- width:auto;\r
- position: relative;\r
- &.withoutBorder{\r
- border-left: 0;\r
- padding-bottom: 0;\r
- .treeBullet.containerBullet{\r
- left: -25px;\r
- top: -25px;\r
+.gbpWrapper{\r
+ .customContainer{\r
+ border-left: 1px solid #7a7a7a;\r
+ margin: 35px 5px 5px 15px;\r
+ padding: 5px;\r
+ /*z-index: 10;*/\r
+ width:auto;\r
+ position: relative;\r
+ &.withoutBorder{\r
+ border-left: 0;\r
+ padding-bottom: 0;\r
+ .treeBullet.containerBullet{\r
+ left: -25px;\r
+ top: -25px;\r
+ }\r
}\r
}\r
-}\r
\r
-.topContainerPart{\r
- margin-left: -19px;\r
- margin-top: -28px;\r
- margin-bottom: 10px;\r
-}\r
-\r
-.treeBullet{\r
- font-size: 25px;\r
- color: #7a7a7a;\r
- position: absolute;\r
- left: -15px;\r
- top: 0;\r
- &.containerBullet{\r
- top: -25px; \r
- left: -25px;\r
+ .topContainerPart{\r
+ margin-left: -19px;\r
+ margin-top: -28px;\r
+ margin-bottom: 10px;\r
}\r
-}\r
\r
-.btn-name{\r
- -webkit-border-radius: 5px;\r
- border-radius: 5px;\r
- background: transparent;\r
- font-weight: bold;\r
- color: @text-color;\r
- border: 2px solid @text-color;\r
- cursor: auto;\r
-}\r
-\r
-button, div{\r
- &.yangButton{\r
- cursor: pointer;\r
- position: relative;\r
- width: 24px;\r
- height: 24px;\r
- border: 0;\r
- margin: 2px;\r
- .inlineBlock;\r
- &.iconArrowDown{\r
- background: transparent url('@{iconsRootPath}icon-arrow-down.png') no-repeat center top;\r
- }\r
- &.iconArrowRight{\r
- background: transparent url('@{iconsRootPath}icon-arrow-right.png') no-repeat center top;\r
- }\r
- &.iconNext{\r
- background: transparent url('@{iconsRootPath}icon-next.png') no-repeat center top;\r
- }\r
- &.iconPrev{\r
- background: transparent url('@{iconsRootPath}icon-prev.png') no-repeat center top;\r
- }\r
- &:hover{\r
- background-position: center -24px;\r
+ .treeBullet{\r
+ font-size: 25px;\r
+ color: #7a7a7a;\r
+ position: absolute;\r
+ left: -15px;\r
+ top: 0;\r
+ &.containerBullet{\r
+ top: -25px; \r
+ left: -25px;\r
}\r
- &.disabled{\r
- .opacityDeph(0.4)!important;\r
+ }\r
+\r
+ .btn-name{\r
+ -webkit-border-radius: 5px;\r
+ border-radius: 5px;\r
+ background: transparent;\r
+ font-weight: bold;\r
+ color: @text-color;\r
+ border: 2px solid @text-color;\r
+ cursor: auto;\r
+ }\r
+\r
+ button, div{\r
+ &.yangButton{\r
+ cursor: pointer;\r
+ position: relative;\r
+ width: 24px;\r
+ height: 24px;\r
+ border: 0;\r
+ margin: 2px;\r
+ .inlineBlock;\r
+ &.iconArrowDown{\r
+ background: transparent url('@{iconsRootPath}icon-arrow-down.png') no-repeat center top;\r
+ }\r
+ &.iconArrowRight{\r
+ background: transparent url('@{iconsRootPath}icon-arrow-right.png') no-repeat center top;\r
+ }\r
+ &.iconNext{\r
+ background: transparent url('@{iconsRootPath}icon-next.png') no-repeat center top;\r
+ }\r
+ &.iconPrev{\r
+ background: transparent url('@{iconsRootPath}icon-prev.png') no-repeat center top;\r
+ }\r
&:hover{\r
- background-position: center top;\r
+ background-position: center -24px;\r
+ }\r
+ &.disabled{\r
+ .opacityDeph(0.4)!important;\r
+ &:hover{\r
+ background-position: center top;\r
+ }\r
}\r
}\r
}\r
-}\r
\r
-.btn-slim {\r
- padding-top: 2px;\r
- padding-bottom: 2px;\r
-}\r
+ .btn-slim {\r
+ padding-top: 2px;\r
+ padding-bottom: 2px;\r
+ }\r
\r
-.inlineBlock {\r
- display: -moz-inline-stack;\r
- display: inline-block;\r
- vertical-align: top;\r
- zoom: 1;\r
- *display: inline;\r
-}\r
+ .inlineBlock {\r
+ display: -moz-inline-stack;\r
+ display: inline-block;\r
+ vertical-align: top;\r
+ zoom: 1;\r
+ *display: inline;\r
+ }\r
\r
-.leaf {\r
- margin: 5px;\r
- padding-left: 5px;\r
- position: relative;\r
-}\r
+ .leaf {\r
+ margin: 5px;\r
+ padding-left: 5px;\r
+ position: relative;\r
+ }\r
\r
-.leaf-label {\r
- margin-right: 10px;\r
- font-weight: bold;\r
- .inlineBlock;\r
- /*width: 170px;*/\r
- padding-top: 6px;\r
- button.iconQuestion{\r
- margin-top: -2px;\r
- }\r
+ .leaf-label {\r
+ margin-right: 10px;\r
+ font-weight: bold;\r
+ .inlineBlock;\r
+ /*width: 170px;*/\r
+ padding-top: 6px;\r
+ button.iconQuestion{\r
+ margin-top: -2px;\r
+ }\r
\r
- i.icon-key {\r
- font-size: 1.3em;\r
- padding-left: 5px;\r
- }\r
-}\r
+ i.icon-key {\r
+ font-size: 1.3em;\r
+ padding-left: 5px;\r
+ }\r
+ }\r
\r
-.clear{\r
- clear: both;\r
-}\r
+ .clear{\r
+ clear: both;\r
+ }\r
\r
-.borderArrow{\r
- color: @text-color;\r
- position: absolute;\r
- bottom: -6px;\r
- left: -6px;\r
- font-size: 1.3em;\r
-}\r
+ .borderArrow{\r
+ color: @text-color;\r
+ position: absolute;\r
+ bottom: -6px;\r
+ left: -6px;\r
+ font-size: 1.3em;\r
+ }\r
\r
-.tooltip-inner{\r
- color: #fff;\r
- white-space: pre-wrap; /* CSS3 */ \r
- white-space: -moz-pre-wrap; /* Firefox */ \r
- white-space: -pre-wrap; /* Opera <7 */ \r
- white-space: -o-pre-wrap; /* Opera 7 */ \r
- word-wrap: break-word; /* IE */\r
+ .tooltip-inner{\r
+ color: #fff;\r
+ white-space: pre-wrap; /* CSS3 */ \r
+ white-space: -moz-pre-wrap; /* Firefox */ \r
+ white-space: -pre-wrap; /* Opera <7 */ \r
+ white-space: -o-pre-wrap; /* Opera 7 */ \r
+ word-wrap: break-word; /* IE */\r
+ }\r
}\r
-\r
/*-------------------YangUI import END-------------------*/\r
\r
/*\r