NOTICE: By continued use of this site you understand and agree to the binding Terms of Service and Privacy Policy.
// ==UserScript==
// @name RMS Mobile View
// @namespace rms_mobile
// @version 0.3
// @description Injects mobile-friendly styles via Tampermonkey Android Browser to ratemyserver.net [current: Pre-Alpha]
// @author Sacer
// @match http://ratemyserver.net/*
// @grant none
// @require http://code.jquery.com/jquery-3.2.1.min.js
// ==/UserScript==
(function() {
'use strict';
// switch to false before deploy to tampermonkey
var local = false;
var domain = 'http://geek-wares.de/rms_mobile/';
var css_url = domain + 'style.css';
var icon_url = domain + 'icons/';
// grid-class holding object, i'm just to lazy to type the whole class every time...
var g = {
clear: 'clearfix',
bgfix: 'bgfix',
c: 'container',
cf: 'container-fluid',
r: 'row',
x1: 'col-xs-1',
x2: 'col-xs-2',
x3: 'col-xs-3',
x4: 'col-xs-4',
x5: 'col-xs-5',
x6: 'col-xs-6',
x7: 'col-xs-7',
x8: 'col-xs-8',
x9: 'col-xs-9',
x10: 'col-xs-10',
x11: 'col-xs-11',
x12: 'col-xs-12',
s1: 'col-sm-1',
s2: 'col-sm-2',
s3: 'col-sm-3',
s4: 'col-sm-4',
s5: 'col-sm-5',
s6: 'col-sm-6',
s7: 'col-sm-7',
s8: 'col-sm-8',
s9: 'col-sm-9',
s10: 'col-sm-10',
s11: 'col-sm-11',
s12: 'col-sm-12',
xh: 'hidden-xs',
sh: 'hidden-sm',
xv: 'visible-xs',
sv: 'visible-sm'
}
// globals for navigation purpose
var topmenu_link_active = null;
/**
* Class controller to append master-id ".rms_mobile" and inject the custom css
*/
var CssCtrl = function() {
this.init = function() {
// switch for local dev purpopse
if ( local ) {
css_url = '../style.min.css';
icon_url = '../icons/';
}
$('body').attr('id', 'rms_mobile');
// inject the CSS
$('<link/>', {
rel: 'stylesheet',
type: 'text/css',
href: css_url
}).appendTo('head');
// add viewport meta
// <meta name="viewport" content="width=device-width, initial-scale=1.0">
$('<meta/>', {
name: 'viewport',
content: 'width=device-width, initial-scale=1.0'
}).appendTo('head');
$('body').append('<div id="rms_mobile_lightbox"></div>');
}
this.init();
}
/**
* Class controller to add classes and grid-wrapper to the given markup
*/
var ClassCtrl = function() {
// init classes, leave a space at the and if we want to add more selectors
var body_cls = 'body#rms_mobile ';
var wrapper_cls = body_cls + '.wrapper ';
this.init = function() {
// initialise wrapping on the page-wrapper
var wrapper = $( wrapper_cls );
// add container-fluid, clearfix, wrap the children in rows
wrapper.addClass( g.cf, g.clear );
wrapper.children().wrap( '<div class="' + g.r + '"></div>' );
// handle the children
this.handleLogo();
this.handleSearchBar();
this.handleContentWrap();
this.handleLightbox();
}
this.handleLogo = function() {
var logo_cls = '.logo ';
var logo = $( wrapper_cls + logo_cls );
logo.addClass( g.r, g.clear, g.bgfix );
logo.wrap( '<div class="' + g.x12 + '"></div>');
// children top_menu wrapping
var topmenu_wrap_cls = '.topmenu_wrap ';
var topmenu_wrap = $( wrapper_cls + logo_cls + topmenu_wrap_cls);
topmenu_wrap.addClass( g.bgfix );
topmenu_wrap.wrap( '<div class="' + g.x12 + '"></div>' );
topmenu_wrap.children().wrap( '<div class="' + g.r + '"><div class="' + g.x12 + '"></div></div>' );
// remove eventlisteners from topmenus
var topmenu_links = topmenu_wrap.find( 'a' );
topmenu_links.each( function() {
$( this ).removeAttr( 'onmouseover' );
$( this ).removeAttr( 'onmouseout' );
$( this ).attr( 'href', '#' );
});
// top_menu subnav
var nav_sub_cls = '.nav_sub ';
var nav_sub = $( wrapper_cls + logo_cls + nav_sub_cls );
// remove the eventlisteners as well
var nav_sub_links = nav_sub.find( 'span.ns_span' );
nav_sub_links.each( function() {
$( this ).removeAttr( 'onmouseover' );
$( this ).removeAttr( 'onmouseout' );
$( this ).addClass( g.bgfix );
});
// handle topmenu subnav toggle
var topmenu_link = $( 'ul.topmenu li a' );
var that = this;
topmenu_link.click( function(){
var atxt = $( this ).text();
switch( atxt ) {
case 'Community':
that.handleSubmenuSwitch( 'sub_com' );
break;
case 'Rate My Server':
that.handleSubmenuSwitch( 'sub_svr' );
break;
case 'RO World':
that.handleSubmenuSwitch( 'sub_wld' );
break;
case 'Downloads':
that.handleSubmenuSwitch( 'sub_dl' );
break;
}
});
}
this.handleSubmenuSwitch = function( id ) {
var link = $( '#' + id );
if ( topmenu_link_active === null ) {
topmenu_link_active = link;
link.css( 'display', 'flex' )
} else if ( topmenu_link_active !== null && topmenu_link_active.attr( 'id' ) != id ) {
topmenu_link_active.css( 'display', 'none' );
topmenu_link_active = link;
link.css( 'display', 'flex' );
} else if ( topmenu_link_active !== null && topmenu_link_active.attr( 'id' ) == id ) {
topmenu_link_active.css( 'display', 'none' );
topmenu_link_active = null;
}
}
this.handleSearchBar = function() {
var searchbar_cls = '.srchbar ';
var searchbar = $( wrapper_cls + searchbar_cls );
searchbar.addClass( g.x12 );
// Searchbar link
var searchbar_link_id = '#srchbar-link';
var searchbar_link = $( searchbar_link_id );
searchbar_link.addClass( g.clear );
searchbar.find( 'ul' ).append( '<li id="search-trigger"><img alt="search-trigger" src="' + icon_url + 'searchw.png" />');
// search fields, create menu from right
var searchbar_search_id = '#srchbar-srch';
var searchbar_search = $( searchbar_search_id );
searchbar_search.appendTo(document.body);
this.handleSearchbarSearchTrigger();
}
this.handleSearchbarSearchTrigger = function() {
var sbstrigger = $( '#search-trigger' );
sbstrigger.click( function(e) {
var sbs = $( '#srchbar-srch' );
var lightbox = $( '#rms_mobile_lightbox' );
var wrapper = $( 'body#rms_mobile .wrapper' );
sbs.addClass( 'open' );
lightbox.addClass( 'active' );
wrapper.addClass( 'open-nav--right' );
});
}
this.handleContentWrap = function() {
var contentwrap_cls = '.contentwrap ';
var contentwrap = $( wrapper_cls + contentwrap_cls );
contentwrap.wrap( '<div class="' + g.x12 + '"></div>' );
}
this.handleLightbox = function() {
// reset all open classes
var lightbox = $( '#rms_mobile_lightbox' );
lightbox.click( function(e) {
var sbs = $( '#srchbar-srch' );
var wrapper = $( 'body#rms_mobile .wrapper' );
sbs.removeClass( 'open' );
lightbox.removeClass( 'active' );
wrapper.removeClass( 'open-nav--right' );
});
}
this.init();
}
jQuery(document).ready( function( $ ) {
// vars
var css_ctrl = new CssCtrl();
var class_ctrl = new ClassCtrl();
});
})();