MP Embed Dev Blog
Feature Requests, Changelog and Tentative Roadmap
I’m excited to announce that we’ve been accepted as an embed provider by Embed.ly. Embed.ly is a service that provides standardization for embedding content within web apps — and is used by Matterport’s Multimedia Mattertags.
What this means is that you can now embed a space that uses mpembed.com INSIDE of a Matterport tour! How cool is that?
If you would like to add a tint to the UI so that it is not black and white, you can use a HEX Code to recolor all elements! Need some help? Visit: https://htmlcolorcodes.com/
|RRGGBB||Tint the UI with a color of your choice!|
I also fixed a bug with the fullscreen button.
MPEmbed overlays a hidden fullscreen button on top of the default Matterport one. This is necessary because otherwise, the default fullscreen button would take the tour fullscreen and leave behind all overlay features. Not cool!
One problem has been that if you are using the highlight reel, the fullscreen button can move. So – simple solution! I’ve added a second hidden fullscreen button. Yes, it’s always there 🙁 If the SDK has a feature wherein I can tell if the highlight reel is or is not open, I can do this properly. For now – problem solved!
The infobox was too big.
I have nipped and tucked as well as replaced much of the visible content with icons that will display information when a user rolls the mouse over. The only thing I find odd is that the Contact Name seems to be sort of hanging there without any context… which in the default Matterport Infobox, it has context as it is an equal citizen with everything else. As I’ve turned all other information into icons, this little bit of left over text looks a bit odd. I’m thinking about what to do here.
Join the highlight reels from multiple tours into one highlight directory!
Be sure to enable the highlight directory (&info=hdir)
Update 5/24 – If you use a tour that does NOT have a highlight reel, the tour’s thumbnail image will be used instead and a single highlight reel entry will be created for the tour. (Requested by: Gerald Smith)
Thank you, Benoit Penicaut.
You can zoom into the minimap with the mouse wheel and drag the floorplan around as well as resize the map box with the lower left handle.
You can now adjust the position of the panos for use on custom maps that are not proportional to the generated map. &minimapoffset=w,h,x,y (width, height, x offset, y offset). All values are in %. This feature is definitely for the PROs out there as correctly moving your pano map and aligning it will take some tweaking. If you are familiar with using your browser’s debug tools, you can fine tune by playing with the CSS and seeing the live preview as you do this. Premium will have a GUI for this!
Minimap now features a draggable resize handler on the bottom left!
Also – The details panel image is now responsive on mobile screens.
You can now swap the generated map with your own
Hotspots too large?
1/2 Size Hotspots – &hotspots=2
I have rewritten the algorithms for calculating the visibility of panoramas while changing floors.
The SDK now provides the associated floor for each pano (aka ‘sweep’), however, simply using this data would prevent the appearance of nearby panorama hotspots that would enable a visitor to click a nearby panorama that is set to the next floor.
Therefore I have also included all nearby neighbors with a threshold of 2 meters. Nearby neighbors on assigned to different floors appear as slightly smaller blue hotspots.
- 4/28/18 – Adjusted opacity of inactive tabs.
- 4/21/18 – Added mousewheel zoom to the minimap; Renamed ‘Close Tag’ to ‘Close’ and moved from bottom left to top right of window for &mt=0 mode; Added a secret code (‘d e b u g’)
- 4/17/18 – &minimap=3 – Starts minimap maximized.
- 4/15/18 – Added an interactive url builder to the homepage; &filter=darken changed from 80% to 90% with 10% Contrast; &filter=darkenmore changed from 60% to 75% with 25% contrast
- 4/10/18 – Fixed a bug where the minimap bounding box would extend beyond the map and block navigation interaction.
- 4/7/18 – Added – Darken Filter (Thanks, Gerald Smith); Removed – &filter=blue, &filter=lum and &filter=killyellow (awww) — Filters now work consistently on all browsers (Except IE); Removed debug code that showed a message when clicking on the active pano in the minimap (Thanks, Isabel Wang); Fixed – &fadehotspots disabled on tablets and mobile correctly (Thanks, Gerald Smith); Passes validator.w3.org — except for allow=”vr” (Thanks, Google for enforcing non-standards); Fixed a bug that caused MPEmbed’s overlay to fail since yesterday (Sorry)
- 4/3/18 – Added &fadehotspots=1 for large tours with many panos. This will automatically fade out inactive hotspots on desktop when the map is not hovered as well as shrinking the hotspots to half their size until hovered individually. Bug fixes: Fixed tour spinning out of control when looking down; Fixed ©right (conflict with debug box); Fixed MiniMap position on smaller screens to not overlap
- 4/2/18 – Updated debug box with full parameters list, minimapfilter selection and fixed debug minimap toggle. oEmbed bug fixes. Figured out why oEmbed doesn’t work in WordPress for Matterport or oEmbed
- 3/29/18 – Added XML support for oEmbed.
- 3/28/18 – Tour Title appears on click-to-start screen; Fixed mobile browser detection; MPEmbed works on iOS / Safari and Chrome again. (Adds &play=1 to bypass opening in a new window); Added a click-to-start start screen for mobile; Added ‘reset’ button next to Mattertag Directory filter; Added oEmbed support! (See it in action with the insert media from URL option in WordPress)
- 3/26/18 – Showcase v3.01. BETA replaces v3.0.0 BETA (new dollhosue transitions, lighter background behind terms). Minimap fixed as the method for generating the vr minimap image url changed.
- 3/25/18 – New Feature – Mattertag content displays in the infobox when hidden in the space (&mt=0). Killer feature; Mobile Mattertag Directory is now alphabetized in drop down list; renamed ‘directory’ to ‘highlights’; UI no longer fades when clicking on a highlight reel entry in the ‘highlights’ tab; Added translations of ‘Details’, ‘Highlights’, ‘Tags’ and ‘Presented by’ in all supported languages using Google Translate.
- 3/24/18 – Infobox – Tabs no longer appear when only one panel is selected (i.e. &info=mdir), fixed showing first available infobox panel if ‘details’ is not enabled; expanded hit target area for arrow buttons in top corners and minimap hotspots.
- 3/23/18 – Mattertag Directory now has colored icons based on the Mattertag color — plus filtering box (add mdirfilter to info panels)
- 3/22/18 – Minimap toggle now appears at the same time as the map (and doesn’t appear if minimap is disabled)
- 3/21/18 – Added ‘minimapfilter’ parameter. Apply any filter to the mini map (&minimapfilter=blackandwhite) for instance.
- 3/19/18 – New website with MP.Embed Premium membership sign up added. (not available to use yet)
- 3/18/18 – Added ‘image’ support in details box.
- 3/17/18 – Removed default Google Analytics UUID (my UUID)
- 3/16/18 – Added OpenGraph / Twitter tag; Added copyright feature to bottom right of player.
- 3/15/18 – Optimized UI for mobile. Mobile dropdowns added for hotspots and Mattertags.
- 3/14/18 – Added UI fading during movement; Added support for Chinese Servers.
- 3/13/18 – Public Beta Launches – Added support for parameters via Mattertags; Changed several parameters
- 3/12/18 – New UI with tabbed infobox box. Removed hdirectory and mdirectory params.
- 3/11/18 – Labels now display on the mini map!
- 3/7/18 – Fixed floorplan from exceeding window height when expanded. Restored Native UI icon for Full Screen.
- 3/6/18 – Google Analytics (&ga=UID) implemented
- 3/5/18 – MP.Embed private beta launches.
MPEmbed on Facebook
Things I Cannot Do Right Now
Mattertags cannot be opened via SDK. This feature will be available VERY soon as well as the ability to instantly transition to where Mattertags are located instead of ‘flying’ to the point. I’m waiting on the Showcase v3.0.6 / SDK v3.0.6 release to enable this.
I cannot change the URL that is shown when clicking the ‘share’ icon or hitting ‘u’ to get a deep link.
I cannot do anything to fix issues caused by the VR Modal Box, Terms of Service or Help Modal Boxes.