Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Styling changes, added jQuery UI multiselect for drop down and report…

… metrics, some code clean up.
  • Loading branch information...
commit 2a705b62b431c7d6ecaa3b087194eb9c78f64baa 1 parent 7af6141
@tobinbradley authored
View
178 css/style.css
@@ -1,12 +1,12 @@
-/*
- * HTML5 Boilerplate
+/*
+ * HTML5 Boilerplate
*
- * What follows is the result of much research on cross-browser styling.
+ * What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*
* Detailed information about this CSS: h5bp.com/css
- *
+ *
* ==|== normalize ==========================================================
*/
@@ -20,23 +20,23 @@ audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
+
/* =============================================================================
Base
========================================================================== */
/*
* 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
- * 2. Force vertical scrollbar in non-IE
- * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
+ * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
*/
-html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
+html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
-body { margin: 0; font-size: 13px; line-height: 1.231; }
+html, button, input, select, textarea { font-family: sans-serif; color: #222; }
-body, button, input, select, textarea { font-family: sans-serif; color: #222; }
+body { margin: 0; font-size: 1em; line-height: 1.4; }
-/*
+/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate
* Also: hot pink! (or customize the background color to match your design)
@@ -78,7 +78,7 @@ ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
/* Redeclare monospace font family: h5bp.com/j */
-pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
+pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
@@ -109,13 +109,13 @@ nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0
/*
* 1. Improve image quality when scaled in IE7: h5bp.com/d
- * 2. Remove the gap between images and borders on image containers: h5bp.com/e
+ * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
*/
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
/*
- * Correct overflow not hidden in IE9
+ * Correct overflow not hidden in IE9
*/
svg:not(:root) { overflow: hidden; }
@@ -138,12 +138,12 @@ fieldset { border: 0; margin: 0; padding: 0; }
/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }
-/*
- * 1. Correct color not inheriting in IE6/7/8/9
- * 2. Correct alignment displayed oddly in IE6/7
+/*
+ * 1. Correct color not inheriting in IE6/7/8/9
+ * 2. Correct alignment displayed oddly in IE6/7
*/
-legend { border: 0; *margin-left: -7px; padding: 0; }
+legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
/*
* 1. Correct font-size not inheriting in all browsers
@@ -155,40 +155,40 @@ button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: ba
/*
* 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
- * 2. Correct inner spacing displayed oddly in IE6/7
*/
-button, input { line-height: normal; *overflow: visible; }
+button, input { line-height: normal; }
/*
- * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
+ * 1. Display hand cursor for clickable form elements
+ * 2. Allow styling of clickable form elements in iOS
+ * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
*/
-table button, table input { *overflow: auto; }
+button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
/*
- * 1. Display hand cursor for clickable form elements
- * 2. Allow styling of clickable form elements in iOS
+ * Re-set default cursor for disabled elements
*/
-button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
+button[disabled], input[disabled] { cursor: default; }
/*
* Consistent box sizing and appearance
*/
-input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
+input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
-input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
+input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
-/*
- * Remove inner padding and border in FF3/4: h5bp.com/l
+/*
+ * Remove inner padding and border in FF3/4: h5bp.com/l
*/
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
-/*
- * 1. Remove default vertical scrollbar in IE6/7/8/9
+/*
+ * 1. Remove default vertical scrollbar in IE6/7/8/9
* 2. Allow only vertical resizing
*/
@@ -207,6 +207,13 @@ table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
+/* =============================================================================
+ Chrome Frame Prompt
+ ========================================================================== */
+
+.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
+
+
/* ==|== primary styles =====================================================
Author: Tobin Bradley
========================================================================== */
@@ -221,6 +228,8 @@ td { vertical-align: top; }
/* main page elements */
body { background: #E1E5E8; }
+html, button, input, select, textarea { font-family: myriad-pro-1, myriad-pro-2, 'Lucida Grande',"Lucida Sans Unicode", sans-serif; }
+body { font-size: 14px; line-height: 1.3; }
#container { max-width: 960px; margin: 0 auto 10px auto; background: #fff; box-shadow: 0 0 15px #4d4d4d; border-radius: 0 0 10px 10px; }
header { box-shadow: 0 5px 15px -3px #666; margin-bottom: 15px; border-top: 5px solid rgb(45,45,45);
@@ -242,33 +251,33 @@ footer a:hover { text-decoration: underline; }
/* header */
-#header_bottom_nav { text-align: left; background: rgb(45,45,45); max-width: 960px; margin: 0 auto; }
-#header_top_nav { text-align: right; max-width: 350px; float: right; padding: 5px 5px 0 0; }
+#header_bottom_nav { text-align: left; background: rgb(45,45,45); max-width: 960px; margin: 0 auto; }
+#header_top_nav_right { text-align: right; max-width: 350px; float: right; padding: 4px 5px 0 0; min-height: 16px;}
header nav ul { list-style: none; padding: 3px 0 5px 0; margin: 0; }
header nav ul li { display: inline; }
-#header_top_nav, #header_top_nav a, #header_top_nav a:visited { color: #666; text-decoration: none; font-size: 9px; }
+.header_top_nav, .header_top_nav a, .header_top_nav a:visited { color: #666; text-decoration: none; font-size: 9px; }
#header_bottom_nav ul li a, #header_bottom_nav ul li a:visited { color: #ccc; padding-left: 10px; text-decoration: none; font-size: 11px; }
header a:hover { text-decoration: underline !important; }
+#event_calendar { max-width: 100px; float: left; font-size: 9px; padding: 4px 0 0 5px;}
#title { max-width: 960px; margin: 0 auto; background: url("../img/site-logo.png") top left no-repeat; }
#title h1 { font-family: 'Arvo', Georgia, Times, serif; text-shadow: 1px 1px 3px #222; font-size: 39px; color: #222; margin: 0; padding: 5px 0 8px 65px; }
/* google translate */
-#google_translate_element { text-align: left; min-height: 18px; padding: 2px; width: 100px; float: left; }
-.goog-te-gadget-simple { font-size: 9px !important; color: white !important; background: transparent !important; border: none !important; color: white !important; }
+#google_translate_element { text-align: left; width: 100px; float: left; padding-top: 2px; }
+.goog-te-gadget-simple { font-family: Arial, sans-serif !important; font-size: 9px !important; background: transparent !important; border: none !important; color: white !important; }
.goog-te-gadget-simple .goog-te-menu-value { color: #666 !important; }
.goog-te-gadget-icon { display: none !important; }
/* search area */
#search { margin: 10px 0 20px; text-align: center; }
-#searchbox, #mapIndicie { padding: 3px; border:1px solid #b2b2b2; border-radius: 5px; color: #7C7C7C; font-weight: bold; }
-#searchbox:focus, #mapIndicie:focus { outline:none; }
+#searchbox { padding: 3px; border:1px solid #b2b2b2; border-radius: 5px; color: #7C7C7C; font-weight: bold; }
+#searchbox:focus { outline:none; }
#searchbox { font-size: 1.2em; padding: 8px 5px; width: 60%; }
#search p { width: 60%; text-align: right; margin: 0 auto; font-size: 10px; }
#search p a { text-decoration: none; color: #2684ce; }
#search p a:hover { text-decoration: underline; }
-#mapIndicie { font-size: 1.1em; max-width: 100%; background: #fff; margin: 0 2px 4px 0; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #7C7C7C; }
input::-moz-placeholder, textarea::-moz-placeholder { color: #7C7C7C; }
@@ -276,53 +285,23 @@ input::-moz-placeholder, textarea::-moz-placeholder { color: #7C7C7C; }
/* main map area */
aside { float: left; width: 49%; min-width: 280px; padding-bottom: 10px; }
#map { width: 50%; min-width: 280px; float: right; text-align: right; padding-bottom: 10px; }
-#map-canvas { position: relative; width: 99%; height: 475px; border: 1px solid #b2b2b2; border-radius: 5px; text-align: left; }
+#map-canvas { margin-top: 5px; position: relative; width: 99%; height: 475px; border: 1px solid #b2b2b2; border-radius: 5px; text-align: left; }
.googft-info-window { text-align: left; }
.googft-info-window h3 { margin-bottom: 5px; }
#legend { position: absolute; top: 10; right: 10; z-index: -1; margin: 5px 5px 0 0; padding: 5px; background: #fff; border: 1px solid black; box-shadow: 3px 3px 7px #ccc; min-width: 80px; min-height: 50px; }
#legend span { width: 15px; height: 15px; display: block; float: left; margin-right: 3px; }
-
+#mapIndicie { min-width: 240px; }
/* data area */
-.measureDetails { background: #eee; padding-bottom: 10px; border-bottom: 1px solid #CFCFCF; border-radius: 7px; min-height: 496px; }
+.measureDetails { padding-bottom: 10px; border: 1px solid #CFCFCF; border-radius: 7px; min-height: 496px; }
.measureDetails h3, .measureDetails h4, .measureDetails div { padding-left: 10px; padding-right: 10px; }
.measureDetails h3 { margin-top: 0; text-align: left; background: #ccc; padding: 0 0 0 10px; font-size: 16px; line-height: 2; border-radius: 7px 7px 0 0; }
.measureDetails h4 { margin: 12px 0 0; }
.measureDetails h3, .measureDetails h4 { font-size: 16px; }
-.measureDetails h3 a { float: right; position: relative; text-decoration: none; color: #333; padding: 0 10px; border-left: 5px solid white; background: #a2d6eb; border-radius: 0 7px 0 0; }
-/* .measureDetails h3 a:hover { padding: 0 15px; } */
-.measureDetails h3 a:before,
-.measureDetails h3 a:after {
- content: "";
- position: absolute;
- /* Pushed down half way, will get pulled back up half height of triangle
- ensures centering if font-size or line-height changes */
- top: 50%;
- width: 0;
- height: 0;
-}
-.measureDetails h3 a:before {
- left: -12px;
- /* Triangle */
- border-top: 8px solid transparent;
- border-bottom: 8px solid transparent;
- border-right: 8px solid white;
- /* Pull-up */
- margin-top: -8px;
-}
-.measureDetails h3 a:after {
- /* Smaller and different position triangle */
- left: -5px;
- border-top: 6px solid transparent;
- border-bottom: 6px solid transparent;
- border-right: 6px solid #a2d6eb;
- margin-top: -6px;
-}
.quickLink { background: url("../img/quicklink.png") center right no-repeat; padding: 0 13px 0 0; }
-.ie7 .measureDetails h3 a { display: none; } /* hide the busted spiffy thing from IE7 */
#selectedNeighborhood { text-align: center; }
#details_chart { text-align: center; padding-top: 10px; }
-.measuredetails div img { max-width: 90%; }
+.measureDetails div img { max-width: 90%; }
#permalink a { font-size: 10px; }
#indicator_auxchart { margin-top: 15px; text-align: center; }
#indicator_quicklinks h4 { padding-left: 0; }
@@ -332,7 +311,9 @@ aside { float: left; width: 49%; min-width: 280px; padding-bottom: 10px; }
/* Metrics list */
-#metricslist h4 { margin: 5px 0; padding: 2px 4px; font-size: 1.1em; background: #F0EDE5; text-shadow: 1px 1px 3px white; }
+#metricslist { border: 1px solid #ccc; }
+#metricslist h4 { margin: 5px 0; padding: 2px 4px; font-size: 1.1em; background: #ccc; text-shadow: 1px 1px 3px white; }
+#metricslist :first-child { margin-top: 0 !important; }
#metricslist a { padding-left: 3px; text-decoration: none; }
#metricslist a:hover { text-decoration: underline; }
@@ -345,22 +326,35 @@ aside { float: left; width: 49%; min-width: 280px; padding-bottom: 10px; }
/* jquery ui tweaks */
.ui-autocomplete-loading { background: transparent url('../img/ui-anim_basic_16x16.gif') right no-repeat !important }
.ui-autocomplete .ui-menu-item { padding-left: 10px }
-.ui-autocomplete {
- overflow: auto;
- overflow-y: auto;
- overflow-x: hidden;
- font-size: 0.9em;
- font-weight: normal;
- max-height: 400px;
- box-shadow: 2px 2px 4px #666;
-}
-.ui-autocomplete-category {
- font-weight: bold;
- padding: 0 4px;
- line-height: 1.5;
- font-variant: small-caps;
- font-size: 14px;
-}
+.ui-autocomplete { overflow: auto; overflow-y: auto; overflow-x: hidden; font-size: 0.9em; font-weight: normal; max-height: 400px; box-shadow: 2px 2px 4px #666; }
+.ui-autocomplete-category { font-weight: bold; padding: 0 4px; line-height: 1.5; font-variant: small-caps; font-size: 14px; }
+
+/* jquery ui multiselect */
+.ui-multiselect { padding:2px 0 2px 4px; text-align:left }
+.ui-multiselect span.ui-icon { float:right }
+.ui-multiselect-single .ui-multiselect-checkboxes input { position:absolute !important; top: auto !important; left:-9999px; }
+.ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important }
+
+.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px }
+.ui-multiselect-header ul { font-size:0.9em }
+.ui-multiselect-header ul li { float:left; padding:0 10px 0 0 }
+.ui-multiselect-header a { text-decoration:none }
+.ui-multiselect-header a:hover { text-decoration:underline }
+.ui-multiselect-header span.ui-icon { float:left }
+.ui-multiselect-header li.ui-multiselect-close { float:right; text-align:right; padding-right:0 }
+
+.ui-multiselect-menu { display:none; padding:3px; position:absolute; z-index:10000; text-align: left }
+.ui-multiselect-checkboxes { position:relative /* fixes bug in IE6/7 */; overflow-y:scroll }
+.ui-multiselect-checkboxes label { cursor:default; display:block; border:1px solid transparent; padding:3px 1px }
+.ui-multiselect-checkboxes label input { position:relative; top:1px }
+.ui-multiselect-checkboxes li { clear:both; font-size:0.9em; padding-right:3px }
+.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { text-align:center; font-weight:bold; border-bottom:1px solid }
+.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; padding:3px; margin:1px 0; text-decoration:none }
+
+.ui-multiselect-hasfilter ul { position:relative; top:2px }
+.ui-multiselect-filter { float:left; margin-right:10px; font-size:11px }
+.ui-multiselect-filter input { width:100px; font-size:10px; margin-left:5px; height:15px; padding:2px; border:1px solid #292929; -webkit-appearance:textfield; -webkit-box-sizing:content-box; }
+
/* ==|== non-semantic helper classes ========================================
@@ -442,12 +436,8 @@ aside { float: left; width: 49%; min-width: 280px; padding-bottom: 10px; }
#container { box-shadow: none; padding-top: 30px; border: none; }
header { border-bottom: 2px solid black; }
header nav ul { display: none; }
- #title { height: 115px; }
+ #title { height: 65px; }
#search { display: none; }
- #maptools { display: none; }
- #tabs .ui-tabs-nav li { display: none; }
- #tabs .ui-tabs-nav li.ui-state-active { display: inherit; border:none; font-weight: bold; font-size: 18px; }
- #tabs .ui-widget-header, #tabs.ui-widget-content { border: none; }
.measureDetails { box-shadow: none; }
}
View
63 humans.txt
@@ -3,41 +3,44 @@
/* TEAM */
- <your title>: <your name>
- Site:
- Twitter:
- Location:
+ Tobin Bradley, Many Other Functions
+ Site: http://fuzzytolerance.info
+ Location: USA
/* THANKS */
Names (& URL):
/* SITE */
Standards: HTML5, CSS3
- Components: Modernizr, jQuery
- Software:
+ Components: Modernizr, jQuery, jQuery UI, Chosen plugin, Google Fusion Tables, Google Maps API
+ Software: Komodo Edit
+
+
-
- -o/-
- +oo//-
- :ooo+//:
- -ooooo///-
- /oooooo//:
- :ooooooo+//-
- -+oooooooo///-
- -://////////////+oooooooooo++////////////::
- :+ooooooooooooooooooooooooooooooooooooo+:::-
- -/+ooooooooooooooooooooooooooooooo+/::////:-
- -:+oooooooooooooooooooooooooooo/::///////:-
- --/+ooooooooooooooooooooo+::://////:-
- -:+ooooooooooooooooo+:://////:--
- /ooooooooooooooooo+//////:-
- -ooooooooooooooooooo////-
- /ooooooooo+oooooooooo//:
- :ooooooo+/::/+oooooooo+//-
- -oooooo/::///////+oooooo///-
- /ooo+::://////:---:/+oooo//:
- -o+/::///////:- -:/+o+//-
- :-:///////:- -:/://
- -////:- --//:
- -- -:
+ oooo$$$$$$$$$$$$oooo
+ oo$$$$$$$$$$$$$$$$$$$$$$$$o
+ oo$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$o o$ $$ o$
+ o $ oo o$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$o $$ $$ $$o$
+oo $ $ "$ o$$$$$$$$$ $$$$$$$$$$$$$ $$$$$$$$$o $$$o$$o$
+"$$$$$$o$ o$$$$$$$$$ $$$$$$$$$$$ $$$$$$$$$$o $$$$$$$$
+ $$$$$$$ $$$$$$$$$$$ $$$$$$$$$$$ $$$$$$$$$$$$$$$$$$$$$$$
+ $$$$$$$$$$$$$$$$$$$$$$$ $$$$$$$$$$$$$ $$$$$$$$$$$$$$ """$$$
+ "$$$""""$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ "$$$
+ $$$ o$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ "$$$o
+ o$$" $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ $$$o
+ $$$ $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$" "$$$$$$ooooo$$$$o
+ o$$$oooo$$$$$ $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ o$$$$$$$$$$$$$$$$$
+ $$$$$$$$"$$$$ $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ $$$$""""""""
+ """" $$$$ "$$$$$$$$$$$$$$$$$$$$$$$$$$$$" o$$$
+ "$$$o """$$$$$$$$$$$$$$$$$$"$$" $$$
+ $$$o "$$""$$$$$$"""" o$$$
+ $$$$o o$$$"
+ "$$$$o o$$$$$$o"$$$$o o$$$$
+ "$$$$$oo ""$$$$o$$$$$o o$$$$""
+ ""$$$$$oooo "$$$o$$$$$$$$$"""
+ ""$$$$$$$oo $$$$$$$$$$
+ """"$$$$$$$$$$$
+ $$$$$$$$$$$$
+ $$$$$$$$$$"
+ "$$$""""
View
0  img/beta_testing.jpg 100644 → 100755
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
0  img/quicklink.png 100644 → 100755
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
0  img/seals.png 100644 → 100755
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
0  img/seals.svg 100644 → 100755
File mode changed
View
0  img/site-logo.png 100644 → 100755
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
0  img/social/googleplus.png 100644 → 100755
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
41 index.html
@@ -23,7 +23,7 @@
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<!-- jQuery UI CSS -->
- <link type="text/css" media="all" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/south-street/jquery-ui.css" rel="stylesheet" />
+ <link type="text/css" media="all" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<!-- CSS: implied media=all -->
<link href='http://fonts.googleapis.com/css?family=Arvo' rel='stylesheet' type='text/css'>
@@ -43,13 +43,14 @@
<div id="container">
<header>
<div class="clearfix">
- <div id="google_translate_element"></div>
- <nav id="header_top_nav">
- <a href="http://www.charmeck.org/">CharMeck.org</a> |
- <a href="http://www.charmeck.org/city/charlotte/">City of Charlotte</a> |
- <a href="http://www.charmeck.org/mecklenburg/county/">Mecklenburg County</a> |
- <a href="http://www.uncc.edu/">UNC Charlotte</a>
- </nav>
+ <div id="event_calendar" class="header_top_nav screen-only"><a href="http://charmeck.org/eventcalendar/Pages/Default.aspx">Event Calendar</a> | </div>
+ <div id="google_translate_element" class="screen-only"></div>
+ <nav id="header_top_nav_right" class="header_top_nav screen-only">
+ <a href="http://www.charmeck.org/">CharMeck.org</a> |
+ <a href="http://www.charmeck.org/city/charlotte/">City of Charlotte</a> |
+ <a href="http://www.charmeck.org/mecklenburg/county/">Mecklenburg County</a> |
+ <a href="http://www.uncc.edu/">UNC Charlotte</a>
+ </nav>
</div>
<div id="title">
<h1>Quality of Life Dashboard</h1>
@@ -58,7 +59,7 @@
<ul>
<li><a href="javascript:void(0)" id="selectNone">Welcome</a></li>
<li><a href="javascript:void(0)" id="showMetricslist">Metrics</a></li>
- <li><a href="javascript:void(0)" id="report">Print Report</a></li>
+ <li><a href="javascript:void(0)" id="report">Report</a></li>
<li><a href="http://www.google.com/fusiontables/DataSource?snapid=S289817c03d" target="_blank">Access Data</a></li>
<li><a href="javascript:void(0)" id="tutorial">Video Tutorial</a></li>
<li><a href="https://github.com/tobinbradley/Mecklenburg-County-Quality-of-Life-Dashboard" title="github">Source Code</a></li>
@@ -75,15 +76,15 @@
<p><a href="javascript:void(0)">Help</a></p>
</div>
- <div id="map">
- <select id="mapIndicie"></select>
+ <div id="map">
+ <select id="mapIndicie" class=""></select>
<div id="map-canvas"></div>
<div id="legend" class="hidden"></div>
</div>
<aside>
<div id="welcome">
- <h3>Welcome the the Quality of Life Dashboard</h3>
+ <h3>Welcome to the Quality of Life Dashboard</h3>
<div id="welcomeCharts"></div>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a lorem id ipsum sagittis faucibus sit amet vel nisl. Cras vel eros felis, a volutpat lacus. Suspendisse potenti. Praesent a sem felis, et luctus justo. Nulla quis felis eu nisi vestibulum rhoncus at at orci. Mauris tempus, lorem et faucibus tincidunt, arcu nisl adipiscing velit, non placerat nulla nibh vitae neque. Pellentesque facilisis, enim nec pharetra eleifend, tortor arcu molestie diam, eu viverra ligula est eget magna. Curabitur id imperdiet metus. Sed nec ipsum adipiscing purus lobortis rutrum. Etiam luctus euismod nunc vitae molestie. Morbi vel diam erat.
@@ -151,12 +152,14 @@ <h4 id="selectedNeighborhood">Neighborhood</h4>
<!-- Create report dialog -->
<div id="report-dialog" title="Create PDF Report" class="hidden">
<form action="php/report.php" method="get" target="_blank">
- <input type="hidden" name="m" id="report_measures" value="">
<h4>Neighborhood</h4>
<p>
<select id="report_neighborhood" name="n"></select>
</p>
- <p id="report-metrics"></p>
+ <h4>Metrics</h4>
+ <p id="report_measures">
+ <select id="report_metrics" multiple="multiple" name="m[]"></select>
+ </p>
<input type="submit" id="submitPDFReport" name="mysubmit" value="Go!" />
<a href="php/report.php" target="_blank" class="hidden">Try Work in Progress</a>
</form>
@@ -194,13 +197,13 @@ <h4 id="selectedNeighborhood">Neighborhood</h4>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
- <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
+ <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+ <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<!-- scripts concatenated and minified via ant build script-->
- <script defer src="js/plugins.js"></script>
- <script defer src="js/map.js"></script>
- <script defer src="js/script.js"></script>
+ <script src="js/plugins.js"></script>
+ <script src="js/map.js"></script>
+ <script src="js/script.js"></script>
<!-- end scripts-->
<!-- Google Translate -->
View
24 js/map.js
@@ -28,10 +28,12 @@ function mapInit() {
//add a click listener to the layer
google.maps.event.addListener(layer, 'click', function(e) {
//update the content of the InfoWindow
- e.infoWindowHtml = '<div class="googft-info-window"><h3>Neighborhood ' + e.row['ID'].value + "</h3>";
- e.infoWindowHtml += 'Score: ' + e.row[$("#mapIndicie option:selected").val()].value + '<br />';
+ e.infoWindowHtml = '<div class="googft-info-window">';
+ e.infoWindowHtml += '<h3>Neighborhood ' + e.row['ID'].value + "</h3>";
+ e.infoWindowHtml += '<strong>' + $("#mapIndicie option:selected").html() + '</strong><br />';
theID = $("#mapIndicie option:selected").val();
- e.infoWindowHtml += 'County Average: ' + countyAverage["AVERAGE(" + theID + ")"] + '<br />';
+ e.infoWindowHtml += 'Score: ' + e.row[$("#mapIndicie option:selected").val()].value + FTmeta[theID].style.units + '<br />';
+ e.infoWindowHtml += 'County Average: ' + countyAverage[theID] + FTmeta[theID].style.units + '<br />';
e.infoWindowHtml += '<p><a href="javascript:void(0)" onclick="selectNeighborhoodByID(' + e.row['ID'].value + ')">Select Neighborhood</a></p>';
e.infoWindowHtml += "</div>";
});
@@ -196,6 +198,22 @@ function styleMap() {
var style = [
{
+ featureType: 'all',
+ stylers: [{
+ saturation: -99
+ }]
+ }, {
+ featureType: 'poi',
+ stylers: [{
+ visibility: 'off'
+ }]
+ }, {
+ featureType: 'road',
+ stylers: [{
+ visibility: 'off'
+ }]
+ },
+ {
featureType: "administrative.locality",
elementType: "labels",
stylers: [
View
8 js/metrics.json 100644 → 100755
@@ -45,7 +45,7 @@
"tech_notes": "Data derived from the American Community Survey and only measures mode of transit from home to work.",
"source": "U.S. Census American Community Survey",
"links": {"text": [ "CATS Carpooling", "Guide for Bicyclists and Pedstrians" ], "links": [ "http://charmeck.org/city/charlotte/cats/commuting/Carpool/Pages/default.aspx", "http://charmeck.org/city/charlotte/cats/commuting/ETC/Pages/companies%20in%20ETC.aspx" ]},
- "style": { "type": "range", "units": "%", "breaks": ["0", "25", "50", "75"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
+ "style": { "type": "range", "units": "%", "breaks": ["0", "5", "10", "15", "20"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
},
"commute_carpool" : {
"field": "commute_carpool",
@@ -141,7 +141,7 @@
"tech_notes": "Data derived from the American Community Survey and only measures mode of transit from home to work.",
"source": "U.S. Census American Community Survey",
"links": {"text": [ "CATS Carpooling", "Guide for Bicyclists and Pedstrians" ], "links": [ "http://charmeck.org/city/charlotte/cats/commuting/Carpool/Pages/default.aspx", "http://charmeck.org/city/charlotte/cats/commuting/ETC/Pages/companies%20in%20ETC.aspx" ]},
- "style": { "type": "range", "units": "%", "breaks": ["0", "1", "3", "5", "7"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
+ "style": { "type": "range", "units": "%", "breaks": ["0", "1", "2", "3", "4"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
},
"commute_walk" : {
"field": "commute_walk",
@@ -153,7 +153,7 @@
"tech_notes": "Data derived from the American Community Survey and only measures mode of transit from home to work.",
"source": "U.S. Census American Community Survey",
"links": {"text": [ "CATS Carpooling", "Guide for Bicyclists and Pedstrians" ], "links": [ "http://charmeck.org/city/charlotte/cats/commuting/Carpool/Pages/default.aspx", "http://charmeck.org/city/charlotte/cats/commuting/ETC/Pages/companies%20in%20ETC.aspx" ]},
- "style": { "type": "range", "units": "%", "breaks": ["0", "25", "50", "75"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
+ "style": { "type": "range", "units": "%", "breaks": ["0", "1", "3", "5", "7"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
},
"commute_other" : {
"field": "commute_other",
@@ -177,7 +177,7 @@
"tech_notes": "Data derived from the American Community Survey and only measures mode of transit from home to work.",
"source": "U.S. Census American Community Survey",
"links": {"text": [ "CATS Carpooling", "Guide for Bicyclists and Pedstrians" ], "links": [ "http://charmeck.org/city/charlotte/cats/commuting/Carpool/Pages/default.aspx", "http://charmeck.org/city/charlotte/cats/commuting/ETC/Pages/companies%20in%20ETC.aspx" ]},
- "style": { "type": "range", "units": "%", "breaks": ["0", "25", "50", "75"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
+ "style": { "type": "range", "units": "%", "breaks": ["0", "2", "4", "6", "8"] , "colors": ["#d9d2e9", "#b4a7d6", "#8e7cc3", "#674ea7", "#351c75"] }
},
"health_1" : {
"field": "health_1",
View
40 js/plugins.js
@@ -97,3 +97,43 @@ function sortAlpha(a, b) {
function randomHexColor() {
return Math.floor(Math.random()*16777215).toString(16);
}
+
+
+
+/*
+ * jQuery MultiSelect UI Widget 1.12
+ * Copyright (c) 2011 Eric Hynds
+ *
+ * http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/
+ *
+ * Depends:
+ * - jQuery 1.4.2+
+ * - jQuery UI 1.8 widget factory
+ *
+ * Optional:
+ * - jQuery UI effects
+ * - jQuery UI position utility
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ * http://www.opensource.org/licenses/mit-license.php
+ * http://www.gnu.org/licenses/gpl.html
+ *
+ */
+(function(d){var j=0;d.widget("ech.multiselect",{options:{header:!0,height:175,minWidth:225,classes:"",checkAllText:"Check all",uncheckAllText:"Uncheck all",noneSelectedText:"Select options",selectedText:"# selected",selectedList:0,show:"",hide:"",autoOpen:!1,multiple:!0,position:{}},_create:function(){var a=this.element.hide(),b=this.options;this.speed=d.fx.speeds._default;this._isOpen=!1;a=(this.button=d('<button type="button"><span class="ui-icon ui-icon-triangle-2-n-s"></span></button>')).addClass("ui-multiselect ui-widget ui-state-default ui-corner-all").addClass(b.classes).attr({title:a.attr("title"), "aria-haspopup":!0,tabIndex:a.attr("tabIndex")}).insertAfter(a);(this.buttonlabel=d("<span />")).html(b.noneSelectedText).appendTo(a);var a=(this.menu=d("<div />")).addClass("ui-multiselect-menu ui-widget ui-widget-content ui-corner-all").addClass(b.classes).appendTo(document.body),c=(this.header=d("<div />")).addClass("ui-widget-header ui-corner-all ui-multiselect-header ui-helper-clearfix").appendTo(a);(this.headerLinkContainer=d("<ul />")).addClass("ui-helper-reset").html(function(){return!0=== b.header?'<li><a class="ui-multiselect-all" href="#"><span class="ui-icon ui-icon-check"></span><span>'+b.checkAllText+'</span></a></li><li><a class="ui-multiselect-none" href="#"><span class="ui-icon ui-icon-closethick"></span><span>'+b.uncheckAllText+"</span></a></li>":"string"===typeof b.header?"<li>"+b.header+"</li>":""}).append('<li class="ui-multiselect-close"><a href="#" class="ui-multiselect-close"><span class="ui-icon ui-icon-circle-close"></span></a></li>').appendTo(c);(this.checkboxContainer= d("<ul />")).addClass("ui-multiselect-checkboxes ui-helper-reset").appendTo(a);this._bindEvents();this.refresh(!0);b.multiple||a.addClass("ui-multiselect-single")},_init:function(){!1===this.options.header&&this.header.hide();this.options.multiple||this.headerLinkContainer.find(".ui-multiselect-all, .ui-multiselect-none").hide();this.options.autoOpen&&this.open();this.element.is(":disabled")&&this.disable()},refresh:function(a){var b=this.element,c=this.options,e=this.menu,h=this.checkboxContainer, g=[],f=[],i=b.attr("id")||j++;b.find("option").each(function(b){d(this);var a=this.parentNode,e=this.innerHTML,h=this.title,j=this.value,b=this.id||"ui-multiselect-"+i+"-option-"+b,k=this.disabled,m=this.selected,l=["ui-corner-all"];"optgroup"===a.tagName.toLowerCase()&&(a=a.getAttribute("label"),-1===d.inArray(a,g)&&(f.push('<li class="ui-multiselect-optgroup-label"><a href="#">'+a+"</a></li>"),g.push(a)));k&&l.push("ui-state-disabled");m&&!c.multiple&&l.push("ui-state-active");f.push('<li class="'+ (k?"ui-multiselect-disabled":"")+'">');f.push('<label for="'+b+'" title="'+h+'" class="'+l.join(" ")+'">');f.push('<input id="'+b+'" name="multiselect_'+i+'" type="'+(c.multiple?"checkbox":"radio")+'" value="'+j+'" title="'+e+'"');m&&(f.push(' checked="checked"'),f.push(' aria-selected="true"'));k&&(f.push(' disabled="disabled"'),f.push(' aria-disabled="true"'));f.push(" /><span>"+e+"</span></label></li>")});h.html(f.join(""));this.labels=e.find("label");this._setButtonWidth();this._setMenuWidth(); this.button[0].defaultValue=this.update();a||this._trigger("refresh")},update:function(){var a=this.options,b=this.labels.find("input"),c=b.filter("[checked]"),e=c.length,a=0===e?a.noneSelectedText:d.isFunction(a.selectedText)?a.selectedText.call(this,e,b.length,c.get()):/\d/.test(a.selectedList)&&0<a.selectedList&&e<=a.selectedList?c.map(function(){return d(this).next().text()}).get().join(", "):a.selectedText.replace("#",e).replace("#",b.length);this.buttonlabel.html(a);return a},_bindEvents:function(){function a(){b[b._isOpen? "close":"open"]();return!1}var b=this,c=this.button;c.find("span").bind("click.multiselect",a);c.bind({click:a,keypress:function(a){switch(a.which){case 27:case 38:case 37:b.close();break;case 39:case 40:b.open()}},mouseenter:function(){c.hasClass("ui-state-disabled")||d(this).addClass("ui-state-hover")},mouseleave:function(){d(this).removeClass("ui-state-hover")},focus:function(){c.hasClass("ui-state-disabled")||d(this).addClass("ui-state-focus")},blur:function(){d(this).removeClass("ui-state-focus")}}); this.header.delegate("a","click.multiselect",function(a){if(d(this).hasClass("ui-multiselect-close"))b.close();else b[d(this).hasClass("ui-multiselect-all")?"checkAll":"uncheckAll"]();a.preventDefault()});this.menu.delegate("li.ui-multiselect-optgroup-label a","click.multiselect",function(a){a.preventDefault();var c=d(this),g=c.parent().nextUntil("li.ui-multiselect-optgroup-label").find("input:visible:not(:disabled)"),f=g.get(),c=c.parent().text();!1!==b._trigger("beforeoptgrouptoggle",a,{inputs:f, label:c})&&(b._toggleChecked(g.filter("[checked]").length!==g.length,g),b._trigger("optgrouptoggle",a,{inputs:f,label:c,checked:f[0].checked}))}).delegate("label","mouseenter.multiselect",function(){d(this).hasClass("ui-state-disabled")||(b.labels.removeClass("ui-state-hover"),d(this).addClass("ui-state-hover").find("input").focus())}).delegate("label","keydown.multiselect",function(a){a.preventDefault();switch(a.which){case 9:case 27:b.close();break;case 38:case 40:case 37:case 39:b._traverse(a.which, this);break;case 13:d(this).find("input")[0].click()}}).delegate('input[type="checkbox"], input[type="radio"]',"click.multiselect",function(a){var c=d(this),g=this.value,f=this.checked,i=b.element.find("option");this.disabled||!1===b._trigger("click",a,{value:g,text:this.title,checked:f})?a.preventDefault():(c.focus(),c.attr("aria-selected",f),i.each(function(){if(this.value===g)this.selected=f;else if(!b.options.multiple)this.selected=!1}),b.options.multiple||(b.labels.removeClass("ui-state-active"), c.closest("label").toggleClass("ui-state-active",f),b.close()),b.element.trigger("change"),setTimeout(d.proxy(b.update,b),10))});d(document).bind("mousedown.multiselect",function(a){b._isOpen&&!d.contains(b.menu[0],a.target)&&!d.contains(b.button[0],a.target)&&a.target!==b.button[0]&&b.close()});d(this.element[0].form).bind("reset.multiselect",function(){setTimeout(d.proxy(b.refresh,b),10)})},_setButtonWidth:function(){var a=this.element.outerWidth(),b=this.options;if(/\d/.test(b.minWidth)&&a<b.minWidth)a= b.minWidth;this.button.width(a)},_setMenuWidth:function(){var a=this.menu,b=this.button.outerWidth()-parseInt(a.css("padding-left"),10)-parseInt(a.css("padding-right"),10)-parseInt(a.css("border-right-width"),10)-parseInt(a.css("border-left-width"),10);a.width(b||this.button.outerWidth())},_traverse:function(a,b){var c=d(b),e=38===a||37===a,c=c.parent()[e?"prevAll":"nextAll"]("li:not(.ui-multiselect-disabled, .ui-multiselect-optgroup-label)")[e?"last":"first"]();c.length?c.find("label").trigger("mouseover"): (c=this.menu.find("ul").last(),this.menu.find("label")[e?"last":"first"]().trigger("mouseover"),c.scrollTop(e?c.height():0))},_toggleState:function(a,b){return function(){this.disabled||(this[a]=b);b?this.setAttribute("aria-selected",!0):this.removeAttribute("aria-selected")}},_toggleChecked:function(a,b){var c=b&&b.length?b:this.labels.find("input"),e=this;c.each(this._toggleState("checked",a));c.eq(0).focus();this.update();var h=c.map(function(){return this.value}).get();this.element.find("option").each(function(){!this.disabled&& -1<d.inArray(this.value,h)&&e._toggleState("selected",a).call(this)});c.length&&this.element.trigger("change")},_toggleDisabled:function(a){this.button.attr({disabled:a,"aria-disabled":a})[a?"addClass":"removeClass"]("ui-state-disabled");this.menu.find("input").attr({disabled:a,"aria-disabled":a}).parent()[a?"addClass":"removeClass"]("ui-state-disabled");this.element.attr({disabled:a,"aria-disabled":a})},open:function(){var a=this.button,b=this.menu,c=this.speed,e=this.options;if(!(!1===this._trigger("beforeopen")|| a.hasClass("ui-state-disabled")||this._isOpen)){var h=b.find("ul").last(),g=e.show,f=a.offset();d.isArray(e.show)&&(g=e.show[0],c=e.show[1]||this.speed);h.scrollTop(0).height(e.height);d.ui.position&&!d.isEmptyObject(e.position)?(e.position.of=e.position.of||a,b.show().position(e.position).hide().show(g,c)):b.css({top:f.top+a.outerHeight(),left:f.left}).show(g,c);this.labels.eq(0).trigger("mouseover").trigger("mouseenter").find("input").trigger("focus");a.addClass("ui-state-active");this._isOpen= !0;this._trigger("open")}},close:function(){if(!1!==this._trigger("beforeclose")){var a=this.options,b=a.hide,c=this.speed;d.isArray(a.hide)&&(b=a.hide[0],c=a.hide[1]||this.speed);this.menu.hide(b,c);this.button.removeClass("ui-state-active").trigger("blur").trigger("mouseleave");this._isOpen=!1;this._trigger("close")}},enable:function(){this._toggleDisabled(!1)},disable:function(){this._toggleDisabled(!0)},checkAll:function(){this._toggleChecked(!0);this._trigger("checkAll")},uncheckAll:function(){this._toggleChecked(!1); this._trigger("uncheckAll")},getChecked:function(){return this.menu.find("input").filter("[checked]")},destroy:function(){d.Widget.prototype.destroy.call(this);this.button.remove();this.menu.remove();this.element.show();return this},isOpen:function(){return this._isOpen},widget:function(){return this.menu},_setOption:function(a,b){var c=this.menu;switch(a){case "header":c.find("div.ui-multiselect-header")[b?"show":"hide"]();break;case "checkAllText":c.find("a.ui-multiselect-all span").eq(-1).text(b); break;case "uncheckAllText":c.find("a.ui-multiselect-none span").eq(-1).text(b);break;case "height":c.find("ul").last().height(parseInt(b,10));break;case "minWidth":this.options[a]=parseInt(b,10);this._setButtonWidth();this._setMenuWidth();break;case "selectedText":case "selectedList":case "noneSelectedText":this.options[a]=b;this.update();break;case "classes":c.add(this.button).removeClass(this.options.classes).addClass(b)}d.Widget.prototype._setOption.apply(this,arguments)}})})(jQuery);
+
+
+/*
+ * jQuery MultiSelect UI Widget Filtering Plugin 1.4
+ * Copyright (c) 2011 Eric Hynds
+ *
+ * http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/
+ *
+ * Depends:
+ * - jQuery UI MultiSelect widget
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ * http://www.opensource.org/licenses/mit-license.php
+ * http://www.gnu.org/licenses/gpl.html
+ *
+*/
+(function(a){var f=/[\-\[\]{}()*+?.,\\\^$|#\s]/g;a.widget("ech.multiselectfilter",{options:{label:"Filter:",width:null,placeholder:"Enter keywords",autoReset:!1},_create:function(){var e;var b=this,c=this.options,d=this.instance=a(this.element).data("multiselect");this.header=d.menu.find(".ui-multiselect-header").addClass("ui-multiselect-hasfilter");e=this.wrapper=a('<div class="ui-multiselect-filter">'+(c.label.length?c.label:"")+'<input placeholder="'+c.placeholder+'" type="search"'+(/\d/.test(c.width)? 'style="width:'+c.width+'px"':"")+" /></div>").prependTo(this.header),c=e;this.inputs=d.menu.find('input[type="checkbox"], input[type="radio"]');this.input=c.find("input").bind({keydown:function(a){13===a.which&&a.preventDefault()},keyup:a.proxy(b._handler,b),click:a.proxy(b._handler,b)});this.updateCache();d._toggleChecked=function(c,d){var e=d&&d.length?d:this.labels.find("input"),i=this,e=e.not(b.instance._isOpen?":disabled, :hidden":":disabled").each(this._toggleState("checked",c));this.update(); var j=e.map(function(){return this.value}).get();this.element.find("option").filter(function(){!this.disabled&&-1<a.inArray(this.value,j)&&i._toggleState("selected",c).call(this)})};d=a(document).bind("multiselectrefresh",function(){b.updateCache();b._handler()});this.options.autoReset&&d.bind("multiselectclose",a.proxy(this._reset,this))},_handler:function(b){var c=a.trim(this.input[0].value.toLowerCase()),d=this.rows,g=this.inputs,h=this.cache;if(c){d.hide();var e=RegExp(c.replace(f,"\\$&"),"gi"); this._trigger("filter",b,a.map(h,function(a,b){return-1!==a.search(e)?(d.eq(b).show(),g.get(b)):null}))}else d.show();this.instance.menu.find(".ui-multiselect-optgroup-label").each(function(){var b=a(this),c=b.nextUntil(".ui-multiselect-optgroup-label").filter(function(){return"none"!==a.css(this,"display")}).length;b[c?"show":"hide"]()})},_reset:function(){this.input.val("").trigger("keyup")},updateCache:function(){this.rows=this.instance.menu.find(".ui-multiselect-checkboxes li:not(.ui-multiselect-optgroup-label)");this.cache=this.element.children().map(function(){var b=a(this);"optgroup"===this.tagName.toLowerCase()&&(b=b.children());return b.map(function(){return this.innerHTML.toLowerCase()}).get()}).get()},widget:function(){return this.wrapper},destroy:function(){a.Widget.prototype.destroy.call(this);this.input.val("").trigger("keyup");this.wrapper.remove()}})})(jQuery);
View
87 js/script.js
@@ -19,13 +19,16 @@ Purples
*/
/**
- * Map Configuration Elements
+ * Map Configuration Elements - customize for your location
*/
var mapCenterZoom = { lat: 35.260, lng: -80.817, zoom: 10 };
$(document).ready(function() {
-
+
+ // Ugly hack to fix vertical spacing problem on google translate gadget
+ if ($.browser.webkit) $("#google_translate_element").css("padding-top", "0");
+
// Load JSON metric configuration
$.ajax({
url: "js/metrics.json",
@@ -40,7 +43,7 @@ $(document).ready(function() {
// Dialogs
$("#report-dialog").dialog({ width: 360, maxHeight: 550, autoOpen: false, show: 'fade', hide: 'fade', modal: true });
$("#tutorial-dialog").dialog({ width: 510, autoOpen: false, show: 'fade', hide: 'fade', modal: true });
- $("#search-dialog").dialog({ width: 320, autoOpen: false, show: 'fade', hide: 'fade', modal: true });
+ $("#search-dialog").dialog({ width: 320, autoOpen: false, show: 'fade', hide: 'fade', modal: false });
$("#disclaimer-dialog").dialog({ width: 550, autoOpen: false, show: 'fade', hide: 'fade', modal: true });
// Click events
@@ -48,36 +51,40 @@ $(document).ready(function() {
$("#tutorial").click(function(){ $('#tutorial-dialog').dialog('open') });
$("#search p a").click(function(){ $('#search-dialog').dialog('open') });
$("#searchbox").click(function() { $(this).select(); });
-
- // Set hidden value in PDF report form
- $("#report-dialog").delegate("input[type=checkbox]", "change", function(){
- reportCheckboxBuffer = [];
- $("#report-dialog input[type=checkbox]").each(function() {
- if ($(this).is(":checked")) reportCheckboxBuffer.push( $(this).attr("id") );
- });
- $("#report_measures").val(reportCheckboxBuffer.join());
- });
-
- // Add elements to mapIndicie
- writebuffer = "";
- $.each(FTmeta, function(index) {
- writebuffer += '<option value="' + this.field + '">' + this.title + '</option>';
- });
- $("#mapIndicie").append(writebuffer);
- $("#mapIndicie option").sort(sortAlpha).appendTo("#mapIndicie");
-
- // Select first element of mapIndicie
- $("#mapIndicie option").first().attr('selected', 'selected');
-
- // return to initial layout
$("#selectNone").click(function(){
$("#selected-summary, #metricslist").hide();
- $("#welcome").show("fade", {}, 1000);
+ $("#welcome").show("fade", {}, 1500);
});
$("#showMetricslist").click(function(){
$("#selected-summary, #welcome").hide();
- $("#metricslist").show("fade", {}, 1000);
- });
+ $("#metricslist").show("fade", {}, 1500);
+ });
+
+
+ // MapIndicie, report, metrics list data
+ writebuffer = "";
+ writebuffer2 = "";
+ category = "";
+ $.each(FTmeta, function(index) {
+ if (index == 0 || this.category != category) {
+ if (index != 0) writebuffer += '</optgroup>';
+ writebuffer += '<optgroup label="' + capitaliseFirstLetter(this.category) + '">';
+ writebuffer2 += "<h4>" + capitaliseFirstLetter(this.category) + "</h4>";
+ category = this.category;
+ }
+ writebuffer += '<option value="' + this.field + '">' + this.title + '</option>';
+ writebuffer2 += '<a href="javascript:void(0)" onclick="quickLink(\'' + this.field + '\')" class="quickLink">' + this.title + '</a><br />';
+ });
+ writebuffer += '</optgroup>';
+ $("#mapIndicie, #report_metrics").html(writebuffer);
+ $("#metricslist").html(writebuffer2);
+ $("#mapIndicie option").sort(sortAlpha).appendTo("#mapIndicie");
+ //$("#report_metrics optgroup option").sort(sortAlpha).appendTo("#report_metrics");
+ var options = $("#mapIndicie > option");
+ var random = Math.floor(options.length * (Math.random() % 1));
+ options.eq(random).attr('selected',true);
+ $("#map select").multiselect({ multiple: false, selectedList: 1}).multiselectfilter();
+ $("#report_measures select").multiselect().multiselectfilter();
// Map measure drop down list
@@ -88,6 +95,7 @@ $(document).ready(function() {
// update data
if (jQuery.isEmptyObject(activeRecord) == false) updateData(measure);
});
+
// Autocomplete
$("#searchbox").autocomplete({
@@ -224,24 +232,8 @@ $(window).load(function(){
}
});
- // Load measures into report and metrics list
- measurebuffer = "<h4>Character</h4>";
- measurebuffer2 = measurebuffer;
- measureCategory = "character";
- $.each(FTmeta, function(index) {
- if (this.category != measureCategory) {
- measurebuffer += "<h4>" + capitaliseFirstLetter(this.category) + "</h4>";
- measurebuffer2 += "<h4>" + capitaliseFirstLetter(this.category) + "</h4>";
- measureCategory = this.category;
- }
- measurebuffer += '<input type="checkbox" id="' + this.field + '" /><label for="' + this.field + '">' + this.title + '</label><br />';
- measurebuffer2 += '<a href="javascript:void(0)" onclick="quickLink(\'' + this.field + '\')" class="quickLink">' + this.title + '</a><br />';
- });
- $("#report-metrics").append(measurebuffer);
- $("#metricslist").append(measurebuffer2);
-
- // Detect arguments
+ // Detect arguments
if (getUrlVars()["n"]) {
selectNeighborhoodByID(getUrlVars()["n"]);
}
@@ -253,6 +245,7 @@ $(window).load(function(){
*/
function quickLink(theMeasure) {
$("#mapIndicie").val(theMeasure).attr('selected', 'selected');
+ $("#map select").multiselect('refresh');
styleFusionTable(FTmeta[theMeasure]);
$("#mapIndicie").trigger("change");
if (jQuery.isEmptyObject(activeRecord) == false) {
@@ -288,7 +281,7 @@ function updateData(measure) {
$("#selectedNeighborhood").html("Neighborhood " + activeRecord.ID + "<br />" + activeRecord[measure.field] + measure.style.units);
// set details info
- $(".measureDetails h3").html(measure.title + '<a href="javascript:void(0)" class="transition">' + capitaliseFirstLetter(measure.category) + '</a>' );
+ $(".measureDetails h3").html(measure.title );
$("#indicator_description").html(measure.description);
$("#indicator_why").html(measure.importance);
$("#indicator_technical").html(measure.tech_notes);
@@ -322,7 +315,7 @@ function updateData(measure) {
// Show
$("#welcome, #metricslist").hide();
- $("#selected-summary").show("fade", {}, 400);
+ $("#selected-summary").show("fade", {}, 1500);
}
View
0  php/gft.php 100644 → 100755
File mode changed
View
5 php/report.php
@@ -22,8 +22,7 @@
* Get form variables
*/
$neighborhood = $_REQUEST['n'];
-$measures = explode(",", urldecode($_REQUEST['m']));
-
+$measures = $_REQUEST['m'];
/**
* Load data JSON
@@ -49,7 +48,7 @@ function getFieldsArray($data) {
/**
* Load neighborhood information from Google Fusion Tables
*/
-if (strlen(urldecode($_REQUEST['m'])) > 0) {
+if (count($measures) > 0) {
// neighborhood
$ft = new googleFusion();
$gft_neighborhood = $ft->query("select " . implode(",", $measures) . " FROM " . $tableID . " WHERE ID = " . $neighborhood);
Please sign in to comment.
Something went wrong with that request. Please try again.