diff --git a/src/app/app.component.css b/src/app/app.component.css index 47f247e..b16f453 100644 --- a/src/app/app.component.css +++ b/src/app/app.component.css @@ -3,6 +3,6 @@ map-box {margin:0;} div.title {font-size:1em;text-align:left;padding:10px;position:absolute;bottom:0;left:0;width:30vw;background-color:rgba(0,0,0,0);color:#fff;} div.title h1 {font-family:"Open Sans";font-size:4em;} -div.title h1 span {background:#d52b1e;padding:5px;} +div.title h1 span {background:#d52b1e;padding:0 10px;} div.title h2 span {background:#fff;padding:2px;color:#000;} div.title p span {line-height:1.4;background:#021011;} diff --git a/src/app/app.component.ts b/src/app/app.component.ts index a7b4426..02fe28a 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -23,6 +23,7 @@ export class AppComponent { this.wordpressService.getPage(slug) .subscribe(data=> { this.pages = data; + console.log(data) }) }) } diff --git a/src/app/map-box/map-box.component.ts b/src/app/map-box/map-box.component.ts index c50925b..06d8625 100644 --- a/src/app/map-box/map-box.component.ts +++ b/src/app/map-box/map-box.component.ts @@ -72,7 +72,6 @@ export class MapBoxComponent implements OnInit { this.hoveredStateId = e.features[0].id; this.map.setFeatureState({source: 'ticino', id: this.hoveredStateId}, { hover: true}); - console.log(this.hoveredStateId); } }) @@ -90,7 +89,6 @@ export class MapBoxComponent implements OnInit { this.wordpressService.getMarker(slug) .subscribe(data => { data.map(page => { - console.log(page) this.mService.addMessage(page); }) }) @@ -112,18 +110,28 @@ export class MapBoxComponent implements OnInit { type: "symbol", source: "ticino", layout: { - // 'icon-size': 1, - // 'icon-image': "sound-marker", - // 'icon-allow-overlap': true, + 'icon-size': 1, + 'icon-image': "sound-marker", + 'icon-allow-overlap': true, "text-field": "{title}", 'text-allow-overlap': true, 'text-size':18, - 'text-offset':[0,0], + 'text-offset':[0,-1.5], 'text-transform':'lowercase', }, paint: { // 'text-halo-color':"#d52b1e", - 'text-halo-width':20, + // 'text-halo-width':20, + 'text-halo-width': ["case", + ["boolean", ["feature-state", "hover"], false], + 20, + 0 + ], + 'text-opacity': ["case", + ["boolean", ["feature-state", "hover"], false], + 1, + 0 + ], 'text-color':"#fff", 'text-halo-color':["case", ["boolean", ["feature-state", "hover"], false], @@ -157,7 +165,7 @@ export class MapBoxComponent implements OnInit { ); this.featurecollection = fc; this.source.setData(fc) - console.log(this.source) + console.log(fc); }); } diff --git a/src/app/page.ts b/src/app/page.ts index 95ab90a..d09eecc 100644 --- a/src/app/page.ts +++ b/src/app/page.ts @@ -19,5 +19,6 @@ export class PageItem { }, public pdf?:any, public georeference?:number[], + public author? : string, ) {} } diff --git a/src/app/text-info/text-info.component.css b/src/app/text-info/text-info.component.css index 24e06e9..e69de29 100644 --- a/src/app/text-info/text-info.component.css +++ b/src/app/text-info/text-info.component.css @@ -1,10 +0,0 @@ -div.modal {display:block;position:absolute;top:0;left:0;width:100vw;height:100vh;width:100%;height:100%; background-color:rgba(255,255,255,0.8);overflow-y:scroll;} -div.content { background:#fff;border:1px solid #eee;padding:10px;border-radius:1px; position:relative; width:80vw;min-height:50vh;margin:auto;margin-top:10vh;margin-bottom:10vh;} -div.content div.tags-container, -div.content div.categories-container, -div.content div.content-container {width:100%;clear:both;position:relative;padding:10px 0px;} -div.content ul {list-style:none;width:100%;clear:both;} -div.content ul.categories li, -div.content ul.tags li {float:left;padding:5px;margin:2px;background-color:#d52b1e;color:#fff;} -div.content div.audio-box audio {margin-top:10px;margin-bottom:10px;} -div.close-button {position:absolute;right:0;top:0;z-index:100;padding:10px;} diff --git a/src/app/text-info/text-info.component.html b/src/app/text-info/text-info.component.html index 8f3debb..15565f5 100644 --- a/src/app/text-info/text-info.component.html +++ b/src/app/text-info/text-info.component.html @@ -1,27 +1,43 @@
-
-
[X]
-

-

{{ page.date | date }}

-
- Categories -
  • {{cat.name}}
+
+
+ + + + + +
-
- Tags -
  • {{cat.name}}
+
+

+
-
-
- - Metadata [+] -
    -
  • Title: {{m.title}}
    • -
  • Author: {{m.meta.artist}}
    • -
  • Album: {{m.meta.album}}
    • -
  • Bitrate: {{m.meta.bitrate}}
    • -
  • Original filename: {{m.filename}}
    • -
+
+
+ Date:

{{ page.date | date }}

+
+
+ Author:

+
+
+ Categories +
  • {{cat.name}}
+
+
+ Tags +
  • {{cat.name}}
+
+
+ +
Metadata ↓↑
+
    +
  • Title: {{m.title}}
    • +
  • Author: {{m.meta.artist}}
    • +
  • Album: {{m.meta.album}}
    • +
  • Bitrate: {{m.meta.bitrate}}
    • +
  • Original filename: {{m.filename}}
    • +
+
diff --git a/src/assets/sound-marker.svg b/src/assets/sound-marker.svg index 1502da9..d1a2f0f 100644 --- a/src/assets/sound-marker.svg +++ b/src/assets/sound-marker.svg @@ -12,15 +12,25 @@ version="1.1" x="0px" y="0px" - viewBox="0 0 50 68.17596" + viewBox="0 0 37.795277 37.795278" enable-background="new 0 0 1000 1000" xml:space="preserve" id="svg5045" sodipodi:docname="sound-marker.svg" inkscape:version="0.92.1 r15371" - width="50" - height="68.175957"> Svg Vector Icons : http://www.onlinewebfonts.com/icon image/svg+xml \ No newline at end of file + d="m 17.803388,3.8510121 c -27.0931969,3.4447841 4.183855,32.9059859 4.183855,32.9059859 0,0 22.90934,-36.35076996 -4.183855,-32.9059859 z m 0.39933,3.1407308 A 8.2838955,8.2838955 0 0 1 27.4655,14.163908 8.2838955,8.2838955 0 0 1 20.292367,23.426814 8.2838955,8.2838955 0 0 1 11.029462,16.25368 8.2838955,8.2838955 0 0 1 18.202718,6.9917429 Z" + style="fill:#d52b1e;fill-opacity:1;stroke:#000000;stroke-width:0.71323878;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.14009663" + inkscape:connector-curvature="0" /> \ No newline at end of file diff --git a/src/index.html b/src/index.html index 428d3a4..4613ac6 100644 --- a/src/index.html +++ b/src/index.html @@ -2,7 +2,7 @@ - ChiassoSoundmap + Ticino Soundmap @@ -11,5 +11,8 @@ + diff --git a/src/styles.css b/src/styles.css index 92dedca..7e35147 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,2 +1,26 @@ /* You can add global styles to this file, and also import other style files */ -body {padding:0;font-size:12pt;overflow:hidden;} + @import url('https://fonts.googleapis.com/css?family=Oswald|Raleway'); + +body {padding:0;font-size:12pt;overflow:hidden;font-family:'Raleway',sans-serif;} +h1,h2,h3,h4,h5,h6 {font-family:'Oswald';} +div.modal {display:block;position:absolute;top:0;left:0;width:100vw;height:100vh;width:100%;height:100%; background-color:rgba(255,255,255,0.8);overflow-y:scroll;} +div.content { position:relative;display:block;height:100%;overflow:auto;font-size:1em;background:#fff;border:1px solid #eee;padding:30px;border-radius:1px; position:relative; width:80vw;min-height:50vh;margin:auto;margin-top:10vh;margin-bottom:10vh;} +div.col-left-70 {position:relative;float:right;width:66%;padding-left:1%;padding-right:1%;} +div.col-right-30 {border-right:1px solid #ccc;position:relative;float:right;width:28%;padding-left:1%;padding-right:1%;} +div.content h1 span {background-color:#d52b1e;color:#fff;font-size:3em;padding:0 20px;} +div.content h1,h2,h3,h4,h5 {font-size:1em;color:#d52b1e;} +div.content div.content-col > * {margin:0 20px;height:100%;display:block;} +div.content div.col-right-30 > * {margin-bottom:20px;} +div.content div.tags-container, +div.content div.categories-container, +div.content div.content-container {width:100%;clear:both;position:relative;padding:10px 0px;} +div.content div.content-container h2 {font-size:1em;color:#d52b1e;margin-left:5px;} +div.content-container img {max-width:100%;} +div.content-container p code {background:#efefef;padding:1px;} +div.content-container figcaption {background-color:#efefef;padding:10px;font-size:0.8em;} +div.content ul {list-style:none;max-width:100%;clear:both;padding:0;height:100%;} +div.content ul.categories li, +div.content ul.tags li {float:left;padding:5px;margin:2px;background-color:#d52b1e;color:#fff;} +div.content div.audio-box audio {margin-top:10px;margin-bottom:10px;} +div.close-button {cursor:pointer;position:absolute;right:0;top:0;z-index:100;padding:10px;} +div close-button:hover {background:#eee;}