WebMP Skin: Bootstrap v5.1 (9 aug. 2013)

Discussion in 'MPExtended' started by Dragy, March 15, 2013.

  1. Dragy

    Dragy Portal Pro

    Joined:
    April 27, 2009
    Messages:
    778
    Likes Received:
    303
    Gender:
    Male
    Occupation:
    Student
    Ratings:
    +332 / 1
    Home Country:
    Netherlands Netherlands
    Show System Specs
    My second contribution to the WebMP skinning contest is this skin based on Bootstrap. It still looks pretty basic, but believe me when I say that it took more work then the BlueShift skin. It has some nice features, like different views for the lists, TVGuide and a cool CPU plot for the TVServer status page.
    Also, it works perfectly on mobile devices. The new image lazy loading keeps your bandwith usage low, since it only downloads images when they are in your viewport. This also increases loading speed on desktop browsers.



    Main new features compared to the standard skin:
    - Choose between different list views (list, coverlist, covers, big covers)
    - 2 TVGuide styles, standard and list
    - Grouped recordings
    - CPU/Memory usage plot on TV Status page
    - Seeking in video player is possible in fullscreen
    - New music player layout




    Home.png Movies overview.png Movie Details.png Music Albumplayer.png Recordings overview.png TVServer Guide list.png TVServer Guide wide.png TVServer Status.png TVShow overview.png TVShow Seasons.png TVShow Episodes.png TVShow Details.png
    Enjoy!

    Installation:
    Copy the Bootstrap folder to c:\Program Files (x86)\MPExtended\WebMediaPortal\www\Skins
    When upgrading, copy (and thus overwrite) the contents of the Bootstrap folder in the zip (new version) to the Bootstrap folder in above path (old version). To have no rudimentary files left on your PC, it may be best to remove all the contents from the Bootstrap folder and replace it with the new files.

    Todo:
    - Views for Recordings list.

    Changelog:
    v1: Initial release
    v2:
    - Fixed big banner view for smaller screens (forced small banners)
    - New Album Music player! (used JWPlayer 5 because of forcing duration, which makes seeking possible)
    - Updated to Bootstrap base v2.3.1
    v3:
    - New backdrop for movie and tvshow detail view
    - New sub-title for some views with extra info
    - Add actors to tvshows
    - Localize 'Episode' in breadcrumb
    - Fixed a small responsive design bug at 779px
    - Sorted recordings by date
    - Added nummer of recordings per group to group title
    - Fixed an issue when clicking on a recording, closing the group
    - Extended album musicplayer with playing indicator
    - Gave a nice color to the music player itself
    - Added duration to track music player
    - Added cover to track music player
    - Aligned the duration in the list to be more in the middle
    - Added refreshrate indicator in dropdown button
    v4:
    - Fixed rounded corners of fanart in webkit browsers
    - Fixed width of coverlist item images in IE
    - Fixed loading of non existent default fanart-image
    - Fixed images only load when scrolling
    - Added fade animation when cha nging view
    - Added year to album list
    - Added breadcrumbs to music
    - Added artist in front of track title in playlist
    - Added fast dynamic filter for movies and music
    - More consistency between track and album musicplayer
    - Placed breadcrumbs at left plane, making more place for the cover
    v5:
    - Only show 'players' dropdown list when more then one player
    - Added current chosen genre (for movies and tvshows) to title of the page
    - Statuspage CPU/Memory usage history persistent after refresh/leaving page
    - Add new WebMP 0.5.4 feature: watched status for movies (not working right?)
    - updated to Bootstrap base v2.3.2 (no time to test the new v3 RC yet)
    v5.1:
    - Reverted update from Bootstrap base v2.3.2 to v2.3.1 because it caused problems.
    - Fixed aspect ratio of videos in Flash player (change stretching: 'exactfit' to stretching: 'uniform')
     

    Attached Files:

    Last edited: August 10, 2013
    • Like Like x 14
    • Thank You! Thank You! x 1
  2. Google AdSense Guest Advertisement



    to hide all adverts.
  3. The_Stig
    • Premium Supporter

    The_Stig Retired Team Member

    Joined:
    April 5, 2005
    Messages:
    2,176
    Likes Received:
    288
    Ratings:
    +426 / 5
    How about screenshots to see first if one personally likes it before installing? Thanks and good luck for the contest.
     
    • Like Like x 1
  4. Dragy

    Dragy Portal Pro

    Joined:
    April 27, 2009
    Messages:
    778
    Likes Received:
    303
    Gender:
    Male
    Occupation:
    Student
    Ratings:
    +332 / 1
    Home Country:
    Netherlands Netherlands
    Show System Specs
    I've added a video!
     
    • Like Like x 1
  5. Lyfesaver74
    • Team MediaPortal

    Lyfesaver74 Public Relations

    Joined:
    September 25, 2010
    Messages:
    1,544
    Likes Received:
    890
    Location:
    Texas
    Ratings:
    +1,093 / 3
    Home Country:
    United States of America United States of America
    Show System Specs
    awesome job =)
     
    • Like Like x 1
  6. kiwijunglist
    • Team MediaPortal

    kiwijunglist Super Moderator

    Joined:
    June 10, 2008
    Messages:
    6,746
    Likes Received:
    1,420
    Occupation:
    Doctor
    Location:
    New Zealand
    Ratings:
    +1,849 / 9
    Home Country:
    New Zealand New Zealand
    Show System Specs
  7. rspierenburg

    rspierenburg Portal Pro

    Joined:
    June 18, 2010
    Messages:
    146
    Likes Received:
    20
    Ratings:
    +26 / 0
    Home Country:
    Canada Canada
    Show System Specs
    Love the video...just might not be a good idea to pick 'Life of Pi' before its been released on DVD / Bluray. ;)
     
  8. mediacowboy

    mediacowboy Portal Pro

    Joined:
    May 5, 2012
    Messages:
    134
    Likes Received:
    11
    Gender:
    Male
    Occupation:
    Support Technician
    Location:
    Texas
    Ratings:
    +25 / 0
    Home Country:
    United States of America United States of America
    Show System Specs
    Life of pi has been released in the US.
     
  9. mbuzina
    • Premium Supporter

    mbuzina Retired Team Member

    Joined:
    April 11, 2005
    Messages:
    2,839
    Likes Received:
    627
    Location:
    Germany
    Ratings:
    +723 / 4
    Home Country:
    Germany Germany
    Show System Specs
    Great skin, a few things do not work 100% in IE10
    1. The small view does not work for EPG (works in Chrome/Iron)
    2. Covers (music,movies) are sometimes not loaded until scrolled a little (less of an issue in Chrome/Iron)
    3. Does not remember view selection (does in Chrome/Iron)
    4. Covers keep aspect ratio in IE10 do not in Chrome/Iron. I guess Chrome is the behaviour you want, I would suggest not stretching pics (my Artist pics are not CD cover sized)

    Suggestion: Add a floating link list to the right with jumps to the starting letters of the alphabet (# A B C .... Z and have link targets in the list)
     
    • Like Like x 1
  10. Dragy

    Dragy Portal Pro

    Joined:
    April 27, 2009
    Messages:
    778
    Likes Received:
    303
    Gender:
    Male
    Occupation:
    Student
    Ratings:
    +332 / 1
    Home Country:
    Netherlands Netherlands
    Show System Specs
    New version up!
    - Fixed big banner view for smaller screens (forced small banners)
    - New Album Music player! (used JWPlayer 5 because of forcing duration)
    (and tested a view more video players, still didn't find a better one, though Flowplayer Flash seems promising)

    @mbuzina, sorry, still didn't have time for the IE10 issues :(
     
    Last edited: March 30, 2013
    • Like Like x 1
  11. ollienator
    • Premium Supporter

    ollienator MP Donator

    Joined:
    October 13, 2007
    Messages:
    15
    Likes Received:
    2
    Ratings:
    +2 / 0

    Have you had a look at projekktor? I was also just recently shopping around for a free jwplayer substitute that doesnt force any logos onto the video (among other issues).
    After trying and ditching a couple of different alternatives, I am currently testing a setup with projekktor. So far it seems to work nicely on windows / ios, using the same player.cshtml for all platforms.
     
    Last edited: March 23, 2013
Loading...

Users Viewing Thread (Users: 0, Guests: 0)

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice
  • About The Project

    The vision of the MediaPortal project is to create a free open source media centre application, which supports all advanced media centre functions, and is accessible to all Windows users.

    In reaching this goal we are working every day to make sure our software is one of the best.

             

  • Support MediaPortal!

    The team works very hard to make sure the community is running the best HTPC-software. We give away MediaPortal for free but hosting and software is not for us.

    Care to support our work with a few bucks? We'd really appreciate it!