From c9a27d7f11703167f9eab12dcb605788cc695d6f Mon Sep 17 00:00:00 2001 From: tworrall Date: Fri, 16 Nov 2012 15:56:18 -0500 Subject: [PATCH] Changes to support collapsible/expandable property groups on the profile pages. --- .../individual/individual-property-groups.css | 32 +++++ .../images/individual/collapse-prop-group.png | Bin 0 -> 3073 bytes .../images/individual/expand-prop-group.png | Bin 0 -> 3047 bytes webapp/web/js/amplify/amplify.store.min.js | 10 ++ .../js/individual/propertyGroupControls.js | 115 ++++++++++++++++++ 5 files changed, 157 insertions(+) create mode 100644 webapp/web/css/individual/individual-property-groups.css create mode 100644 webapp/web/images/individual/collapse-prop-group.png create mode 100644 webapp/web/images/individual/expand-prop-group.png create mode 100644 webapp/web/js/amplify/amplify.store.min.js create mode 100644 webapp/web/js/individual/propertyGroupControls.js diff --git a/webapp/web/css/individual/individual-property-groups.css b/webapp/web/css/individual/individual-property-groups.css new file mode 100644 index 000000000..7edcb4011 --- /dev/null +++ b/webapp/web/css/individual/individual-property-groups.css @@ -0,0 +1,32 @@ +/* $This file is distributed under the terms of the license in /doc/license.txt$ */ + +span#toggleContainer { + float:right; + padding:10px 8px 0 0; + font-size: 0.85em; +} +section.property-group h2 { + padding: 8px 10px 4px 12px; +} +.scroll-up { + position: absolute; + width: 21px; + height: 30px; + top: 8px; /* changed for redesign, was 0 */ + right: 12px; /* changed for redesign, was -21px;*/ +} +section.property-group div { + margin-top:15px; + display:none; +} +section.property-group h2 { + font-size: 1.15em !important; + color: #5e6363 !important; + font-weight: normal !important; + background: #fafaf9 !important; +} +/* this class is referenced in java script; the important is needed to override the color in the previous selector */ +section.property-group h2.expandedPropGroupH2 { + background:#e4ecf3 !important; + color:#2485ae !important; +} diff --git a/webapp/web/images/individual/collapse-prop-group.png b/webapp/web/images/individual/collapse-prop-group.png new file mode 100644 index 0000000000000000000000000000000000000000..fac863a85a00dbb96d98e27d5b7010191037a8d9 GIT binary patch literal 3073 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 P00000NkvXXu0mjff4JFD literal 0 HcmV?d00001 diff --git a/webapp/web/images/individual/expand-prop-group.png b/webapp/web/images/individual/expand-prop-group.png new file mode 100644 index 0000000000000000000000000000000000000000..26b57a7715d493a67a4693c80879868469a24bc6 GIT binary patch literal 3047 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 -1 ) { + $.each($('section.property-group'), function() { + $("div[id='" + $(this).attr("id") + "Group']").slideDown(222); + var innerSrc = $(this).children("nav").children("img").attr("src"); + $(this).children("nav").children("img").attr("src",innerSrc.replace("expand-prop-group","collapse-prop-group")); + $(this).children("h2").addClass("expandedPropGroupH2"); + }); + $(this).html("collapse all"); + } + else { + $.each($('section.property-group'), function() { + $("div[id='" + $(this).attr("id") + "Group']").slideUp(222); + var innerSrc = $(this).children("nav").children("img").attr("src"); + $(this).children("nav").children("img").attr("src",innerSrc.replace("collapse-prop-group","expand-prop-group")); + $(this).children("h2").removeClass("expandedPropGroupH2"); + }); + $(this).html("expand all"); + } + manageLocalStorage(); + }); + }); + + // Next two functions -- keep track of which property group tabs have been expanded, + // so if we return from a custom form or a related individual, even via the back button, + // the property groups will be expanded as before. + function manageLocalStorage() { + var localName = this.individualLocalName; + // is this individual already stored? If not, how many have been stored? + // If the answer is 3, remove the first one in before adding the new one + var current = amplify.store(localName); + var profiles = amplify.store("profiles"); + if ( current == undefined ) { + if ( profiles == undefined ) { + var lnArray = []; + lnArray.push(localName); + amplify.store("profiles", lnArray); + } + else if ( profiles != undefined && profiles.length >= 3 ) { + firstItem = profiles[0]; + amplify.store(firstItem, null); + profiles.splice(0,1); + profiles.push(localName); + amplify.store("profiles", profiles) + } + else if ( profiles != undefined && profiles.length < 3 ) { + profiles.push(localName); + amplify.store("profiles", profiles) + } + } + var groups = []; + $.each($('section.property-group').children("nav").children("img"), function() { + if ( $(this).attr('src').indexOf('collapse-prop-group') > -1 ) { + groups.push($(this).attr('groupName')); + } + }); + amplify.store(localName, groups); + var checkLength = amplify.store(localName); + if ( checkLength.length == 0 ) { + amplify.store(localName, null); + } + } + + function retrieveLocalStorage() { + var localName = this.individualLocalName; + var groups = amplify.store(individualLocalName); + if ( groups != undefined ) { + for ( i = 0; i < groups.length; i++) { + var groupName = groups[i]; + // unlikely, but it's possible a group that was previously opened and stored won't be displayed + // because the object properties would have been deleted. So ensure that the group in local + // storage has been rendered on the page. More likely, a user navigated from a quick view to a full + // profile, opened a group, then navigated back to the quick view where the group isn't rendered. + if ($("section#" + groupName).length ) { + $("div[id='" + groupName + "Group']").slideDown(1); + $("img[groupName='" + groupName + "']").attr("src", $("img[groupName='" + groupName + "']").attr("src").replace("expand-prop-group","collapse-prop-group")); + $("section#" + groupName).children("h2").addClass("expandedPropGroupH2"); + } + } + if ( groups.length == $('section.property-group').length ) { + $('a#propertyGroupsToggle').html('collapse all'); + } + } + } +});