fpdcc / trailsy

A trip planner and mapper for hiking/biking/riding trail systems.
https://map.fpdcc.com/
BSD 3-Clause "New" or "Revised" License
9 stars 2 forks source link

Link Activity Icons, Revise More Information Lists #245

Closed versatilehuman closed 3 years ago

versatilehuman commented 5 years ago
versatilehuman commented 4 years ago

Link activity icons

(replaces lines 514 to 622)

// Activities/Amenities on map

        // bike_rental = Bike Rental
        if (poi.properties.tags[':panel'].indexOf('bike_rental') > -1 ) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-bike-rental'><use xlink:href='icons/defs.svg#icon-bike-rental'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/bicycling/'>Bike Rental</a></span></div>"
        }
          // boat_ramp = Boat Launch
        if (poi.properties.tags[':panel'].indexOf('boat_ramp') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-boat-launch'><use xlink:href='icons/defs.svg#icon-boat-launch'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/boating-canoeing-kayaking/'>Boat Launch</a></span></div>"
        }

        // boat_rental = Boat Rental
        if (poi.properties.tags[':panel'].indexOf('boat_rental') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-boat-rental'><use xlink:href='icons/defs.svg#icon-boat-rental'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/boating-canoeing-kayaking/'>Boat Rental</a></span></div>"
        }
          // camping = Campground
        if (poi.properties.tags[':panel'].indexOf('camping') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-camp'><use xlink:href='icons/defs.svg#icon-camp'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/camping/'>Campground</a></span></div>"
        }

        // shower = Shower
        if (poi.properties.tags[':panel'].indexOf('shower') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-camp-shower'><use xlink:href='icons/defs.svg#icon-camp-shower'></use></svg><span class='fpccAmenityTitle'>Shower</span></div>"
        }

        // dining_hall = Dining Hall
        if (poi.properties.tags[':panel'].indexOf('dining_hall') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-camp-dine'><use xlink:href='icons/defs.svg#icon-camp-dine'></use></svg><span class='fpccAmenityTitle'>Dining Hall</span></div>"
        }

        // sanitation_station = Sanitation Station
        if (poi.properties.tags[':panel'].indexOf('sanitation_station') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-camp-sanitary'><use xlink:href='icons/defs.svg#icon-camp-sanitary'></use></svg><span class='fpccAmenityTitle'>Sanitation Station</span></div>"
        }

        // camp_store = Camp Store
        if (poi.properties.tags[':panel'].indexOf('camp_store') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-camp-store'><use xlink:href='icons/defs.svg#icon-camp-store'></use></svg><span class='fpccAmenityTitle'>Camp Store</span></div>"
        }

        // canoe = Canoe Landing
        if (poi.properties.tags[':panel'].indexOf('canoe') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-canoe-landing'><use xlink:href='icons/defs.svg#icon-canoe-landing'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/boating-canoeing-kayaking/'>Canoe Landing</a></span></div>"
        }
        // disc_golf = Disc Golf
        if (poi.properties.tags[':panel'].indexOf('disc_golf') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-disc-golf'><use xlink:href='icons/defs.svg#icon-disc-golf'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/disc-golf/'>Disc Golf</a></span></div>"
        }

        //  dog_friendly = Off-Leash Dog Area
        if (poi.properties.tags[':panel'].indexOf('dog_friendly') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-off-leash-dog-area'><use xlink:href='icons/defs.svg#icon-off-leash-dog-area'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/dogs/'>Off-Leash Dog Area</a></span></div>"
        }

        // golf = Golf
        if (poi.properties.tags[':panel'].indexOf('golf') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-golf-course-driving-range'><use xlink:href='icons/defs.svg#icon-golf-course-driving-range'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/golf/'>Golf</a></span></div>"
        }
        //  driving_range = Driving Range
        if (poi.properties.tags[':panel'].indexOf('driving_range') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-golf-course-driving-range'><use xlink:href='icons/defs.svg#icon-golf-course-driving-range'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/golf/'>Driving Range</a></span></div>"
        }
        // m_airplane = Model Airplane Flying Field
        if (poi.properties.tags[':panel'].indexOf('m_airplane') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-model-airplane'><use xlink:href='icons/defs.svg#icon-model-airplane'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/model-airplane-drones/'>Model Airplane Flying Field</a></span></div>"
        }

        // m_boat = Model Sailboat
        if (poi.properties.tags[':panel'].indexOf('m_boat') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-model-sailboat'><use xlink:href='icons/defs.svg#icon-model-sailboat'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/boating-canoeing-kayaking/'>Model Sailboat</a></span></div>"
        }

        // nature_center = Nature Center
        if (poi.properties.tags[':panel'].indexOf('nature_center') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-nature-center'><use xlink:href='icons/defs.svg#icon-nature-center'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/nature-centers/'>Nature Center</a></span></div>"
        }

        // natureplay = Nature Play
        if (poi.properties.tags[':panel'].indexOf('natureplay') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-nature-play'><use xlink:href='icons/defs.svg#icon-nature-play'></use></svg><span class='fpccAmenityTitle'>Nature Play</span></div>"
        }

        // picnic_grove = Picnic Grove
        if (poi.properties.tags[':panel'].indexOf('picnic_grove') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity picnic-grove'><svg class='icon icon-picnic-grove'><use xlink:href='icons/defs.svg#icon-picnic-grove'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/permits/picnics-event-permits/'>Picnic Grove</a></span></div>"
        }

        // shelter = Picnic Grove (with shelter)
        if (poi.properties.tags[':panel'].indexOf('shelter') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-picnic-grove-shelter'><use xlink:href='icons/defs.svg#icon-picnic-grove-shelter'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/permits/picnics-event-permits/'>Picnic Grove <br>(with shelter)</a></span></div>"
        }
        // public_building = Public Building
        if (poi.properties.tags[':panel'].indexOf('public_building') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity public-building'><svg class='icon icon-facility'><use xlink:href='icons/defs.svg#icon-facility'></use></svg><span class='fpccAmenityTitle'>Public Building</span></div>"
        }
        // sledding = Sledding
        if (poi.properties.tags[':panel'].indexOf('sledding') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-sledding'><use xlink:href='icons/defs.svg#icon-sledding'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/sledding/'>Sledding</a></span></div>"
        }

        // snowmobile = Snowmobile Area
        if (poi.properties.tags[':panel'].indexOf('snowmobile') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-snowmobiling'><use xlink:href='icons/defs.svg#icon-snowmobiling'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/snowmobiling/'>Snowmobile Area</a></span></div>"
        }

        // swimming = Aquatic Center
        if (poi.properties.tags[':panel'].indexOf('swimming') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-aquatic-center'><use xlink:href='icons/defs.svg#icon-aquatic-center'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/swimming/'>Aquatic Center</a></span></div>"
        }

