Skip to content

A
atlas
Commit a5e5cec6 by kevalbhatt Committed by Sarath Subramanian
Options

ATLAS-2951: UI : Show entity specific icon for the lineage node

Signed-off-by: 's avatarSarath Subramanian <ssubramanian@hortonworks.com>
parent b919d3d0
Showing with 377 additions and 68 deletions
dashboardv2/gruntfile.js
...@@ -144,7 +144,8 @@ module.exports = function(grunt) { ...@@ -144,7 +144,8 @@ module.exports = function(grunt) {
}], }],
'query-builder.default.min.css': { 'jQuery-QueryBuilder/dist/css': 'jQueryQueryBuilder/css' }, 'query-builder.default.min.css': { 'jQuery-QueryBuilder/dist/css': 'jQueryQueryBuilder/css' },
'daterangepicker.css': { 'bootstrap-daterangepicker': 'bootstrap-daterangepicker/css' }, 'daterangepicker.css': { 'bootstrap-daterangepicker': 'bootstrap-daterangepicker/css' },
'nv.d3.min.css': { 'nvd3/build': 'nvd3/css' } 'nv.d3.min.css': { 'nvd3/build': 'nvd3/css' },
'pretty-checkbox.min.css': { 'pretty-checkbox/dist': 'pretty-checkbox/css' }
} }
}, },
...@@ -168,7 +169,8 @@ module.exports = function(grunt) { ...@@ -168,7 +169,8 @@ module.exports = function(grunt) {
{ 'dagre-d3': 'dagre-d3' }, { 'dagre-d3': 'dagre-d3' },
{ 'platform': 'platform/' }, { 'platform': 'platform/' },
{ 'jQuery-QueryBuilder': 'jQueryQueryBuilder/' }, { 'jQuery-QueryBuilder': 'jQueryQueryBuilder/' },
{ 'moment-timezone': 'moment-timezone' } { 'moment-timezone': 'moment-timezone' },
{ 'pretty-checkbox': 'pretty-checkbox' }
], ],
'LICENSE.md': [{ 'backbone.babysitter': 'backbone-babysitter' }, 'LICENSE.md': [{ 'backbone.babysitter': 'backbone-babysitter' },
{ 'backbone.wreqr': 'backbone-wreqr' }, { 'backbone.wreqr': 'backbone-wreqr' },
...@@ -391,4 +393,4 @@ module.exports = function(grunt) { ...@@ -391,4 +393,4 @@ module.exports = function(grunt) {
'cssmin', 'cssmin',
'template' 'template'
]); ]);
}; };
\ No newline at end of file
dashboardv2/package.json
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
"type": "git", "type": "git",
"url": "https://git-wip-us.apache.org/repos/asf/incubator-atlas.git" "url": "https://git-wip-us.apache.org/repos/asf/incubator-atlas.git"
}, },
"scripts": { "scripts": {
"dev": "grunt dev", "dev": "grunt dev",
"build": "grunt build", "build": "grunt build",
"dev-minify": "grunt dev-minify", "dev-minify": "grunt dev-minify",
...@@ -47,6 +47,7 @@ ...@@ -47,6 +47,7 @@
"nvd3": "1.8.5", "nvd3": "1.8.5",
"platform": "1.3.4", "platform": "1.3.4",
"pnotify": "3.2.0", "pnotify": "3.2.0",
"pretty-checkbox": "3.0.3",
"requirejs": "2.3.3", "requirejs": "2.3.3",
"requirejs-text": "2.0.15", "requirejs-text": "2.0.15",
"select2": "4.0.3", "select2": "4.0.3",
......
dashboardv2/public/css/scss/graph.scss
...@@ -28,33 +28,41 @@ ...@@ -28,33 +28,41 @@
.node { .node {
cursor: pointer; cursor: pointer;
text { text {
font-size: 10px; font-size: 10px;
font-family: $font_1; font-family: $font_1;
} }
rect { rect {
stroke: $color_mountain_mist_approx; stroke: $color_mountain_mist_approx;
fill: $white; fill: $white;
stroke-width: 1.5px; stroke-width: 1.5px;
} }
.label { .label {
fill: $color_suva_gray_approx; fill: $color_suva_gray_approx;
} }
circle { circle {
-moz-transition: all 0.3s; -moz-transition: all 0.3s;
-webkit-transition: all 0.3s; -webkit-transition: all 0.3s;
transition: all 0.3s; transition: all 0.3s;
stroke-width: 1.5px; stroke-width: 1.5px;
&.nodeImage { &.nodeImage {
&.green:hover { &.green:hover {
stroke: #8bc152; stroke: #ffb203;
} }
&.blue:hover { &.blue:hover {
stroke: #4b91e2; stroke: #4b91e2;
} }
&.currentNode { &.currentNode {
stroke: #fb4200; stroke: #fb4200;
} }
&:hover { &:hover {
-moz-transform: scale(1.4); -moz-transform: scale(1.4);
-webkit-transform: scale(1.4); -webkit-transform: scale(1.4);
...@@ -62,15 +70,18 @@ ...@@ -62,15 +70,18 @@
} }
} }
} }
&.active { &.active {
circle { circle {
-moz-transform: scale(1.4); -moz-transform: scale(1.4);
-webkit-transform: scale(1.4); -webkit-transform: scale(1.4);
transform: scale(1.4); transform: scale(1.4);
&.nodeImage { &.nodeImage {
&.green { &.green {
stroke: #8bc152; stroke: #ffb203;
} }
&.blue { &.blue {
stroke: #4b91e2; stroke: #4b91e2;
} }
...@@ -102,10 +113,12 @@ ...@@ -102,10 +113,12 @@
z-index: 999; z-index: 999;
max-width: 300px; //Instead of the line below you could use @include border-radius($radius, $vertical-radius) max-width: 300px; //Instead of the line below you could use @include border-radius($radius, $vertical-radius)
border-radius: 2px; border-radius: 2px;
.tip-inner-scroll { .tip-inner-scroll {
overflow: auto; overflow: auto;
max-height: 300px; max-height: 300px;
} }
/* Creates a small triangle extender for the tooltip */ /* Creates a small triangle extender for the tooltip */
&:after { &:after {
box-sizing: border-box; box-sizing: border-box;
...@@ -116,6 +129,7 @@ ...@@ -116,6 +129,7 @@
color: rgba(0, 0, 0, 0.8); color: rgba(0, 0, 0, 0.8);
position: absolute; position: absolute;
} }
/* Nrthward tooltips */ /* Nrthward tooltips */
&.n:after { &.n:after {
content: "\25BC"; content: "\25BC";
...@@ -124,6 +138,7 @@ ...@@ -124,6 +138,7 @@
left: 0; left: 0;
text-align: center; text-align: center;
} }
/* Eastward tooltips */ /* Eastward tooltips */
&.e:after { &.e:after {
content: "\25C0"; content: "\25C0";
...@@ -131,6 +146,7 @@ ...@@ -131,6 +146,7 @@
top: 50%; top: 50%;
left: -8px; left: -8px;
} }
/* Southward tooltips */ /* Southward tooltips */
&.s:after { &.s:after {
content: "\25B2"; content: "\25B2";
...@@ -139,6 +155,7 @@ ...@@ -139,6 +155,7 @@
left: 0; left: 0;
text-align: center; text-align: center;
} }
/* Westward tooltips */ /* Westward tooltips */
&.w:after { &.w:after {
content: "\25B6"; content: "\25B6";
...@@ -152,10 +169,6 @@ g.type-TK>rect { ...@@ -152,10 +169,6 @@ g.type-TK>rect {
fill: $color_bright_turquoise_approx; fill: $color_bright_turquoise_approx;
} }
.hideProcessContainer {
position: absolute;
top: 12px;
}
.graph-toolbar { .graph-toolbar {
background-color: $white; background-color: $white;
...@@ -183,9 +196,11 @@ g.type-TK>rect { ...@@ -183,9 +196,11 @@ g.type-TK>rect {
transform: scaleX(0); transform: scaleX(0);
width: 200px; width: 200px;
transition: transform 0.3s ease-in; transition: transform 0.3s ease-in;
&.open { &.open {
transform: scaleX(1); transform: scaleX(1);
} }
.title { .title {
background: black; background: black;
color: white; color: white;
...@@ -193,12 +208,14 @@ g.type-TK>rect { ...@@ -193,12 +208,14 @@ g.type-TK>rect {
padding-left: 17px; padding-left: 17px;
margin-top: 0; margin-top: 0;
font-size: 14px; font-size: 14px;
.navigation-font { .navigation-font {
font-family: sans-serif; font-family: sans-serif;
padding: 0px 5px; padding: 0px 5px;
color: #fb4200; color: #fb4200;
} }
} }
.close-details { .close-details {
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -209,12 +226,14 @@ g.type-TK>rect { ...@@ -209,12 +226,14 @@ g.type-TK>rect {
cursor: pointer; cursor: pointer;
font-size: 16px; font-size: 16px;
} }
.propagation-list { .propagation-list {
overflow: auto; overflow: auto;
list-style-type: none; list-style-type: none;
list-style-position: outside; list-style-position: outside;
padding-left: 30px; padding-left: 30px;
} }
.overlay { .overlay {
position: absolute; position: absolute;
left: 0; left: 0;
...@@ -224,6 +243,7 @@ g.type-TK>rect { ...@@ -224,6 +243,7 @@ g.type-TK>rect {
background: #d2d2d2b8; background: #d2d2d2b8;
z-index: 99; z-index: 99;
} }
ul>li { ul>li {
word-wrap: break-word; word-wrap: break-word;
margin-bottom: 5px; margin-bottom: 5px;
...@@ -240,13 +260,94 @@ g.type-TK>rect { ...@@ -240,13 +260,94 @@ g.type-TK>rect {
box-shadow: 1px 3px 3px 2px #bfbfbf; box-shadow: 1px 3px 3px 2px #bfbfbf;
} }
.zoomButtonGroup { .graph-button-group {
text-align: right; position: absolute;
top: 5px;
right: 5px;
.zoom-button-group {
margin-top: 8px;
border: 1px solid;
border-radius: 5px;
background-color: white;
[type="button"] {
display: block;
padding: 2px 6px;
cursor: pointer;
}
}
}
.lineage-fltr-panel {
position: absolute;
border: 1px solid #ccc;
width: 250px;
max-height: 99%;
overflow: auto;
transition: all 0.3s ease;
right: -273px;
box-shadow: 9px -14px 26px 6px;
background-color: #f5f5f5;
//color: $white;
z-index: 999;
.header {
background: black;
color: white;
text-align: center;
margin-bottom: 15px;
position: absolute;
width: 100%;
>h4 {
padding: 0px 36px 0px 10px;
word-break: break-all;
}
.fltr-togler {
position: absolute;
right: 0px;
top: 0px;
}
}
.body {
padding: 10px;
margin-top: 39px;
width: 100%;
position: relative;
height: 200px;
overflow: auto;
}
}
.show-filter-panel {
right: 0px !important;
}
.btn-gray {
border: 1px solid #686868;
color: $dark_gray;
background: white;
}
.btn-gray:hover {
border: 1px solid #686868;
color: $dark_gray !important;
background-color: transparent !important;
}
span#zoom_in {
border-bottom: 1px solid #625555;
} }
.depthContainer { .depthContainer {
display: inline-block;
margin-top: 3px; //display: inline-block;
//margin-top: 3px;
.inline { .inline {
display: inline-block; display: inline-block;
} }
......
dashboardv2/public/css/scss/override.scss
...@@ -21,6 +21,7 @@ ...@@ -21,6 +21,7 @@
.tabs li.tab.active { .tabs li.tab.active {
border-bottom: 2px solid $color_keppel_approx; border-bottom: 2px solid $color_keppel_approx;
a { a {
color: $color_keppel_approx; color: $color_keppel_approx;
} }
...@@ -40,6 +41,7 @@ ...@@ -40,6 +41,7 @@
padding: 15px; padding: 15px;
text-align: right; text-align: right;
border-top: 1px solid #DEDEDE; border-top: 1px solid #DEDEDE;
.btn+.btn { .btn+.btn {
margin-bottom: 0; margin-bottom: 0;
} }
...@@ -51,6 +53,7 @@ ...@@ -51,6 +53,7 @@
max-height: 400px; max-height: 400px;
min-height: 70px; min-height: 70px;
overflow: auto; overflow: auto;
.btn+.btn { .btn+.btn {
margin-bottom: 2px; margin-bottom: 2px;
} }
...@@ -71,14 +74,17 @@ ...@@ -71,14 +74,17 @@
box-shadow: 0px 0px 4px #d8d8d8; box-shadow: 0px 0px 4px #d8d8d8;
overflow: scroll !important; overflow: scroll !important;
max-height: 500px; max-height: 500px;
.resizeHandler { .resizeHandler {
&.grid-draggable { &.grid-draggable {
background-color: $color_jungle_green_approx !important; background-color: $color_jungle_green_approx !important;
} }
&:hover { &:hover {
border-left: 1px solid #d2d2d2; border-left: 1px solid #d2d2d2;
} }
} }
>thead>tr>th { >thead>tr>th {
border-width: thin; border-width: thin;
border-color: $color_jungle_green_approx; border-color: $color_jungle_green_approx;
...@@ -93,6 +99,7 @@ ...@@ -93,6 +99,7 @@
letter-spacing: 0.25px; letter-spacing: 0.25px;
color: rgba(52, 52, 52, 1); color: rgba(52, 52, 52, 1);
} }
>tbody>tr>td { >tbody>tr>td {
border-color: $color_gallery_approx; border-color: $color_gallery_approx;
color: #333333; color: #333333;
...@@ -102,6 +109,7 @@ ...@@ -102,6 +109,7 @@
} }
td { td {
div.scroll-y, div.scroll-y,
pre.scroll-y { pre.scroll-y {
max-height: 200px; max-height: 200px;
...@@ -113,6 +121,7 @@ td { ...@@ -113,6 +121,7 @@ td {
td { td {
white-space: normal; white-space: normal;
} }
.select-all-header-cell { .select-all-header-cell {
width: 42px; width: 42px;
} }
...@@ -152,9 +161,11 @@ td { ...@@ -152,9 +161,11 @@ td {
background: $transparent; background: $transparent;
color: $color_keppel_approx; color: $color_keppel_approx;
@include ellipsis(); @include ellipsis();
i { i {
font-weight: bold; font-weight: bold;
} }
&:hover { &:hover {
color: $white; color: $white;
background: $color_keppel_approx background: $color_keppel_approx
...@@ -165,6 +176,7 @@ td { ...@@ -165,6 +176,7 @@ td {
>.disabled>a, >.disabled>a,
>li>button[disabled] { >li>button[disabled] {
color: $color_mountain_mist_approx; color: $color_mountain_mist_approx;
&:hover { &:hover {
cursor: not-allowed; cursor: not-allowed;
color: $white; color: $white;
...@@ -177,32 +189,58 @@ td { ...@@ -177,32 +189,58 @@ td {
width: 100% !important; width: 100% !important;
} }
.select2-mini {
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
min-height: 28px;
}
.select2-container--default .select2-selection--single {
.select2-selection__rendered {
line-height: 28px;
font-size: 13px;
}
.select2-selection__arrow {
height: 28px;
}
}
}
.select2-container--default { .select2-container--default {
.select2-selection--multiple { .select2-selection--multiple {
background-color: $color_white_lilac_approx !important; background-color: $color_white_lilac_approx !important;
border: 1px $color_mystic_approx solid !important; border: 1px $color_mystic_approx solid !important;
&.errorClass { &.errorClass {
border: 1px solid red !important; border: 1px solid red !important;
} }
} }
.select2-selection--single { .select2-selection--single {
.select2-selection__arrow { .select2-selection__arrow {
height: 34px; height: 34px;
} }
.select2-selection__rendered { .select2-selection__rendered {
line-height: 32px; line-height: 32px;
font-size: 14px; font-size: 14px;
} }
} }
&.select2-container--focus .select2-selection--multiple { &.select2-container--focus .select2-selection--multiple {
border-color: $color_bali_hai_approx !important; border-color: $color_bali_hai_approx !important;
} }
} }
.select2-container { .select2-container {
.select2-selection--single, .select2-selection--single,
.select2-selection--multiple { .select2-selection--multiple {
min-height: 34px; min-height: 34px;
.select2-selection__rendered { .select2-selection__rendered {
padding-left: 12px; padding-left: 12px;
} }
...@@ -225,15 +263,18 @@ td { ...@@ -225,15 +263,18 @@ td {
.select2-selection--multiple { .select2-selection--multiple {
.select2-selection__rendered { .select2-selection__rendered {
padding-right: 13px; padding-right: 13px;
.select2-selection__choice { .select2-selection__choice {
font-size: 14px; font-size: 14px;
color: $color_mountain_mist_approx; color: $color_mountain_mist_approx;
border: 1px solid $color_mountain_mist_approx; border: 1px solid $color_mountain_mist_approx;
} }
.select2-search__field { .select2-search__field {
font-size: 14px; font-size: 14px;
} }
} }
.select2-selection__clear { .select2-selection__clear {
position: absolute; position: absolute;
float: none; float: none;
...@@ -267,11 +308,13 @@ td { ...@@ -267,11 +308,13 @@ td {
.popover-content { .popover-content {
max-height: 150px; max-height: 150px;
overflow: auto; overflow: auto;
ul { ul {
color: $dark_gray; color: $dark_gray;
padding: 0px 5px; padding: 0px 5px;
margin-bottom: 0px; margin-bottom: 0px;
cursor: pointer; cursor: pointer;
a { a {
color: $dark_gray; color: $dark_gray;
padding: 5px; padding: 5px;
...@@ -291,35 +334,43 @@ td { ...@@ -291,35 +334,43 @@ td {
.query-builder { .query-builder {
.rule-container { .rule-container {
margin: 6px 0; margin: 6px 0;
.rule-header { .rule-header {
.rule-actions { .rule-actions {
padding: 7px 0px; padding: 7px 0px;
} }
} }
.rule-value-container { .rule-value-container {
display: inline-block !important; display: inline-block !important;
.form-control { .form-control {
width: 220px !important; width: 220px !important;
padding: 6px 12px !important; padding: 6px 12px !important;
} }
} }
.rule-filter-container { .rule-filter-container {
.form-control { .form-control {
width: 200px !important; width: 200px !important;
} }
} }
.rule-operator-container { .rule-operator-container {
.form-control { .form-control {
width: auto !important; width: auto !important;
} }
} }
} }
.rules-list>:first-child::before { .rules-list>:first-child::before {
top: -8px; top: -8px;
} }
.rules-group-container { .rules-group-container {
border-color: transparent; border-color: transparent;
background: none; background: none;
.rules-group-header { .rules-group-header {
.group-actions { .group-actions {
.btn-success { .btn-success {
...@@ -327,18 +378,21 @@ td { ...@@ -327,18 +378,21 @@ td {
background-color: transparent !important; background-color: transparent !important;
border-color: #38BB9B !important; border-color: #38BB9B !important;
} }
.btn-danger { .btn-danger {
color: #e14f00; color: #e14f00;
background-color: transparent; background-color: transparent;
border-color: #e14f00; border-color: #e14f00;
} }
} }
.group-conditions { .group-conditions {
.btn-primary { .btn-primary {
color: #333 !important; color: #333 !important;
background-color: #fff !important; background-color: #fff !important;
border-color: #ccc !important; border-color: #ccc !important;
} }
.active { .active {
color: #fff !important; color: #fff !important;
background-color: #5bc0de !important; background-color: #5bc0de !important;
...@@ -357,6 +411,7 @@ td { ...@@ -357,6 +411,7 @@ td {
div.columnmanager-visibilitycontrol { div.columnmanager-visibilitycontrol {
width: auto; width: auto;
margin-bottom: 5px; margin-bottom: 5px;
&.open .btn-action { &.open .btn-action {
background-color: #37bb9b; background-color: #37bb9b;
color: #fff; color: #fff;
...@@ -367,6 +422,7 @@ div.columnmanager-dropdown-container { ...@@ -367,6 +422,7 @@ div.columnmanager-dropdown-container {
&.open { &.open {
overflow: auto; overflow: auto;
} }
>li>span.column-label { >li>span.column-label {
width: auto; width: auto;
} }
...@@ -378,16 +434,19 @@ div.columnmanager-dropdown-container { ...@@ -378,16 +434,19 @@ div.columnmanager-dropdown-container {
left: calc(50% - 250px) !important; left: calc(50% - 250px) !important;
margin-left: 0 !important; margin-left: 0 !important;
} }
&.width-500 { &.width-500 {
width: 500px !important; width: 500px !important;
left: calc(50% - 216px) !important; left: calc(50% - 216px) !important;
margin-left: 0 !important; margin-left: 0 !important;
} }
&.width-400 { &.width-400 {
width: 400px !important; width: 400px !important;
left: calc(50% - 183px); left: calc(50% - 183px);
margin-left: 0 !important; margin-left: 0 !important;
} }
.alert.ui-pnotify-container { .alert.ui-pnotify-container {
color: $color_ironside_gray_approx; color: $color_ironside_gray_approx;
background-color: $white; background-color: $white;
...@@ -396,10 +455,12 @@ div.columnmanager-dropdown-container { ...@@ -396,10 +455,12 @@ div.columnmanager-dropdown-container {
outline: 0; outline: 0;
-webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
box-shadow: 0 5px 15px rgba(0, 0, 0, .5); box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
.ui-pnotify-icon, .ui-pnotify-icon,
.ui-pnotify-title { .ui-pnotify-title {
padding: 15px; padding: 15px;
} }
.ui-pnotify-text { .ui-pnotify-text {
position: relative; position: relative;
padding: 15px; padding: 15px;
...@@ -426,7 +487,7 @@ div.columnmanager-dropdown-container { ...@@ -426,7 +487,7 @@ div.columnmanager-dropdown-container {
border-radius: 11px; border-radius: 11px;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
background-color: transparent!important; background-color: transparent !important;
color: #626467; color: #626467;
border: 1px solid black; border: 1px solid black;
} }
......
dashboardv2/public/css/scss/relationship.scss
...@@ -21,6 +21,7 @@ ...@@ -21,6 +21,7 @@
fill: none; fill: none;
stroke-width: 1.5px; stroke-width: 1.5px;
} }
.relationship-details { .relationship-details {
position: absolute; position: absolute;
left: 0; left: 0;
...@@ -32,15 +33,19 @@ ...@@ -32,15 +33,19 @@
transform: scaleX(0); transform: scaleX(0);
width: 240px; width: 240px;
transition: transform 0.3s ease-in; transition: transform 0.3s ease-in;
&.open { &.open {
transform: scaleX(1); transform: scaleX(1);
} }
.title { .title {
background: black; background: black;
color: white; color: white;
padding: 10px; padding: 10px 38px 10px 10px;
word-break: break-all;
margin-top: 0; margin-top: 0;
} }
.close-details { .close-details {
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -51,12 +56,14 @@ ...@@ -51,12 +56,14 @@
cursor: pointer; cursor: pointer;
font-size: 16px; font-size: 16px;
} }
.entity-list { .entity-list {
overflow: auto; overflow: auto;
list-style-type: decimal; list-style-type: decimal;
list-style-position: outside; list-style-position: outside;
padding-left: 15px; padding-left: 15px;
} }
ul>li { ul>li {
word-wrap: break-word; word-wrap: break-word;
margin-bottom: 5px; margin-bottom: 5px;
...@@ -66,6 +73,7 @@ ...@@ -66,6 +73,7 @@
a { a {
color: #BB5838 !important; color: #BB5838 !important;
} }
.deleteBtn { .deleteBtn {
padding: 2px 8px !important; padding: 2px 8px !important;
margin: 5px 5px !important; margin: 5px 5px !important;
......
dashboardv2/public/css/scss/theme.scss
...@@ -33,25 +33,31 @@ header { ...@@ -33,25 +33,31 @@ header {
.header-menu { .header-menu {
.dropdown-menu>li>a { .dropdown-menu>li>a {
color: $color_ironside_gray_approx; color: $color_ironside_gray_approx;
&:hover { &:hover {
color: $color_jungle_green_approx; color: $color_jungle_green_approx;
} }
i { i {
padding-right: 3px; padding-right: 3px;
} }
} }
>a { >a {
display: inline-block; display: inline-block;
color: $color_ironside_gray_approx; color: $color_ironside_gray_approx;
padding: 15px 14px; padding: 15px 14px;
&:hover { &:hover {
border-bottom: 2px solid $color_jungle_green_approx; border-bottom: 2px solid $color_jungle_green_approx;
padding: 14px 14px; padding: 14px 14px;
color: $color_jungle_green_approx; color: $color_jungle_green_approx;
} }
span { span {
padding: 5px; padding: 5px;
} }
i { i {
font-size: 18px; font-size: 18px;
} }
...@@ -68,6 +74,7 @@ header { ...@@ -68,6 +74,7 @@ header {
font-size: 18px; font-size: 18px;
font-style: italic; font-style: italic;
} }
.input-group-addon { .input-group-addon {
font-size: 20px; font-size: 20px;
color: $color_bombay_approx; color: $color_bombay_approx;
...@@ -84,6 +91,7 @@ header { ...@@ -84,6 +91,7 @@ header {
#sideNav-wrapper { #sideNav-wrapper {
color: $white; color: $white;
font-size: 16px !important; font-size: 16px !important;
.well { .well {
background-color: $color_tuna_approx; background-color: $color_tuna_approx;
border: 1px solid #666363; border: 1px solid #666363;
...@@ -93,19 +101,26 @@ header { ...@@ -93,19 +101,26 @@ header {
} }
.page-title { .page-title {
background-color: $white; background-color: $color_white_lilac_approx;
padding: 10px 15px; padding: 10px 15px 0px 15px;
.title { .title {
padding-top: 0; padding-top: 0;
margin-top: 0; margin-top: 0;
} }
h1 { h1 {
&.title {
word-break: break-all;
}
// margin-top: 50px; // margin-top: 50px;
margin-bottom: 10px; margin-bottom: 10px;
font-weight: 600; font-weight: 600;
@include ellipsis(); @include ellipsis();
max-width: 91%; max-width: 91%;
display: inline-block; display: inline-block;
small { small {
position: relative; position: relative;
bottom: 5px; bottom: 5px;
...@@ -118,6 +133,7 @@ header { ...@@ -118,6 +133,7 @@ header {
text-transform: uppercase; text-transform: uppercase;
} }
} }
.sub-title { .sub-title {
margin-bottom: 40px; margin-bottom: 40px;
} }
...@@ -138,12 +154,14 @@ header { ...@@ -138,12 +154,14 @@ header {
a { a {
color: $color_jungle_green_approx; color: $color_jungle_green_approx;
cursor: pointer; cursor: pointer;
&:focus { &:focus {
color: $color_puerto_rico_approx; color: $color_puerto_rico_approx;
text-decoration: none; text-decoration: none;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
} }
&:hover { &:hover {
color: $color_puerto_rico_approx; color: $color_puerto_rico_approx;
text-decoration: none; text-decoration: none;
...@@ -158,11 +176,13 @@ a { ...@@ -158,11 +176,13 @@ a {
.blue-link { .blue-link {
color: $color_havelock_blue_approx; color: $color_havelock_blue_approx;
&:focus { &:focus {
color: $color_havelock_blue_approx; color: $color_havelock_blue_approx;
text-decoration: none; text-decoration: none;
outline: none; outline: none;
} }
&:hover { &:hover {
color: $color_havelock_blue_approx; color: $color_havelock_blue_approx;
text-decoration: underline; text-decoration: underline;
...@@ -190,6 +210,7 @@ hr[size="10"] { ...@@ -190,6 +210,7 @@ hr[size="10"] {
margin-bottom: 2px; margin-bottom: 2px;
background-color: $white; background-color: $white;
max-width: none; max-width: none;
.table { .table {
width: auto; width: auto;
} }
...@@ -227,13 +248,16 @@ hr[size="10"] { ...@@ -227,13 +248,16 @@ hr[size="10"] {
padding: 25px 0; padding: 25px 0;
margin-top: 25px; margin-top: 25px;
border-top: 1px $color_mystic_approx solid; border-top: 1px $color_mystic_approx solid;
.comment { .comment {
margin-bottom: 25px; margin-bottom: 25px;
} }
.author { .author {
color: $color_keppel_approx; color: $color_keppel_approx;
margin-bottom: 0; margin-bottom: 0;
} }
.date { .date {
color: $color_star_dust_approx; color: $color_star_dust_approx;
} }
...@@ -318,9 +342,11 @@ hr[size="10"] { ...@@ -318,9 +342,11 @@ hr[size="10"] {
.readOnlyLink { .readOnlyLink {
@include ellipsis(); @include ellipsis();
.deleteBtn { .deleteBtn {
padding: 0px 5px; padding: 0px 5px;
} }
a { a {
color: $delete_link !important; color: $delete_link !important;
} }
...@@ -348,6 +374,7 @@ fieldset.fieldset-child-pd>div { ...@@ -348,6 +374,7 @@ fieldset.fieldset-child-pd>div {
.inline-content { .inline-content {
>.inline { >.inline {
display: inline-block; display: inline-block;
&+.inline { &+.inline {
margin-left: 5px; margin-left: 5px;
} }
...@@ -356,6 +383,7 @@ fieldset.fieldset-child-pd>div { ...@@ -356,6 +383,7 @@ fieldset.fieldset-child-pd>div {
.inline-content-fl { .inline-content-fl {
@extend .inline-content; @extend .inline-content;
>.inline { >.inline {
display: block; display: block;
float: left; float: left;
...@@ -364,8 +392,10 @@ fieldset.fieldset-child-pd>div { ...@@ -364,8 +392,10 @@ fieldset.fieldset-child-pd>div {
.inline-content-fr { .inline-content-fr {
@extend .inline-content-fl; @extend .inline-content-fl;
>.inline { >.inline {
float: right; float: right;
&+.inline { &+.inline {
margin-right: 5px; margin-right: 5px;
} }
...@@ -373,6 +403,7 @@ fieldset.fieldset-child-pd>div { ...@@ -373,6 +403,7 @@ fieldset.fieldset-child-pd>div {
} }
.has-error { .has-error {
.select2-selection--single, .select2-selection--single,
.select2-selection--multiple { .select2-selection--multiple {
border-color: $color_apple_blossom_approx; border-color: $color_apple_blossom_approx;
...@@ -382,4 +413,21 @@ fieldset.fieldset-child-pd>div { ...@@ -382,4 +413,21 @@ fieldset.fieldset-child-pd>div {
.table-action-btn { .table-action-btn {
position: absolute; position: absolute;
right: 0px; right: 0px;
}
.entity-icon-box {
display: inline-block;
background: #cee0fa;
padding: 10px;
border-radius: 50%;
min-width: 76.25px;
min-height: 70px;
&.disabled {
background: #e3e3e3;
}
img {
height: 50px;
}
} }
\ No newline at end of file
dashboardv2/public/index.html.tpl
...@@ -55,6 +55,7 @@ ...@@ -55,6 +55,7 @@
<link href="js/libs/bootstrap-daterangepicker/css/daterangepicker.css?bust=<%- bust %>" rel="stylesheet"> <link href="js/libs/bootstrap-daterangepicker/css/daterangepicker.css?bust=<%- bust %>" rel="stylesheet">
<link rel="stylesheet" href="js/libs/nvd3/css/nv.d3.min.css?bust=<%- bust %>"> <link rel="stylesheet" href="js/libs/nvd3/css/nv.d3.min.css?bust=<%- bust %>">
<link href="js/libs/jstree/css/default-dark/default-dark-theme.min.css?bust=<%- bust %>" rel="stylesheet"> <link href="js/libs/jstree/css/default-dark/default-dark-theme.min.css?bust=<%- bust %>" rel="stylesheet">
<link href="js/libs/pretty-checkbox/css/pretty-checkbox.min.css?bust=<%- bust %>" rel="stylesheet">
<link href="js/libs/jstree/css/default/default-theme.min.css?bust=<%- bust %>" rel="stylesheet"> <link href="js/libs/jstree/css/default/default-theme.min.css?bust=<%- bust %>" rel="stylesheet">
<link href="css/style.css?bust=<%- bust %>" rel="stylesheet"> <link href="css/style.css?bust=<%- bust %>" rel="stylesheet">
</head> </head>
......
dashboardv2/public/js/main.js
...@@ -229,23 +229,25 @@ require(['App', ...@@ -229,23 +229,25 @@ require(['App',
CommonViewFunction.userDataFetch({ CommonViewFunction.userDataFetch({
url: UrlLinks.sessionApiUrl(), url: UrlLinks.sessionApiUrl(),
callback: function(response) { callback: function(response) {
if (response && response.userName) { if (response) {
Globals.userLogedIn.status = true; if (response.userName) {
Globals.userLogedIn.response = response; Globals.userLogedIn.status = true;
} Globals.userLogedIn.response = response;
if (response && response['atlas.entity.create.allowed'] !== undefined) { }
Globals.entityCreate = response['atlas.entity.create.allowed']; if (response['atlas.entity.create.allowed'] !== undefined) {
} Globals.entityCreate = response['atlas.entity.create.allowed'];
if (response && response['atlas.entity.update.allowed'] !== undefined) { }
Globals.entityUpdate = response['atlas.entity.update.allowed']; if (response['atlas.entity.update.allowed'] !== undefined) {
} Globals.entityUpdate = response['atlas.entity.update.allowed'];
if (response && response['atlas.ui.editable.entity.types'] !== undefined) { }
var entityTypeList = response['atlas.ui.editable.entity.types'].trim().split(","); if (response['atlas.ui.editable.entity.types'] !== undefined) {
if (entityTypeList.length) { var entityTypeList = response['atlas.ui.editable.entity.types'].trim().split(",");
if (entityTypeList[0] === "*") { if (entityTypeList.length) {
Globals.entityTypeConfList = []; if (entityTypeList[0] === "*") {
} else if (entityTypeList.length > 0) { Globals.entityTypeConfList = [];
Globals.entityTypeConfList = entityTypeList; } else if (entityTypeList.length > 0) {
Globals.entityTypeConfList = entityTypeList;
}
} }
} }
} }
......
dashboardv2/public/js/templates/detail_page/DetailPageLayoutView_tmpl.html
...@@ -19,7 +19,11 @@ ...@@ -19,7 +19,11 @@
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
</div> </div>
<div class="entityDetail form-horizontal col-sm-12"> <div class="entityDetail form-horizontal col-sm-12">
<h1 class="title row"><span data-id="title"></span></h1> {{#if entityUpdate}} <h1 class="title row">
<div data-id="entityIcon" class="entity-icon-box"></div>
<span data-id="title"></span>
</h1>
{{#if entityUpdate}}
<div data-id="editButtonContainer" class="pull-right"></div> <div data-id="editButtonContainer" class="pull-right"></div>
{{/if}} {{/if}}
<div class="form-group"> <div class="form-group">
...@@ -59,7 +63,7 @@ ...@@ -59,7 +63,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="gray-bg"> <div>
<div class="tab-content"> <div class="tab-content">
<div id="tab-details" role="properties" class="tab-pane active animated fadeIn"> <div id="tab-details" role="properties" class="tab-pane active animated fadeIn">
<div id="r_entityDetailTableLayoutView"> <div id="r_entityDetailTableLayoutView">
......
dashboardv2/public/js/templates/graph/LineageLayoutView_tmpl.html
...@@ -15,36 +15,53 @@ ...@@ -15,36 +15,53 @@
* limitations under the License. * limitations under the License.
--> -->
<!-- <div class="graph-toolbar clearfix"></div> --> <!-- <div class="graph-toolbar clearfix"></div> -->
<div style="position: absolute;height:100%;width:100%;" class="white-bg no-padding lineage-box"> <div style="position: absolute;height:100%;width:100%;overflow: hidden;" class="white-bg no-padding lineage-box">
<div class="lineage-filter-box clearfix"> <div class="lineage-fltr-panel">
<div class="hideProcessContainer"> <div class="header clearfix">
<span class="pull-left"><b>Load Process:</b>&nbsp</span> <h4>Filters</h4>
<span class="pull-left">Show</span> <span data-id="fltr-togler" style="margin: 7px" class="btn btn-action btn-sm fltr-togler"><i class="fa fa-close"></i></span>
<label class="switch pull-left">
<input type="checkbox" class="switch-input" data-id="checkHideProcess" value="" />
<span class="switch-slider"></span>
</label>
<span class="pull-left">Hide</span>
</div> </div>
<div class="depthContainer"> <div class="body">
<div> <div class="hideProcessContainer form-group text-left col-sm-12">
<span class="control-label-sm inline ">Depth :</span> <div class="pretty p-switch p-fill">
<div class="select inline" style="width: 80px;"> <input type="checkbox" class="pull-left" data-id="checkHideProcess" value="" />
<select data-id="selectDepth" class="form-control"></select> <div class="state p-primary">
<label>Hide Process</label>
</div>
</div>
</div> </div>
<div class="hideDeletedContainer form-group text-left col-sm-12">
<div class="pretty p-switch p-fill">
<input type="checkbox" data-id="checkDeletedEntity" value="" />
<div class="state p-primary">
<label>Hide Deleted Entity</label>
</div>
</div>
</div> </div>
<div class="depthContainer form-group select2-mini">
<label class="control-label col-sm-4">Depth:</label>
<div class="col-sm-4 no-padding">
<select data-id="selectDepth" class="form-control"></select>
</div>
</div>
</div>
</div>
<div class="graph-button-group">
<div>
<button type="button" data-id="fltr-togler" class="btn btn-action btn-gray btn-sm"><i class="fa fa-filter"></i></button>
</div> </div>
<div class="zoomButtonGroup pull-right"> <div class="zoom-button-group pull-right">
<span type="button" id="zoom_in" class="btn btn-atlas btn-md lineageZoomButton" title="Zoom In" data-id="refreshBtn"> <i class="fa fa-search-plus"></i></span> <span type="button" id="zoom_in" class="btn-md lineageZoomButton" title="Zoom In" data-id="refreshBtn"> <i class="fa fa-search-plus"></i></span>
<span type="button" id="zoom_out" class="btn btn-atlas btn-md lineageZoomButton" title="Zoom Out" data-id="refreshBtn"> <i class="fa fa-search-minus"></i></span> <span type="button" id="zoom_out" class="btn-md lineageZoomButton" title="Zoom Out" data-id="refreshBtn"> <i class="fa fa-search-minus"></i></span>
</div> </div>
</div> </div>
<div class="fontLoader"> <div class="fontLoader">
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
</div> </div>
<svg width="100%" height="calc(100% - 80px)" viewBox="0 0 854 330" enable-background="new 0 0 854 330" xml:space="preserve"></svg> <div class="legends" style="height: 25px; padding: 2px;">
<div class="legends" style="height: 20px"> <span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-circle-o fa-fw" aria-hidden="true"></i>Current Entity</span>
<i class="fa fa-long-arrow-right" aria-hidden="true" style="margin-right: 12px; color:#8bc152;">&nbsp<span>Lineage</span></i> <span style="margin-right: 8px; color:#df9b00;"><i class="fa fa-long-arrow-right fa-fw" aria-hidden="true"></i>Lineage</span>
<i class="fa fa-long-arrow-right" aria-hidden="true" style="color:#fb4200;">&nbsp<span>Impact</span></i> <span style="margin-right: 8px; color:#fb4200;"><i class="fa fa-long-arrow-right fa-fw" aria-hidden="true"></i>Impact</span>
</div> </div>
<svg width="100%" height="calc(100% - 28px)" viewBox="0 0 854 330" enable-background="new 0 0 854 330" xml:space="preserve"></svg>
</div> </div>
\ No newline at end of file
dashboardv2/public/js/templates/graph/RelationshipLayoutView_tmpl.html
...@@ -20,14 +20,17 @@ ...@@ -20,14 +20,17 @@
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
</div> </div>
<div style="position: absolute;height:100%;width:100%;"> <div style="position: absolute;height:100%;width:100%;">
<div class="graph-button-group">
<div class="zoom-button-group">
<span type="button" id="zoom_in" class="btn-md lineageZoomButton" title="Zoom In"> <i class="fa fa-search-plus"></i></span>
<span type="button" id="zoom_out" class="btn-md lineageZoomButton" title="Zoom Out"> <i class="fa fa-search-minus"></i></span>
</div>
</div>
<svg width="100%" height="100%" viewBox="0 0 854 330" enable-background="new 0 0 854 330" xml:space="preserve"></svg> <svg width="100%" height="100%" viewBox="0 0 854 330" enable-background="new 0 0 854 330" xml:space="preserve"></svg>
</div> </div>
<div class="zoomButtonGroup">
<span type="button" id="zoom_in" class="btn btn-action btn-md lineageZoomButton" title="Zoom In"> <i class="fa fa-search-plus"></i></span>
<span type="button" id="zoom_out" class="btn btn-action btn-md lineageZoomButton" title="Zoom Out"> <i class="fa fa-search-minus"></i></span>
</div>
<div class="relationship-details"> <div class="relationship-details">
<div data-id="close" class="close-details"><i class="fa fa-times"></i></div> <span data-id="close" style="margin: 7px;position: absolute;right: 0" class="btn btn-action btn-sm fltr-togler"><i class="fa fa-close"></i></span>
<!-- <div data-id="close" class="close-details"><i class="fa fa-times"></i></div> -->
<h4 class="title"><span data-id="typeName"></span></h4> <h4 class="title"><span data-id="typeName"></span></h4>
<div class="col-md-12"> <div class="col-md-12">
<input data-id="searchNode" class="form-control form-group" placeholder="Search Entities" /> <input data-id="searchNode" class="form-control form-group" placeholder="Search Entities" />
......
dashboardv2/public/js/utils/Globals.js
...@@ -36,5 +36,6 @@ define(['require'], function(require) { ...@@ -36,5 +36,6 @@ define(['require'], function(require) {
status: false, status: false,
response: {} response: {}
} }
Globals.entityImgPath = "/img/entity-icon/"
return Globals; return Globals;
}); });
\ No newline at end of file
dashboardv2/public/js/utils/Utils.js
...@@ -76,6 +76,49 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums', ...@@ -76,6 +76,49 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'utils/Enums',
Utils.getBaseUrl = function(url) { Utils.getBaseUrl = function(url) {
return url.replace(/\/[\w-]+.(jsp|html)|\/+$/ig, ''); return url.replace(/\/[\w-]+.(jsp|html)|\/+$/ig, '');
}; };
Utils.getEntityIconPath = function(options) {
var entityData = null,
serviceType = null,
status = null,
iconBasePath = Utils.getBaseUrl(window.location.pathname) + Globals.entityImgPath;
if (options) {
entityData = options.entityData;
serviceType = entityData && entityData.serviceType;
status = entityData && entityData.status;
}
if (entityData) {
if (options.errorUrl) {
var isErrorInDefaultServiceType = (serviceType && options.errorUrl && options.errorUrl.match("/" + serviceType + "/" + serviceType + ".png|/" + serviceType + "/disabled/" + serviceType + ".png") ? true : false);
if (serviceType && !isErrorInDefaultServiceType) {
var imageName = serviceType + ".png";
return iconBasePath + serviceType + (Enums.entityStateReadOnly[status] ? "/disabled/" + imageName : "/" + imageName);
} else {
if (entityData.isProcess) {
if (Enums.entityStateReadOnly[status]) {
return iconBasePath + 'default/disabled/process.png';
} else {
return iconBasePath + 'default/process.png';
}
} else {
if (Enums.entityStateReadOnly[status]) {
return iconBasePath + 'default/disabled/table.png';
} else {
return iconBasePath + 'default/table.png';
}
}
}
} else {
var imageName = entityData.typeName + ".png";
if (serviceType) {
return iconBasePath + serviceType + (Enums.entityStateReadOnly[status] ? "/disabled/" + imageName : "/" + imageName);
} else {
return iconBasePath + (Enums.entityStateReadOnly[status] ? "default/disabled/" + imageName : "default/" + imageName);
}
}
}
}
pnotify.prototype.options.styling = "fontawesome"; pnotify.prototype.options.styling = "fontawesome";
var notify = function(options) { var notify = function(options) {
return new pnotify(_.extend({ return new pnotify(_.extend({
......
dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js
...@@ -66,7 +66,8 @@ define(['require', ...@@ -66,7 +66,8 @@ define(['require',
termList: '[data-id="termList"]', termList: '[data-id="termList"]',
propagatedTagList: '[data-id="propagatedTagList"]', propagatedTagList: '[data-id="propagatedTagList"]',
fullscreenPanel: "#fullscreen_panel", fullscreenPanel: "#fullscreen_panel",
tablist: '[data-id="tab-list"] li' tablist: '[data-id="tab-list"] li',
entityIcon: '[data-id="entityIcon"]'
}, },
templateHelpers: function() { templateHelpers: function() {
return { return {
...@@ -126,6 +127,7 @@ define(['require', ...@@ -126,6 +127,7 @@ define(['require',
this.listenTo(this.collection, 'reset', function() { this.listenTo(this.collection, 'reset', function() {
this.entityObject = this.collection.first().toJSON(); this.entityObject = this.collection.first().toJSON();
var collectionJSON = this.entityObject.entity; var collectionJSON = this.entityObject.entity;
this.activeEntityDef = this.entityDefCollection.fullCollection.find({ name: collectionJSON.typeName });
if (collectionJSON && _.startsWith(collectionJSON.typeName, "AtlasGlossary")) { if (collectionJSON && _.startsWith(collectionJSON.typeName, "AtlasGlossary")) {
this.$(".termBox").hide(); this.$(".termBox").hide();
...@@ -161,6 +163,15 @@ define(['require', ...@@ -161,6 +163,15 @@ define(['require',
titleName += '<button title="Deleted" class="btn btn-action btn-md deleteBtn"><i class="fa fa-trash"></i> Deleted</button>'; titleName += '<button title="Deleted" class="btn btn-action btn-md deleteBtn"><i class="fa fa-trash"></i> Deleted</button>';
} }
this.ui.title.html(titleName); this.ui.title.html(titleName);
var entityData = _.extend({ serviceType: this.activeEntityDef && this.activeEntityDef.get('serviceType') }, collectionJSON);
if (this.readOnly) {
this.ui.entityIcon.addClass('disabled');
} else {
this.ui.entityIcon.removeClass('disabled');
}
this.ui.entityIcon.attr('title', _.escape(collectionJSON.typeName)).html('<img src="' + Utils.getEntityIconPath({ entityData: entityData }) + '"/>').find("img").on('error', function() {
this.src = Utils.getEntityIconPath({ entityData: entityData, errorUrl: this.src });
});
} else { } else {
this.ui.title.hide(); this.ui.title.hide();
} }
...@@ -194,7 +205,6 @@ define(['require', ...@@ -194,7 +205,6 @@ define(['require',
} }
} }
this.hideLoader(); this.hideLoader();
this.activeEntityDef = this.entityDefCollection.fullCollection.find({ name: collectionJSON.typeName });
var obj = { var obj = {
entity: collectionJSON, entity: collectionJSON,
guid: this.id, guid: this.id,
...@@ -252,9 +262,13 @@ define(['require', ...@@ -252,9 +262,13 @@ define(['require',
} }
var containsList = Utils.getNestedSuperTypes({ data: this.activeEntityDef.toJSON(), collection: this.entityDefCollection }), var processCheck = false,
containsList = Utils.getNestedSuperTypes({ data: this.activeEntityDef.toJSON(), collection: this.entityDefCollection }),
superType = _.find(containsList, function(type) { superType = _.find(containsList, function(type) {
if (type === "DataSet" || type === "Process") { if (type === "DataSet" || type === "Process") {
if (type === "Process") {
processCheck = true;
}
return true; return true;
} }
}); });
...@@ -262,6 +276,7 @@ define(['require', ...@@ -262,6 +276,7 @@ define(['require',
if (superType) { if (superType) {
this.$('.lineageGraph').show(); this.$('.lineageGraph').show();
this.renderLineageLayoutView({ this.renderLineageLayoutView({
processCheck: processCheck,
guid: this.id, guid: this.id,
entityDefCollection: this.entityDefCollection, entityDefCollection: this.entityDefCollection,
fetchCollection: this.fetchCollection.bind(this), fetchCollection: this.fetchCollection.bind(this),
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment