Changes added to solve issues #53, #59, #61, #63 and #64

src/app/api/model/app-cfg.ts

@@ -45,6 +45,7 @@ export interface AppApplication {
 export interface AppBackground {
   id: string;
   title: string;
+  thumbnail: string;
 }
 export interface AppGroup {
   id?: string;

src/app/ui/util/sitna-helpers.ts

@@ -66,13 +66,22 @@ export class SitnaHelper {
   }
 
   static toBaseLayers(apiConfig: AppCfg): SitnaBaseLayer[] {
+    /**
+     * WARNING
+     * Thumbnails coming from backgorunds, but backgrounds may contain more than one layer.
+     * This has to be rethought from the admin, once done, the code marked with 'TODO-redo' must be reviewed.     * 
+     */
     let baseLayers: SitnaBaseLayer[] = [];
     if (apiConfig.backgrounds.length) {
       let backgrounds: string[] = [];
       let groups: AppGroup[] = [];
       let layers: string[] = [];
+      let thumbnail: string = ""; // TODO-redo
       for (let background of apiConfig.backgrounds) {
         backgrounds.push(background.id);
+        if(typeof background.thumbnail!='undefined' && background.thumbnail) { // TODO-redo
+          thumbnail = background.thumbnail;
+        }
       }
       for (let background of backgrounds) {
         const group = apiConfig.groups.find((elem) => elem.id === background);
@@ -102,7 +111,8 @@ export class SitnaHelper {
               layerNames: layer.layers,
               matrixSet: service.parameters.matrixSet,
               format: service.parameters.format,
-              isBase: true
+              isBase: true,
+              thumbnail: thumbnail // TODO-redo
             };
             if (service.type == 'WMTS') {
               a.layerNames = layer.layers[0];

src/assets/map-styles/sitmun-base/style/colors.css

@@ -16,7 +16,7 @@
     background-color: #ffffff;
 }
 
-.tc-ctl-wlm-metadata a:hover, .tc-ctl-wlm-descarregadades a:hover, .tc-ctl-lcat-metadata a:hover, .tc-ctl-lcat-descarregadades a:hover, .tc-ctl.tc-ctl-nav-home:hover {
+.tc-ctl-wlm-metadata a:hover, .tc-ctl-wlm-descarregadades a:hover, .tc-ctl-lcat-metadata a:hover, .tc-ctl-lcat-descarregadades a:hover, .tc-ctl.tc-ctl-nav-home:hover, .tc-ctl-lcat-tree ul input[type="checkbox"].tc-ctl-lcat-btn-info.tc-checked, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:checked {
     background-color: #000000;
 }
 
@@ -263,10 +263,9 @@ li.tc-ctl-lcat-search-group button.tc-ctl-lcat-search-btn-info.tc-checked::after
     color: #af0000;
 }
 
-li.tc-ctl-lcat-node > button.tc-ctl-lcat-btn-info:hover, .tc-ctl-lcat-tree ul input[type="checkbox"].tc-ctl-lcat-btn-info:hover,
-.tc-ctl-wlm-btn-info:hover, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:hover,
-.tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:checked,
-.tc-ctl-lcat-tree ul input[type="checkbox"].tc-ctl-lcat-btn-info.tc-checked {
+/* .tc-ctl-lcat-tree ul input[type="checkbox"].tc-ctl-lcat-btn-info:hover, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:hover NOT USING ANYMORE */
+li.tc-ctl-lcat-node > button.tc-ctl-lcat-btn-info:hover, 
+.tc-ctl-wlm-btn-info:hover {
     background-color: #660000;
 }
 

src/assets/map-styles/sitmun-base/style/main_style.css

@@ -257,7 +257,7 @@ button.tc-ctl-fscreen-btn {
     background-position: center center;
     background-repeat: no-repeat;
     background-size: 40px 40px;
-    background-image: url(../img/mapaCerrar.png);
+    background-image: url(../img/mapaCerrarReverse.png);
     background-color: rgba(0, 0, 0, 1);
 }
 
@@ -1215,22 +1215,28 @@ li.tc-ctl-lcat-node > button.tc-ctl-lcat-btn-info {
 }
 
 .tc-ctl-lcat li.tc-ctl-lcat-node > input[type="checkbox"].tc-ctl-lcat-btn-info, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info {
-    border-radius: 100%;
+    border-radius: 0.15rem;
     top: 0.5em;
-    background-color: #666;
+    background-color: #cccccc;
     width: 1em;
     height: 1em;
+    transition: background-color 0.3s ease;
 }
 
 .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info {
     top: 0.2em
 }
 
-    .tc-ctl-lcat-tree ul input[type="checkbox"].tc-ctl-lcat-btn-info:before, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:before {
-        color: white;
-        font-size: 0.6em;
-        line-height: 1.7em;
-    }
+.tc-ctl-lcat-tree ul input[type="checkbox"].tc-ctl-lcat-btn-info:before, 
+.tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:before {
+    color: black;
+    font-size: 0.6em;
+    line-height: 1.7em;
+}
+
+.tc-ctl-lcat-tree ul input[type="checkbox"].tc-ctl-lcat-btn-info.tc-checked:before, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info.tc-checked:before, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:checked, .tc-ctl-lcat-search ul input[type="checkbox"].tc-ctl-lcat-search-btn-info:checked:before {
+    color: white;
+}
 
 .tc-ctl-lcat h2 button.tc-ctl-lcat-btn-tree {
     margin-left: 10px;
@@ -2968,3 +2974,15 @@ i.fa-list-alt.fa, i.fa-area-chart.fa {
 #arbol li.sitmun-folder span {
   cursor: pointer;
 }
+
+.tc-ctl-fscreenToMap.tc-ctl-sv-active.tc-collapsed, .tc-ctl-fscreenToMap.tc-ctl-be-active.tc-collapsed {
+    top: unset !important;
+    bottom: 15px !important;
+    height: 25vh !important;
+}
+
+body:fullscreen > .tc-map.tc-ctl-sv-active.tc-collapsed, body:fullscreen > .tc-map.tc-ctl-be-active.tc-collapsed {
+    top: unset;
+    bottom: 15px;
+    height: 25vh;
+}