(replaces lines 624 to 719)

// Activities/Amenities NOT on map

        // birding = Birding Hotspot
        if (poi.properties.tags[':panel'].indexOf('birding') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-birding-hotspot'><use xlink:href='icons/defs.svg#icon-birding-hotspot'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/birding/'>Birding Hotspot</a></span></div>"
        }
        // cycling = Bicycling
        if (poi.properties.tags[':panel'].indexOf('cycling') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-bicycling'><use xlink:href='icons/defs.svg#icon-bicycling'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/bicycling/'>Bicycling</a></span></div>"
        }

        // cross_country = Cross-Country Skiing
        if (poi.properties.tags[':panel'].indexOf('cross_country') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-cross-country-skiing'><use xlink:href='icons/defs.svg#icon-cross-country-skiing'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/cross-country-skiing/'>Cross-Country Skiing</a></span></div>"
        }

        //  dog_leash = Dogs (with a leash)
        if (poi.properties.tags[':panel'].indexOf('dog_leash') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-dog-leash'><use xlink:href='icons/defs.svg#icon-dog-leash'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/dogs/'>Dogs <br>(on-leash only)</a></span></div>"
        }

        // no_dogs = No Dogs
        if (poi.properties.tags[':panel'].indexOf('no_dogs') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-no-dogs'><use xlink:href='icons/defs.svg#icon-no-dogs'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/dogs/'>No Dogs</a></span></div>"
        }

        // fitness_stairs = Fitness Stairs
        if (poi.properties.tags[':panel'].indexOf('fitness_stairs') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-stairs'><use xlink:href='icons/defs.svg#icon-stairs'></use></svg><span class='fpccAmenityTitle'>Fitness Stairs</span></div>"
        }

        // zip_line = Zip Line
        if (poi.properties.tags[':panel'].indexOf('zip_line') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-zip-line'><use xlink:href='icons/defs.svg#icon-zip-line'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/zip-line/'>Treetop Adventure & Zip Line</a></span></div>"
        }

        //  drone = Drone Flying
        if (poi.properties.tags[':panel'].indexOf('drone') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-drone'><use xlink:href='icons/defs.svg#icon-drone'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/model-airplane-drones/'>Drone Flying Area</a></span></div>"
        }

        // equestrian = Equestrian
        if (poi.properties.tags[':panel'].indexOf('equestrian') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-equestrian'><use xlink:href='icons/defs.svg#icon-equestrian'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/equestrian/'>Equestrian Parking</a></span></div>"
        }

        // fishing = Fishing
        if (poi.properties.tags[':panel'].indexOf('fishing') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-fishing'><use xlink:href='icons/defs.svg#icon-fishing'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/fishing/'>Fishing</a></span></div>"
        }

        // hiking = Hiking
        if (poi.properties.tags[':panel'].indexOf('hiking') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-hiking'><use xlink:href='icons/defs.svg#icon-hiking'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/hiking-walking-running/'>Hiking, Walking & Running</a></span></div>"
        }

        // ice_fishing = Ice Fishing
        if (poi.properties.tags[':panel'].indexOf('ice_fishing') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-ice-fishing'><use xlink:href='icons/defs.svg#icon-ice-fishing'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/fishing/'>Ice Fishing</a></span></div>"
        }

        // no_alcohol = No Alcohol
        if (poi.properties.tags[':panel'].indexOf('no_alcohol') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-no-alcohol'><use xlink:href='icons/defs.svg#icon-no-alcohol'></use></svg><span class='fpccAmenityTitle'>No Alcohol <br>(without permit)</span></div>"
        }
        // no_fishing = No Fishing
        if (poi.properties.tags[':panel'].indexOf('no_fishing') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-no-fishing'><use xlink:href='icons/defs.svg#icon-no-fishing'></use></svg> <span class='fpccAmenityTitle'>No Fishing</span></div>"
        }
        // overlook = Scenic Overlook
        if (poi.properties.tags[':panel'].indexOf('overlook') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-scenic-overlook'><use xlink:href='icons/defs.svg#icon-scenic-overlook'></use></svg><span class='fpccAmenityTitle'>Scenic Overlook</span></div>"
        }
        // skating_ice = Ice Skating
        if (poi.properties.tags[':panel'].indexOf('skating_ice') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-ice-skating'><use xlink:href='icons/defs.svg#icon-ice-skating'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/things-to-do/ice-skating/'>Ice Skating</a></span></div>"
        }

        // volunteer = Volunteer Opportunities
        if (poi.properties.tags[':panel'].indexOf('volunteer') > -1) {
          fpccAmenitiesString += "<div class='fpccAmenity'><svg class='icon icon-volunteer'><use xlink:href='icons/defs.svg#icon-volunteer'></use></svg><span class='fpccAmenityTitle'><a href='https://fpdcc.com/volunteer/'>Volunteer Opportunities</a></span></div>"
        }

        // nature_preserve = Nature Preserve
        if (poi.properties.tags[':panel'].indexOf('nature_preserve') > -1) {
          naturePreserveString = '<div class="fpccNP clearfix"><a href="https://fpdcc.com/nature/illinois-nature-preserves/"><img src="images/idnr-np-logo.png" width="75" height="65" alt="Illinois Nature Preserves Commission Logo"></a><p> This land is designated as one of the highest quality natural areas in the state by the Illinois Nature Preserves Commission. This status includes increased levels of legal protection and management. Learn more on the <a href="https://fpdcc.com/nature/illinois-nature-preserves/">Illinois Nature Preserves Page</a></p></div>'
        }
