MediaWiki:CharCount.js: Difference between revisions
Jump to navigation
Jump to search
Richardpruen (talk | contribs) (Added identifier) |
Richardpruen (talk | contribs) No edit summary |
||
Line 1: | Line 1: | ||
function | $(function () { | ||
var myPlace = document.getElementById('tpl-example-placeholder'); | |||
myPlace.innerHTML = ( | |||
<!DOCTYPE HTML> | |||
<head> | |||
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> | |||
<style> | |||
body { | |||
font-family: sans-serif; | |||
} | } | ||
</style> | |||
<script src='CharCount.js'></script> | |||
</head> | |||
<body onload='setup()'> | |||
<h1>Character Count</h1> | |||
<p>This form is useful for planning text and links for a text input area that has a character limit. | |||
<form id='textForm' oninput='updateOutput()'> | |||
<table border=0> | |||
<tr> | |||
<td colspan=2> | |||
Maximum Characters Allowed: | |||
<select id="chars" name='chars' size="1"> | |||
</select> | |||
<br>Abbreviates Links? <input type='checkbox' id='linkAbbreviate' value='Short Links'> | |||
Characters/Link: <select id="linkChars" size="1"> | |||
</select> | |||
</td> | |||
</tr> | |||
<tr> | |||
<td colspan=2> | |||
<textarea id='text' rows=10 cols=80> | |||
</textarea> | |||
</td> | |||
</tr> | |||
<tr> | |||
<td id='warningLevel' style='border: solid 1px black; color: green; width: 20px; height: 20px'> | |||
</td> | |||
<td> | |||
<output id="outputCount" value='0 of ?'>0 of ?</output> | |||
</td> | |||
</tr> | |||
</table> | |||
</form> | |||
<h2>Notes</h2> | |||
<table border=1> | |||
<tr> | |||
<th>Platform</th> | |||
<th>User Type</th> | |||
<th>Char Limit</th> | |||
<th>Link Chars</th> | |||
<th>Use these options</th> | |||
</tr> | |||
<tr> | |||
<td>𝕏 (Twitter)</td> | |||
<td>CN Unverified</td> | |||
<td>280</td> | |||
<td>-</td> | |||
<td> | |||
<a href='?c=280'>Setup</a> | |||
</td> | |||
</tr> | |||
<tr> | |||
<td>𝕏 (Twitter)</td> | |||
<td>CN Verified</td> | |||
<td>580?</td> | |||
<td>-</td> | |||
<td> | |||
<a href='?c=580'>Setup</a> | |||
</td> | |||
</tr> | |||
<tr> | |||
<td>𝕏 (Twitter)</td> | |||
<td>Unverified</td> | |||
<td>280</td> | |||
<td>13</td> | |||
<td> | |||
<a href='?c=280&l=13'>Setup</a> | |||
</td> | |||
</tr> | |||
<tr> | |||
<td>𝕏 (Twitter)</td> | |||
<td>Verified</td> | |||
<td>580</td> | |||
<td>13</td> | |||
<td> | |||
<a href='?c=580&l=13'>Setup</a> | |||
</td> | |||
</tr> | |||
</table> | |||
</body> | |||
</html> | |||
); | |||
}()); | |||
Revision as of 12:27, 8 December 2023
$(function () {
var myPlace = document.getElementById('tpl-example-placeholder');
myPlace.innerHTML = (
<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<style>
body {
font-family: sans-serif;
}
</style>
<script src='CharCount.js'></script>
</head>
<body onload='setup()'>
<h1>Character Count</h1>
<p>This form is useful for planning text and links for a text input area that has a character limit.
<form id='textForm' oninput='updateOutput()'>
<table border=0>
<tr>
<td colspan=2>
Maximum Characters Allowed:
<select id="chars" name='chars' size="1">
</select>
<br>Abbreviates Links? <input type='checkbox' id='linkAbbreviate' value='Short Links'>
Characters/Link: <select id="linkChars" size="1">
</select>
</td>
</tr>
<tr>
<td colspan=2>
<textarea id='text' rows=10 cols=80>
</textarea>
</td>
</tr>
<tr>
<td id='warningLevel' style='border: solid 1px black; color: green; width: 20px; height: 20px'>
</td>
<td>
<output id="outputCount" value='0 of ?'>0 of ?</output>
</td>
</tr>
</table>
</form>
<h2>Notes</h2>
<table border=1>
<tr>
<th>Platform</th>
<th>User Type</th>
<th>Char Limit</th>
<th>Link Chars</th>
<th>Use these options</th>
</tr>
<tr>
<td>𝕏 (Twitter)</td>
<td>CN Unverified</td>
<td>280</td>
<td>-</td>
<td>
<a href='?c=280'>Setup</a>
</td>
</tr>
<tr>
<td>𝕏 (Twitter)</td>
<td>CN Verified</td>
<td>580?</td>
<td>-</td>
<td>
<a href='?c=580'>Setup</a>
</td>
</tr>
<tr>
<td>𝕏 (Twitter)</td>
<td>Unverified</td>
<td>280</td>
<td>13</td>
<td>
<a href='?c=280&l=13'>Setup</a>
</td>
</tr>
<tr>
<td>𝕏 (Twitter)</td>
<td>Verified</td>
<td>580</td>
<td>13</td>
<td>
<a href='?c=580&l=13'>Setup</a>
</td>
</tr>
</table>
</body>
</html>
);
}());