DATE TO ROMAN NUMERALS CODE

Sunday, 13 September 2015

DATE TO ROMAN NUMERALS CODE

-----------------------------------------------------------------------------------------------------------------
COPY AND PASTE BELOW CODE IN POST HTML SECTION
------------------------------------------------------------------------------------------------------------------

<html>
<head>

<style type="text/css">
input { font-size: 1em; }
@media (max-width:799px) {
.btn { font-size: 1.2em; padding:7px; }
}
@media (min-width:800px) {
.btn { font-size: 1.2em; padding:4px; }
}
.intext {
background:url(data:image/gif;base64,R0lGODlhsQBfALMAAO+9jPe9iP+9e/+9hOLBnOnBnMbGwdbGs63G3rXG1r3GzrnG2qXG563G56XG75zG9ywAAAAAsQBfAAAE/lDISau9OOvNZQBgKI5BZ55oqq7s+QHEcRi0gtyMo+98z9wIBc0gI4AGraRyyex8YjbE7kGtWq/YbFb3SygORmRzTC5bPjObQ8tuu9+PnzBsrttPsIMazu/7q3JgAHeEdzAGCAx/i4x+DgwJBgQlhZUsATEJio2cnX0MXwCUlqQYAXoNa56rrG8OCJKjpZaYBg2tuLlvsAWzhQAHUrrDxFsJB4O+Y6cKqsXP0FSgBGLKl8HR2doPCdTWKcAI2+PZx7LfGAAGm+Tt0AgH5+gS6uzu98/w8sqn9vj/xbrNI5AAoMFoDhQkmxXAgLODEIkxODCrQMGIGJ8ptHTAX8aP/rgQECDU8CHIk60cUKxjEaXLYRvJdHxJM5fIMQ5r6ky5UomBnUBZqfQZtKinoSx+Gl3ayMFIFQdMMp0Kp8HTE1GpavVjFavUrWC1NOjFAYDHsGixJNhXQUHat216YjgAt24WBmQvmLXL18paDG77Cn4gdwKBwYMZLJxwEXHfwgC+Ok6LQJbSyXydTgggDnNfA4Y9C25A6bJou08Dn7a7svPquqAFuH79VoEAzrTrIhAQOTdcBh8k+57qAITw4UsV90YeFsGAvczBJpAwO/rU2KatM316WPtUxfTOetc5fUL18TtjS8iOvqaDvLzFtz9puwL7+SffW4CO32V9C/f1/heRfnrJJyBA/11A14EZ4bVBgAy6g5QGATQW4T/qbVDALRfiowBbFxBwXIfFILBYBwuSuI1mKkCoYi4TQjXii510lURWNOpioxIEcJgjKwnAx6OPP3KSwIlLtFRkIwaAmAQAqi3JhwMZ1kHAeVJmEaQl6sz440ROmkFQlljE5Es/ZD5w0zwFRJkjlUh+MyaNCQk5jwQDENBMh3XeqaECBloHip1+poPIfLDEWSiFenqJmQPdhLmoBgXYMlwDBhA6qQqYAHraNJJumkItqQyGqRGikkSAAZq8BWksqc5ySCLEBYFMNbFac4gmjv7zSCTIhJqrrAVAkUAivUqEgBeSLRSg6LC55pEGDsnC8cgNkRCBKrTcqgBAsTIMcSwQ5JaL7RDaOtvtuuy2O0EEAAA7);
font-family:'Comic Sans MS';
font-weight:bold;
}
.outtext {
background:url(data:image/gif;base64,R0lGODlhsQBfALMAAO+9jPe9iP+9e/+9hOLBnOnBnMbGwdbGs63G3rXG1r3GzrnG2qXG563G56XG75zG9ywAAAAAsQBfAAAE/lDISau9OOvNZQBgKI5BZ55oqq7s+QHEcRi0gtyMo+98z9wIBc0gI4AGraRyyex8YjbE7kGtWq/YbFb3SygORmRzTC5bPjObQ8tuu9+PnzBsrttPsIMazu/7q3JgAHeEdzAGCAx/i4x+DgwJBgQlhZUsATEJio2cnX0MXwCUlqQYAXoNa56rrG8OCJKjpZaYBg2tuLlvsAWzhQAHUrrDxFsJB4O+Y6cKqsXP0FSgBGLKl8HR2doPCdTWKcAI2+PZx7LfGAAGm+Tt0AgH5+gS6uzu98/w8sqn9vj/xbrNI5AAoMFoDhQkmxXAgLODEIkxODCrQMGIGJ8ptHTAX8aP/rgQECDU8CHIk60cUKxjEaXLYRvJdHxJM5fIMQ5r6ky5UomBnUBZqfQZtKinoSx+Gl3ayMFIFQdMMp0Kp8HTE1GpavVjFavUrWC1NOjFAYDHsGixJNhXQUHat216YjgAt24WBmQvmLXL18paDG77Cn4gdwKBwYMZLJxwEXHfwgC+Ok6LQJbSyXydTgggDnNfA4Y9C25A6bJou08Dn7a7svPquqAFuH79VoEAzrTrIhAQOTdcBh8k+57qAITw4UsV90YeFsGAvczBJpAwO/rU2KatM316WPtUxfTOetc5fUL18TtjS8iOvqaDvLzFtz9puwL7+SffW4CO32V9C/f1/heRfnrJJyBA/11A14EZ4bVBgAy6g5QGATQW4T/qbVDALRfiowBbFxBwXIfFILBYBwuSuI1mKkCoYi4TQjXii510lURWNOpioxIEcJgjKwnAx6OPP3KSwIlLtFRkIwaAmAQAqi3JhwMZ1kHAeVJmEaQl6sz440ROmkFQlljE5Es/ZD5w0zwFRJkjlUh+MyaNCQk5jwQDENBMh3XeqaECBloHip1+poPIfLDEWSiFenqJmQPdhLmoBgXYMlwDBhA6qQqYAHraNJJumkItqQyGqRGikkSAAZq8BWksqc5ySCLEBYFMNbFac4gmjv7zSCTIhJqrrAVAkUAivUqEgBeSLRSg6LC55pEGDsnC8cgNkRCBKrTcqgBAsTIMcSwQ5JaL7RDaOtvtuuy2O0EEAAA7);
font-family:'Comic Sans MS';
font-weight:bold;
}
a:link { text-decoration: none; color: #083d8d; }
a:visited { text-decoration: none; color: #083d8d; }
a:active { text-decoration: underline; color: #000000; }
a:hover { text-decoration: underline; color: #000000; }
a:focus { outline: none; }

.math { font-family: "Times New Roman"; font-size: 1.6em; padding-left: 6px; font-weight: normal;}
.mathsymbol { font-family: "Times New Roman"; font-size: 1.2em; font-weight: normal; }
.text { font-family: "Times New Roman", Times, serif; font-size: 1.2em }
.code { font-family: "Courier New"; font-size: 1.0em; padding-left: 6px;}
.codebg { font-family: "Courier New"; font-size: 1.0em; color: #000000; background:#f0f0f0; margin-top: 0px; margin-bottom: 0px; padding: 10px; }
.codebg.p { font-family: "Courier New"; font-size: 1.0em; color: #000000; background:#f0f0f0; margin-top: 0px; margin-bottom: 0px;}
p.code { font-family: "Courier New"; font-size: 1.0em; color: #000000; background:#f0f0f0; margin:0px; padding:5px; border-width:1px; border-color:#ccc; border-style:solid; line-height:20px}
p.wcode { font-family: "Courier New"; font-size: 1.0em; color: #000000}
p.tcode { font-family: "Courier New"; font-size: 1.0em; color: #000000; background:#f0f0f0; margin:0px; padding:5px; border-width:1px; border-color:#ccc; border-style:solid; line-height:20px }

.table1 .hov { border: 2px black solid; padding: 4px; }
.table1 .ho2 { border: 2px #707070 solid; padding: 4px; }
.table1 .td { border: 1px black solid; padding: 5px; }

table.dtable, table.ntable { border: 1px #ccc solid; border-collapse:collapse; padding: 5px;}
table.dtable th, table.dtable td, table.ntable th, table.ntable td { border: 1px #ccc solid; border-collapse:collapse; padding: 5px; font-weight:normal;}
table.dtable th, table.ntable th { text-align:center }
table.ntable td { text-align:right }

table.calc, .calc2 {
border-spacing: 0px;
border-collapse: separate;
background: #e8e8e8;
border:1px #ddd solid;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;
}
table.calc td, .calc2 td {
padding: 2px;
border-width: 0px;
border-style: none;
background: #e8e8e8;
}
.calc2 select { padding:4px 2px; font-size:1.2em; font-family:Arial, Helvetica, sans-serif }
@media all and (max-width: 576px) {
.calc2 { padding:8px; margin-left:auto; margin-right:auto; }
.calc2 td { float:left; }
.calc2 td:nth-child(2) { clear:left; }
.calc2 tr td:nth-child(3) { padding-top:10px; }
.calc2 input[type=text], .calc2 input[type=number], .calc2 input[type=url] { width:190px; font-size:x-large; padding-left:3px; }
.calc2 tr td:nth-child(3) select { margin-top:-8px; }
}
@media all and (min-width: 577px) {
.calc2 { padding:15px; }
.calc2 tr { line-height:40px; }
.calc2 input[type=text], .calc2 input[type=number], .calc2 input[type=url] { width:220px; font-size:x-large; padding-left:3px; }
}

</style>

<script type='text/javascript'>
//<![CDATA[
window.onload = new function()
{
var currentTime = new Date()
var month = currentTime.getMonth()+1;
var day = currentTime.getDate();
var year = currentTime.getFullYear();
document.calcform.x.value = year;
document.calcform.D1.selectedIndex = month-1;
document.calcform.D2.selectedIndex = day-1;
}
function convert()
{
var month = document.calcform.D1.selectedIndex+1;
var day = document.calcform.D2.selectedIndex+1;
var type = document.calcform.D3.selectedIndex;
var year = document.calcform.x.value;
rmonth = convert2(month);
rday = convert2(day);
ryear = convert2(year);
if( type==0 )
date = rmonth+'.'+rday+'.'+ryear;
else
date = rday+'.'+rmonth+'.'+ryear;
document.calcform.y.value = date;
}
function convert2(x)
{
var n=['i', 'iv', 'v', 'ix', 'x', 'xl', 'l', 'xc', 'c', 'cd', 'd', 'cm', 'm'];
var v=[1, 4, 5, 9, 10, 40, 50, 90, 100, 400, 500, 900, 1000];
x = parseInt(x);
if( x<1 || x>4999 )
{
alert(x+' is not valid');
return '';
}
y = '';
for(i=12; i>=0; )
if( v[i]<=x )
{
y += n[i];
x -= v[i];
}
else
{
i--;
k = 0;
}
return y.toUpperCase();
}
//-->

function setfocus() {
document.calcform.x.focus();
}
function calc() {
x = document.calcform.x.value;
y = convert(x);
y = roundresult(y);
document.calcform.y.value = y;
}
function calctest() {
x = document.calcform.x.value;
y = convert(x);
//y = roundresult(y);
y = roundresult1(y);
document.calcform.y.value = y;
}
function calc3() {
x1 = document.calcform.x1.value;
x2 = document.calcform.x2.value;
y = convert(x1,x2);
y = roundresult(y);
document.calcform.y.value = y;
}
function calc4() {
x1 = document.calcform.x1.value;
x2 = document.calcform.x2.value;
x3 = document.calcform.x3.value;
y = convert(x1,x2,x3);
y = roundresult(y);
//yy = y.toString();
//if( yy.length>12 ) {
// y = parseFloat(y);
// y = y.toPrecision(10);
//}
document.calcform.y.value = y;
}
function calc5() {
x = document.calcform.x.value;
y = convert1(x);
y = roundresult(y);
document.calcform.y1.value = y;
y = convert2(x);
y = roundresult(y);
document.calcform.y2.value = y;
}
function calcbase(b1,b2) {
x = document.calcform.x.value;
document.calcform.y.value = convertbase(x,b1,b2);
}
function calcbase2() {
x = document.calcform.x.value;
y = convert(x);
document.calcform.y.value = y;
}

function roundresult(x) {
y = parseFloat(x);
y = roundnum(y,10);
return y;
}
function roundnum(x,p) {
var i;
var n=parseFloat(x);
var m=n.toPrecision(p+1);
var y=String(m);
i=y.indexOf('e');
if( i==-1 ) i=y.length;
j=y.indexOf('.');
if( i>j && j!=-1 )
{
while(i>0)
{
if(y.charAt(--i)=='0')
y = removeAt(y,i);
else
break;
}
if(y.charAt(i)=='.')
y = removeAt(y,i);
}
return y;
}
function removeAt(s,i) {
s = s.substring(0,i)+s.substring(i+1,s.length);
return s;
}

//]]>
</script>

</head>

<body>

<section id="doc">

<h1>Roman Numerals Date Converter</h1>
<h2><a name="converter"></a>Date to roman numerals converter</h2>
<p>Enter the decimal number or roman number and press the <i>Convert</i> button:</p>
<form name="calcform">
<table class="calc">
<tr>
<td>Enter date:</td>
<td><select name="D1" autofocus>
<option>January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>August</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select> / <select name="D2">
<option> 1</option>
<option> 2</option>
<option> 3</option>
<option> 4</option>
<option> 5</option>
<option> 6</option>
<option> 7</option>
<option> 8</option>
<option> 9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select> / <input type="text" name="x" value="2000" class="intext"></td>
</tr>
<tr>
<td>Select roman date format:</td>
<td><select name="D3" class="intext">
<option>MM.DD.YYYY</option>
<option>DD.MM.YYYY</option>
</select></td>
</tr>
<tr>
<td> </td>
<td><input onclick="convert()" type="button" value="Convert" class="btn"> <input onclick="setfocus()" type="reset" value="Reset" class="btn"></td>
</tr>
<tr>
<td>Date in roman numerals:</td>
<td class="math"><input type="text" name="y" class="outtext" readonly></td>
</tr>
</table>
</form>

<h2><a name="table"></a>Roman numerals table</h2>
<table class="ntable" style="width:200px">
<tr>
<th>Roman numeral</th>
<th>Decimal number</th>
</tr>
<tr>
<td>I</td>
<td>1</td>
</tr>
<tr>
<td>V</td>
<td>5</td>
</tr>
<tr>
<td>X</td>
<td>10</td>
</tr>
<tr>
<td>L</td>
<td>50</td>
</tr>
<tr>
<td>C</td>
<td>100</td>
</tr>
<tr>
<td>D</td>
<td>500</td>
</tr>
<tr>
<td>M</td>
<td>1000</td>
</tr>
</table>

</section>

</body>
</html>