WebCompDev / COMPONENTS

Commit 6f8e74f79abe5b4fb677e0972dfef9cf99288485

Authored by Luigi Serra
1 parent 7383b38e

card update

Inline Side-by-side
Showing 2 changed files with 43 additions and 24 deletions
controllets/data-sevc-controllet/data-sevc-controllet.html
  View file @6f8e74f
... ... @@ -64,8 +64,8 @@ is available every time a fields is dragged in the input data model fields area.
64 64  
65 65 Example:
66 66  
67   - <data-sevc-controllet deep-url="http://192.168.214.128/DatalEts-Ecosystem-Provider/DEEP/"
68   - datalets-list-url="http://192.168.214.128/DatalEts-Ecosystem-Provider/DEEP/datalets-list"
  67 + <data-sevc-controllet deep-url="http://192.168.36.128/DatalEts-Ecosystem-Provider/DEEP/"
  68 + datalets-list-url="http://192.168.36.128/DatalEts-Ecosystem-Provider/DEEP/datalets-list"
69 69 datasets='{[{name : 'dataset1', url : dataset1Urls}, ... , {name : 'datasetN', url : datasetNUrls}]'>
70 70 </data-sevc-controllet>
71 71  
... ...
controllets/paper-card-controllet/paper-card-controllet.html
  View file @6f8e74f
... ... @@ -17,6 +17,7 @@
17 17 line-height: 10px;
18 18 --paper-fab-background: var(--accent-color);
19 19 font-family: 'Roboto', sans-serif;
  20 + padding-bottom: 30px;
20 21 }
21 22  
22 23 paper-material {
... ... @@ -69,6 +70,7 @@
69 70 #text{
70 71 position:relative;
71 72 top: -50px;
  73 + min-height: 50px;
72 74 height: auto;
73 75 padding: 8px 8px 8px 8px;
74 76 font-size: 10px;
... ... @@ -85,43 +87,44 @@
85 87 <content></content>
86 88 </div>
87 89  
88   - <div class="footer">
  90 + <template is="dom-if" if="{{legend}}">
89 91  
90   - <template is="dom-if" if="{{legend}}">
  92 + <div class="legend horizontal layout center">
  93 + <span>{{legend}}</span>
  94 + <!-- Adding icon based on card type -->
91 95  
92   - <div class="legend horizontal layout center">
93   - <span>{{legend}}</span>
94   - <!-- Adding icon based on card type -->
  96 + <template is="dom-if" if="{{checkType(type, 'text')}}">
95 97  
96   - <template is="dom-if" if="{{checkType(type, 'text')}}">
  98 + <paper-fab mini icon="create"></paper-fab>
97 99  
98   - <paper-fab mini icon="create"></paper-fab>
  100 + </template>
99 101  
100   - </template>
  102 + <template is="dom-if" if="{{checkType(type, 'image')}}">
101 103  
102   - <template is="dom-if" if="{{checkType(type, 'image')}}">
  104 + <paper-fab mini icon="perm-media"></paper-fab>
103 105  
104   - <paper-fab mini icon="perm-media"></paper-fab>
  106 + </template>
105 107  
106   - </template>
  108 + <template is="dom-if" if="{{checkType(type, 'datalet')}}">
107 109  
108   - <template is="dom-if" if="{{checkType(type, 'datalet')}}">
  110 + <paper-fab mini icon="assessment"></paper-fab>
109 111  
110   - <paper-fab mini icon="assessment"></paper-fab>
  112 + </template>
111 113  
112   - </template>
  114 + <template is="dom-if" if="{{checkType(type, 'link')}}">
113 115  
114   - <template is="dom-if" if="{{checkType(type, 'link')}}">
  116 + <paper-fab mini icon="link"></paper-fab>
115 117  
116   - <paper-fab mini icon="link"></paper-fab>
  118 + </template>
117 119  
118   - </template>
  120 + </div>
119 121  
120   - </div>
  122 + </template>
121 123  
  124 + <div class="footer">
  125 + <template is="dom-if" if="{{text}}">
  126 + <div id="text">{{text}}</div>
122 127 </template>
123   -
124   - <div id="text">{{text}}</div>
125 128 </div>
126 129  
127 130 </div>
... ... @@ -146,6 +149,21 @@
146 149 type:{
147 150 type: String,
148 151 value: "text"
  152 + },
  153 + text:{
  154 + type: String,
  155 + value: ""
  156 + },
  157 + legend:{
  158 + type: String,
  159 + value: ""
  160 + }
  161 +
  162 + },
  163 +
  164 + ready: function(){
  165 + if(this.type == "text"){
  166 + this.$.content.style.backgroundColor = "#ffc";
149 167 }
150 168 },
151 169  
... ... @@ -156,9 +174,10 @@
156 174 },
157 175  
158 176 _changeHeight: function(data){
159   - this.style.height = (data + 20) + "px";
  177 + this.style.height = (data) + "px";
160 178 this.$.content.style.height = data + "px";
161   - //$(this.$.content).perfectScrollbar();
  179 + this.style.height = (this.height + ((this.text != "") ? 50 : 0)) + "px";
  180 + $(this.$.content).perfectScrollbar();
162 181 },
163 182  
164 183 checkType: function(type, check){
... ...