├── README.md ├── _func.php ├── _init.php ├── _main.php ├── admin.php ├── architect.php ├── architects.php ├── basic-page.php ├── browse.php ├── cities.php ├── city.php ├── fields └── body.php ├── home.php ├── includes ├── banner-photo.php ├── cities-list.php ├── google-analytics.php ├── nav-cols.php ├── offcanvas.php ├── search-form.php ├── search-summary.php ├── sidebar-links.php ├── skyscraper-list-item.php ├── skyscraper-list-sort.php ├── skyscraper-list.php ├── skyscraper-page-images.php ├── skyscraper-page-table.php └── skyscraper-page.php ├── list-all.php ├── scripts └── skyscrapers.js ├── search.php ├── skyscraper.php ├── styles ├── images │ ├── bg.gif │ ├── bg_foot.gif │ ├── photo_placeholder.png │ ├── search_bg.jpg │ ├── search_bg.png │ ├── shade.png │ ├── thumb_placeholder.gif │ └── thumb_placeholder2.gif ├── main.css ├── reset.css ├── skyscraper.css ├── skyscrapers.css ├── skyscrapers.css.map └── skyscrapers.scss └── uikit ├── css ├── components │ ├── accordion.almost-flat.css │ ├── accordion.almost-flat.min.css │ ├── accordion.css │ ├── accordion.gradient.css │ ├── accordion.gradient.min.css │ ├── accordion.min.css │ ├── autocomplete.almost-flat.css │ ├── autocomplete.almost-flat.min.css │ ├── autocomplete.css │ ├── autocomplete.gradient.css │ ├── autocomplete.gradient.min.css │ ├── autocomplete.min.css │ ├── datepicker.almost-flat.css │ ├── datepicker.almost-flat.min.css │ ├── datepicker.css │ ├── datepicker.gradient.css │ ├── datepicker.gradient.min.css │ ├── datepicker.min.css │ ├── dotnav.almost-flat.css │ ├── dotnav.almost-flat.min.css │ ├── dotnav.css │ ├── dotnav.gradient.css │ ├── dotnav.gradient.min.css │ ├── dotnav.min.css │ ├── form-advanced.almost-flat.css │ ├── form-advanced.almost-flat.min.css │ ├── form-advanced.css │ ├── form-advanced.gradient.css │ ├── form-advanced.gradient.min.css │ ├── form-advanced.min.css │ ├── form-file.almost-flat.css │ ├── form-file.almost-flat.min.css │ ├── form-file.css │ ├── form-file.gradient.css │ ├── form-file.gradient.min.css │ ├── form-file.min.css │ ├── form-password.almost-flat.css │ ├── form-password.almost-flat.min.css │ ├── form-password.css │ ├── form-password.gradient.css │ ├── form-password.gradient.min.css │ ├── form-password.min.css │ ├── form-select.almost-flat.css │ ├── form-select.almost-flat.min.css │ ├── form-select.css │ ├── form-select.gradient.css │ ├── form-select.gradient.min.css │ ├── form-select.min.css │ ├── htmleditor.almost-flat.css │ ├── htmleditor.almost-flat.min.css │ ├── htmleditor.css │ ├── htmleditor.gradient.css │ ├── htmleditor.gradient.min.css │ ├── htmleditor.min.css │ ├── nestable.almost-flat.css │ ├── nestable.almost-flat.min.css │ ├── nestable.css │ ├── nestable.gradient.css │ ├── nestable.gradient.min.css │ ├── nestable.min.css │ ├── notify.almost-flat.css │ ├── notify.almost-flat.min.css │ ├── notify.css │ ├── notify.gradient.css │ ├── notify.gradient.min.css │ ├── notify.min.css │ ├── placeholder.almost-flat.css │ ├── placeholder.almost-flat.min.css │ ├── placeholder.css │ ├── placeholder.gradient.css │ ├── placeholder.gradient.min.css │ ├── placeholder.min.css │ ├── progress.almost-flat.css │ ├── progress.almost-flat.min.css │ ├── progress.css │ ├── progress.gradient.css │ ├── progress.gradient.min.css │ ├── progress.min.css │ ├── search.almost-flat.css │ ├── search.almost-flat.min.css │ ├── search.css │ ├── search.gradient.css │ ├── search.gradient.min.css │ ├── search.min.css │ ├── slidenav.almost-flat.css │ ├── slidenav.almost-flat.min.css │ ├── slidenav.css │ ├── slidenav.gradient.css │ ├── slidenav.gradient.min.css │ ├── slidenav.min.css │ ├── slider.almost-flat.css │ ├── slider.almost-flat.min.css │ ├── slider.css │ ├── slider.gradient.css │ ├── slider.gradient.min.css │ ├── slider.min.css │ ├── slideshow.almost-flat.css │ ├── slideshow.almost-flat.min.css │ ├── slideshow.css │ ├── slideshow.gradient.css │ ├── slideshow.gradient.min.css │ ├── slideshow.min.css │ ├── sortable.almost-flat.css │ ├── sortable.almost-flat.min.css │ ├── sortable.css │ ├── sortable.gradient.css │ ├── sortable.gradient.min.css │ ├── sortable.min.css │ ├── sticky.almost-flat.css │ ├── sticky.almost-flat.min.css │ ├── sticky.css │ ├── sticky.gradient.css │ ├── sticky.gradient.min.css │ ├── sticky.min.css │ ├── tooltip.almost-flat.css │ ├── tooltip.almost-flat.min.css │ ├── tooltip.css │ ├── tooltip.gradient.css │ ├── tooltip.gradient.min.css │ ├── tooltip.min.css │ ├── upload.almost-flat.css │ ├── upload.almost-flat.min.css │ ├── upload.css │ ├── upload.gradient.css │ ├── upload.gradient.min.css │ └── upload.min.css ├── uikit.almost-flat.css ├── uikit.almost-flat.min.css ├── uikit.css ├── uikit.gradient.css ├── uikit.gradient.min.css └── uikit.min.css ├── fonts ├── FontAwesome.otf ├── fontawesome-webfont.ttf ├── fontawesome-webfont.woff └── fontawesome-webfont.woff2 └── js ├── components ├── accordion.js ├── accordion.min.js ├── autocomplete.js ├── autocomplete.min.js ├── datepicker.js ├── datepicker.min.js ├── form-password.js ├── form-password.min.js ├── form-select.js ├── form-select.min.js ├── grid-parallax.js ├── grid-parallax.min.js ├── grid.js ├── grid.min.js ├── htmleditor.js ├── htmleditor.min.js ├── lightbox.js ├── lightbox.min.js ├── nestable.js ├── nestable.min.js ├── notify.js ├── notify.min.js ├── pagination.js ├── pagination.min.js ├── parallax.js ├── parallax.min.js ├── search.js ├── search.min.js ├── slider.js ├── slider.min.js ├── slideset.js ├── slideset.min.js ├── slideshow-fx.js ├── slideshow-fx.min.js ├── slideshow.js ├── slideshow.min.js ├── sortable.js ├── sortable.min.js ├── sticky.js ├── sticky.min.js ├── timepicker.js ├── timepicker.min.js ├── tooltip.js ├── tooltip.min.js ├── upload.js └── upload.min.js ├── core ├── alert.js ├── alert.min.js ├── button.js ├── button.min.js ├── core.js ├── core.min.js ├── cover.js ├── cover.min.js ├── dropdown.js ├── dropdown.min.js ├── grid.js ├── grid.min.js ├── modal.js ├── modal.min.js ├── nav.js ├── nav.min.js ├── offcanvas.js ├── offcanvas.min.js ├── scrollspy.js ├── scrollspy.min.js ├── smooth-scroll.js ├── smooth-scroll.min.js ├── switcher.js ├── switcher.min.js ├── tab.js ├── tab.min.js ├── toggle.js ├── toggle.min.js ├── touch.js ├── touch.min.js ├── utility.js └── utility.min.js ├── uikit.js └── uikit.min.js /README.md: -------------------------------------------------------------------------------- 1 | ## Skyscraper template files 2 | 3 | In this Skyscrapers profile, please note the following locations: 4 | 5 | ### `_init.php` 6 | 7 | This file is automatically included before all other template files. 8 | We use it to define our output regions, while the individual 9 | template files populate those regions. 10 | 11 | ### `_main.php` 12 | 13 | This file is automatically included after all other template files. 14 | We use it as our main markup file to output everything. It outputs 15 | the regions defined in the `_init.php` file into the appropriate 16 | locations. 17 | 18 | ### `_func.php` 19 | 20 | This file contains shared functions for finding skyscrapers and 21 | rendering lists of skyscrapers, maps, and more. 22 | 23 | ### `includes/` 24 | 25 | We have placed our common markup rendering/views in this directory. 26 | These files are rendered from the template files as needed. 27 | 28 | ## Requirements 29 | 30 | These template files require ProcessWire 3.0.39 or newer. 31 | 32 | These template files also require the following settings 33 | in your /site/config.php file: 34 | 35 | - `$config->useFunctionsAPI = true;` 36 | - `$config->prependTemplateFile = '_init.php';` 37 | - `$config->appendTemplateFile = '_main.php';` 38 | -------------------------------------------------------------------------------- /_init.php: -------------------------------------------------------------------------------- 1 | prependTemplateFile in /site/config.php. 7 | * We are using this init file to define shared functions and variables. 8 | * See _main.php for the main markup file where everything is output. 9 | * 10 | */ 11 | 12 | include_once("./_func.php"); // shared functions 13 | 14 | /*************************************************************************************** 15 | * DEFINE REGIONS 16 | * 17 | * These are the regions we've decided template files may choose to populate. 18 | * and they are ultimately output by the _main.php file. 19 | * 20 | */ 21 | 22 | region('browserTitle', page('title')); 23 | region('headline', page('title')); 24 | region('mainHeader', ''); 25 | region('content', page('body')); 26 | region('sidebar', ''); 27 | region('sidebarHeader', ''); 28 | 29 | -------------------------------------------------------------------------------- /admin.php: -------------------------------------------------------------------------------- 1 | paths->adminTemplates . 'controller.php'); 14 | -------------------------------------------------------------------------------- /architect.php: -------------------------------------------------------------------------------- 1 | render('./includes/nav-cols.php', array( 4 | 'items' => page()->children, 5 | 'cols' => 2 6 | ))); 7 | 8 | -------------------------------------------------------------------------------- /cities.php: -------------------------------------------------------------------------------- 1 | children; 9 | 10 | region('content', 11 | renderMap($cities, array('height' => '320px')) . 12 | page()->body . 13 | files()->render('./includes/cities-list.php', array('items' => $cities)) 14 | ); 15 | 16 | -------------------------------------------------------------------------------- /city.php: -------------------------------------------------------------------------------- 1 | get('map'); 14 | $mapMarkup = renderMap($skyscrapers, array( 15 | 'fitToMarkers' => false, 16 | 'lat' => $map->lat, 17 | 'lng' => $map->lng 18 | )); 19 | 20 | region('browserTitle', "Skyscrapers in $page->title"); 21 | region('content', renderSkyscraperList($skyscrapers)); 22 | region('sidebarHeader', $mapMarkup); 23 | 24 | 25 | -------------------------------------------------------------------------------- /fields/body.php: -------------------------------------------------------------------------------- 1 |
=$summary?>
32 |
20 | The selector used to find the pages shown above is:
21 | =$selector?>
22 |
Height | 17 |$height feet"; ?> | 18 |
---|---|
Floors | 24 |$floors"; ?> | 25 |
Year | 31 |$year"; ?> | 32 |
Architects | 38 |
39 |
|
43 |
16 | 17 | Read More at Wikipedia 18 | 19 |
20 | 21 | 22 |