Mobile Media
|
The Mobile Media mod is obsolete with TNG 10.1.2. The functionality was added to TNG V10.1.2.
|
|
| Mobile Media | |||
|---|---|---|---|
| Summary | fixes the image display and image previews for smart phones and tablets | ||
| Validation | |||
| Mod Updated | {{{mod_last_update}}} | ||
| Download link | for
| ||
| Download stats | View download statistics | ||
| Author(s) | Ken Roy | ||
| Homepage | Mobile Media (This page) | ||
| Mod Support | TNG Community Forums | ||
| Contact Developer | Ken Roy | ||
| Latest Mod | 10.1.1.4 for TNG V10.1.1 10.1.0.4 for TNG V10.1.0 | ||
| Min TNG V | 10.1.0 | ||
| Max TNG V | 10.1.1 | ||
| Files modified | showalbum.php browsemedia.php showmedia.php showmedialib.php css/genstyle.css | ||
| Related Mods | |||
| Notes | Note that this mod conflicts with the Media Preview Fixed mod | ||
Introduction
This mod adjusts the Image display and image preview for different screen widths
Note that this mod requires that you use v10.1.0.3 of the Mobile Site Enhancements mod since some of the code in this mod was previously in the Mobile Site Enhancements mod
Note the slide show suppression code was moved to the Mobile Site No Slideshow
Developer
This mod was developed by Ken Roy with some code provided by Darrin Lythgoe that will be part of the upgrade after TNG 10.1.1.
Thanks to Roger Moffat, Graham Chamberlain, and Del Groves for testing.
Revision History
| Version | Date | Contents |
|---|---|---|
| v10.1.1.4 v10.1.0.4 |
14 June 2015 | Provides the Image Preview changes that will be in the next TNG upgrade
The slide show suppression code was moved to Mobile Site No Slideshow v10.1.0.3 and v10.1.1.3 were used for beta testing only. |
| v10.1.0.2 | 22 April 2015 | Initial production version of the mod |
| v10.1.0.1b | 20 April 2015 | Disable the Slide Show in Show Album for smart phones and tablets |
| v10.1.0.1a | 17 April 2015 | Disable the Slide Show in Browse Media for smart phones and tablets |
| v10.1.0.1 | 17 April 2015 | Initial version of the mod |
Requirements
- a working TNG installation
- an installed current version of the Mod Manager
- a backup of the getperson.php file
- must be using the latest TNG templates/templateN/footer.php that includes setting the $flags['basicfooter'] = true; before calling the tng_footer function
Automated Installation
- Download the appropriate mod for your TNG version and desktop genealogy program from the download links in the status area in the upper right.
- Extract the appropriate zip file to your TNG mods folder.
- Follow the normal automated installation for Mod Manager, as shown in the example Mod Manager - Installing Config Files to install the appropriate mod for your desktop genealogy program.
Known Problems
If you are not using the latest versions of the TNG footer.php modules, then the Image Preview will not be displayed since the jQuery script that calls the showPreview function in net.js is added to the page footer by the tng_basicfooter function in the tng_footer function of genlib.php.
- to resolve this problem update your template footer to include setting the $flags['basicfooter'] before the tng_footer function call
$flags['basicfooter'] = true;
echo tng_footer($flags);Visualization
The following screen captures shows the major changes made by the mod
Image Display
| Image Display Before Installation | Image Display After Installation |
|---|---|
Before installing this mod, the following issues exist
|
The installed mod
|
|
|
Image Preview
| Image Preview Before Installation | Image Preview After Installation |
|---|---|
Before installing this mod, the following issues exist
|
The installed mod
|
|
|
Note that the column width reductions in the above after image are implemented by the Mobile Site Enhancements mod
Note that the Slide Show not showing in the above after image is implemented by the Mobile Site No Slideshow mod
Alternative CSS @media query
The following is an alternative CSS @media query that you could put in your templates/templateN/css/mytngstyle.css provided by Colin Spencer that may provide a better display experience on the iPhone 5. These definitions added to your templateN/css/mytngstyle.css will overrided the definitions provided by the mod.
/* definitions for different screen widths added in TNG 10.1.1+ to keep image preview on screen
see http://www.canbike.org/CSSpixels/ for CSS Pixel Widths using
/* media query default for smart phones and tablets */
@media screen and (max-width:1200px) {.media-prev {height:100%; top:50px; background:none;}}
@media screen and (max-width:640px) {.media-prev {padding: 10px 4px 6px 0;}}
@media screen and (min-width: 300px) and (max-width: 360px) {
.media-prev {
left: -20px;
width: 180px;
}
}
@media screen and (min-width:361px) and (max-width: 480px) {
.media-prev {
left: 10px;
width: 180px;
}
}
@media only screen and (min-width:481px) and (max-width:640px) {
.media-prev {
left: 50px;
width: 230px;
}
}
@media only screen and (min-width:641px) and (max-width:1100px) {
.media-prev {
left: 50px;
}
}
Sites using this mod
If you download and install this mod, please add your TNG site to the table below:
| URL | User | Note | Mod-Version | TNG-Version | User-language |
|---|---|---|---|---|---|
| Our Roy and Boucher Family | Ken Roy | Mod is provided to adjust the Image display when not using the Image Viewer, suppress the Slide Show on the smart phones | 10.1.0.4 | 10.1.1 | English, French |
| Wortelboer Genealogy | Bernard Wortelboer | 10.1.0.2 | 10.1.1 | NL, EN | |
| Genealogy of the Hendee Family | John Hendee | 10.1.1.4 | 10.1.1 | EN | |
| Chamberlain & Eidenbenz Genealogy | Graham Chamberlain | 10.1.1.4 | 10.1.1 | EN,NL,FR,DE,ES | |
| Our Family Saga | Del Groves | 10.1.1.4 | 10.1.1 | EN |
Related Links
Life Dates Mobile - adjusts the date displays for smart phones and tablets as an alternative to Life Dates Mod which always puts the birth and death dates on separate lines
Mobile Media - adjusts the Image display when not using the Image Viewer and the Image Preview for mobile devices
Mobile Individual Page Map - adjusts the Google Event Map on smart phones and tablets
Mobile Site Enhancements - several adjustments for smart phones and tablets
Mobile Site No Previews - eliminates the Person and Family previews for smart phones
Mobile Site No Slideshow - eliminates the slide show for smart phones and tablets
Responsive Tables - adjusts TNG table displays based on screen widths
