Commit 51ac09ee authored by Peter Knoop's avatar Peter Knoop
Browse files

Aligned html, css, and javascript to use view.ui for layout of more of the components of app.

parent 85084fcf
......@@ -29,20 +29,15 @@ body {
width: 100%;
}
#title-view {
position: absolute;
padding: 10px;
left: 50%;
transform: translate(-50%, 0);
background-color: white;
opacity: 0.6;
z-index: 2;
opacity: 0.75;
}
#username {
font-weight: bold;
}
#mainViewDiv {
position: relative;
z-index: 1;
padding: 0px;
margin: 0px;
height: 100%;
......@@ -66,29 +61,26 @@ body {
}
#parameter-picker {
position: absolute;
padding: 10px;
left: 100%;
transform: translate(-100%, 0);
background-color: white;
opacity: 0.6;
z-index: 3;
opacity: 0.75;
}
#infoDiv {
padding: 10px;
width: 275px;
height: 50vh;
padding: 10px;
width: 275px;
height: 40vh;
opacity: 0.75;
}
.esri-slider__max, .esri-slider__min {
font-weight: 700;
font-weight: 700;
}
.esri-slider--vertical .esri-slider__max {
margin-bottom: 1em !important;
margin-bottom: 1em !important;
}
.esri-slider--vertical .esri-slider__min{
margin-top: 1em !important;
margin-top: 1em !important;
}
......@@ -18,26 +18,27 @@
<span id="sign-in" class="action">Sign In</span>
</div>
<div id="authenticated-view" class="esri-widget">
<div id="title-view">
<span id="username"></span>&nbsp;&nbsp;-&nbsp;
<span id="sign-out" class="action">Sign Out</span>
</div>
<div id="parameter-picker">
<label for="parameter-1">NWS Parameter:</label>
<select id="parameter-1-select"></select>
<br>
<label for="parameter-2-">Yale Parameter:</label>
<select id="parameter-2-select"></select>
</div>
<div id="mainViewDiv"></div>
<div id="akViewDiv" class="esri-widget"></div>
<div id="hiViewDiv" class="esri-widget"></div>
<div id="infoDiv" class="esri-widget">
<div id="infoDescription">
Show where the % that believe the global warming is between:
<span id="sliderHighValue">100</span>% and <span id="sliderLowValue">0</span>%.
<div id="mainViewDiv" class="esri-widget">
<div id="title-view" class="esri-widget">
<span id="username"></span>&nbsp;&nbsp;-&nbsp;
<span id="sign-out" class="action">Sign Out</span>
</div>
<div id="parameter-picker" class="esri-widget">
<label for="parameter-1">NWS Parameter:</label>
<select id="parameter-1-select"></select>
<br>
<label for="parameter-2-">Yale Parameter:</label>
<select id="parameter-2-select"></select>
</div>
<div id="akViewDiv" class="esri-widget"></div>
<div id="hiViewDiv" class="esri-widget"></div>
<div id="infoDiv" class="esri-widget">
<div id="infoDescription">
Show where the % that believe the global warming is between:
<span id="sliderHighValue">100</span>% and <span id="sliderLowValue">0</span>%.
</div>
<div id="sliderDiv" class"slider"></div>
</div>
<div id="sliderDiv" class"slider"></div>
</div>
</div>
</body>
......
......@@ -105,6 +105,9 @@ require([
}
});
// Add username and sign out link.
mainView.ui.add('title-view', 'top-right');
// Create a layer from Perry's alert and Yale's opinion data at the level of Congressional Districts (115th).
const layer = new FeatureLayer({
//url: 'https://services1.arcgis.com/4ezfu5dIwH83BUNL/arcgis/rest/services/Yale_Congressional_District_115_Level/FeatureServer/0',
......@@ -121,6 +124,7 @@ require([
// Populate selection lists for parameters.
setParameterSelectionLists();
mainView.ui.add('parameter-picker', 'top-right');
// Set relationship (or bivariate) renderer for data.
setRelationshipRenderer();
......@@ -437,28 +441,8 @@ require([
console.log('Parameter selection lists set.')
}
// // add slider widget
// // Joe is adding a comment for some reason...
// const slider = new Slider({
// container: document.getElementById('sliderDiv'),
// min: 0,
// max: 100,
// values: [ 50 ],
// rangeLabelsVisible: true,
// precision: 0,
// layout: 'vertical'
// });
//
// mainView.ui.add(slider, {
// position: 'top-right',
// });
console.log('complete')
// add slider widget
mainView.ui.add("infoDiv", {
position: "top-right",
});
......@@ -537,6 +521,8 @@ require([
setHIFeatureLayerViewFilter(filterField + " >= " + sliderLowValue + " AND " + filterField + " <= " + sliderHighValue);
});
console.log('complete')
});
}
});
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment