adiwg-mdtranslator 2.18.2 → 2.18.4

data/lib/adiwg/mdtranslator/writers/simple_html/sections/html_body.rb

@@ -0,0 +1,324 @@
+# HTML writer
+# html body
+
+# History:
+#  Stan Smith 2018-01-19 add resource citation title to report header
+#  Stan Smith 2017-03-22 refactor for mdTranslator 2.0
+#  Stan Smith 2015-07-20 moved mdTranslator logo to html_inlineCss.css
+#  Stan Smith 2015-07-16 refactored to remove global namespace $HtmlNS
+#  Stan Smith 2014-04-10 add open and close buttons
+#  Stan Smith 2015-03-23 original script
+
+require_relative 'html_contact'
+require_relative 'html_metadataInfo'
+require_relative 'html_resourceInfo'
+require_relative 'html_dataQuality'
+require_relative 'html_lineage'
+require_relative 'html_distribution'
+require_relative 'html_associatedResource'
+require_relative 'html_additionalDocumentation'
+require_relative 'html_funding'
+require_relative 'html_dataDictionary'
+require_relative 'html_metadataRepository'
+
+module ADIWG
+   module Mdtranslator
+      module Writers
+         module Simple_html
+
+            class Html_Body
+
+               def initialize(html)
+                  @html = html
+               end
+
+               def writeHtml(version, intObj)
+                  @html.body do
+
+                     # classes used
+                     metaInfoClass = Html_MetadataInfo.new(@html)
+                     contactClass = Html_Contact.new(@html)
+                     resourceClass = Html_ResourceInfo.new(@html)
+                     dataQualityClass = Html_DataQuality.new(@html)
+                     lineageClass = Html_Lineage.new(@html)
+                     distributionClass = Html_Distribution.new(@html)
+                     associatedClass = Html_AssociatedResource.new(@html)
+                     additionalClass = Html_AdditionalDocumentation.new(@html)
+                     fundingClass = Html_Funding.new(@html)
+                     dictionaryClass = Html_DataDictionary.new(@html)
+                     repositoryClass = Html_Repository.new(@html)
+
+                     # make sections of the internal data store convenient
+                     hSchema = intObj[:schema]
+                     aContacts = intObj[:contacts]
+                     hMetaInfo = intObj[:metadata][:metadataInfo]
+                     hResourceInfo = intObj[:metadata][:resourceInfo]
+                     aDataQuality = intObj[:metadata][:dataQuality]
+                     aLineage = intObj[:metadata][:lineageInfo]
+                     aDistribution = intObj[:metadata][:distributorInfo]
+                     aAssociated = intObj[:metadata][:associatedResources]
+                     aAdditional = intObj[:metadata][:additionalDocuments]
+                     aFunding = intObj[:metadata][:funding]
+                     aDictionaries = intObj[:dataDictionaries]
+                     aRepositories = intObj[:metadataRepositories]
+
+                     # set page title and logo
+                     # side navigation
+                     @html.div('id' => 'sideNav') do
+
+                        # add section buttons
+                        @html.a(' Top', {'href' => '#', 'class' => 'btn'})
+                        @html.a(' Contacts', {'href' => '#body-contacts', 'class' => 'btn navBtn', 'id' => 'contactButton'})
+                        @html.a(' Metadata', {'href' => '#body-metadataInfo', 'class' => 'btn navBtn', 'id' => 'metadataButton'})
+                        @html.a(' Resource', {'href' => '#body-resourceInfo', 'class' => 'btn navBtn', 'id' => 'resourceButton'})
+                        @html.a(' Lineage', {'href' => '#body-lineage', 'class' => 'btn navBtn', 'id' => 'lineageButton'})
+                        @html.a(' Distribution', {'href' => '#body-distribution', 'class' => 'btn navBtn', 'id' => 'distributionButton'})
+                        @html.a(' Associated', {'href' => '#body-associatedResource', 'class' => 'btn navBtn', 'id' => 'associatedButton'})
+                        @html.a(' Additional', {'href' => '#body-additionalDocument', 'class' => 'btn navBtn', 'id' => 'additionalButton'})
+                        @html.a(' Dictionary', {'href' => '#body-dataDictionary', 'class' => 'btn navBtn', 'id' => 'dictionaryButton'})
+                        @html.a(' Funding', {'href' => '#body-funding', 'class' => 'btn navBtn', 'id' => 'fundingButton'})
+                        @html.a(' Repository', {'href' => '#body-repository', 'class' => 'btn navBtn', 'id' => 'repositoryButton'})
+
+                        # add open and close buttons
+                        @html.span(' Open', {'class' => 'btn icon-caret-down', 'id' => 'openAllButton'})
+                        @html.span(' Close', {'class' => 'btn icon-caret-right', 'id' => 'closeAllButton'})
+
+                     end
+
+                     # main header
+                     @html.h2('id' => 'mainHeader') do
+                        # added blank to span tag to force builder to create closing tag
+                        @html.span('', 'id' => 'logo')
+                        @html.span('Metadata Record')
+                        @html.span('HTML5', 'class' => 'version')
+                     end
+
+                     # report title
+                     # aShortVersion = version.split('.')
+                     # shortVersion = aShortVersion[0].to_s + '.' + aShortVersion[1].to_s
+                     @html.h1('mdTranslator ' + version + ' HTML Metadata Record', 'id' => 'mdtranslator-metadata-report')
+
+                     # resource citation title
+                     unless hResourceInfo.empty?
+                        unless hResourceInfo[:citation].empty?
+                           unless hResourceInfo[:citation][:title].nil?
+                              @html.h2(hResourceInfo[:citation][:title])
+                           end
+                        end
+                     end
+
+                     # report date
+                     @html.div(:class => 'block') do
+                        @html.em('Report Generated:')
+                        @html.text!(Time.new.inspect)
+                     end
+
+                     # metadata source
+                     @html.h3('Metadata Source', 'id' => 'metadataSource')
+                     @html.div(:class => 'block') do
+                        @html.em('Metadata schema:')
+                        @html.text!(hSchema[:name])
+                        @html.br
+
+                        @html.em('Schema version:')
+                        @html.text!(hSchema[:version])
+                     end
+                     @html.hr
+
+                     # contacts [] section
+                     unless aContacts.empty?
+                        @html.div do
+                           @html.h2('Contacts', {'id' => 'body-contacts', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aContacts.each do |hContact|
+                                 @html.div(:class => 'block') do
+                                    contactClass.writeHtml(hContact)
+                                 end
+                              end
+                              @html.hr
+                           end
+                        end
+                     end
+
+                     # metadata information section
+                     unless hMetaInfo.empty?
+                        @html.div do
+                        @html.h2('Metadata Information', {'id' => 'body-metadataInfo', 'class' => 'h2'})
+                        @html.div(:class => 'block') do
+                              @html.div(:class => 'block') do
+                                 metaInfoClass.writeHtml(hMetaInfo)
+                              end
+                           end
+                           @html.hr
+                        end
+                     end
+
+                     # resource information section
+                     unless hResourceInfo.empty?
+                        @html.div do
+                           @html.h2('Resource Information', {'id' => 'body-resourceInfo', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              resourceClass.writeHtml(hResourceInfo)
+                           end
+                           @html.hr
+                        end
+                     end
+
+                     unless aDataQuality.nil? || aDataQuality.empty?
+                        @html.div do
+                           @html.h2('Data Quality', {'id' => 'body-dataQuality', 'class' => 'h2'})
+                           aDataQuality.each do |hDataQuality|
+                              @html.div(:class => 'block') do
+                                 dataQualityClass.writeHtml(hDataQuality)
+                              end
+                           end
+                        end
+                     end
+
+                     # lineage section
+                     unless aLineage.empty?
+                        @html.div do
+                           @html.h2('Resource Lineage', {'id' => 'body-lineage', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aLineage.each do |hLineage|
+                                 @html.div do
+                                    @html.h3('Lineage', {'class' => 'h3'})
+                                    @html.div(:class => 'block') do
+                                       lineageClass.writeHtml(hLineage)
+                                    end
+                                 end
+                              end
+                           end
+                           @html.hr
+                        end
+                     end
+
+                     # distribution section
+                     unless aDistribution.empty?
+                        @html.div do
+                           @html.h2('Resource Distribution', {'id' => 'body-distribution', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aDistribution.each do |hDistribution|
+                                 @html.div do
+                                    @html.h3('Distribution', {'class' => 'h3'})
+                                    @html.div(:class => 'block') do
+                                       distributionClass.writeHtml(hDistribution)
+                                    end
+                                 end
+                              end
+                           end
+                           @html.hr
+                        end
+                     end
+
+                     # associated resource section
+                     unless aAssociated.empty?
+                        @html.div do
+                           @html.h2('Associated Resources', {'id' => 'body-associatedResource', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aAssociated.each do |hAssociated|
+                                 @html.div do
+                                    @html.h3('Resource', {'class' => 'h3'})
+                                    @html.div(:class => 'block') do
+                                       associatedClass.writeHtml(hAssociated)
+                                    end
+                                 end
+                              end
+                           end
+                           @html.hr
+                        end
+                     end
+
+                     # additional documentation section
+                     unless aAdditional.empty?
+                        @html.div do
+                           @html.h2('Additional Documentation', {'id' => 'body-additionalDocument', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aAdditional.each do |hAdditional|
+                                 @html.div do
+                                    @html.h3('Document', {'class' => 'h3'})
+                                    @html.div(:class => 'block') do
+                                       additionalClass.writeHtml(hAdditional)
+                                    end
+                                 end
+                              end
+                           end
+                           @html.hr
+                        end
+                     end
+
+                     # data dictionary section
+                     unless aDictionaries.empty?
+                        @html.div do
+                           @html.h2('Data Dictionaries', {'id' => 'body-dataDictionary', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aDictionaries.each do |hDictionary|
+                                 @html.div do
+                                    @html.h3('Dictionary', {'class' => 'h3'})
+                                    @html.div(:class => 'block') do
+                                       dictionaryClass.writeHtml(hDictionary)
+                                    end
+                                 end
+                              end
+                           end
+                        end
+                     end
+
+                     # funding section
+                     unless aFunding.empty?
+                        @html.div do
+                           @html.h2('Funding', {'id' => 'body-funding', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aFunding.each do |hFunding|
+                                 @html.div do
+                                    @html.h3('Funds', {'class' => 'h3'})
+                                    @html.div(:class => 'block') do
+                                       fundingClass.writeHtml(hFunding)
+                                    end
+                                 end
+                              end
+                           end
+                        end
+                     end
+
+                     # metadata repository section
+                     unless aRepositories.empty?
+                        @html.div do
+                           @html.h2('Metadata Repositories', {'id' => 'body-repository', 'class' => 'h2'})
+                           @html.div(:class => 'block') do
+                              aRepositories.each do |hRepository|
+                                 @html.div do
+                                    @html.h3('Repository', {'class' => 'h3'})
+                                    @html.div(:class => 'block') do
+                                       repositoryClass.writeHtml(hRepository)
+                                    end
+                                 end
+                              end
+                           end
+                        end
+                     end
+
+                     # load leaflet
+                     @html.link( :rel => 'stylesheet', :href => 'https://unpkg.com/leaflet@1.0.3/dist/leaflet.css')
+                     @html.script('', :src => 'https://unpkg.com/leaflet@1.0.3/dist/leaflet.js')
+                     @html.script('', :src => 'https://stamen-maps.a.ssl.fastly.net/js/tile.stamen.js')
+
+                     # add inline javascript
+                     # read javascript from file
+                     path = File.join(File.dirname(__FILE__), 'html_bodyScript.js')
+                     file = File.open(path, 'r')
+                     bodyJS = file.read
+                     file.close
+
+                     @html.script('type'=>'text/javascript') do
+                        @html << bodyJS
+                     end
+
+                  end # body
+               end # writeHtml
+            end # Html_Body
+
+         end
+      end
+   end
+end

data/lib/adiwg/mdtranslator/writers/simple_html/sections/html_bodyScript.js

@@ -0,0 +1,317 @@
+
+//forEach Polyfill, Reference: https://goo.gl/hFIfSd
+if (!Array.prototype.forEach) {
+   Array.prototype.forEach = function(callback, thisArg) {
+      var T, k;
+      if (this === null || this === undefined) {
+         throw new TypeError(' this is null or not defined');
+      }
+      var O = Object(this);
+      var len = O.length >>> 0;
+      if ( typeof callback !== "function") {
+         throw new TypeError(callback + ' is not a function');
+      }
+      if (arguments.length > 1) {
+         T = thisArg;
+      }
+      k = 0;
+      while (k < len) {
+         var kValue;
+         if ( k in O) {
+            kValue = O[k];
+            callback.call(T, kValue, k, O);
+         }
+         k++;
+      }
+   };
+}
+
+// open detail panel in the document
+function openDetail(evt) {
+   var href = evt.target.getAttribute("href");
+   href = href.slice(1);
+
+   if(window.location !== window.parent.location){
+     evt.preventDefault();
+     var el = document.getElementById(href);
+     window.scrollTo(0, el.offsetTop);
+   }
+   var parentNode = document.getElementById(href).parentNode;
+   parentNode.open = true;
+}
+
+// open all detail panels in the document
+function openAllDetails(evt) {
+  if(window.location !== window.parent.location){
+    evt.preventDefault();
+  }
+   var arr = document.getElementsByTagName("details");
+   var len = arr.length;
+
+   for (var i = 0; i < len; i++) {
+      arr[i].open = true;
+   }
+}
+
+// close all detail panels in the document
+function closeAllDetails(evt) {
+  if(window.location !== window.parent.location){
+    evt.preventDefault();
+  }
+   var arr = document.getElementsByTagName("details");
+   var len = arr.length;
+
+   for (var i = 0; i < len; i++) {
+      arr[i].open = false;
+   }
+}
+
+// add event listeners to all anchor buttons in the sideNav
+var navBtnList = document.querySelectorAll('a.navBtn');
+var navBtnArray = Array.prototype.slice.call(navBtnList);
+navBtnArray.forEach(function(btn, btnIdx, btnArr) {
+   var href = btn.getAttribute("href").slice(1);
+   var target = document.getElementById(href);
+   //hide button if target is not present
+   if(target) {
+     btn.addEventListener("click", openDetail, false);
+   } else {
+     btn.style.display = 'none';
+   }
+});
+
+// add event listener to openAllButton
+var elOpen = document.getElementById("openAllButton");
+elOpen.addEventListener("click", openAllDetails, false);
+
+// add event listener to closeAllButton
+var elClose = document.getElementById("closeAllButton");
+elClose.addEventListener("click", closeAllDetails, false);
+
+//replace top links in inframes
+if(window.location !== window.parent.location){
+  // add event listeners to all "top" links
+  var topList = document.querySelectorAll("a[href='#']");
+  var topArray = Array.prototype.slice.call(topList);
+  topArray.forEach(function(a) {
+      a.addEventListener("click", function(evt) {
+        evt.preventDefault();
+        window.scrollTo(0,0);
+      }, false);
+  });
+}
+
+if ( typeof L === "object") {
+   (function() {
+
+      var westBound;
+      var eastBound;
+
+      var coordsToLatLng = function(coords) {
+         // if computed bounding box spans the antimeridian
+         // add 360 to negative longitudes
+         var longitude = coords[0];
+         if (westBound >= 0 && eastBound < 0) {
+            if (longitude < 0) {
+               longitude += 360;
+            }
+         }
+         var latitude = coords[1];
+         return L.latLng(latitude, longitude);
+      };
+
+      var bbox2Poly = function(bbox) {
+         var bboxJson = JSON.parse(bbox.textContent || bbox.innerText);
+         var sw = [ bboxJson.westLongitude, bboxJson.southLatitude ];
+         var nw = [ bboxJson.westLongitude, bboxJson.northLatitude ];
+         var ne = [ bboxJson.eastLongitude, bboxJson.northLatitude ];
+         var se = [ bboxJson.eastLongitude, bboxJson.southLatitude ];
+         var coords = [];
+         coords.push(sw);
+         coords.push(nw);
+         coords.push(ne);
+         coords.push(se);
+         var bboxCoods = [];
+         bboxCoods.push(coords);
+         return bboxCoods;
+      };
+
+      // collect all geographicExtents sections in document
+      var geoExtentNodeList = document.querySelectorAll('section.extent-geographic');
+      var geoExtents = Array.prototype.slice.call(geoExtentNodeList);
+
+      var check = function(i, me, bnds) {
+         if (i < 3) {
+            var resize = me.getSize().x === 0 && me.getContainer().offsetWidth > 0;
+
+            me.invalidateSize();
+            if (resize) {
+               me.fitBounds(bnds);
+            } else {
+               i++;
+               setTimeout(function() {
+                  check(i, me, bnds);
+               }, 100);
+            }
+         }
+      };
+
+      geoExtents.forEach(function(geoExtent, idx, arr) {
+         // instantiate a leaflet map in the map div
+         var map = L.map(geoExtent.querySelector('div.map'), {noWrap: true});
+         // get a pointer to the map header switch
+         var header = geoExtent.querySelector('summary.map-summary');
+         // get the GeoJSON from the geojson div
+         var geoJsonDiv  = geoExtent.querySelector('div.geojson');
+         if (geoJsonDiv) {
+            var geojson = JSON.parse(geoJsonDiv.textContent || geoJsonDiv.innerText);
+         }
+         else {
+            var geojson = [];
+         }
+         // get the user provided bounding box for the extent - if any
+         var userBBox = geoExtent.querySelector('div.userBBox');
+         if (userBBox) {
+            var userCoords = bbox2Poly(userBBox);
+            var newUserBBox = {
+               "type": "Feature",
+               "geometry": {
+                  "type": "Polygon",
+                  "coordinates": userCoords
+               },
+               "properties": {
+                  "style": {
+                     "color": '#f00',
+                     "fill": false
+                  },
+                  "featureName": [
+                     "User BBOX"
+                  ]
+               }
+            };
+            geojson.push(newUserBBox);
+         }
+
+         // get the computed bounding box for the extent - always one
+         var computedBBox = geoExtent.querySelector('div.computedBBox');
+         if (computedBBox) {
+            var compCoords = bbox2Poly(computedBBox);
+            var newCompBBox = {
+               "type": "Feature",
+               "geometry": {
+                  "type": "Polygon",
+                  "coordinates": compCoords
+               },
+               "properties": {
+                  "style": {
+                     "color": '#0f0',
+                     "fill": false
+                  },
+                  "featureName": [
+                     "Computed BBOX"
+                  ]
+               }
+            };
+            geojson.push(newCompBBox);
+            westBound = compCoords[0][0][0];
+            eastBound = compCoords[0][2][0];
+         }
+
+         var pointCnt = 0;
+         var lineStringCnt = 0;
+         var polygonCnt = 0;
+         var geoCollectCnt = 0;
+         var featureCnt = 0;
+
+         geojson.forEach(function(geo, geoIdx, geoArr) {
+
+            // make sure each geo has a properties object
+            if (!geo.properties) {
+               geo.properties = {};
+            }
+
+            // add popup information
+            if (geo.type === "Point") {
+               pointCnt += 1;
+               geo.properties.popup = "Point " + pointCnt;
+            }
+            if (geo.type === 'LineString') {
+               lineStringCnt += 1;
+               geo.properties.popup = "LineString " + lineStringCnt;
+            }
+            if (geo.type === 'Polygon') {
+               polygonCnt += 1;
+               geo.properties.popup = "Polygon " + polygonCnt;
+            }
+            if (geo.type === 'GeometryCollection') {
+               geoCollectCnt += 1;
+               geo.properties.popup =  "Geometry Collection " + geoCollectCnt;
+               // popup can't find properties on collection objects
+               // placed popup on geometry collection instead
+               // geo.geometries.forEach(function (geoG, geoGIdx, geoGArr) {
+               //    geoG.properties = {};
+               //    geoG.properties.popup =  "Geometry Collection " + geoCollectCnt + " " + geoG.type;
+               // });
+            }
+            if (geo.type === 'Feature') {
+               featureCnt += 1;
+               var featureName;
+               if (geo.properties.featureName !== undefined) {
+                  featureName = geo.properties.featureName[0] || geo.id || geo.geometry.type;
+               } else featureName = geo.id || "Feature " + featureCnt + " " + geo.geometry.type;
+               geo.properties.popup = featureName;
+            }
+            if (geo.type === 'FeatureCollection') {
+               geo.features.forEach(function (geoF, geoFIdx, geoFArr) {
+                  featureCnt += 1;
+                  var featureName;
+                  if (geoF.properties.featureName !== undefined) {
+                     featureName = geoF.properties.featureName[0] || geoF.id || geoF.geometry.type;
+                  } else featureName = geoF.id || "Feature " + featureCnt + " " + geoF.geometry.type;
+                  geoF.properties.popup = featureName;
+               });
+            }
+
+         });
+
+         var geoLayer = L.geoJSON(geojson, {
+            style: function(feature) {
+               return feature.properties.style || {};
+            },
+            coordsToLatLng: coordsToLatLng,
+            onEachFeature: function (feature, layer) {
+               layer.bindPopup(feature.properties.popup,{
+                  closeButton: true
+               });
+            }
+         }).addTo(map);
+
+         var bnds = geoLayer.getBounds();
+         map.fitBounds(bnds);
+
+         L.DomEvent.addListener(header, 'click', function() {
+            var me = this;
+            var i = 0;
+
+            setTimeout(function() {
+               check(i, me, bnds);
+            }, 100);
+
+         }, map);
+
+         L.DomEvent.addListener(L.DomUtil.get('openAllButton'), 'click', function() {
+            var me = this;
+            var i = 0;
+
+            setTimeout(function() {
+               check(i, me, bnds);
+            }, 100);
+
+         }, map);
+
+         // map.addLayer(new L.TileLayer.OSM());
+         var stamen = new L.StamenTileLayer("terrain");
+         map.addLayer(stamen);
+      });
+   })();
+}