Custom Visual Composer Plugins
The main WordPress plugin used is WPBakery Page Builder and I built multiple custom elements using the vc_map function. The website is fully responsive with fading transitions as you scroll down.
Image Panorama View
The Plans and Views page features two draggable panorama images; one for morning view and one for evening view. This was created using the jQuery UI Draggable interaction.
We had to develop an algorithm to make sure that the image would always be on the screen. In web programming, everything is calculated from the top and from the left. In order to calculate the right side, we had to compare the current position and screen width with the image width.
The floorplans popup was another custom element built into WPBakery Page Builder. Using the same query as the grid, a new page was created that contained just the in-depth floorplan information.
All the floorplans were then put into a slider. I programmed the ability to pass a parameter into the URL which would go to a specific slide.
Back on the grid, I added a custom click event to the thumbnails, which would open the slider page inside an iframe in a popup. The parameter passed into the URL made sure it always arrived at the correct position.
I created a new post type in WordPress with custom fields for the thumbnail, pdf download, and other text fields.
A custom element was programmed into WPBakery Page Builder to list out all the floorplans. The element contains a custom WordPress query to retrieve all the floorplan posts. jQuery's Isotope plugin was used to display all the floorplans in a masonry grid with the filters.
Custom Popup Plugin
The gallery page contains both images and videos. Users can filter by categories using buttons at the top. Clicking on any thumbnail opens up the video or hi-res image in a popup window.