Featured Projects

Upper Blackfoot River Restoration

NRDP Timelapse Photo Browser //caption for each site, list of image indexes, references imageData[][] const siteData = [ ["Blackfoot River (looking at Shaue confluence)",0,1,2], ["Upper Mike Horse Creek (looking downstream)",3,4,5,6,7], ["Upper Beartrap Creek (looking downstream)",8,9,10], ["Lower Beartrap Creek (looking upstream)",11,12,13] // ["Infrared Imagery (changes in vegetation and soil)",14,15,16] ]; //base upload path for all images const filePath = "https://dojmt.gov/wp-content/uploads/CustomWebApps/NRDP/MHPhotoViewer/images/"; //image captions and URL for all timelapse images const imageData = [ ["2020 October",filePath+"blackfoot_Set4_1.jpg"], ["2021 September",filePath+"blackfoot_Set4_2.jpg"], ["2022 August",filePath+"blackfoot_Set4_3.jpg"], ["2016 November",filePath+"blackfoot_Set1_1.jpg"], ["2017 September",filePath+"blackfoot_Set1_2.jpg"], ["2018 June",filePath+"blackfoot_Set1_3.jpg"], ["2019 October",filePath+"blackfoot_Set1_4.jpg"], ["2020 September",filePath+"blackfoot_Set1_5.jpg"], ["2019 October",filePath+"blackfoot_Set2_1.jpg"], ["2020 September",filePath+"blackfoot_Set2_2.jpg"], ["2022 August",filePath+"blackfoot_Set2_3.jpg"], ["2019 October",filePath+"blackfoot_Set3_1.jpg"], ["2020 September",filePath+"blackfoot_Set3_2.jpg"], ["2021 September",filePath+"blackfoot_Set3_3.jpg"], // ["2009 NIAP Arial Imagery",filePath+"MikeHorseIR_2009.jpg"], // ["2015 NIAP Arial Imagery",filePath+"MikeHorseIR_2015.jpg"], // ["2023 NIAP Arial Imagery",filePath+"MikeHorseIR_2023.jpg"] ];
Title Text
Caption
//Custom Javascript code let siteIndex = -1; const siteImages = []; //-1 is home //curr & prev image are index of siteImages[][] , not ImageData[][] let currImage = 0; let prevImage = 0; //image object, holds next image let preloadImage; //index of siteImages[][] let preloadIndex; //used to track state of overlay fade in / out let overlayVisible = false; const blackScreenSrc = filePath+ "blackScreen.jpg"; //HTML elements const overlayImage = document.getElementById("overlay-image"); const baseImage = document.getElementById("base-image"); const captionText = document.getElementById("caption-text"); const headerText = document.getElementById("header-text"); const nextButton = document.getElementById("next-button"); const prevButton = document.getElementById("prev-button"); const homeButton = document.getElementById("home-button"); const playPauseButton = document.getElementById("play-pause-button"); //array of all circle buttons const circleButtons = document.getElementsByClassName("circleButton"); //variable for timer let autoPlay; //bool for button state let playSlides = true; // captionText.innerText = imageData[currImage][1]; // bottomDisplayImage.src = imageData[prevImage][0]; GoToHome(); //Initialize / Reload Homescreen function GoToHome() { //stop autoplay timer clearInterval(autoPlay); siteIndex = -1; //reset overlay image to blank overlayImage.src = ""; overlayImage.className = "fadeOut"; baseImage.src = filePath+"MikeHorseMap3D.jpg"; headerText.innerHTML = "Mike Horse Dam Restoration Site" captionText.innerHTML = "Click on a location to see restoration images"; nextButton.style.visibility = "hidden"; prevButton.style.visibility = "hidden"; homeButton.style.visibility = "hidden"; playPauseButton.style.visibility = "hidden"; //show all circle buttons for(var i=0; i"; nextButton.style.visibility = "visible"; prevButton.style.visibility = "visible"; homeButton.style.visibility = "visible"; playPauseButton.style.visibility = "visible"; playPauseButton.innerHTML = ''; //preload next image PreloadImage(true); } //update images based on overlay state (prev / curr alternates between base and overlay) function ChangeImage() { //get indexes of images in imageData[] const currIndex = siteImages[currImage]; const prevIndex = siteImages[prevImage]; //fade top image out if(overlayVisible) { overlayImage.src = imageData[prevIndex][1]; baseImage.src = imageData[currIndex][1]; overlayVisible = false; } else { overlayImage.src = imageData[currIndex][1]; baseImage.src = imageData[prevIndex][1]; overlayVisible = true; } overlayImage.classList.toggle("fadeIn"); overlayImage.classList.toggle("fadeOut"); captionText.innerHTML ="" + imageData[currIndex][0] +""; prevImage = currImage; } //Play pause Button Toggle function TogglePlayPause() { if(playSlides){ //stop timer clearInterval(autoPlay); playSlides = false; playPauseButton.innerHTML = ''; } else { //restart timer autoPlay= window.setInterval(NextImage, 3000); playSlides = true; playPauseButton.innerHTML = ''; } } //force pasue auto play, called when next / prev buttons are clicked function PauseAutoSides() { clearInterval(autoPlay); playSlides = false; playPauseButton.innerHTML = ''; } function NextImageButton() { PauseAutoSides(); NextImage(); } function NextImage() { currImage++; if(currImage>=siteImages.length){ currImage = 0; } ChangeImage(); //pre load next image PreloadImage(true); } function PrevImageButton() { PauseAutoSides(); PrevImage(); } function PrevImage() { currImage--; if(currImage=siteImages.length) preloadIndex=0; } //prev button clicked, preload previous image in sequence else { preloadIndex = currImage-1; if(preloadIndex<0) preloadIndex=siteImages.length-1; } preloadImage = new Image(); //image URL is in imageData[][] index from siteImages[][] preloadImage.src = imageData[siteImages[preloadIndex]][1]; // console.log("curr Image: " + siteImages[currImage] + " pre loading image index: " +siteImages[preloadIndex]); }

NRDP worked with DEQ and the US Forest Service (USFS) to remediate and restore the Upper Blackfoot Mining Complex, a historic mining district at the headwaters of the Upper Blackfoot River. In 1975, a failure of the Mike Horse Dam released an estimated 100,000 tons of mining tailings and other materials into the Upper Blackfoot River and Beartrap Creek. Between 2015 and 2020, NRDP, DEQ, and USFS removed the Mike Horse Dam and the tailings and waste from the floodplain of the Upper Blackfoot and its tributaries (Beartrap Creek and Mike Horse Creek). The stream channels were then rebuilt and the floodplain restored and revegetated. These photo points show progress of the restored channels and floodplains on Upper Mike Horse Creek, Upper Beartrap Creek, Lower Beartrap Creek, and the Upper Blackfoot River from when remediation/restoration on each reach was completed up through 2022.