Optimize focus mode logic and add focusStyle method.

This commit is contained in:
Kenshin 2016-12-19 14:13:46 +08:00
parent 71c9c9834a
commit 74692324fd

View File

@ -20,9 +20,9 @@ function focuseMode() {
console.log( "=== simpread start ===" )
var $focus, $parent,
sel, range, node,
tag, bakstyle,
mask = "z-index: auto; opacity: 1; overflow: visible; transform: none; animation: none; position: relative;";
sel, range, node, tag,
maskstyle = "z-index: auto; opacity: 1; overflow: visible; transform: none; animation: none; position: relative;",
focusstyle = "z-index: 2147483647; overflow: visible; position: relative;";
// find article tag
if ( $( "body" ).find( "article" ).length > 0 ) {
@ -43,14 +43,13 @@ function focuseMode() {
return;
}
}
$focus.addClass( "ks-simpread-focus" );
focusStyle( $focus, focusstyle, "ks-simpread-focus", "add" );
// add ks-simpread-mask
$parent = $focus.parent();
tag = $parent[0].tagName;
while ( tag.toLowerCase() != "body" ) {
bakstyle = $parent.attr( "style" ) == undefined ? "" : $parent.attr( "style" );
$parent.attr( "style", bakstyle + mask ).addClass("ks-simpread-mask");
focusStyle( $parent, maskstyle, "ks-simpread-mask", "add" );
$parent = $parent.parent();
tag = $parent[0].tagName;
}
@ -60,20 +59,38 @@ function focuseMode() {
// click mask remove it
$( ".ks-simpread-bg" ).one( "click", function( event ) {
$focus.removeClass( "ks-simpread-focus" );
//$focus.removeClass( "ks-simpread-focus" );
focusStyle( $focus, focusstyle, "ks-simpread-focus", "delete" );
$( ".ks-simpread-bg" ).remove();
// remove ks-simpread-mask
$parent = $focus.parent();
tag = $parent[0].tagName;
while ( tag.toLowerCase() != "body" ) {
bakstyle = $parent.attr( "style" );
bakstyle = bakstyle.replace( mask, "" );
$parent.attr( "style", bakstyle ).removeClass( "ks-simpread-mask" );
focusStyle( $parent, maskstyle, "ks-simpread-mask", "delete" );
$parent = $parent.parent();
tag = $parent[0].tagName;
}
});
return false;
}
/*
Set focus style
@param $target: jquery object
@param style : set style string
@param cls : set class string
@param type : include 'add' and 'delete'
*/
function focusStyle( $target, style, cls, type ) {
var bakstyle;
if ( type === "add" ) {
bakstyle = $target.attr( "style" ) == undefined ? "" : $target.attr( "style" );
$target.attr( "style", bakstyle + style ).addClass( cls );
} else if ( type === "delete" ) {
bakstyle = $target.attr( "style" );
bakstyle = bakstyle.replace( style, "" );
$target.attr( "style", bakstyle ).removeClass( cls );
}
}