Nexus Clash Stat Bars Vertical

Adds bars to AP HP and MP

目前为 2015-05-05 提交的版本。查看 最新版本

// ==UserScript==
// @name        Nexus Clash Stat Bars Vertical
// @namespace   http://userscripts.org/users/125692
// @description Adds bars to AP HP and MP
// @include        http://nexusclash.com/modules.php?name=Game*
// @include        http://www.nexusclash.com/modules.php?name=Game*
// @grant          GM_getValue
// @grant          GM_setValue 
// @grant          GM_addStyle
// @version     .91
// ==/UserScript==
//for nexus clash. this script
// adds coloured bars to under AP/HP/MP to provide visual referenece to depletion of these stats.
//this version adds the bars vertically in the larger cells under the ap/hp/mp numbers.
(function() {
//this copied off the web
//http://stackoverflow.com/questions/9447950/script-to-save-settings
// for chrome
if (!this.GM_getValue || (this.GM_getValue.toString && this.GM_getValue.toString().indexOf("not supported")>-1)) {
    this.GM_getValue=function (key,def) {
        return localStorage[key] || def;
    };
    this.GM_setValue=function (key,value) {
        return localStorage[key]=value;
    };
    this.GM_deleteValue=function (key) {
        return delete localStorage[key];
    };
}

//check if start screen and store max values.
var isstart = document.evaluate(
	"//h2[starts-with(.,'Welcome back to Nexus Clash!')]", 
	document, 
	null,
	XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
	null);

if (isstart.snapshotLength == 1) {
	//we on start screen.
	//Store max ap/hp/mp values.
	var charlinks = document.evaluate( 
		"//a[starts-with(@href,'modules.php?name=Game&op=character&id=')]",
		document,
		null,
		XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
		null );
	var charid;
	var charmaxhp=0;
	var charmaxap=0;
	var charmaxmp=0;
	if (charlinks.snapshotLength > 1) {//found some charlinks
		var charlink=0;
		for (i=0;charlink=charlinks.snapshotItem(i);i++){
			//alert(i);
			charid=charlink.href.match(/id=(\d+)/)[1];
			
			charlink=charlink.parentNode.nextElementSibling.nextElementSibling;
			charmaxap=charlink.textContent.match(/\/(\d+)/)[1];
			
			charlink=charlink.nextElementSibling;
			charmaxhp=charlink.textContent.match(/\/(\d+)/)[1];
			
			charlink=charlink.nextElementSibling;
			charmaxmp=charlink.textContent.match(/\/(\d+)/)[1];	
			
			//now store 'em away
			GM_setValue("maxap"+charid,charmaxap);
			GM_setValue("maxhp"+charid,charmaxhp);
			GM_setValue("maxmp"+charid,charmaxmp);		
		} 
	}
	return; //as that is all we want to do as we are on the start screen
}





//we not on start screen so we probably in game so apply rest of script.
//add styles

GM_addStyle(".barap{line-height=:1px;height:5px;display:inline-block;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;top:20px;left:-1px;border:1px solid #777777;"+
"background-color:#64ff64;");//  AP bar background

GM_addStyle(".barhp{line-height=:1px;height:5px;display:inline-block;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;top:20px;left:-1px;border:1px solid #777777;"+
"background-color:#ff0000;");// HP bar background is red
	
GM_addStyle(".barmp{line-height=:1px;height:5px;display:inline-block;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;top:20px;left:-1px;border:1px solid #777777;"+
"background-color:#99d9ea;");// MP bar background light-blue	

GM_addStyle(".bar2{line-height=:1px;height:5px;display:inline-block;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;top:21px;left:0px;"+
"background-color:#00c000;}");// SET COLOUR FOR FOREGROUND OF BAR 00ff00 is green

GM_addStyle(".numberdiv{display:inline-block;padding:0 0 0 0;margin: 0 0 0 0;width:20px;position:relative;}");
var OVERMAXCOLOUR="#0000FF";//colour to make bar for when over max

	

	
	//vertical  styles
		
	var barheight='40px';
	GM_addStyle(".vnumberdiv{display:inline;padding:0 0 0 0;margin: 0 0 0 0;width:20px;height:100%;position:relative;}");
	
//GM_addStyle(".vbarap{height:100%;width:20px;display:inline;margin: 0 0 0 0;padding: 0 0 0 0;bottom:0px;left:-1px;border:1px solid #777777;"+
//						"background-color:#64ff64;z-index:1;");//  AP bar background

	GM_addStyle(".vbarap{height:"+barheight+";width:20px;display:inline;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;bottom:-5px;right:0px;border:1px solid #777777;"+
						"background-color:#64ff64;z-index:1;");//  AP bar background

	GM_addStyle(".vbarhp{height:"+barheight+";width:20px;display:inline;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;bottom:-5px;right:0px;border:1px solid #777777;"+
"background-color:#ff0000;");// HP bar background is red
	
	GM_addStyle(".vbarmp{height:"+barheight+";width:20px;display:inline;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;bottom:-5px;right:0px;border:1px solid #777777;"+
"background-color:#99d9ea;");// MP bar background light-blue	

	GM_addStyle(".vbar2{width:18px;display:inline;margin: 0 0 0 0;padding: 0 0 0 0;position:absolute;bottom:0px;right:1px;"+
							"background-color:#00c000;z-index:2;}");// SET COLOUR FOR FOREGROUND OF BAR 00ff00 is very dark green	
	
	GM_addStyle(".vtext{position:absolute;top:-10px;left:-20px;z-index:100;width:100%;height:100%;}");// SET COLOUR FOR FOREGROUND OF BAR 00ff00 is very dark green	
	GM_addStyle(".voldtext{display:none;position:absolute;top:-10px;left:-20px;z-index:101;}");// SET COLOUR FOR FOREGROUND OF BAR 00ff00 is very dark green	
		
//ADD COLOUR BARS TO AP/HP/MP
if(document.getElementById("CharacterInfo")){

	var charinfodiv=document.getElementById("CharacterInfo");
	var charlinks = document.evaluate( 
		".//a[starts-with(@href,'modules.php?name=Game&op=character&id=')]",
		charinfodiv,
		null,
		XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
		null );
	var charid=0;
	if (charlinks.snapshotLength==1){
			charid=charlinks.snapshotItem(0).href.match(/id=(\d+)/)[1];
	}
	var charmax = new Array();//lol at this way. makes code a bit shorter in for
	charmax[0]=GM_getValue("maxap"+charid,0);
	charmax[1]=GM_getValue("maxhp"+charid,0);
	charmax[2]=GM_getValue("maxmp"+charid,0);

	//do it this way as the fonts are removed each loop
	var fontlist = new Array();
	fontlist[0]=charinfodiv.getElementsByTagName("font")[0];//get font
	fontlist[1]=charinfodiv.getElementsByTagName("font")[1];//get font
	fontlist[2]=charinfodiv.getElementsByTagName("font")[2];//get font
	fontlist[3]=charinfodiv.getElementsByTagName("font")[3];
	fontlist[4]=charinfodiv.getElementsByTagName("font")[4];
	fontlist[5]=charinfodiv.getElementsByTagName("font")[5];
	
	if (charmax[0]&&charmax[1]&&charmax[2]){//only if all are true(ie we got a proper value)
		for(i=0;i<3;i++){//for each stat add bar
			var anewspan=document.createElement('div');
			anewspan.className="numberdiv";
			
			var vanewspan=document.createElement('div');
			vanewspan.className="vnumberdiv";
			
			//var font=charinfodiv.getElementsByTagName("font")[i];//get font
			var font=fontlist[i];
			charstat=font.innerHTML.match(/-?\d+/); //get ap/hp/mp  and if -ve
	
			//verticalbar
			var vfont=fontlist[i+3];
			//var vfont=charinfodiv.getElementsByTagName("font")[i+3];//i think we wnat the 4th-6th interation. so index of 3-5
			
			
			var reddiv=document.createElement('div');
			reddiv.style.width='20px';
			reddiv.className = i==0?"barap":i==1?"barhp":"barmp";
		//	if (i==0){reddiv.className="baralt"}
			
			//vertical
			var vreddiv=document.createElement('div');
			vreddiv.style.width='20px';
			vreddiv.className = i==0?"vbarap":i==1?"vbarhp":"vbarmp";
			
			//else{			reddiv.className="bar";} 
			if(i==1){//the hp doesn't refill automatically most of the time.
				reddiv.title=charstat+"/"+charmax[i]+" Need "+
				(Number(charmax[i])-Number(charstat))+"hp healed";
				
				vreddiv.title=charstat+"/"+charmax[i]+" Need "+
				(Number(charmax[i])-Number(charstat))+"hp healed";
			}
			else{// for ap and mp
				reddiv.title = charstat+"/"+charmax[i]+" Full in "+ 
				(Number(charmax[i])-Number(charstat))/4+" hours";//assume ap/mp +1 per tick
			  
				vreddiv.title = charstat+"/"+charmax[i]+" Full in "+ 
				(Number(charmax[i])-Number(charstat))/4+" hours";//assume ap/mp +1 per tick
			}
			var greendiv=document.createElement('div');
			var greenwidth=Math.round(20*(Number(charstat)/Number(charmax[i])));
			if (greenwidth>20){//for some reason we over max
				greenwidth=20;
				greendiv.style.backgroundColor=OVERMAXCOLOUR;//set to blue to signify over max
			}
			else if (greenwidth<0){//for some reason we at -ve values
				greenwidth=0;
			}
			greendiv.className="bar2"; 
			greendiv.style.width=""+greenwidth+"px";//to make out of 20 as int;
			greendiv.title=charstat+"/"+charmax[i];
			
			
		//and vertical bars.	
			var vgreendiv=document.createElement('div');
			var vgreenheight=Math.round(100*(Number(charstat)/Number(charmax[i])));
			if (vgreenheight>100){//for some reason we over max
				vgreenheight=100;
				vgreenheight.style.backgroundColor=OVERMAXCOLOUR;//set to blue to signify over max
			}
			else if (vgreenheight<0){//for some reason we at -ve values
				vgreenheight=0;
			}
			vgreendiv.className="vbar2"; 
			vgreendiv.style.height=""+vgreenheight+"%"//to make out of 20 as int;
			vgreendiv.title=charstat+"/"+charmax[i];
			
		//put the bars in	
			var firstcell=font.parentNode;
			if(i==0){//first time is nested deeper
				firstcell=font.parentNode.parentNode;
			}
			firstcell.width='20px';
			//anewspan.insertBefore(greendiv,anewspan.firstChild);//put img in span
			//anewspan.insertBefore(reddiv,anewspan.firstChild);//put img in span
			//anewspan.insertBefore(font,anewspan.firstChild);//move the text into the new span
			//firstcell.insertBefore(anewspan,firstcell.firstChild);//put span in table cell
			
			
				
		//put the vertical bars in	
			var vfirstcell=vfont.parentNode.parentNode;//verical bars are one deeper than horizontal
			var vlinkelement=vfont.parentNode;
			if(i==0){//first time is nested deeper
				vfirstcell=vfont.parentNode.parentNode.parentNode;//ap is in extra b tag
				vlinkelement=vfont.parentNode.parentNode;
			}
			
			
				//for vertical replace vfont with a span with class and stuff	
		//var vfont.innerHTML
		var vfontdiv=document.createElement('div');
			
			var vtext=vfont.innerHTML;
			vfontdiv.className="vtext";
		//remove font element
			vfont.className="voldtext";
		//vfont.parentNode.removeChild(vfont);
     // vlinkelement.removeChild(vlinkelement.firstChild);//empty the a link?
			vlinkelement.textContent=vtext;
			
			//vfirstcell.width='20px';
			//vanewspan.insertBefore(vgreendiv,vanewspan.firstChild);//put img in span
			vanewspan.insertBefore(vreddiv,vanewspan.firstChild);//put img in span
			vreddiv.insertBefore(vgreendiv,vreddiv.firstChild);//put img in span
			vfontdiv.insertBefore(vlinkelement,vfontdiv.firstChild);
			vanewspan.insertBefore(vfontdiv,vanewspan.lastChild);//move the text into the new span
			vfirstcell.insertBefore(vanewspan,vfirstcell.firstChild);//put span in table cell;
		
			
			
		}
	}
}
//EOF
})();