versatilehuman commented 4 years ago

POI More Information list

Now that we are linking the icons directly, let's drop those dynamically created links (tagLinks function) from the "More Information" list.

1. Here: https://github.com/fpdcc/trailsy/blob/development/js/panelFunctions.js#L721 Starting with: if (tagLinks.length > 0) {

2. Here: https://github.com/fpdcc/trailsy/blob/development/js/panelFunctions.js#L458 Starting with:

// tagLinks
        if ((poi.properties.tags[':panel'].indexOf("cycling") > -1)) {

3. Here: https://github.com/fpdcc/trailsy/blob/development/js/panelFunctions.js#L852

Starting with: var tagLinks = ''


to: extraLinksText += '<li><a href="https://fpdcc.com/about/rules-regulations/">Rules &amp; Frequently Asked Questions</a></li>'


versatilehuman commented 4 years ago

Trail More Information list

Include conditionals for [web_link], [map_link] and [map_link_spanish] in the trails_desc table.

Place after the fpccTrailSegments div (starts here: https://github.com/fpdcc/trailsy/blob/development/js/panelFunctions.js#L934), resulting in this:

<div class="fpccLinks fpccUnit clearfix"><span class="fpccLabel">More Information</span>
<ul>
<li><a href="[trails_desc --> web_link]">Trail Webpage</a></li>
<li><a href="[trails_desc --> map_link]">English Map (PDF)</a></li>
<li><a href="[trails_desc --> map_link_spanish]">Mapa Español (PDF)</a></li>
<li><a href="https://fpdcc.com/about/rules-regulations/">Rules & Frequently Asked Questions</a></li>
</ul></div>

image