I thought I would post my apex and visualforce code used to build my first Force.com Site – the one listed on the Force.com Sites Gallery.
In total, it is:
- 1 apex class – custom extension
- 1 apex test class
- 3 visualforce pages
- 1 CSS file
- A small amount of on-page javascript
Here is the custom extension:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 | public class MyPropertyExtension {
//The standard controller on which this extension is based
Property__c prop;
//Properties of this class
public String market {get;set;}
public String country {get;set;}
List<Market> allMarkets = new List<Market>();
Set<String> allCountries = new Set<String>();
//Contructor
public MyPropertyExtension() {
//set the default country
country = 'United States';
//call the getAvailableMarketsAndCountries method to establish what markets actually have available properties
getAvailableMarketsAndCountries();
//on page load, get the market param from the URL and determine if it is a market that actually has available properties
String marketParam = ApexPages.currentPage().getParameters().get('market');
if(marketParam != ''){
for(Market mk : allMarkets){
if(mk.Name == marketParam){
//if the market is in the list of markets with available properties, set the 'country' variable to that markets associated country
country = mk.Country;
market = mk.Name;
}
}
}
}
//Constructor
public MyPropertyExtension(ApexPages.StandardController PropertyController) {
this.prop = (Property__c)PropertyController.getRecord();
}
//Constructor for test methods
public MyPropertyExtension(Property__c testProp){
this.prop = testProp;
}
//Used on the locator details page to list out all related Suite__c child objects where Record Type = TKD
public List<Suite__c> getTKDSuiteRecords() {
return [Select Name, Status__c, Property__c, Total_Raised_Floor_sqft__c, KVA__c, kW_of_UPS__c, (Select Id, Type__C From Spec_Sheets__r sp WHERE (sp.Marketing_Approved__c = TRUE) AND (sp.Type__c = 'Turn-Key Datacenter') LIMIT 1), (Select Id, Title, Type__c From Content__r cv WHERE (cv.IsLatest = TRUE) AND (cv.Type__c = 'Spec Sheet') LIMIT 1) from Suite__c s Where (s.Status__c = 'Available') AND (s.Property__c =:ApexPages.currentPage().getParameters().get('id')) AND (Total_Raised_Floor_sqft__c > 1) AND (Available_PDU_Capacity_kW__c != null) AND (RecordTypeID = '012800000006Kgh') ORDER BY Total_Raised_Floor_sqft__c DESC];
}
//Used on the locator details page to list out all related Suite__c child objects where Record Type = Datacenter
public List<Suite__c> getDatacenterSuiteRecords() {
return [Select Name, Status__c, Property__c, Total_Raised_Floor_sqft__c, KVA__c, kW_of_UPS__c, (Select Id, Type__C From Spec_Sheets__r sp WHERE sp.Marketing_Approved__c = TRUE LIMIT 1), (Select Id, Title, Type__c From Content__r cv WHERE (cv.IsLatest = TRUE) AND (cv.Type__c = 'Spec Sheet') LIMIT 1) from Suite__c s Where (s.Status__c = 'Available') AND (s.Property__c =:ApexPages.currentPage().getParameters().get('id')) AND (Total_Raised_Floor_sqft__c > 1) AND (Available_PDU_Capacity_kW__c != null) AND (RecordTypeID = '012800000006Kgi') ORDER BY Total_Raised_Floor_sqft__c DESC];
}
//Used on the locator details page to list out all related Suite__c child objects where Record Type = PBB
public List<Suite__c> getPBBSuiteRecords() {
return [Select Name, Status__c, Property__c, Total_Rentable_sqft__c, (Select Id, Type__C From Spec_Sheets__r sp WHERE (sp.Marketing_Approved__c = TRUE) AND (sp.Type__c = 'Powered Base Building') LIMIT 1), (Select Id, Title, Type__c From Content__r cv WHERE (cv.IsLatest = TRUE) AND (cv.Type__c = 'Spec Sheet') LIMIT 1) from Suite__c s Where (s.Status__c = 'Available') AND (s.Property__c =:ApexPages.currentPage().getParameters().get('id')) AND (Total_Rentable_sqft__c > 0) AND (RecordTypeID = '012800000006LIm') ORDER BY Total_Rentable_sqft__c DESC];
}
//Used on the locator details page to list out all related Spec_Sheet__c child objects
public List<Spec_Sheet__c> getSpecSheets() {
return [Select s.id, s.Name, s.Property__c, s.Suite__c, s.Suite__r.Name from Spec_Sheet__c s Where (s.Suite__r.Status__c = 'Available') AND (s.Property__c =:ApexPages.currentPage().getParameters().get('id'))];
}
//Used on the locator listings page to list out all Property__c records for a specific market
public List<Property__c> getProperties() {
return [Select p.id, p.Name, p.Description__c, p.PBB_Status__c, p.TKD_Available_Raised__c, p.Total_sq_ft__c, p.Datacenter_Park__c, p.Market__c, p.Marketing_Description__c, p.Zip_Postal_Code__c, p.State__c, p.Address__c, p.City__c, p.Total_kW__c, p.Marketing_Image1__c, p.Leasing_Status__c from Property__c p where (p.Active__c = TRUE) AND (p.Leasing_Status__c = 'Available') AND (p.Market__c = :market) Order By p.Name Asc];
}
//Used on the locator details page to find any Content that relates to the property on screen
public List<ContentVersion> getContentVersions() {
return [select id, Title, Type__c, Suite__r.Name from ContentVersion cv Where (cv.Type__c = 'Spec Sheet') AND (cv.IsLatest = true) AND (cv.Suite__r.Status__c = 'Available') AND (cv.Property__r.Leasing_Status__c = 'Available') AND (cv.Property__c =:ApexPages.currentPage().getParameters().get('id'))];
}
//Used on the locator listings page to list out all Property__c records for a specific market
public List<Property__c> getAllProperties() {
String countryParam = ApexPages.currentPage().getParameters().get('country');
if(countryParam == 'US'){
return [Select p.id, p.Name, p.Address__c, p.City__c, p.Total_kW__c, p.Marketing_Image1__c, p.Marketing_Thumb__c, p.Leasing_Status__c, p.Market__c, p.Country__c, p.State__c from Property__c p where (p.Active__c = TRUE) AND (p.Country__c = 'United States' OR p.Country__c = 'Canada')Order By p.Market__c Asc];
}else if(countryParam == 'EU'){
return [Select p.id, p.Name, p.Address__c, p.City__c, p.Total_kW__c, p.Marketing_Image1__c, p.Marketing_Thumb__c, p.Leasing_Status__c, p.Market__c, p.Country__c, p.State__c from Property__c p where (p.Active__c = TRUE) AND (p.Country__c != 'United States' AND p.Country__c != 'Canada')Order By p.Market__c Asc];
}else if(countryParam == 'test'){
return [Select p.id, p.Name, p.Address__c, p.City__c, p.Total_kW__c, p.Marketing_Image1__c, p.Marketing_Thumb__c, p.Leasing_Status__c, p.Market__c, p.Country__c, p.State__c from Property__c p where (p.Active__c = TRUE) AND (p.Country__c = 'test') Order By p.Market__c Asc];
}else{
return [Select p.id, p.Name, p.Address__c, p.City__c, p.Total_kW__c, p.Marketing_Image1__c, p.Marketing_Thumb__c, p.Leasing_Status__c, p.Market__c, p.Country__c, p.State__c from Property__c p where (p.Active__c = TRUE) Order By p.Market__c Asc];
}
}
//Used on the home page to list out all Property__c records where 'Featured' = TRUE
public List<Property__c> getFeaturedProperties() {
// Capture the 'testParam' querystring from the URL
String testParam = ApexPages.currentPage().getParameters().get('test');
// If testParam = 'test', that means a method from the test class is calling this production method.
if (testParam == 'test'){
return [Select p.id, p.Name, p.Featured__c, p.Market__c, p.Marketing_Image1__c from Property__c p where (p.Name = 'test') AND (p.Active__c = TRUE) AND (p.Leasing_Status__c = 'Available') AND (p.Featured__c = TRUE) Order By p.Market__c Asc];
}else{
return [Select p.id, p.Name, p.Featured__c, p.Market__c, p.Marketing_Image1__c from Property__c p where (p.Active__c = TRUE) AND (p.Leasing_Status__c = 'Available') AND (p.Featured__c = TRUE) Order By p.Market__c Asc];
}
}
//Used to query the db and get back ONLY the market and country value for available properties
public void getAvailableMarketsAndCountries() {
AggregateResult[] groupResult = [Select p.Market__c, p.Country__c
from Property__c p
where (p.Active__c = TRUE) AND (p.Leasing_Status__c = 'Available') AND (p.Market__c != null) AND (p.Country__c != null)
GROUP BY p.Market__c, p.Country__c
Order By p.Country__c Asc, p.Market__c Asc];
for(AggregateResult ar : groupResult){
allMarkets.add(new Market(
String.valueOf(ar.get('market__c')),
String.valueOf(ar.get('country__c'))
)
);
//Add country to set
allCountries.add(String.valueOf(ar.get('country__c')));
System.Debug('NEW MARKET: ' + String.valueOf(ar.get('market__c')) + ', ' + String.valueOf(ar.get('Country__c')) + ';');
}
}
public SelectOption[] getMarketSelectList(){
SelectOption[] marketsList = new SelectOption[]{};
marketsList.add(new SelectOption('', '-- Select Market --'));
for(Market mk : allMarkets){
if(mk.country == country){
marketsList.add(mk.getSelectOption());
}
}
return marketsList;
}
public SelectOption[] getCountriesSelectList() {
SelectOption[] countriesList = new SelectOption[]{};
for(String cntry : allCountries){
countriesList.add(new SelectOption(cntry, cntry));
}
return countriesList;
}
//a sub class
class Market{
//properties for this sub class
Public String name;
Public String country;
public Market(String name, String country ){
this.name = name;
this.country = country;
}
//
public SelectOption getSelectOption(){
return new SelectOption(name, name);
}
}
} |
Here is the apex test class:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 | @isTest
private class TestMyPropertyExtension {
private final Property__c prop;
public TestMyPropertyExtension(ApexPages.StandardController PropertyController) {
this.prop = (Property__c)PropertyController.getRecord();
}
static testmethod void testGetTKDSuitesPositive(){
// Create dummy data for test purposes.
// Always assume your org has no data because the record may not be there later.
Property__c p = new Property__c();
p.Name = 'foo';
p.Region__c = 'Central';
p.Market__c = 'Dallas';
P.Leasing_Status__c = 'Available';
System.debug('Inserting the test property record...');
insert p;
Suite__c sAvailable = new Suite__c();
sAvailable.Name ='bar';
sAvailable.Property__c = p.Id;
sAvailable.Status__C = 'Available';
sAvailable.Total_Raised_Floor_sqft__c = 10000;
sAvailable.Available_PDU_Capacity_kW__c = '1125';
sAvailable.RecordTypeID = '012800000006Kgh';
System.debug('Inserting the test TKD suite record with status = Available...');
insert sAvailable;
System.AssertEquals(sAvailable.Property__c, p.Id);
Suite__c sLeased = new Suite__c();
sLeased.Name ='bar';
sLeased.Property__c = p.Id;
sLeased.Status__c = 'Leased';
System.debug('Inserting the test suite record with status = Leased...');
insert sLeased;
// Use the vf page in my org named 'locatorDetails'
PageReference pageRef = Page.locatorDetails;
Test.setCurrentPage(pageRef);
// Set the id of the current vf page to a Property__c record that I know has child Suite__c and Spec_Sheet__c records
ApexPages.currentPage().getParameters().put('id', p.Id);
MyPropertyExtension controller = new MyPropertyExtension(p);
//Call controller.suiteRecords() and assert the list contains the expected records.
List<Suite__c> suiteRecords = controller.getTKDSuiteRecords();
system.assertEquals(suiteRecords.size(),1);
for(Suite__c s: suiteRecords)
{
System.assertEquals('Available', s.Status__c);
System.assertEquals(sAvailable.Id, s.Id);
}
}
static testmethod void testGetPBBSuitesPositive(){
// Create dummy data for test purposes.
// Always assume your org has no data because the record may not be there later.
Property__c p = new Property__c();
p.Name = 'foo';
p.Region__c = 'Central';
p.Market__c = 'Dallas';
P.Leasing_Status__c = 'Available';
System.debug('Inserting the test property record...');
insert p;
Suite__c sAvailable = new Suite__c();
sAvailable.Name ='bar';
sAvailable.Property__c = p.Id;
sAvailable.Status__C = 'Available';
sAvailable.Total_Rentable_sqft__c = 10000;
sAvailable.RecordTypeID = '012800000006LIm';
System.debug('Inserting the test PBB suite record with status = Available...');
insert sAvailable;
System.AssertEquals(sAvailable.Property__c, p.Id);
Suite__c sLeased = new Suite__c();
sLeased.Name ='bar';
sLeased.Property__c = p.Id;
sLeased.Status__c = 'Leased';
System.debug('Inserting the test suite record with status = Leased...');
insert sLeased;
// Use the vf page in my org named 'locatorDetails'
PageReference pageRef = Page.locatorDetails;
Test.setCurrentPage(pageRef);
// Set the id of the current vf page to a Property__c record that I know has child Suite__c and Spec_Sheet__c records
ApexPages.currentPage().getParameters().put('id', p.Id);
MyPropertyExtension controller = new MyPropertyExtension(p);
//Call controller.suiteRecords() and assert the list contains the expected records.
List<Suite__c> suiteRecords = controller.getPBBSuiteRecords();
system.assertEquals(suiteRecords.size(),1);
for(Suite__c s: suiteRecords)
{
System.assertEquals('Available', s.Status__c);
System.assertEquals(sAvailable.Id, s.Id);
}
}
static testmethod void testGetDatacenterSuitesPositive(){
// Create dummy data for test purposes.
// Always assume your org has no data because the record may not be there later.
Property__c p = new Property__c();
p.Name = 'foo';
p.Region__c = 'Central';
p.Market__c = 'Dallas';
P.Leasing_Status__c = 'Available';
System.debug('Inserting the test property record...');
insert p;
Suite__c sAvailable = new Suite__c();
sAvailable.Name ='bar';
sAvailable.Property__c = p.Id;
sAvailable.Status__C = 'Available';
sAvailable.Total_Raised_Floor_sqft__c = 10000;
sAvailable.Available_PDU_Capacity_kW__c = '1125';
sAvailable.RecordTypeID = '012800000006Kgi';
System.debug('Inserting the test Datacenter suite record with status = Available...');
insert sAvailable;
System.AssertEquals(sAvailable.Property__c, p.Id);
Suite__c sLeased = new Suite__c();
sLeased.Name ='bar';
sLeased.Property__c = p.Id;
sLeased.Status__c = 'Leased';
System.debug('Inserting the test suite record with status = Leased...');
insert sLeased;
// Use the vf page in my org named 'locatorDetails'
PageReference pageRef = Page.locatorDetails;
Test.setCurrentPage(pageRef);
// Set the id of the current vf page to a Property__c record that I know has child Suite__c and Spec_Sheet__c records
ApexPages.currentPage().getParameters().put('id', p.Id);
MyPropertyExtension controller = new MyPropertyExtension(p);
//Call controller.getDatacenterSuiteRecords() and assert the list contains the expected records.
List<Suite__c> suiteRecords = controller.getDatacenterSuiteRecords();
system.assertEquals(suiteRecords.size(),1);
for(Suite__c s: suiteRecords)
{
System.assertEquals('Available', s.Status__c);
System.assertEquals(sAvailable.Id, s.Id);
}
}
static testmethod void testGetSpecSheetsPositive(){
// Create dummy data for test purposes.
// Always assume your org has no data because the record may not be there later.
Property__c p = new Property__c();
p.Name = 'foo';
insert p;
Suite__c sAvailable = new Suite__c();
sAvailable.Name ='bar';
sAvailable.Property__c = p.Id;
sAvailable.Status__C = 'Available';
insert sAvailable;
Spec_Sheet__c spec = new Spec_Sheet__c();
spec.Name ='bar';
spec.Property__c = p.Id;
spec.Suite__c = sAvailable.Id;
insert spec;
// Use the vf page in my org named 'locatorDetails'
PageReference pageRef = Page.LocatorDetails;
Test.setCurrentPage(pageRef);
// Set the id of the current vf page to a Property__c record that I know has child Suite__c and Spec_Sheet__c records
ApexPages.currentPage().getParameters().put('id', p.Id);
MyPropertyExtension controller = new MyPropertyExtension(p);
//Call controller.getSpecSheetLookup() and assert the list contains the expected records.
List<Spec_Sheet__c> specRecords = controller.getSpecSheets();
system.assertEquals(specRecords.size(),1);
}
static testmethod void testGetFeatureProperties(){
// Create dummy data for test purposes.
// Always assume your org has no data because the record may not be there later.
Property__c p = new Property__c();
// The Property name MUST = 'test' so that the production method works correctly
p.Name = 'test';
p.Active__c = TRUE;
p.Leasing_Status__c = 'Available';
p.Market__c = 'Dallas';
p.Featured__c = TRUE;
insert p;
Property__c n = new Property__c();
// The Property name MUST = 'test' so that the production method works correctly
n.Name = 'test';
n.Active__c = TRUE;
n.Leasing_Status__c = 'Available';
n.Market__c = 'Dallas';
n.Featured__c = FALSE;
insert n;
// Use the vf page in my org named 'locatorDetails'
PageReference pageRef = Page.FeaturedProperties;
Test.setCurrentPage(pageRef);
// Tell the production method this is a test and then call the constructor of my controller
ApexPages.currentPage().getParameters().put('test', 'test');
MyPropertyExtension controller = new MyPropertyExtension(p);
//Call controller.getFeaturedProperties() and assert the list contains the expected records.
List<Property__c> propRecords = controller.getFeaturedProperties();
system.assertEquals(propRecords.size(),1);
}
static testmethod void testMarketSelectListPositive(){
Property__c prop1 = new Property__c();
prop1.name = 'foo';
prop1.market__c = 'test';
prop1.country__c = 'United States';
insert prop1;
PageReference pageRef = Page.LocatorListing;
Test.setCurrentPage(pageRef);
ApexPages.currentPage().getParameters().put('market', prop1.market__c);
MyPropertyExtension controller = new MyPropertyExtension();
List<SelectOption> marketList = controller.getMarketSelectList();
system.assert(marketList.size() > 1);
List<SelectOption> countryList = controller.getCountriesSelectList();
system.assert(countryList.size() > 1);
}
static testmethod void testGetAllPropertiesPositive(){
Property__c p = new Property__c();
p.name = 'foo';
p.Market__c = 'm1';
p.Country__c = 'test';
p.Active__c = true;
insert p;
// Use the vf page in my org named 'LocatorListing'
PageReference pageRef = Page.LocatorListing;
Test.setCurrentPage(pageRef);
// Set the market param of the current vf page to the market in my test Property
ApexPages.currentPage().getParameters().put('country', p.Country__c);
MyPropertyExtension controller = new MyPropertyExtension();
//Call controller.getProperties() and assert the list contains the expected records.
List<Property__c> propRecords = controller.getAllProperties();
system.assertEquals(propRecords.size(),1);
}
} |
Here is the first visualforce page:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | <apex:page showHeader="false" id="body" standardStylesheets="false" controller="MyPropertyExtension" cache="true" expires="600">
<head>
<title>Digital Realty Trust - Data Center Search</title>
<meta name="google-site-verification" content="mCvp2dIWyp5uuTK4H0mXzHBRdJDwTBLYQkJbBSMlU1I" />
</head>
<div id="main">
<apex:insert name="header">
<c:LocatorHeader />
</apex:insert>
<!-- ========================== CONTAINER CLASSES ======================== -->
<div class="main_text" style="margin-top:15px;"><div class="locator_top"><h4>Digital Realty Trust Data Centers</h4></div><div class="center_content_bg_graytop"> <div class="center_content">
<!-- ===================================================================== -->
<br/>
<h3>We Know Datacenters</h3><br/>
<p style="width:95%;">Digital Realty Trust provides flexible, reliable and cost-effective data center solutions. Through our suite of product offerings and unique leasing programs, our domestic and international properties are able to support even your most robust data center applications within your budget.</p><br/>
<p><a href="http://datacenters.digitalrealtytrust.com/LocatorListing"><span class="filter">Filter by Market</span></a><br /><br /></p>
<apex:outputPanel id="list">
<apex:dataTable value="{!allproperties}" var="prop" id="propList" rowClasses="odd,even" columnClasses="middle" columnsWidth="108px, 250px, 160px, 160px, 160px" styleClass="datacenterTable">
<apex:column >
<div style="border: 2px solid #e2e2e2; margin:0; padding:2px;"><a href="LocatorDetails?id={!prop.id}" style="text-decoration:underline;"><apex:image alt="{!prop.Name}" url="{!prop.Marketing_Thumb__c}" width="100" /></a></div>
</apex:column>
<apex:column >
<apex:facet name="header">Name</apex:facet>
<apex:outputText value="{!prop.Address__c}"/>
</apex:column>
<apex:column >
<apex:facet name="header">Market</apex:facet>
<apex:outputText value="{!prop.Market__c}"/>
</apex:column>
<apex:column >
<apex:facet name="header">Country</apex:facet>
<apex:outputText value="{!prop.Country__c}"/>
</apex:column>
<apex:column >
<apex:facet name="header">Status</apex:facet>
<apex:outputText value="{!prop.Leasing_Status__c}"/>
</apex:column>
</apex:dataTable>
</apex:outputPanel>
<!-- ===================================================================== -->
</div> <!--center_content--></div> <!--center_content_bg--><div class="bottom"></div></div> <!--main_text-->
<!-- ===================================================================== -->
<apex:insert name="footer">
<c:LocatorFooter />
</apex:insert>
</div>
</apex:page> |
Here is the second visualforce page:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 | <apex:page showHeader="false" id="body" standardStylesheets="false" controller="MyPropertyExtension" apiVersion="19" cache="true" expires="600">
<head>
<title>{!market} Data Center Solutions - Make a Smart Business Decision Today!</title>
<meta name="description" content="Cost efficient {!market} data center solutions from Digital Realty Trust. We set up your business with an {!market} data center & even provide support after you move in!"/>
<meta name="keywords" content="{!market} datacenter, data centers {!market}, {!market} datacenter properties, Digital Realty Trust, {!market}datacenter solutions, datacenter location {!market}, datacenter design, datacenter construction, wholesale datacenter provider, datacenter leasing" />
<script type="text/javascript">
$(document).ready(function() {
$("select").change(function() {
$("p.swapout").replaceWith("<p>Digital Realty Trust is the world’s largest wholesale datacenter provider. Our datacenter properties feature the power and connectivity capacity required to support your most arduous requirements. Every one of our datacenter properties offers you the maximum level of product flexibility to accommodate the unique needs of your organization and are designed for the most energy efficient level of operation possible. To learn more about our datacenters click on one of the building photographs below.</p>");
$("h1.swapout").replaceWith("<h1>Available Properties</h1>");
$("h2.swapout").replaceWith("<h2>Datacenter Property Portfolio</h2>");
});});
</script>
</head>
<apex:includeScript value="{!URLFOR($Resource.Locator, 'jquery.min.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.Locator, 'popupmenu.js')}"/>
<div id="main">
<apex:insert name="header">
<c:LocatorHeader />
</apex:insert>
<!-- ========================== CONTAINER CLASSES ======================== -->
<div class="main_text" style="margin-top:15px;"><div class="locator_top"><h1 class="swapout">{!market} Data Center Solutions</h1></div><div class="center_content_bg_graytop"> <div class="center_content">
<!-- ===================================================================== -->
<br/>
<h2 class="swapout">{!market} Datacenter Property Portfolio</h2><br/>
<p class="swapout" style="width:95%;">Digital Realty Trust is the world’s largest wholesale datacenter provider. Our <b>{!market} datacenter</b> properties feature the power and connectivity capacity required to support your most arduous requirements. Every one of our <strong><em>{!market} datacenter properties</em></strong> offers you the maximum level of product flexibility to accommodate the unique needs of your organization and are designed for the most energy efficient level of operation possible. To learn more about our {!market} datacenters click on one of the building photographs below.</p><br/>
<apex:form id="form">
<table cellpadding="0" cellspacing="10">
<tr>
<td>
<apex:outputText >Country: </apex:outputText>
<apex:selectList id="chooseCountry" value="{!country}" size="1">
<apex:selectOptions value="{!countriesSelectList}"/>
<apex:actionSupport event="onchange" reRender="marketList" status="refreshStatus"/>
</apex:selectList>
</td>
<td>
<apex:outputText >Market: </apex:outputText>
<apex:outputpanel id="marketList">
<apex:selectList id="chooseMarket" size="1" value="{!market}">
<apex:selectOptions value="{!marketSelectList}"/>
<apex:actionSupport event="onchange" reRender="list" status="refreshStatus" oncomplete="reloadPopups();" />
</apex:selectList>
</apex:outputpanel>
</td>
<td>
<apex:actionStatus id="refreshStatus" startText="(updating...)" />
</td>
</tr>
</table>
<br/>
<apex:outputPanel id="list">
<apex:repeat value="{!properties}" var="prop" id="propList">
<div style="float: left; padding:0; margin:0px 15px 15px 0px;">
<h4 align="center">{!prop.Address__c}</h4>
<div style="border: 2px solid #e2e2e2; margin:0; padding:2px;">
<a data-popupmenu="menu{!prop.id}" href="LocatorDetails?id={!prop.id}">
<img src="{!prop.Marketing_Image1__c}" width="250" height="200" alt="{!prop.Market__c} Data Center: {!prop.Name}"/>
</a>
</div>
<!--Begin hover content-->
<div id="menu{!prop.id}" style="width:325px;">
<h3 align="center"><apex:outputText id="dataCenterParkTitle" value="{!IF(prop.Datacenter_Park__c=TRUE,'Datacenter Park ','')}" /><apex:outputText id="dataCenterParkMarket" value="{!IF(prop.Datacenter_Park__c=TRUE,prop.Market__c,'')}" /></h3>
<h3 align="center">{!prop.Address__c}</h3>
<br/>
<p><apex:outputField value="{!prop.Description__c}"/></p>
<br/>
<p>Address:<br />
<apex:outputField value="{!prop.Address__c}"/><br/>
<apex:outputField value="{!prop.City__c}"/> <apex:outputField value="{!prop.State__c}"/> <apex:outputField value="{!prop.Zip_Postal_Code__c}"/></p>
<br/>
<span style="display:{!IF(prop.Total_sq_ft__c="",'none','block')};"><p>Size: <apex:outputField value="{!prop.Total_sq_ft__c}" /> sq ft</p></span>
<span style="display:{!IF(prop.TKD_Available_Raised__c=0,'none','block')};"><p>Available TKD Space: <apex:outputField value="{!prop.TKD_Available_Raised__c}"/> sq ft</p></span>
<span style="display:{!IF(prop.PBB_Status__c="",'none','block')};"><p><a href="http://www.digitalrealtytrust.com/powered-base-building.aspx">Powered Base Building</a>: {!prop.PBB_Status__c}</p></span>
<br/>
<p align="center"><a href="LocatorDetails?id={!prop.id}" style="text-decoration:underline;">More Details</a></p>
</div>
<!--End hover content-->
</div>
</apex:repeat>
</apex:outputPanel>
</apex:form>
<p class="clearfloat" />
<div style="display:block; text-align:center;">
<a href="datacenters"><div class="all_props"></div></a>
</div>
<!-- ===================================================================== -->
</div> <!--center_content--></div> <!--center_content_bg--><div class="bottom"></div></div> <!--main_text-->
<!-- ===================================================================== -->
<apex:insert name="footer">
<c:LocatorFooter />
</apex:insert>
</div>
<site:previewAsAdmin />
</apex:page> |
Here is the visualforce page that make the mouse-over pop up possible:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <apex:page showHeader="false" id="body" standardStylesheets="false" standardController="Property__c" extensions="MyPropertyExtension">
<apex:stylesheet value="{!URLFOR($Resource.Locator, 'style.css')}"/>
<div id="main" style="width:350px; height:450px; padding:5px; margin:0px;">
<h3 align="center"><apex:outputText id="dataCenterParkTitle" value="{!IF(Property__c.Datacenter_Park__c=TRUE,'Datacenter Park','')}" /> <apex:outputText id="dataCenterParkMarket" value="{!IF(Property__c.Datacenter_Park__c=TRUE,Property__c.Market__c,'')}" /></h3>
<h3 align="center"><a href="LocatorDetails?id={!Property__c.id}" style="text-decoration:underline;" target="_blank">{!Property__c.Address__c}</a></h3>
<br /><apex:outputField value="{!Property__c.Marketing_Description__c}"/><br />
<br />Address: <a href="http://www.google.com/maps?&q={!Property__c.Address__c}+{!Property__c.City__c}+{!Property__c.State__c}+{!Property__c.Zip_Postal_Code__c}" style="text-decoration:underline;" target="_blank">map</a><br/>
<apex:outputField value="{!Property__c.Address__c}"/><br/>
<apex:outputField value="{!Property__c.City__c}"/>, <apex:outputField value="{!Property__c.State__c}"/> <apex:outputField value="{!Property__c.Zip_Postal_Code__c}"/><br/><br/>
Size: <apex:outputField value="{!Property__c.Total_sq_ft__c}"/><br/>
Power: <apex:outputField value="{!Property__c.Total_kW__c}"/> kW<br/>
Available TKD Space: <apex:outputField value="{!Property__c.TKD_Available_Raised__c}"/> sq ft<br/>
PBB: {!Property__c.PBB_Status__c}
<br/><br />
<table border="0" style="text-align:left;" >
<tr>
<th>Specification Sheets</th>
</tr>
<apex:repeat var="specSheets" value="{!Property__c.Spec_Sheets__r}">
<tr>
<td><a href="http://info.digitalrealtytrust.com/SpecSheetRequest.html?pid={!specSheets.id}" target="_blank">{!specSheets.Name}</a></td>
</tr>
</apex:repeat>
</table>
<br /><p align="center"><a href="LocatorDetails?id={!Property__c.id}" style="text-decoration:underline;" target="_blank">Details</a></p>
</div>
</apex:page> |
Here is the third visualforce page:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 | <apex:page showHeader="false" sidebar="false" id="body" standardStylesheets="false" standardController="Property__c" extensions="MyPropertyExtension">
<head>
<title>{!Property__c.Market__c} Data Center: {!Property__c.Address__c}</title>
<apex:includeScript value="{!URLFOR($Resource.Locator, 'jquery.min.js')}"/>
</head>
<div id="main">
<apex:insert name="header">
<c:LocatorHeader />
</apex:insert>
<!-- ========================== CONTAINER CLASSES ======================== -->
<div class="main_text" style="margin-top:15px;"><div class="solutions_top"><h4><apex:outputField value="{!Property__c.Market__c}"/> Data Center: <apex:outputField value="{!Property__c.Address__c}"/></h4><div class="details_col_top"><h3><apex:outputField value="{!Property__c.Market__c}"/> Data Center</h3></div></div><div class="center_content_bg_graytop"> <div class="center_content">
<!-- ===================================================================== -->
<!--Begin Column 1-->
<div id="leftcol_details">
<p class="breadcrumb"><a href="LocatorListing">Data Center Locator > </a><a href="LocatorListing?market={!Property__c.Market__c}">{!Property__c.Market__c}</a></p>
<br/>
<p style="width:95%;"><apex:outputField value="{!Property__c.Description__c}"/>
<br /><br />
<a class="bridge-link" href="http://www.digitalrealtytrust.com/form-content-request.aspx?property={!Property__c.Address__c}"><div class="more_info"></div></a>
<br /><br /><br />
</p>
<span style="display:{!IF(Property__c.Sales_Contact__c='','none','block')};"><h3 align="center">For Leasing Information Call: <apex:outputField value="{!Property__c.Sales_Contact__c}"/></h3></span>
<br/>
<div id="detailPhoto" align="center"><img src="{!Property__c.Marketing_Image1__c}" alt="{!Property__c.Market__c} Data Center: {!Property__c.Address__c}" /></div>
<p class="clearFloat" />
<br/>
<div style="display:{!IF(tkdsuiterecords.size=0,'none','block')};">
<h5>Available Turn-Key Datacenter® Space</h5>
<apex:dataTable styleClass="detailsTable" rendered="{!IF(tkdsuiterecords.size=0,'False','True')}" value="{!tkdsuiterecords}" var="tkd" columns="4" rowClasses="odd,even" columnsWidth="100px,100px,100px,100px" cellpadding="0px" cellspacing="0px">
<apex:column headerValue="Suite"><apex:outputText value="{!tkd.Name}"/></apex:column>
<apex:column headerValue="Raised Floor">
<apex:outputText value="{0, number, integer}">
<apex:param value="{!tkd.Total_Raised_Floor_sqft__c}"/>
</apex:outputText>
</apex:column>
<apex:column headerValue="Download" ><apex:outputLink value="/sfc/servlet.shepherd/version/download/{!tkd.Content__r[0].Id}" target="_document" rendered="{!IF(tkd.Content__r.size=0,'False','True')}"><apex:image value="/resource/1301687211000/pdf_icon"/></apex:outputLink></apex:column>
<apex:column headerValue="Details" rendered="false"><apex:outputLink value="LocatorSpecSheet?id={!tkd.Spec_Sheets__r[0].Id}" rendered="{!IF(tkd.Spec_Sheets__r.size=0,'False','True')}"><apex:outputText value="View"/></apex:outputLink></apex:column>
</apex:dataTable>
</div>
<br/><br/>
<div style="display:{!IF(pbbsuiterecords.size=0,'none','block')};">
<h5>Available Powered Base Building® Space</h5>
<apex:dataTable styleClass="detailsTable" rendered="{!IF(pbbsuiterecords.size=0,'False','True')}" value="{!pbbsuiterecords}" var="pbb" columns="4" rowClasses="odd,even" columnsWidth="100px,100px,100px,100px" cellpadding="0px" cellspacing="0px">
<apex:column headerValue="Suite"><apex:outputText value="{!pbb.Name}"/></apex:column>
<apex:column headerValue="Total Rentable">
<apex:outputText value="{0, number, integer}">
<apex:param value="{!pbb.Total_Rentable_sqft__c}" />
</apex:outputText>
</apex:column>
<apex:column headerValue="Download" ><apex:outputLink value="/sfc/servlet.shepherd/version/download/{!pbb.Content__r[0].Id}" target="_document" rendered="{!IF(pbb.Content__r.size=0,'False','True')}"><apex:image value="/resource/1301687211000/pdf_icon"/></apex:outputLink></apex:column>
<apex:column headerValue="Details" rendered="false"><apex:outputLink value="LocatorSpecSheet?id={!pbb.Spec_Sheets__r[0].Id}" rendered="{!IF(pbb.Spec_Sheets__r.size=0,'False','True')}"><apex:outputText value="View"/></apex:outputLink></apex:column>
</apex:dataTable>
</div>
<br/><br/>
</div>
<!--End left column-->
<!--Begin right column-->
<div id="rightcol_details">
<div id="detailFacts">
<br/>
<span class="fact"><apex:outputText id="leaseStatusLabel" value="{!IF(Property__c.Leasing_Status__c!='','Leasing Status: ','')}" /> <apex:outputText id="leaseStatusValue" value="{!Property__c.Leasing_Status__c}" /></span>
<span class="fact" style="display:{!IF(Property__c.Total_sq_ft__c='','none','block')};">Size: <apex:outputField value="{!Property__c.Total_sq_ft__c}"/> sq ft</span>
<!--<span class="fact" style="display:{!IF(Property__c.Year_Built__c='','none','block')};"><apex:outputText id="yearBuiltLabel" value="{!IF(Property__c.Year_Built__c!='','Year Built: ','')}" /> <apex:outputText id="yearBuiltValue" value="{!Property__c.Year_Built__c}" /></span>-->
<!--<span class="fact" style="display:{!IF(Property__c.Year_Last_Renovated__c='','none','block')};"><apex:outputText id="yearRenoLabel" value="{!IF(Property__c.Year_Last_Renovated__c!='','Year Last Renovated: ','')}" /> <apex:outputText id="yearRenoValue" value="{!Property__c.Year_Last_Renovated__c}" /></span>-->
<br/>
<div style="text-align:center; margin:20px 0px 10px 0px; display:{!IF(Property__c.Marketing_Video__c='','none','block')};">
<span class="fact">Property Overview</span>
<apex:includeScript value="http://files.digitalrealtytrust.s3.amazonaws.com/mediaplayer/swfobject.js"/>
<embed
type="application/x-shockwave-flash"
id="player"
name="player"
src="http://files.digitalrealtytrust.s3.amazonaws.com/mediaplayer/player-licensed.swf"
width="250"
height="200"
bgcolor="#AEADAD"
frontcolor="#AEADAD"
allowscriptaccess="always"
allowfullscreen="true"
flashvars="streamer=rtmp://vid.digitalrealtytrust.com/cfx/st&file=datacenters/{!Property__c.Marketing_Video__c}&plugins=gapro-1&gapro.accountid=UA-1231610-1&gapro.trackstarts=true&gapro.trackpercentage=true&gapro.tracktime=true"
/>
</div>
<div style="text-align:center; margin:20px 0px 10px 0px; display:{!IF(Property__c.Marketing_Video_EU__c='','none','block')};">
<span class="fact">Property Overview (English)</span>
<apex:includeScript value="http://files.digitalrealtytrust.s3.amazonaws.com/mediaplayer/swfobject.js"/>
<embed
type="application/x-shockwave-flash"
id="player"
name="player"
src="http://files.digitalrealtytrust.s3.amazonaws.com/mediaplayer/player-licensed.swf"
width="250"
height="200"
bgcolor="#AEADAD"
frontcolor="#AEADAD"
allowscriptaccess="always"
allowfullscreen="true"
flashvars="streamer=rtmp://vid.digitalrealtytrust.com/cfx/st&file=datacenters/{!Property__c.Marketing_Video_EU__c}&plugins=gapro-1&gapro.accountid=UA-1231610-1&gapro.trackstarts=true&gapro.trackpercentage=true&gapro.tracktime=true"
/>
</div>
<div style="text-align:center; margin:20px 0px 10px 0px; display:{!IF(Property__c.Marketing_Video_FR__c='','none','block')};">
<span class="fact">Synthèse du Bâtiment (En Français)</span>
<apex:includeScript value="http://files.digitalrealtytrust.s3.amazonaws.com/mediaplayer/swfobject.js"/>
<embed
type="application/x-shockwave-flash"
id="player"
name="player"
src="http://files.digitalrealtytrust.s3.amazonaws.com/mediaplayer/player-licensed.swf"
width="250"
height="200"
bgcolor="#AEADAD"
frontcolor="#AEADAD"
allowscriptaccess="always"
allowfullscreen="true"
flashvars="streamer=rtmp://vid.digitalrealtytrust.com/cfx/st&file=datacenters/{!Property__c.Marketing_Video_FR__c}&plugins=gapro-1&gapro.accountid=UA-1231610-1&gapro.trackstarts=true&gapro.trackpercentage=true&gapro.tracktime=true"
/>
</div>
<div style="display:{!IF(Property__c.Certification_Logo__c='','none','block')}; width:100px; height:100px; margin:5px; float:left; background:url({!Property__c.Certification_Logo__c}) no-repeat;"><apex:outputText value="{!IF(Property__c.Certification_Logo__c!='',' ','')}" /></div>
<div style="display:{!IF(Property__c.PUE_Score_Graphic__c='','none','block')}; width:138px; height:100px; margin:5px; float:left; background:url({!Property__c.PUE_Score_Graphic__c}) no-repeat;"><apex:outputText value="{!IF(Property__c.PUE_Score_Graphic__c!='',' ','')}" /></div>
</div><!--facts-->
<p class="clearFloat" />
<!--Begin content table-->
<div id="detailDownloads" style="display:none;">
<h3 class="rightcol_heading">Data Center Details</h3>
<br/>
<p align="left" style="padding-left:15px;">Click to download:</p>
<apex:dataTable var="cv" value="{!contentVersions}" id="contentTable" align="center">
<apex:column width="400">
<apex:outputLink value="/sfc/servlet.shepherd/version/download/{!cv.Id}" target="_blank">Suite <apex:outputText value="{!cv.Suite__r.Name}"/> <apex:outputText value="{!cv.Type__c}"/></apex:outputLink>
</apex:column>
</apex:dataTable>
</div>
<!--End content table-->
<div id="detailAddress">
<h3 class="rightcol_heading">Data Center Address</h3>
<apex:outputField value="{!Property__c.Address__c}"/><br />
<apex:outputField value="{!Property__c.City__c}"/><apex:outputText value="{!IF(Property__c.Country__c='United States',",",'')}" /> <apex:outputField value="{!Property__c.State__c}"/> <apex:outputField value="{!Property__c.Zip_Postal_Code__c}"/><br />
<apex:outputField value="{!Property__c.Country__c}"/><br />
<span style="display:{!IF(Property__c.Sales_Contact__c='','none','block')};"><apex:outputField value="{!Property__c.Sales_Contact__c}"/></span><br/>
<br/>
<a href="http://maps.google.com/maps?&q={!Property__c.lat__c},+{!Property__c.long__c}+({!Property__c.Address__c})+&iwloc=A&hl=en" style="text-decoration:underline;font-size:9px;" target="_blank"><apex:image alt="{!Property__c.Market__c} Data Center" styleClass="detailMapPhoto" value="http://maps.google.com/maps/api/staticmap?markers=color:blue|{!Property__c.lat__c},{!Property__c.long__c}&size=220x200&sensor=false&key=ABQIAAAA2qmEZeiUTNuhcaLhcZC9TRSDf1o2ZIfH3wtGNAIGWlamHT2hrxSWrFXkl4QL05qnV3mVo61UosLXeQ" /></a>
<br/><br/>
</div><!--detailAddress-->
</div><!--End right column-->
<!-- ===================================================================== -->
</div> <!--center_content--></div> <!--center_content_bg--><div class="bottom"></div></div> <!--main_text-->
<!-- ===================================================================== -->
<apex:insert name="footer">
<c:LocatorFooter />
</apex:insert>
</div>
</apex:page> |
Here is the CSS file:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | /* -------- DATACENTER LOCATOR STYLES ------- */
/* Styles for datacenters.digitalrealtytrust.com/LocatorListing */
.all_props { background:url(http://img.digitalrealtytrust.com/all_properties.png) bottom no-repeat; width:100%; height: 38px; margin-left:-5px; cursor:pointer; cursor:pointer; }
.all_props:hover { background:url(http://img.digitalrealtytrust.com/all_properties.png) top no-repeat; }
.jqpopupmenu, .jqpopupmenu ul{ /*topmost and sub ULs, respectively*/ font: normal 12px Verdana; margin: 0; padding: 8px; position: absolute; left: 0; top: 0;list-style-type: none; background: white; border:1px solid #E2E2E2; visibility: hidden; display: none; /*collapse all sub menus to begin with*/ box-shadow: 3px 3px 8px #818181; /*shadow for CSS3 capable browsers.*/ -webkit-box-shadow: 3px 3px 8px #818181; -moz-box-shadow: 3px 3px 8px #818181; }
.jqpopupmenu li{ position: relative; }
.jqpopupmenu li a{ display: block; width: 210px; /*width of menu (not including side paddings)*/ height:60px; color:#676868; background: #F5F5F5; text-decoration: none; padding: 5px 10px; border-bottom:1px solid #E2E2E2; }
.jqpopupmenu li img{ float:left; width:60px; height:60px; margin-right:10px; }
* html .jqpopupmenu li{ /*IE6 CSS hack*/ display: inline-block; width: 230px; /*width of menu (include side paddings of LI A*/}
.jqpopupmenu li a:hover, .jqpopupmenu li.selected>a{ background: #e0e0e0; }
.rightarrowclass{ position: absolute; top: 6px; right: 5px; }
/* Styles for datacenters.digitalrealtytrust.com/datacenters */
.datacenterTable{ }
.middle{ vertical-align:middle; text-align:center; margin:10px 0px 0px 0px; }
/* Styles for datacenters.digitalrealtytrust.com/LocatorDetails */
.breadcrumb{ font-size:9px; }
#leftcol_details{float:left; width:616px; padding-top:10px;}
div#leftcol_details ul{ padding-left:30px }
div#leftcol_details li{ list-style-type:square; margin:5px 0px; padding-left:5px; }
div#leftcol_details h3{ margin:5px 0px; display:block; }
.sfdc_richtext{ margin-bottom:20px; }
.odd{ background-color:#F8F8F8; margin:0; padding:0; }
.even{ margin:0; padding:0; background-color:#FFF; }
div#detailPhoto{ /*shadow for CSS3 capable browsers.*/ width:600px; box-shadow: 3px 3px 8px #818181; -webkit-box-shadow: 3px 3px 8px #818181; -moz-box-shadow: 3px 3px 8px #818181; }
.detailMapPhoto{ /*shadow for CSS3 capable browsers.*/ box-shadow: 3px 3px 8px #818181; -webkit-box-shadow: 3px 3px 8px #818181; -moz-box-shadow: 3px 3px 8px #818181; }
div#detailSuiteTable{ margin-top:20px; padding:0; text-align:center; }
.detailsTable { text-align:center; }
#rightcol_details{ float:right; height:100%; width:260px; background:#fafafa; margin-right:10px;}
div#detailFacts{ width:260px; display:inline; line-height:100%; padding-left:10px; }
.fact{ font-weight:bold; line-height:25px; display:block; padding-left:10px; }
div#detailsVideo { text-align:center; margin:20px 0px 10px 0px; }
div#detailsCertLogo { width:100px; height:100px; margin:5px; float:left; }
div#detailsPUELogo { width:138px; height:100px; margin:5px; float:left; }
div#detailDownloads{ width:260px; text-align:center; margin-top:120px; }
div#detailAddress{ width:260px; background: #ffffff url(http://img.digitalrealtytrust.com/solutions_bg.gif) top repeat-x; text-align:center; margin-top:120px; }
/*Styles for the "more information" form used on LocatorDetails and LocatorSpecSheet */
div#form form input { float:left; width:200px; }
div#form form select { float:left; width:200px; }
div#form form label { float:left; width:150px; }
div#form form li { float:right; clear:both; margin-top:10px; width:100%; }
div#form .mktField { list-style-type:none; }
div#form form textarea { width:200px; height:100px; }
div#form form span.mktFormMsg { color:red; font-size:9px; }
/* Adjustments Taken from Style.css */
.center_content_bg { float:left;background:url(http://img.digitalrealtytrust.com/sides.png) repeat-y;width:945px; padding-top:30px; }
.center_content_bg_graytop { float:left;background:url(http://img.digitalrealtytrust.com/sides.png) repeat-y;width:945px; }
.center_content { float:left;margin:0px 0px 0px 55px; }
.center_content p { width:70%; }
.locator_top { float:left;width:100%;height:50px;background:url(http://img.digitalrealtytrust.com/locator_top.png) no-repeat; }
.locator_top h3{ float:right; font-size:110%; color:white; font-weight:bold; padding:19px 50px 0px 0px; text-transform:uppercase; }
.locator_top h2{ float:left; color: #696969; font-size:150%; font-weight:normal; text-transform:uppercase; padding:17px 0px 10px 60px; }
.locator_top h4{ float:left; font-size:135%; color: #696969; font-weight:bold; padding:18px 0px 0px 60px; }
.locator_top h1{ float:left; color: #696969; font-size:150%; font-weight:normal; text-transform:uppercase; padding:17px 0px 10px 60px; }
.details_col_top{ float:right; margin-right:10px; width:265px; text-align:center; }
.details_col_top h3{ float:none; font-size:110%; color:white; font-weight:bold; padding:19px 0px 0px 0px; text-transform:uppercase; }
h3.rightcol_heading { background:#AEADAD; padding:15px 15px 15px 15px; font-size:120%; color:white; font-weight:bold; text-transform:uppercase; margin-bottom:10px; }
.filter{ border:solid #cccccc 1px; padding:7px 17px; background:white; font-weight:bold; } |