From RuneGlory
Jump to: navigation, search
 
(23 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<html>
 
<html>
−
<input id="item_database_input" type="text" placeholder="Search item...">
+
<!-- TEXT -->
−
<button id="item_database_button">Go</button>
+
<p style="font-weight: bold;">Text</p>
 +
<input type="text" maxlength="30" value="Usertitle" id="text" class="update">
 +
<br>
 +
<br>
 +
<!-- COLOR -->
 +
<p style="font-weight: bold;">Color</p>
 +
<input id="color" type="color" value="#C0C0C0" class="update">
 +
<br>
 +
<br>
 +
<!-- GLOW COLOR -->
 +
<p style="font-weight: bold;">Glow Color</p>
 +
<input id="glowColor" type="color" value="#C0C0C0" class="update">
 +
<br>
 +
<br>
 +
<!-- GLOW RADIUS -->
 +
<p style="font-weight: bold;">Glow Radius</p>
 +
<div class="itemBackground"><input id="glowRadius" type="range" min="0" max="1000" value="1000" class="update"></div>
 +
<br>
 +
<!-- TEXT FORMATTING -->
 +
<p style="font-weight: bold;">Text Formatting</p>
 +
<div class="itemBackground" style="padding: 10px;">
 +
<label><input type="checkbox" id="bold" class="update" checked=""><div style="line-height: 20px;">Bold</div></label>
 +
<label><input type="checkbox" id="italic" class="update"><div style="line-height: 20px;">Italic</div></label>
 +
<label><input type="checkbox" id="strikethrough" class="update"><div style="line-height: 20px;">Strikethrough</div></label>
 +
<label><input type="checkbox" id="glitter" class="update"><div style="line-height: 20px;">Glitter</div></label>
 +
</div>
 +
<br>
 +
<!-- PREVIEW -->
 +
<p style="font-weight: bold;">Preview</p>
 +
<div style="padding: 30px; background-color: #1D1D1D; text-align: center; border: 1px solid #A2A2A2; font-size: 12px;">
 +
<span id="preview"></span>
 +
</div>
 +
<br>
 +
<!-- HTML CODE -->
 +
<p style="font-weight: bold;">HTML Code</p>
 +
<input type="text" id="code">
  
−
<div id="result"></div>
 
  
−
<div id='item_database' hidden><div item='abyssal vine whip'>Abyssal vine whip;12000;10000000000;12000000000;No;Yes;No;No;Yes;PP, PKP, OP;Wield for combat.;;1;2;3;4;5;6;7;8;9;10;11;12</div><div item='torva platebody'>Torva platebody;12000;10000000000;12000000000;No;Yes;No;No;Yes;PP, PKP, OP;Worn for protection.;;15;95;15;15;0;10;10;10;10;10;10;10</div></div>
 
  
−
<script>
 
  
−
alert( "hello" );
 
−
$( "button#item_database_button" ).click( function() {
 
  
−
var input = $( "input#item_database_input" ).val().toLowerCase();
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 +
<script type="text/javascript">
  
−
if ( $( "div#item_database > div[item='" + input + "']" ).length > 0 ) {
+
update();
  
−
var data = $( "div#item_database > div[item='" + input + "']" ).html().split( ";" );
+
$( "input.update" ).change( function() {
 +
update();
 +
});
  
−
var name = data[0];
+
function update() {
−
var id = data[1];
 
  
−
var min_price = data[2];
+
var text = $( "input#text" ).val();
−
var max_price = data[3];
+
var color = $( "input#color" ).val();
 +
var glowColor = $( "input#glowColor" ).val();
 +
var glowRadius = $( "input#glowRadius" ).val() / 100;
  
−
var donator = data[4];
+
// TEXT SHADOW
−
var tradeable = data[5];
 
−
var noteable = data[6];
 
−
var stackable = data[7];
 
−
var equipable = data[8];
 
  
−
var sources = data[9];
+
if ( glowRadius == 0 ) {
−
var uses = data[10];
+
var textShadow = "text-shadow: none;";
−
var notes = data[11];
+
} else {
 +
var textShadow = "text-shadow: 0 0 " + glowRadius + "px " + glowColor + ";";
 +
}
  
−
var ab_stab = data[12];
+
// TEXT FORMATTING
−
var ab_slash = data[13];
 
−
var ab_crush = data[14];
 
−
var ab_magic = data[15];
 
−
var ab_range = data[16];
 
  
−
var db_stab = data[17];
+
if ( $( "input#bold" ).is( ":checked" ) ) {
−
var db_slash = data[18];
+
var fontWeight = "bold;";
−
var db_crush = data[19];
+
} else {
−
var db_magic = data[20];
+
var fontWeight = "normal;";
−
var db_range = data[21];
+
}
  
−
var ob_strenght = data[22];
+
if ( $( "input#italic" ).is( ":checked" ) ) {
−
var ob_prayer = data[23];
+
var fontStyle = "italic;";
 +
} else {
 +
var fontStyle = "initial;";
 +
}
  
−
$( "div#result" ).html( "<b>name: </b>" + name + "<br><b>id: </b>" + id + "<br><b>min_price: </b>" + min_price + "<br><b>max_price: </b>" + max_price + "<br><b>donator: </b>" + donator + "<br><b>tradeable: </b>" + tradeable + "<br><b>noteable: </b>" + noteable + "<br><b>stackable: </b>" + stackable + "<br><b>equipable: </b>" + equipable + "<br><b>sources: </b>" + sources + "<br><b>uses: </b>" + uses + "<br><b>notes: </b>" + notes );
+
if ( $( "input#strikethrough" ).is( ":checked" ) ) {
 +
var textDecoration = "line-through;";
 +
} else {
 +
var textDecoration = "initial;";
 +
}
  
 +
if ( $( "input#glitter" ).is( ":checked" ) ) {
 +
var background = "url(http://forum.grinderscape.org/images/Crowns/Glitter.gif);";
 
} else {
 
} else {
 +
var background = "none;";
 +
}
 +
 +
var textFormatting = "font-weight:" + fontWeight + "font-style:" + fontStyle + "text-decoration:" + textDecoration + "background:" + background;
 +
 +
var style = "color:" + color + ";" + textShadow + textFormatting;
 +
$( "span#preview" ).html( text ).attr( "style", style );
  
−
$( "div#result" ).html( "Item not found." );
+
$( "input#code" ).val( "<span style='" + style + "'>" + text + "</span>" );
  
−
};
+
}
−
});
 
  
 
</script>
 
</script>
 
</html>
 
</html>

Latest revision as of 00:25, 27 May 2016

Text



Color



Glow Color



Glow Radius


Text Formatting


Preview

Usertitle

HTML Code

Retrieved from "https://wiki.runeglory.com/index.php?title=User:Jplayer&oldid=1251"