First commit
This commit is contained in:
@@ -0,0 +1,166 @@
|
||||
<head>
|
||||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=9" />
|
||||
<title>Paykan</title>
|
||||
<style type="text/css" media="screen">
|
||||
@font-face { font-family: 'Paykan Light WOFF'; src: url('woff/Paykan-Light.woff'); }
|
||||
@font-face { font-family: 'Paykan ExtraBlack WOFF'; src: url('woff/Paykan-ExtraBlack.woff'); }
|
||||
@font-face { font-family: 'Paykan Light WOFF2'; src: url('woff2/Paykan-Light.woff2'); }
|
||||
@font-face { font-family: 'Paykan ExtraBlack WOFF2'; src: url('woff2/Paykan-ExtraBlack.woff2'); }
|
||||
|
||||
|
||||
body {
|
||||
font-family: "Paykan Light WOFF";
|
||||
font-feature-settings: "kern" on, "liga" on, "dlig" on;
|
||||
-moz-font-feature-settings: "kern" on, "liga" on, "dlig" on;
|
||||
-webkit-font-feature-settings: "kern" on, "liga" on, "dlig" on;
|
||||
-ms-font-feature-settings: "kern" on, "liga" on, "dlig" on;
|
||||
-o-font-feature-settings: "kern" on, "liga" on, "dlig" on;
|
||||
}
|
||||
p { padding: 15px; margin: 10px; }
|
||||
.features {
|
||||
font-size:x-small;
|
||||
font:sans-serif;
|
||||
}
|
||||
.label{
|
||||
font-family: sans-serif;
|
||||
font-size: x-small;
|
||||
color: grey;
|
||||
}
|
||||
span#p08 { font-size: 8pt; }
|
||||
span#p10 { font-size: 10pt; }
|
||||
span#p12 { font-size: 12pt; }
|
||||
span#p14 { font-size: 14pt; }
|
||||
span#p18 { font-size: 18pt; }
|
||||
span#p36 { font-size: 36pt; }
|
||||
span#p72 { font-size: 72pt; }
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
function updateParagraph() {
|
||||
// update paragraph text based on user input:
|
||||
var txt = document.getElementById('textInput');
|
||||
var paragraphs = ['p08','p10','p12','p14','p18','p36','p72'];
|
||||
for (i = 0; i < paragraphs.length; i++) {
|
||||
paragraphID = paragraphs[i];
|
||||
var paragraph = document.getElementById(paragraphID);
|
||||
paragraph.textContent = txt.value;
|
||||
}
|
||||
}
|
||||
function updateFeatures() {
|
||||
// update features based on user input:
|
||||
// first, get feature on/off line:
|
||||
var cssCode = "";
|
||||
var codeLine = "";
|
||||
var checkboxes = document.getElementsByClassName("otFeature")
|
||||
for (i = 0; i < checkboxes.length; i++) {
|
||||
var checkbox = checkboxes[i];
|
||||
codeLine += '"'+checkbox.name+'" ';
|
||||
codeLine += checkbox.checked ? 'on, ' : 'off, ';
|
||||
if (checkbox.name=="kern") {
|
||||
cssCode += "font-kerning: "
|
||||
cssCode += checkbox.checked ? 'normal; ' : 'none; ';
|
||||
} else if (checkbox.name=="liga") {
|
||||
codeLine += '"clig" '
|
||||
codeLine += checkbox.checked ? 'on, ' : 'off, ';
|
||||
cssCode += "font-variant-ligatures: "
|
||||
cssCode += checkbox.checked ? 'common-ligatures contextual; ' : 'no-common-ligatures no-contextual; ';
|
||||
} else if (checkbox.name=="dlig") {
|
||||
cssCode += "font-variant-ligatures: "
|
||||
cssCode += checkbox.checked ? 'discretionary-ligatures; ' : 'no-discretionary-ligatures; ';
|
||||
} else if (checkbox.name=="hlig") {
|
||||
cssCode += "font-variant-ligatures: "
|
||||
cssCode += checkbox.checked ? 'historical-ligatures; ' : 'no-historical-ligatures; ';
|
||||
}
|
||||
}
|
||||
codeLine = codeLine.slice(0, -2)
|
||||
|
||||
// then, apply line for every browser:
|
||||
var prefixes = ["","-moz-","-webkit-","-ms-","-o-",];
|
||||
var suffix = "font-feature-settings: "
|
||||
for (i = 0; i < prefixes.length; i++) {
|
||||
var prefix = prefixes[i];
|
||||
cssCode += prefix
|
||||
cssCode += suffix
|
||||
cssCode += codeLine
|
||||
cssCode += "; "
|
||||
}
|
||||
|
||||
document.getElementById('fontTestBody').style.cssText = cssCode;
|
||||
document.getElementById('featureLine').innerHTML = cssCode.replace(/;/g,";<br/>");
|
||||
changeFont();
|
||||
}
|
||||
function changeFont() {
|
||||
var selector = document.getElementById('fontFamilySelector');
|
||||
var selected_index = selector.selectedIndex;
|
||||
var selected_option_text = selector.options[selected_index].text;
|
||||
document.getElementById('fontTestBody').style.fontFamily = selected_option_text;
|
||||
}
|
||||
function setDefaultText(defaultText) {
|
||||
document.getElementById('textInput').value = decodeEntities(defaultText);
|
||||
updateParagraph();
|
||||
}
|
||||
function setLat1() {
|
||||
var lat1 = "abcdefghijklm nopqrstuvwxyz ABCDEFGHIJKLM NOPQRSTUVWXYZ ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖØŒÞÙÚÛÜÝŸ àáâãäåæçèéêëìíîïðñòóôõöøœþßùúûüýÿ .,:;·…¿?¡!«»‹› /|¦\()[]{}_-–—‚„‘’“”"' #&§@•­*†‡¶ +×÷±=<>¬μ ^~´`ˆ¯˜¨¸ ¥€£$¢¤ƒ ™®© 1234567890 ªº°%‰ ¹²³¼½¾";
|
||||
return setDefaultText(lat1);
|
||||
}
|
||||
function setCharset() {
|
||||
var completeCharSet = "A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z ء ا ﺎ أ ﺄ إ ﺈ آ ﺂ ٱ ﭑ ٮ ب ﺐ ﺒ ﺑ پ ﭗ ﭙ ﭘ ت ﺖ ﺘ ﺗ ث ﺚ ﺜ ﺛ ج ﺞ ﺠ ﺟ چ ﭻ ﭽ ﭼ ح ﺢ ﺤ ﺣ خ ﺦ ﺨ ﺧ د ﺪ ذ ﺬ ر ﺮ ز ﺰ ژ ﮋ س ﺲ ﺴ ﺳ ش ﺶ ﺸ ﺷ ص ﺺ ﺼ ﺻ ض ﺾ ﻀ ﺿ ط ﻂ ﻄ ﻃ ظ ﻆ ﻈ ﻇ ع ﻊ ﻌ ﻋ غ ﻎ ﻐ ﻏ ف ﻒ ﻔ ﻓ ڤ ﭫ ﭭ ﭬ ڡ ٯ ق ﻖ ﻘ ﻗ ك ﻚ ﻜ ﻛ ک ﮏ ﮑ ﮐ گ ﮓ ﮕ ﮔ ل ﻞ ﻠ ﻟ م ﻢ ﻤ ﻣ ن ﻦ ﻨ ﻧ ں ﮟ ه ﻪ ﻬ ﻫ ۀ ﮤ ﮥ ة ﺔ و ﻮ ؤ ﺆ ى ﻰ ي ﻲ ﻴ ﻳ ئ ﺊ ﺌ ﺋ ی ﯽ ﯿ ﯾ ـ ﻻ ﻼ ﻷ ﻸ ﻹ ﻺ ﻵ ﻶ ﷲ 0 1 2 3 4 5 6 7 8 9 ٫ ٬ ٠ ١ ٢ ٣ ٤ ٥ ٦ ٧ ٨ ٩ ۰ ۱ ۲ ۳ ۴ ۵ ۶ ۷ ۸ ۹ . , : ; ! ? * # / \ ( ) { } [ ] - _ „ “ ” ‘ ’ « » ‹ › " ' ، ؛ ؟ ٭ ﴾ ﴿         ​ ‍ ‌ 
  ﷼ $ + − × ÷ = ≠ % @ & ٪ ﮲ ﮳ ﮴ ﮵ ﮹ ﮶ ٰ ٖ ٔ ٕ ً ٌ ٍ َ ُ ِ ّ ْ ٓ";
|
||||
setDefaultText(completeCharSet);
|
||||
}
|
||||
function decodeEntities(string){
|
||||
var elem = document.createElement('div');
|
||||
elem.innerHTML = string;
|
||||
return elem.textContent;
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body id="fontTestBody">
|
||||
<select size="1" id="fontFamilySelector" name="fontFamilySelector" onchange="changeFont()">
|
||||
<option value="Paykan-Light.woff2">Paykan Light WOFF</option>
|
||||
<option value="Paykan-ExtraBlack.woff2">Paykan ExtraBlack WOFF</option>
|
||||
<option value="Paykan-Light.woff2">Paykan Light WOFF2</option>
|
||||
<option value="Paykan-ExtraBlack.woff2">Paykan ExtraBlack WOFF2</option>
|
||||
|
||||
|
||||
</select>
|
||||
<input type="text" value="برای تست اینجا تایپ کنید." id="textInput" onclick="this.select();" onkeyup="updateParagraph()" size="80" />
|
||||
<p class="features">
|
||||
<a href="javascript:setCharset();">Charset</a>
|
||||
|
||||
 
|
||||
|
||||
|
||||
</p>
|
||||
<p class="features" id="featureLine" style="display:none;">font-feature-settings: "kern" on, "liga" on, "dlig" on;</p>
|
||||
<p><span class="label">8 pt.</span> <span id="p08">
|
||||
بنشین بر لب جوی و گذر عمر ببین - کاین اشارت ز جهان گذران ما را بس
|
||||
</span></p>
|
||||
|
||||
<p><span class="label">10 pt.</span> <span id="p10">
|
||||
بنشین بر لب جوی و گذر عمر ببین - کاین اشارت ز جهان گذران ما را بس
|
||||
</span></p>
|
||||
|
||||
<p><span class="label">12 pt.</span> <span id="p12">
|
||||
بنشین بر لب جوی و گذر عمر ببین - کاین اشارت ز جهان گذران ما را بس
|
||||
</span></p>
|
||||
|
||||
<p><span class="label">14 pt.</span> <span id="p14">
|
||||
بنشین بر لب جوی و گذر عمر ببین - کاین اشارت ز جهان گذران ما را بس
|
||||
</span></p>
|
||||
|
||||
<p><span class="label">18 pt.</span> <span id="p18">
|
||||
بنشین بر لب جوی و گذر عمر ببین - کاین اشارت ز جهان گذران ما را بس
|
||||
</span></p>
|
||||
|
||||
<p><span class="label">36 pt.</span> <span id="p36">
|
||||
بنشین بر لب جوی و گذر عمر ببین - کاین اشارت ز جهان گذران ما را بس
|
||||
|
||||
</span></p>
|
||||
|
||||
<p><span class="label">72 pt.</span> <span id="p72">
|
||||
بنشین بر لب جوی و گذر عمر ببین - کاین اشارت ز جهان گذران ما را بس
|
||||
|
||||
</span></p>
|
||||
|
||||
</body>
|
||||
Reference in New Issue
Block a user