summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html
blob: e05574e8c8b1b15e8f00387962e8a4b693869b4b (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
<div class="workspace-composition">
    <loader data-display="isLoading"></loader>
    <div class="w-sdc-designer-canvas" data-ng-class="{sidebaractive: displayDesignerRightSidebar}">
        <palette current-component="currentComponent"
                 is-view-only="isViewOnly"
                 is-loading="isLoading"></palette>

        <composition-graph component="currentComponent" data-tests-id="canvas"
                           is-view-only="isViewOnly" with-sidebar="displayDesignerRightSidebar"></composition-graph>
    </div>

    <div class="w-sdc-designer-sidebar-toggle" data-ng-class="{'active': displayDesignerRightSidebar}"
         data-ng-init="displayDesignerRightSidebar = true"
         data-ng-click="displayDesignerRightSidebar = !displayDesignerRightSidebar">
        <div class="w-sdc-designer-sidebar-toggle-icon sprite-new pointer menu-open-left"></div>
    </div>

    <div class="w-sdc-designer-sidebar" data-ng-class="{'view-mode':isViewOnly}">

        <div class="w-sdc-designer-sidebar-head" data-tests-id="w-sdc-designer-sidebar-head">
            <div class="w-sdc-designer-sidebar-logo-ph">
                <div class="large {{selectedComponent.iconSprite}} {{selectedComponent.icon}}">
                    <div ng-if="isComponentInstanceSelected()"
                         data-ng-class="{'non-certified':'CERTIFIED' !== selectedComponent.lifecycleState}"
                         tooltips tooltip-side="top" tooltip-content="Not certified"></div>
                </div>
            </div>

            <div class="w-sdc-designer-sidebar-logo">
              <span class="w-sdc-designer-sidebar-logo-title" data-tests-id="selectedCompTitle" tooltips
                    tooltip-class="tooltip-custom break-word-tooltip"
                    tooltip-content="&#8203;{{isComponentInstanceSelected() ? currentComponent.selectedInstance.name : currentComponent.name | resourceName}}"
                    data-ng-bind="isComponentInstanceSelected() ? currentComponent.selectedInstance.name : currentComponent.name | resourceName"></span>
            </div>
            <div class="sprite e-sdc-small-icon-pencil w-sdc-designer-update-resource-icon"
                 data-ng-if="!isViewOnly && isComponentInstanceSelected()"
                 data-ng-click="openUpdateModal()" id="editPencil"></div>

            <div class="sprite e-sdc-small-icon-delete w-sdc-designer-delete-resource-icon"
                 data-tests-id="e-sdc-small-icon-delete"
                 data-ng-if="!isViewOnly && isComponentInstanceSelected()"
                 data-ng-click="!isLoading && deleteSelectedComponentInstance()" title="Delete Resource Instance"></div>
        </div>

        <div class="w-sdc-designer-sidebar-tabs">
            <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
                    data-ui-sref="workspace.composition.details"
                    tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Information"
                    data-tests-id="information-tab">
                <div class="i-sdc-designer-sidebar-tab-icon sprite-new info"></div>
            </button>
            <!--<button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"-->
                    <!--ui-sref="workspace.composition.structure"-->
                    <!--tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Composition">-->
                <!--<div class="i-sdc-designer-sidebar-tab-icon sprite-new structure"></div>-->
            <!--</button>-->
            <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
                    data-ui-sref="workspace.composition.deployment"
                    tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Deployment Artifacts"
                    data-tests-id="deployment-artifact-tab"
                    data-ng-if="!isPNF()">
                <div class="i-sdc-designer-sidebar-tab-icon sprite-new deployment-artifacts"></div>
            </button>
            <button tooltips tooltip-class="tooltip-custom tab-tooltip"
                    tooltip-content="{{selectedComponent.isResource() ? 'Properties and Attributes': 'Inputs'}}"
                    class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
                    data-ui-sref="workspace.composition.properties"
                    data-tests-id="properties-and-attributes-tab">
                <div class="i-sdc-designer-sidebar-tab-icon sprite-new"
                     ng-class="selectedComponent.isResource() ? 'properties': 'inputs'"></div>
            </button>
            <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
                    data-ui-sref="workspace.composition.artifacts"
                    tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Information Artifacts">
                <div class="i-sdc-designer-sidebar-tab-icon sprite-new information-artifacts"></div>
            </button>
            <button data-ng-show="!selectedComponent.isService()" class="i-sdc-designer-sidebar-tab"
                    data-ui-sref-active="active" ui-sref="workspace.composition.relations"
                    tooltips tooltip-class="tooltip-custom tab-tooltip  tooltip-rightside"
                    tooltip-content="Requirements and Capabilities">
                <div class="i-sdc-designer-sidebar-tab-icon sprite-new relations"></div>
            </button>
            <button data-ng-show="selectedComponent.isService()" class="i-sdc-designer-sidebar-tab"
                    data-ui-sref-active="active" ui-sref="workspace.composition.api" data-tests-id="tab-api"
                    tooltips tooltip-class="tooltip-custom tab-tooltip tooltip-rightside" tooltip-content="API">
                <div class="i-sdc-designer-sidebar-tab-icon sprite-new api"></div>
            </button>

        </div>

        <div data-ui-view="" class="w-sdc-designer-sidebar-tab-content-view"></div>

        <loader data-display="isLoadingRightPanel" relative="true" size="medium"></loader>

    </div>
</div>