Dokument bez názvu – živá ukázka

Výsledek

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Dokument bez názvu</title>
	<script type="text/javascript" src="url.js"></script>
<link rel="stylesheet" type="text/css" href="test.css" />
</head>
 
<body>
<div class ="content">
<fieldset>
    <legend>Vložit text- URL nebo název souboru:</legend>

<p>
 <label for="title">Původní název: </label><br>
 <input name="title" id="title" onchange="generateURL(this)" onkeyup="generateURL(this)" size="70" placeholder="Zadat text" abindex="9" type="text">
 </p>
 
 <p>              
<label for="rewrite">Výstupní text:</label> <br>                       
<input name="rewrite" id="rewrite" onchange="linkChanged()" size="70" type="text" placeholder="text">              
<center><input  tabindex="9" class="hledani" type="submit" id="copy-button" data-clipboard-target="search" value="Copy"></center>
 </p>
	</fieldset>
</div>

// Copy to clipboard example
document.querySelector("#rewrite").onclick = function() {
  // Select the content
  document.querySelector("#copy-button").select();
  // Copy to the clipboard
  document.execCommand('copy');
};
</script>

</body>
</html>

HTML

Autoformát
Standardní režim
Mobilní zobrazení

CSS

Autoformát
CSS reset
Až na konci

// Vytvoreni linku z jmena stranky - misto #doplnte#
link_changed = false;
// zajistuje autovyplneni pole link-name po vyplneni name
function generateURL(el) {
	if(!link_changed) {
		str = document.getElementById("rewrite").value;

str = truncateString(trim(el.value));

document.getElementById("rewrite").value = str;
	}
}

function linkChanged() {
	link_changed = true;
}

/**
* Funkce ma jako vstup unicode retezec a jako vystup vyhodi ten samy, ale malymi pismeny
* bez diakritiky, nealfanumericky znaky nahrazeny "_"
* Pokud je mode == 1, pak ponechava i tecky a orizne delku na 31 znaku
* Vystupem by tedy mel byt validni link-name
*
*/
function truncateString(str) {
	// UTF8 "ěščřžýáíéťúůóďňľĺ"
	convFromL = String.fromCharCode(283,353,269,345,382,253,225,237,233,357,367,250,243,271,328,318,314);
	// UTF8 "escrzyaietuuodnll"
	convToL = String.fromCharCode(101,115,99,114,122,121,97,105,101,116,117,117,111,100,110,108,108);

// zmenseni a odstraneni diakritiky
	str = str.toLowerCase();
	str = strtr(str,convFromL,convToL);

// jakykoliv nealfanumericky znak (nepouzit \W ci \w, protoze jinak tam necha treba "ďż˝")
	preg = /[^0-9A-Za-z]{1,}?/g;

// odstraneni nealfanumerickych znaku (pripadne je tolerovana tecka)
	str = trim(str.replace(preg, ' '));
	str = str.replace(/[\s]+/g, '-');

return str;
}

/**
* Funkce strtr odpovida teto funkci z PHP
*/
function strtr(s, from, to) {
	out = new String();
	// slow but simple :^)
	top:
	for(i=0; i < s.length; i++) {
		for(j=0; j < from.length; j++) {
			if(s.charAt(i) == from.charAt(j)) {
				out += to.charAt(j);
				continue top;
			}
		}
		out += s.charAt(i);
	}
	return out;
}

function trim(string) {
	//var re= /^\s|\s$/g;
	var re= /^\s*|\s*$/g;
	return string.replace(re,"");
}

JS

Autoformát
jQuery
Umístění JS