test8.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  5. <title>Test 008</title>
  6. <script>
  7. var Hyphenopoly = {
  8. require: {
  9. "en-us": "FORCEHYPHENOPOLY"
  10. },
  11. setup: {
  12. selectors: {
  13. ".class1": {
  14. hyphen: "·",
  15. minWordLength: 10,
  16. leftmin: 3
  17. },
  18. ".class2": {
  19. hyphen: "|",
  20. compound: "auto"
  21. },
  22. ".class3": {
  23. hyphen: "¬",
  24. rightmin: 6
  25. },
  26. ".class4": {
  27. hyphen: "•"
  28. }
  29. }
  30. },
  31. handleEvent: {
  32. hyphenopolyEnd: function (e) {
  33. assert();
  34. }
  35. }
  36. };
  37. </script>
  38. <script src="../Hyphenopoly_Loader.js"></script>
  39. <script>
  40. function assert() {
  41. var tests = 4;
  42. var i = 1;
  43. var test = "";
  44. var ref = "";
  45. var result = true;
  46. while (i <= tests) {
  47. test = document.getElementById("test" + i).innerHTML;
  48. ref = document.getElementById("ref" + i).innerHTML;
  49. if (test === ref) {
  50. document.getElementById("result").innerHTML += "<p style=\"background-color: #d6ffd6\">" + i + " passed</p>";
  51. result = result && true;
  52. } else {
  53. document.getElementById("result").innerHTML += "<p style=\"background-color: #ffd6d6\">" + i + " failed</p>";
  54. result = false;
  55. }
  56. i += 1;
  57. }
  58. if (parent != window) {
  59. parent.postMessage(JSON.stringify({
  60. desc: document.getElementById("desc").innerHTML,
  61. index: 8,
  62. result: (result ? "passed" : "failed")
  63. }), window.location.href);
  64. }
  65. }
  66. if (!Hyphenopoly) {
  67. document.addEventListener("DOMContentLoaded", function() {
  68. assert();
  69. });
  70. }
  71. </script>
  72. <style type="text/css">
  73. body {
  74. width:50%;
  75. margin-left:25%;
  76. margin-right:25%;
  77. }
  78. .test {
  79. background-color: #D8E2F9;
  80. }
  81. .ref {
  82. background-color: #FEEFC0;
  83. }
  84. .hyphenate {
  85. hyphens: auto;
  86. -ms-hyphens: auto;
  87. -moz-hyphens: auto;
  88. -webkit-hyphens: auto;
  89. }
  90. </style>
  91. </head>
  92. <body>
  93. <div id="navigate"><a href="index.html">&Larr;&nbsp;Index</a>&nbsp;|&nbsp;<a href="test7.html">&larr;&nbsp;Prev</a>&nbsp;|&nbsp;<a href="test9.html">Next&nbsp;&rarr;</a></div>
  94. <h1>Test 008</h1>
  95. <p id="desc">Class-based settings.</p>
  96. <div id="result"></div>
  97. <hr>
  98. <h2>1: class1</h2>
  99. <p id="test1" class="test class1" lang="en-us">hyphenation algorithm</p>
  100. <p id="ref1" class="ref" lang="en-us">hyphen·ation algorithm</p>
  101. <h2>2: class2</h2>
  102. <p id="test2" class="test class2" lang="en-us">hyphenation algorithm</p>
  103. <p id="ref2" class="ref" lang="en-us">hy|phen|ation al|go|rithm</p>
  104. <h2>3: class3</h2>
  105. <p id="test3" class="test class3" lang="en-us">hyphenation algorithm</p>
  106. <p id="ref3" class="ref" lang="en-us">hy¬phenation al¬gorithm</p>
  107. <h2>4: class4 (subelement)</h2>
  108. <p id="test4" class="test class3" lang="en-us">superclass <span class="class4">subclass</span></p>
  109. <p id="ref4" class="ref" lang="en-us">su¬perclass <span class="class4">sub•class</span></p>
  110. <hr>
  111. <div><span class="test">Test</span> <span class="ref">Ref</span></div>
  112. </body>
  113. </html>