diff --git a/main.js b/main.js index f564034..d938114 100644 --- a/main.js +++ b/main.js @@ -13,18 +13,34 @@ function setLongPostListener(){ jQuery("#list-view-2").on( "click", ".badge-evt.post-read-more", function( event ) { event.preventDefault(); post = jQuery(event.target); - var image = post.parent().find("img"); - image = jQuery(image); + // var image = post.parent().find("img"); + var sidebar = jQuery("#sidebar-longPost"); + sidebar.removeClass("closed"); + sidebar.html(""); + var image = jQuery("#sidebar-longPost img"); + image.on('error', function(){ image.attr("src", post.attr('href').replace("/gag/", "http://img-9gag-fun.9cache.com/photo/") + "_700b.jpg"); }); image.attr("src", post.attr('href').replace("/gag/", "http://img-9gag-fun.9cache.com/photo/") + "_700b_v1.jpg"); - post.remove(); + // post.remove(); + + }); + jQuery(document).on('scroll', function(){ + var sidebar = jQuery("#sidebar-longPost"); + if( !sidebar.hasClass('closed') ){ + sidebar.addClass('closed'); + } }); } +function setupLongPostSidebar(){ + jQuery(".badge-page.page .main-wrap ").after(""); + var pageHeight = jQuery(window).height(); + jQuery("#sidebar-longPost").css({"height": pageHeight}); +} //clean wake up overlay function cleanWakeUp(){ jQuery("#overlay-container").remove(); @@ -55,6 +71,9 @@ function nightMode(){ } } +function enableSoftTransitions( element ){ + jQuery(element).addClass("softTransitions"); +} function toggleNight( command ){ nightClass = "night"; @@ -95,6 +114,8 @@ jQuery(document).ready(function() { cleanWakeUp(); currentVideo = setupVideoObject(); setVideoListener(); + enableSoftTransitions(jQuery("#container")); + setupLongPostSidebar(); nightMode(); console.log("9gag Mod Successfully Loaded!"); diff --git a/style.css b/style.css index 66713ca..3a5e190 100644 --- a/style.css +++ b/style.css @@ -1,8 +1,38 @@ +.softTransitions{ + -webkit-transition: all .7s ease-in-out; +} #container.night{ background-color: white; - -webkit-transition: all 0.3s ease-in-out; /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6 */ -webkit-filter: invert(100%); } #container.night img, #container.night video{ -webkit-filter: invert(100%); +} +#sidebar-longPost{ + overflow-y: scroll; + float: left; + position: fixed; + height: 70%; + width: 40%; + right: 0px; + background-color: #333; + z-index: 9999; + padding: 20px; + + +} +#sidebar-longPost *{ + box-sizing: border-box; +} +#sidebar-longPost img{ + width: 100%; + padding-bottom: 700px; +} +#sidebar-longPost.closed, .closed{ + width: 0px; + background: white; + +} +.hidden{ + display: none; } \ No newline at end of file