all files / document-editor/implementation/utility/ dom-util.js

48.93% Statements 871/1780
37.68% Branches 321/852
50% Functions 43/86
48.93% Lines 871/1780
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 832 833 834 835 836 837 838 839 840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927 928 929 930 931 932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947 948 949 950 951 952 953 954 955 956 957 958 959 960 961 962 963 964 965 966 967 968 969 970 971 972 973 974 975 976 977 978 979 980 981 982 983 984 985 986 987 988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004 1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 1015 1016 1017 1018 1019 1020 1021 1022 1023 1024 1025 1026 1027 1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 1048 1049 1050 1051 1052 1053 1054 1055 1056 1057 1058 1059 1060 1061 1062 1063 1064 1065 1066 1067 1068 1069 1070 1071 1072 1073 1074 1075 1076 1077 1078 1079 1080 1081 1082 1083 1084 1085 1086 1087 1088 1089 1090 1091 1092 1093 1094 1095 1096 1097 1098 1099 1100 1101 1102 1103 1104 1105 1106 1107 1108 1109 1110 1111 1112 1113 1114 1115 1116 1117 1118 1119 1120 1121 1122 1123 1124 1125 1126 1127 1128 1129 1130 1131 1132 1133 1134 1135 1136 1137 1138 1139 1140 1141 1142 1143 1144 1145 1146 1147 1148 1149 1150 1151 1152 1153 1154 1155 1156 1157 1158 1159 1160 1161 1162 1163 1164 1165 1166 1167 1168 1169 1170 1171 1172 1173 1174 1175 1176 1177 1178 1179 1180 1181 1182 1183 1184 1185 1186 1187 1188 1189 1190 1191 1192 1193 1194 1195 1196 1197 1198 1199 1200 1201 1202 1203 1204 1205 1206 1207 1208 1209 1210 1211 1212 1213 1214 1215 1216 1217 1218 1219 1220 1221 1222 1223 1224 1225 1226 1227 1228 1229 1230 1231 1232 1233 1234 1235 1236 1237 1238 1239 1240 1241 1242 1243 1244 1245 1246 1247 1248 1249 1250 1251 1252 1253 1254 1255 1256 1257 1258 1259 1260 1261 1262 1263 1264 1265 1266 1267 1268 1269 1270 1271 1272 1273 1274 1275 1276 1277 1278 1279 1280 1281 1282 1283 1284 1285 1286 1287 1288 1289 1290 1291 1292 1293 1294 1295 1296 1297 1298 1299 1300 1301 1302 1303 1304 1305 1306 1307 1308 1309 1310 1311 1312 1313 1314 1315 1316 1317 1318 1319 1320 1321 1322 1323 1324 1325 1326 1327 1328 1329 1330 1331 1332 1333 1334 1335 1336 1337 1338 1339 1340 1341 1342 1343 1344 1345 1346 1347 1348 1349 1350 1351 1352 1353 1354 1355 1356 1357 1358 1359 1360 1361 1362 1363 1364 1365 1366 1367 1368 1369 1370 1371 1372 1373 1374 1375 1376 1377 1378 1379 1380 1381 1382 1383 1384 1385 1386 1387 1388 1389 1390 1391 1392 1393 1394 1395 1396 1397 1398 1399 1400 1401 1402 1403 1404 1405 1406 1407 1408 1409 1410 1411 1412 1413 1414 1415 1416 1417 1418 1419 1420 1421 1422 1423 1424 1425 1426 1427 1428 1429 1430 1431 1432 1433 1434 1435 1436 1437 1438 1439 1440 1441 1442 1443 1444 1445 1446 1447 1448 1449 1450 1451 1452 1453 1454 1455 1456 1457 1458 1459 1460 1461 1462 1463 1464 1465 1466 1467 1468 1469 1470 1471 1472 1473 1474 1475 1476 1477 1478 1479 1480 1481 1482 1483 1484 1485 1486 1487 1488 1489 1490 1491 1492 1493 1494 1495 1496 1497 1498 1499 1500 1501 1502 1503 1504 1505 1506 1507 1508 1509 1510 1511 1512 1513 1514 1515 1516 1517 1518 1519 1520 1521 1522 1523 1524 1525 1526 1527 1528 1529 1530 1531 1532 1533 1534 1535 1536 1537 1538 1539 1540 1541 1542 1543 1544 1545 1546 1547 1548 1549 1550 1551 1552 1553 1554 1555 1556 1557 1558 1559 1560 1561 1562 1563 1564 1565 1566 1567 1568 1569 1570 1571 1572 1573 1574 1575 1576 1577 1578 1579 1580 1581 1582 1583 1584 1585 1586 1587 1588 1589 1590 1591 1592 1593 1594 1595 1596 1597 1598 1599 1600 1601 1602 1603 1604 1605 1606 1607 1608 1609 1610 1611 1612 1613 1614 1615 1616 1617 1618 1619 1620 1621 1622 1623 1624 1625 1626 1627 1628 1629 1630 1631 1632 1633 1634 1635 1636 1637 1638 1639 1640 1641 1642 1643 1644 1645 1646 1647 1648 1649 1650 1651 1652 1653 1654 1655 1656 1657 1658 1659 1660 1661 1662 1663 1664 1665 1666 1667 1668 1669 1670 1671 1672 1673 1674 1675 1676 1677 1678 1679 1680 1681 1682 1683 1684 1685 1686 1687 1688 1689 1690 1691 1692 1693 1694 1695 1696 1697 1698 1699 1700 1701 1702 1703 1704 1705 1706 1707 1708 1709 1710 1711 1712 1713 1714 1715 1716 1717 1718 1719 1720 1721 1722 1723 1724 1725 1726 1727 1728 1729 1730 1731 1732 1733 1734 1735 1736 1737 1738 1739 1740 1741 1742 1743 1744 1745 1746 1747 1748 1749 1750 1751 1752 1753 1754 1755 1756 1757 1758 1759 1760 1761 1762 1763 1764 1765 1766 1767 1768 1769 1770 1771 1772 1773 1774 1775 1776 1777 1778 1779 1780 1781 1782 1783 1784 1785 1786 1787 1788 1789 1790 1791 1792 1793 1794 1795 1796 1797 1798 1799 1800 1801 1802 1803 1804 1805 1806 1807 1808 1809 1810 1811 1812 1813 1814 1815 1816 1817 1818 1819 1820 1821 1822 1823 1824 1825 1826 1827 1828 1829 1830 1831 1832 1833 1834 1835 1836 1837 1838 1839 1840 1841 1842 1843 1844 1845 1846 1847 1848 1849 1850 1851 1852 1853 1854 1855 1856 1857 1858 1859 1860 1861 1862 1863 1864 1865 1866 1867 1868 1869 1870 1871 1872 1873 1874 1875 1876 1877 1878 1879 1880 1881 1882 1883 1884 1885 1886 1887 1888 1889 1890 1891 1892 1893 1894 1895 1896 1897 1898 1899 1900 1901 1902 1903 1904 1905 1906 1907 1908 1909 1910 1911 1912 1913 1914 1915 1916 1917 1918 1919 1920 1921 1922 1923 1924 1925 1926 1927 1928 1929 1930 1931 1932 1933 1934 1935 1936 1937 1938 1939 1940 1941 1942 1943 1944 1945 1946 1947 1948 1949 1950 1951 1952 1953 1954 1955 1956 1957 1958 1959 1960 1961 1962 1963 1964 1965 1966 1967 1968 1969 1970 1971 1972 1973 1974 1975 1976 1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990 1991 1992 1993 1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025 2026 2027 2028 2029 2030 2031 2032 2033 2034 2035 2036 2037 2038 2039 2040 2041 2042 2043 2044 2045 2046 2047 2048 2049 2050 2051 2052 2053 2054 2055 2056 2057 2058 2059 2060 2061 2062 2063 2064 2065 2066 2067 2068 2069 2070 2071 2072 2073 2074 2075 2076 2077 2078 2079 2080 2081 2082 2083 2084 2085 2086 2087 2088 2089 2090 2091 2092 2093 2094 2095 2096 2097 2098 2099 2100 2101 2102 2103 2104 2105 2106 2107 2108 2109 2110 2111 2112 2113 2114 2115 2116 2117 2118 2119 2120 2121 2122 2123 2124 2125 2126 2127 2128 2129 2130 2131 2132 2133 2134 2135 2136 2137 2138 2139 2140 2141 2142 2143 2144 2145 2146 2147 2148 2149 2150 2151 2152 2153 2154 2155 2156 2157 2158 2159 2160 2161 2162 2163 2164 2165 2166 2167 2168 2169 2170 2171 2172 2173 2174 2175 2176 2177 2178 2179 2180 2181 2182 2183 2184 2185 2186 2187 2188 2189 2190 2191 2192 2193 2194 2195 2196 2197 2198 2199 2200 2201 2202 2203 2204 2205 2206 2207 2208 2209 2210 2211 2212 2213 2214 2215 2216 2217 2218 2219 2220 2221 2222 2223 2224 2225 2226 2227 2228 2229 2230 2231 2232 2233 2234 2235 2236 2237 2238 2239 2240 2241 2242 2243 2244 2245 2246 2247 2248 2249 2250 2251 2252 2253 2254 2255 2256 2257 2258 2259 2260 2261 2262 2263 2264 2265 2266 2267 2268 2269 2270 2271 2272 2273 2274 2275 2276 2277 2278 2279 2280 2281 2282 2283 2284 2285 2286 2287 2288 2289 2290 2291 2292 2293 2294 2295 2296 2297 2298 2299 2300 2301 2302 2303 2304 2305 2306 2307 2308 2309 2310 2311 2312 2313 2314 2315 2316 2317 2318 2319 2320 2321 2322 2323 2324 2325 2326 2327 2328 2329 2330 2331 2332 2333 2334 2335 2336 2337 2338 2339 2340 2341 2342 2343 2344 2345 2346 2347 2348 2349 2350 2351 2352 2353 2354 2355 2356 2357 2358 2359 2360 2361 2362 2363 2364 2365 2366 2367 2368 2369 2370 2371 2372 2373 2374 2375 2376 2377 2378 2379 2380 2381 2382 2383 2384 2385 2386 2387 2388 2389 2390 2391 2392 2393 2394 2395 2396 2397 2398 2399 2400 2401 2402 2403 2404 2405 2406 2407 2408 2409 2410 2411 2412 2413 2414 2415 2416 2417 2418 2419 2420 2421 2422 2423 2424 2425 2426 2427 2428 2429 2430 2431 2432 2433 2434 2435 2436 2437 2438 2439 2440 2441 2442 2443 2444 2445 2446 2447 2448 2449 2450 2451 2452 2453 2454 2455 2456 2457 2458 2459 2460 2461 2462 2463 2464 2465 2466 2467 2468 2469 2470 2471 2472 2473 2474 2475 2476 2477 2478 2479 2480 2481 2482 2483 2484 2485 2486 2487 2488 2489 2490 2491 2492 2493 2494 2495 2496 2497 2498 2499 2500 2501 2502 2503 2504 2505 2506 2507 2508 2509 2510 2511 2512 2513 2514 2515 2516 2517 2518 2519 2520 2521 2522 2523 2524 2525 2526 2527 2528 2529 2530 2531 2532 2533 2534 2535 2536 2537 2538 2539 2540 2541 2542 2543 2544 2545 2546 2547 2548 2549 2550 2551 2552 2553 2554 2555 2556 2557 2558 2559 2560 2561 2562 2563 2564 2565 2566 2567 2568 2569 2570 2571 2572 2573 2574 2575 2576 2577 2578 2579 2580 2581 2582 2583 2584 2585 2586 2587 2588 2589 2590 2591 2592 2593 2594 2595 2596 2597 2598 2599 2600 2601 2602 2603 2604 2605 2606 2607 2608 2609   502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502× 502×                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               961× 620×     961× 620×   961× 620×     1860×     1851×     9237× 9237× 9237×   318846× 318846× 318846×   67619× 67619× 132734× 132734× 119049×       370822× 370822× 1294683× 1236301×     58382×       9237× 9237× 29167× 19930×     9237×       502× 502×         502× 502× 502× 502×   502× 210×   292× 292×         292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 292× 1460× 1460× 1460× 1460× 1460× 1460× 1460× 1460× 1460×     292×   1004× 1004× 420×   584× 584× 584× 584×   584× 584×       584×   584× 582×   582×       582×   584× 584× 584×   584×       584× 584× 292×     292×   584× 584× 584× 584× 584× 584× 584× 584× 584× 584× 584× 584× 584× 584× 584× 584× 292×       292×       584× 584× 292×   584× 584× 292× 292× 292× 292× 292× 292×   584× 584× 584× 292× 292× 292×                                                                                                                                                                                                                                                                                   584× 584× 584× 584×     23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23×   502× 210×   292× 292× 292× 292× 292× 292× 292× 292×           292× 292× 292× 292× 292× 292× 292× 292×           292× 292× 292× 292× 292× 292×   315×         315× 315× 315× 315× 315× 315× 315× 315× 315×             315× 315× 315× 315×           315× 315× 315×           315× 315× 315×   315× 315× 315× 315× 314×                             315× 315× 315× 314×                             315× 315× 314× 314×       314×                             315× 315× 314×       314×   314× 314×                               23×         23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23×                                                       23× 23×               584× 584× 584×   584× 584× 584×     584× 292× 3796× 3796× 3783×   3783×         3783×   3796×       292× 292× 292×   292×         292×   292×     23× 23× 23× 23× 23×     23× 23×   23× 23× 23× 23× 23× 23× 23× 23×     23×       23×     23× 299× 299× 299× 23×         23×   23× 23×         23×   23×   276×                                 276×                                                                                               292× 292× 292× 291× 291× 291×           291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291×   292× 292× 291× 291× 291×           291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291×   292× 292× 291× 291× 291×         291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291×   292× 292× 291× 291× 291×         291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291× 291×   292×   28×     23× 23×     23× 12×     11×   23× 23× 23× 23× 23× 23×       23×   23×   23× 23× 23×                                                                                                                                                                                                                                                                                                               46× 46× 46× 46× 46× 46× 46×     46× 46× 23×     23× 23×   46×               46× 23× 23× 23× 23×     23×         23×                                     23×     46× 46× 46× 46×     46× 46× 46× 46× 46× 46× 46×     46× 23× 23× 23×       1575× 1575×   1575×   1575×                     1460× 1460× 1460× 1460×   292× 292× 291× 291×             291×           291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291×   292×     292× 292× 291× 291×             291×           291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291×   292×     292× 292× 291× 291×             291×           291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291×   292×     292× 292× 291× 291×             291×           291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291× 291× 291×   292×     292× 292× 291× 291×             291×           291× 291× 291×           291× 291× 291×     291× 291× 291× 291× 291× 291× 291× 291×   292×     1460×                             630× 315× 315×     315× 315×                                 3606× 3606× 3606× 3606× 3606×   501× 501× 501×   501× 501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 500× 500×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501×   501×   501× 291× 291×   501× 291× 291×   501× 291× 291× 291×   291× 291× 291×   501× 291× 291× 291×   291× 291× 291×   501× 291× 291× 291×   291× 291× 291×   501× 291× 291× 291×   291× 291× 291×   501× 291× 291× 291×   291× 291× 291×   501× 291×   291× 291× 291×   501× 291× 1746× 1746×   291× 291× 291×     501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 291× 291×   501× 290× 290×   501× 290× 290×   501× 290× 290×   501× 290× 290×   501× 290× 290×   501× 290× 290×   501× 290× 290×   501× 290× 290×     501× 291×   501× 291×   501× 291× 291× 291× 291×   501× 291×   501× 291× 291× 291× 291×   501× 501× 501× 501× 501× 501× 501× 291× 291× 291× 291×   501× 501× 501× 291× 291× 291× 291×   501× 501× 501× 291× 291× 291× 291×   501× 501× 501×         501× 501× 501×        
define(["require", "exports", "@syncfusion/ej2-base", "../ruler/index", "../editor/editor-helper", "../format/paragraph-format", "./size"], function (require, exports, ej2_base_1, index_1, editor_helper_1, paragraph_format_1, size_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var RulerHelper = (function () {
        function RulerHelper() {
            this.resizerEnabled = false;
            this.isDraggingRender = false;
            this.isDraggingIndents1 = false;
            this.isDraggingIndents2 = false;
            this.isDraggingIndents3 = false;
            this.isDraggingIndents4 = false;
            this.isDraggingForTab = false;
            this.currentTabStop = undefined;
            this.tabIndex = 0;
            this.isLeftRulerMargin = undefined;
            this.isLeftMultiColumn = false;
            this.isRightMultiColumn = false;
            this.onmarkIndicatorClickHandler = this.onMarkIndicatorClick.bind(this);
            this.onHorizontalRulerMouseMoveHandler = this.onHorizontalRulerMouseMoved.bind(this);
            this.onHRulerMouseEnterHandler = this.onHRulerMouseEnter.bind(this);
            this.onHRulerMouseLeaveHandler = this.onHRulerMouseLeave.bind(this);
            this.onHRulerMouseDownHandler = this.onHRulerMouseDown.bind(this);
            this.onHRulerMouseUpHandler = this.onHRulerMouseUp.bind(this);
            this.onRulerDblClickHandler = this.onRulerDblClick.bind(this);
            this.onDoubleClickHandler = this.onDoubleClick.bind(this);
            this.onRulerMouseUpHandler = this.onRularMouseUp.bind(this);
            this.onVMouseMoveHandler = this.onVMouseMove.bind(this);
            this.onVMouseDownHandler = this.onVMouseDown.bind(this);
            this.onVMouseUpHandler = this.onVMouseUp.bind(this);
            this.onDocumentIntentTrueChangeHandler = this.onDocumentIntentTrue.bind(this);
            this.onDocumentIntentFalseChangeHandler = this.onDocumentIntentFalse.bind(this);
            this.onFirstLineIndentMouseDownHandler = this.onFirstLineIndentMouseDown.bind(this);
            this.onIndentMouseMoveHandler = this.onIndentMouseMove.bind(this);
            this.onIndentMouseUpHandler = this.onIndentMouseUp.bind(this);
            this.onHangIndentMouseDownHandler = this.onHangIndentMouseDown.bind(this);
            this.onHangIndentMouseMoveHandler = this.onHangIndentMouseMove.bind(this);
            this.onHangIndentMouseUpHandler = this.onHangIndentMouseUp.bind(this);
            this.onLeftIndentMouseDownHandler = this.onLeftIndentMouseDown.bind(this);
            this.onLeftIndentMouseMoveHandler = this.onLeftIndentMouseMove.bind(this);
            this.onLeftIndentMouseUpHandler = this.onLeftIndentMouseUp.bind(this);
            this.onRightIndentMouseDownHandler = this.onRightIndentMouseDown.bind(this);
            this.onRightIndentMouseMoveHandler = this.onRightIndentMouseMove.bind(this);
            this.onRightIndentMouseUpHandler = this.onRightIndentMouseUp.bind(this);
            this.onTabStopMouseDownHandler = this.onTabStopMouseDown.bind(this);
            this.onTabStopMouseUpHandler = this.onTabStopMouseUp.bind(this);
            this.onTabStopMouseMoveHandler = this.onTabStopMouseMove.bind(this);
            this.onRenderTabStopMouseUpHandler = this.onRenderTabStopMouseUp.bind(this);
            this.onTabStopDblClickHandler = this.onTabStopDblClick.bind(this);
            this.isTopRulerMargin = false;
        }
        RulerHelper.prototype.onMarkIndicatorClick = function () {
            var divElements = document.querySelector('.e-de-ruler-markIndicator');
            for (var i = 0; i < divElements.childNodes.length; i++) {
                var currentDiv = divElements.childNodes[parseInt(i.toString(), 10)];
                if (currentDiv.style.display === 'block') {
                    currentDiv.style.display = 'none';
                    var nextIndex = (i + 1) % divElements.childNodes.length;
                    divElements.childNodes[parseInt(nextIndex.toString(), 10)].style.display = 'block';
                    break;
                }
            }
        };
        RulerHelper.prototype.onHRulerMouseEnter = function () {
            if (!ej2_base_1.isNullOrUndefined(this.currentTabStopElement)) {
                this.currentTabStopElement.style.display = 'block';
            }
        };
        RulerHelper.prototype.onHRulerMouseLeave = function () {
            if (!ej2_base_1.isNullOrUndefined(this.currentTabStopElement)) {
                this.currentTabStopElement.style.display = 'none';
            }
        };
        RulerHelper.prototype.onRulerDblClick = function () {
            this.documentEditor.showDialog('PageSetup');
        };
        RulerHelper.prototype.onHRulerMouseDown = function (e) {
            if (this.resizerEnabled && !this.documentEditor.isTableMarkerDragging) {
                this.isDraggingRender = true;
                if (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.columns.length > 0) {
                    if (this.isLeftMultiColumn) {
                        this.columnInitialValue = this.multiColumnElement.getBoundingClientRect().left;
                    }
                    else if (this.isRightMultiColumn) {
                        this.columnInitialValue = this.multiColumnElement.getBoundingClientRect().left
                            + this.multiColumnElement.getBoundingClientRect().width;
                    }
                }
                var divRect_1 = this.hRuler.getBoundingClientRect();
                this.renderInitialValue = editor_helper_1.HelperMethods.convertPixelToPoint(Math.round(e.clientX - divRect_1.left));
                this.currentScrollLeft = this.hRuler.scrollLeft;
                var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
                this.initialRightMargin = editor_helper_1.HelperMethods.getNumberFromString(rightIndent.style.left);
                var pixelValue = Math.round(e.clientX - divRect_1.left);
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
                var indicatorLineValue = startValue + pixelValue;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.left = indicatorLineValue + 'px';
                lineSvg.style.display = 'block';
            }
            var divRect = this.hRuler.getBoundingClientRect();
            if (divRect.y + (divRect.height / 2) <= e.clientY) {
                this.mouseDownTabValue = e.clientX - this.hRuler.getBoundingClientRect().left;
                if (this.documentEditor.layoutType === 'Pages') {
                    this.mouseDownTabValue = editor_helper_1.HelperMethods.convertPixelToPoint(this.mouseDownTabValue - editor_helper_1.HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin) *
                        this.documentEditor.zoomFactor);
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        var paraWidth = !ej2_base_1.isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
                        paraWidth = editor_helper_1.HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
                        this.mouseDownTabValue = paraWidth - this.mouseDownTabValue;
                    }
                }
                else if (this.documentEditor.layoutType === 'Continuous') {
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        this.mouseDownTabValue = editor_helper_1.HelperMethods.convertPixelToPoint((this.mouseDownTabValue) - 20);
                        var paraWidth = !ej2_base_1.isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
                        paraWidth = editor_helper_1.HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
                        this.mouseDownTabValue = paraWidth - this.mouseDownTabValue;
                    }
                    else {
                        this.mouseDownTabValue = editor_helper_1.HelperMethods.convertPixelToPoint((this.mouseDownTabValue) - 20);
                    }
                }
            }
        };
        RulerHelper.prototype.onHRulerMouseUp = function (e) {
            var container = document.getElementById(this.documentEditor.element.id + '_markIndicator');
            var divRect = this.hRuler.getBoundingClientRect();
            if (divRect.y + (divRect.height / 2) <= e.clientY) {
                this.mouseUpTabValue = e.clientX - this.hRuler.getBoundingClientRect().left;
                if (this.documentEditor.layoutType === 'Pages') {
                    this.mouseUpTabValue = editor_helper_1.HelperMethods.convertPixelToPoint(this.mouseUpTabValue -
                        editor_helper_1.HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin)
                            * this.documentEditor.zoomFactor);
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        var paraWidth = !ej2_base_1.isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
                        paraWidth = editor_helper_1.HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
                        this.mouseUpTabValue = paraWidth - this.mouseUpTabValue;
                    }
                }
                else if (this.documentEditor.layoutType === 'Continuous') {
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        this.mouseUpTabValue = editor_helper_1.HelperMethods.convertPixelToPoint((this.mouseUpTabValue) - 20);
                        var paraWidth = !ej2_base_1.isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
                        paraWidth = editor_helper_1.HelperMethods.convertPixelToPoint(paraWidth * this.documentEditor.zoomFactor);
                        this.mouseUpTabValue = paraWidth - this.mouseUpTabValue;
                    }
                    else {
                        this.mouseUpTabValue = editor_helper_1.HelperMethods.convertPixelToPoint((this.mouseUpTabValue) - 20);
                    }
                }
                var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
                var rightIndentValue = editor_helper_1.HelperMethods.getNumberFromString(rightIndent.style.left);
                var maxValue = rightIndentValue;
                if (this.mouseUpTabValue > 0 && this.mouseUpTabValue < maxValue && this.mouseDownTabValue === this.mouseUpTabValue) {
                    if (!ej2_base_1.isNullOrUndefined(container)) {
                        var visibleElement = container.querySelector('.e-de-ruler-marker[style*="display: block;"]');
                        if (!ej2_base_1.isNullOrUndefined(visibleElement)) {
                            this.mouseUpTabValue /= this.documentEditor.zoomFactor;
                            var dataNameValue = visibleElement.getAttribute('data-name');
                            if (dataNameValue === 'LeftTab' || dataNameValue === 'CenterTab'
                                || dataNameValue === 'RightTab' || dataNameValue === 'DecimalTab' || dataNameValue === 'BarTab') {
                                var tabStop = new paragraph_format_1.WTabStop();
                                tabStop.position = this.mouseUpTabValue;
                                tabStop.tabJustification = this.getTabJustification(dataNameValue);
                                tabStop.deletePosition = 0;
                                tabStop.tabLeader = 'None';
                                this.documentEditor.editorModule.onApplyParagraphFormat('tabStop', [tabStop], false, false);
                            }
                            else if (dataNameValue === 'FirstLineIndent' || dataNameValue === 'HangingIndent') {
                                var property = 'firstLineIndent';
                                if (dataNameValue === 'HangingIndent') {
                                    var initialValue = this.documentEditor.selectionModule.paragraphFormat.firstLineIndent;
                                    var differenceValue = this.mouseUpTabValue + initialValue;
                                    var currentValue = this.documentEditor.selectionModule.start.paragraph.paragraphFormat.firstLineIndent;
                                    this.documentEditor.editorModule.onApplyParagraphFormat('firstLineIndent', currentValue - differenceValue, false, false);
                                    var leftIndentCurrentValue = this.documentEditor.selectionModule.start.paragraph.paragraphFormat.leftIndent + currentValue;
                                    currentValue = currentValue - differenceValue;
                                    this.documentEditor.editorModule.onApplyParagraphFormat('leftIndent', leftIndentCurrentValue - currentValue, false, false, true);
                                }
                                else {
                                    this.documentEditor.editorModule.onApplyParagraphFormat(property, this.mouseDownTabValue, false, false);
                                }
                            }
                        }
                    }
                }
            }
        };
        RulerHelper.prototype.onRularMouseUp = function (e) {
            if (this.isDraggingRender && !this.documentEditor.isTableMarkerDragging) {
                var divRect = this.hRuler.getBoundingClientRect();
                var mouseXRelativeToDiv = this.finalmouseXRelativeToDiv;
                if (this.isLeftMultiColumn || this.isRightMultiColumn) {
                    var finalvalue = 0;
                    finalvalue = e.clientX - this.columnInitialValue;
                    var secFormat = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.cloneFormat();
                    var pageWidth = this.documentEditor.selectionModule.sectionFormat.pageWidth
                        - this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin -
                        this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin;
                    var columnSpace = this.isLeftMultiColumn ? (secFormat.columns[0].space +
                        ((editor_helper_1.HelperMethods.convertPixelToPoint(finalvalue))))
                        : (secFormat.columns[0].space - ((editor_helper_1.HelperMethods.convertPixelToPoint(finalvalue))));
                    for (var i = 0; i < secFormat.columns.length; i++) {
                        var col = secFormat.columns[parseInt(i.toString(), 10)];
                        if (columnSpace >= 0 && col.width >= 36) {
                            var widthCal = editor_helper_1.HelperMethods.convertPointToPixel((pageWidth - (editor_helper_1.HelperMethods.convertPixelToPoint(columnSpace) * (secFormat.numberOfColumns - 1))) / (secFormat.numberOfColumns));
                            col.width = widthCal;
                            if (i < secFormat.columns.length - 1) {
                                col.space = columnSpace;
                            }
                        }
                        else {
                            col[0].space = col[1].space;
                        }
                    }
                    this.documentEditor.editorModule.onApplySectionFormat(undefined, secFormat);
                    this.isLeftMultiColumn = false;
                    this.isRightMultiColumn = false;
                }
                else if (this.isLeftRulerMargin) {
                    this.documentEditor.hRuler.startMargin = (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
                    this.documentEditor.selectionModule.sectionFormat.leftMargin = mouseXRelativeToDiv / this.documentEditor.zoomFactor;
                }
                else {
                    var rightMargin = editor_helper_1.HelperMethods.convertPixelToPoint(this.rulerGeometry.width) - (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
                    this.documentEditor.selectionModule.sectionFormat.rightMargin = rightMargin;
                }
                this.resizerEnabled = false;
                this.isDraggingRender = false;
                this.isLeftRulerMargin = undefined;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.display = 'none';
            }
        };
        RulerHelper.prototype.onVMouseMove = function (e) {
            if (this.documentEditor.isDestroyed || !this.documentEditor.documentEditorSettings.showRuler) {
                return;
            }
            var divRect = this.vRuler.getBoundingClientRect();
            var topMargin = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin
                * this.documentEditor.zoomFactor;
            var bottomMargin = (editor_helper_1.HelperMethods.convertPixelToPoint(divRect.height) - this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin
                * this.documentEditor.zoomFactor);
            var mouseXRelativeToDiv = editor_helper_1.HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
            var pixelValue = Math.round(e.clientY - divRect.top);
            if (!this.isDraggingRender) {
                if (((topMargin - 3) <= mouseXRelativeToDiv) && ((topMargin + 3) >= mouseXRelativeToDiv)) {
                    this.vRuler.style.cursor = 'n-resize';
                    this.vRuler.setAttribute('title', this.locale.getConstant('Top Margin'));
                    this.resizerEnabled = true;
                    this.isTopRulerMargin = true;
                }
                else if ((((bottomMargin - 3) <= mouseXRelativeToDiv) && ((bottomMargin + 3) >= mouseXRelativeToDiv))) {
                    this.vRuler.style.cursor = 'n-resize';
                    this.vRuler.setAttribute('title', this.locale.getConstant('Bottom Margin'));
                    this.resizerEnabled = true;
                    this.isTopRulerMargin = false;
                }
                else {
                    this.vRuler.style.cursor = 'default';
                    if (this.vRuler.hasAttribute('title')) {
                        this.vRuler.removeAttribute('title');
                    }
                    this.resizerEnabled = false;
                }
            }
            if (this.isDraggingRender) {
                var mouseXRelativeToDiv_1 = editor_helper_1.HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
                var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.topMargin)
                    * this.documentEditor.zoomFactor;
                var pageHeight = this.documentEditor.selectionModule.sectionFormat.pageHeight;
                var minimumValue = 12;
                var bottomMarginValue = this.documentEditor.selectionModule.sectionFormat.bottomMargin;
                var topMarginValue = this.documentEditor.selectionModule.sectionFormat.topMargin;
                if (this.isTopRulerMargin) {
                    var topMinLimit = rulerZeroPoint;
                    var topMaxLimit = rulerZeroPoint + (editor_helper_1.HelperMethods.convertPointToPixel(pageHeight - bottomMarginValue - minimumValue) * this.documentEditor.zoomFactor);
                    if (pixelValue + rulerZeroPoint > topMaxLimit) {
                        pixelValue = topMaxLimit - rulerZeroPoint;
                        mouseXRelativeToDiv_1 = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                    else if (pixelValue + rulerZeroPoint < topMinLimit) {
                        pixelValue = topMinLimit - rulerZeroPoint;
                        mouseXRelativeToDiv_1 = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                }
                else {
                    var bottomMinLimit = rulerZeroPoint + (editor_helper_1.HelperMethods.convertPointToPixel(topMarginValue + minimumValue) * this.documentEditor.zoomFactor);
                    var bottomMaxLimit = rulerZeroPoint + (editor_helper_1.HelperMethods.convertPointToPixel(pageHeight) * this.documentEditor.zoomFactor);
                    if (pixelValue + rulerZeroPoint > bottomMaxLimit) {
                        pixelValue = bottomMaxLimit - rulerZeroPoint;
                        mouseXRelativeToDiv_1 = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                    else if (pixelValue + rulerZeroPoint < bottomMinLimit) {
                        pixelValue = bottomMinLimit - rulerZeroPoint;
                        mouseXRelativeToDiv_1 = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                }
                var currentBottomMargin = (editor_helper_1.HelperMethods.convertPixelToPoint(divRect.height) -
                    (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin * this.documentEditor.zoomFactor));
                this.resizeVRulerMargins(this.isTopRulerMargin, this.initialYValue, this.currentScrollTop, currentBottomMargin, this.vRuler, mouseXRelativeToDiv_1, this.documentEditor);
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.y * this.documentEditor.zoomFactor;
                var indicatorLineValue = startValue + pixelValue;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_vRuler_indicator_svg');
                lineSvg.style.top = indicatorLineValue + 'px';
            }
        };
        RulerHelper.prototype.onVMouseDown = function (e) {
            if (this.resizerEnabled) {
                this.isDraggingRender = true;
                var divRect = this.vRuler.getBoundingClientRect();
                this.initialYValue = editor_helper_1.HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
                this.currentScrollTop = this.vRuler.scrollTop;
                var pixelValue = Math.round(e.clientY - divRect.top);
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_vRuler_indicator_svg');
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.y * this.documentEditor.zoomFactor;
                var indicatorLineValue = (startValue + pixelValue);
                lineSvg.style.top = indicatorLineValue + 'px';
                lineSvg.style.display = 'block';
            }
        };
        RulerHelper.prototype.onVMouseUp = function (e) {
            if (this.isDraggingRender) {
                var divRect = this.vRuler.getBoundingClientRect();
                var mouseXRelativeToDiv = editor_helper_1.HelperMethods.convertPixelToPoint(Math.round(e.clientY - divRect.top));
                if (this.isTopRulerMargin) {
                    this.documentEditor.vRuler.startMargin = (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
                    this.documentEditor.selectionModule.sectionFormat.topMargin = mouseXRelativeToDiv / this.documentEditor.zoomFactor;
                }
                else {
                    var bottomtMargin = editor_helper_1.HelperMethods.convertPixelToPoint(this.rulerGeometry.height) - (mouseXRelativeToDiv / this.documentEditor.zoomFactor);
                    this.documentEditor.vRuler.endMargin = bottomtMargin;
                    this.documentEditor.selectionModule.sectionFormat.bottomMargin = bottomtMargin;
                }
                this.resizerEnabled = false;
                this.isDraggingRender = false;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_vRuler_indicator_svg');
                lineSvg.style.display = 'none';
                this.isTopRulerMargin = undefined;
            }
        };
        RulerHelper.prototype.onDocumentIntentTrue = function () {
            this.documentEditor.isOnIndent = true;
        };
        RulerHelper.prototype.onDocumentIntentFalse = function () {
            this.documentEditor.isOnIndent = false;
        };
        RulerHelper.prototype.onDoubleClick = function (event) {
            this.documentEditor.showDialog('Paragraph');
            event.stopPropagation();
        };
        RulerHelper.prototype.onFirstLineIndentMouseDown = function (e) {
            this.isDraggingIndents1 = true;
            this.firstLineOffset = e.clientX - this.firstLineIndent.getBoundingClientRect().left;
            this.indentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
            var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
            if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                    (this.documentEditor.selectionModule.sectionFormat.pageWidth -
                        this.documentEditor.selectionModule.sectionFormat.leftMargin -
                        this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
            }
            if (this.documentEditor.layoutType === 'Continuous') {
                rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                        20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                }
            }
            var value = rulerZeroPoint + e.clientX - this.firstLineOffset - this.hRuler.getBoundingClientRect().left;
            var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
            startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
            var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
            var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
            lineSvg.style.left = indicatorLineValue + 'px';
            lineSvg.style.display = 'block';
            e.stopPropagation();
        };
        RulerHelper.prototype.onIndentMouseMove = function (e) {
            if (this.isDraggingIndents1) {
                var rulerZeroPoint = void 0;
                var maxValue = void 0;
                var minValue = void 0;
                var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
                var rightIndentValue = editor_helper_1.HelperMethods.getNumberFromString(rightIndent.style.left);
                if (this.documentEditor.layoutType === 'Pages') {
                    if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                            (this.documentEditor.selectionModule.sectionFormat.pageWidth -
                                this.documentEditor.selectionModule.sectionFormat.leftMargin -
                                this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
                        maxValue = rulerZeroPoint - 6 + (editor_helper_1.HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.sectionFormat.pageWidth) * this.documentEditor.zoomFactor);
                        minValue = rightIndentValue + editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor;
                    }
                    else {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin)
                            * this.documentEditor.zoomFactor;
                        minValue = rulerZeroPoint - 6;
                        maxValue = rightIndentValue - editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor;
                    }
                }
                else if (this.documentEditor.layoutType === 'Continuous') {
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                            20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                        maxValue = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20 + 40 - 6;
                        minValue = rightIndentValue + (editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    }
                    else {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                        minValue = rulerZeroPoint - 6;
                        maxValue = rightIndentValue - (editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    }
                }
                var value = rulerZeroPoint + e.clientX - this.firstLineOffset - this.hRuler.getBoundingClientRect().left;
                if (value < minValue) {
                    value = minValue;
                }
                else if (value > maxValue) {
                    value = maxValue;
                }
                this.firstLineIndent.style.left = value + 'px';
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
                startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
                var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.left = indicatorLineValue + 'px';
            }
        };
        RulerHelper.prototype.onIndentMouseUp = function (e) {
            if (this.isDraggingIndents1) {
                this.isDraggingIndents1 = false;
                var finalValue = editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
                if (parseInt(this.firstLineIndent.style.left.replace('px', ''), 10) < 0) {
                    finalValue *= -1;
                }
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    this.documentEditor.editorModule.applyRulerMarkerValues('firstLineIndent', finalValue, this.indentInitialValue);
                }
                else {
                    this.documentEditor.editorModule.applyRulerMarkerValues('firstLineIndent', this.indentInitialValue, finalValue);
                }
                this.indentInitialValue = finalValue;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.display = 'none';
            }
        };
        RulerHelper.prototype.onHangIndentMouseDown = function (e) {
            this.isDraggingIndents2 = true;
            this.hangingLineOffset = e.clientX - this.hangingIndent.getBoundingClientRect().left;
            this.hangingIndentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left);
            var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
            var rightPosition = editor_helper_1.HelperMethods.getNumberFromString(rightIndent.style.left);
            var rulerZeroPoint;
            if (this.documentEditor.layoutType === 'Pages') {
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                        (this.documentEditor.selectionModule.sectionFormat.pageWidth -
                            this.documentEditor.selectionModule.sectionFormat.leftMargin -
                            this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
                    this.minLimit1 = rightPosition + (editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    this.maxLimit1 = rulerZeroPoint - 6 + (editor_helper_1.HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.sectionFormat.pageWidth) * this.documentEditor.zoomFactor);
                }
                else {
                    rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
                    this.minLimit1 = rulerZeroPoint - 6;
                    this.maxLimit1 = (rightPosition - editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                }
            }
            else if (this.documentEditor.layoutType === 'Continuous') {
                if (this.position.paragraph.paragraphFormat.bidi) {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                        20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                    this.maxLimit1 = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20 + 40 - 6;
                    this.minLimit1 = rightPosition + (editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                }
                else {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                    this.minLimit1 = rulerZeroPoint - 6;
                    this.maxLimit1 = (rightPosition - editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                }
            }
            this.leftIndent1 = document.getElementById(this.documentEditor.element.id + '_leftIndent');
            var value = rulerZeroPoint + e.clientX - this.hangingLineOffset - this.hRuler.getBoundingClientRect().left;
            var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
            startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
            var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
            var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
            lineSvg.style.left = indicatorLineValue + 'px';
            lineSvg.style.display = 'block';
            e.stopPropagation();
        };
        RulerHelper.prototype.onHangIndentMouseMove = function (e) {
            if (this.isDraggingIndents2) {
                var rulerZeroPoint = void 0;
                if (this.documentEditor.layoutType === 'Pages') {
                    if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                            (this.documentEditor.selectionModule.sectionFormat.pageWidth -
                                this.documentEditor.selectionModule.sectionFormat.leftMargin -
                                this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
                    }
                    else {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
                    }
                }
                else if (this.documentEditor.layoutType === 'Continuous') {
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                            20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                    }
                    else {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                    }
                }
                var value = rulerZeroPoint + e.clientX - this.hangingLineOffset - this.hRuler.getBoundingClientRect().left;
                if ((value) > this.maxLimit1) {
                    value = this.maxLimit1;
                }
                else if (value < this.minLimit1) {
                    value = this.minLimit1;
                }
                this.leftIndent1.style.left = value + 'px';
                this.hangingIndent.style.left = value + 'px';
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
                startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
                var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.left = indicatorLineValue + 'px';
            }
        };
        RulerHelper.prototype.onHangIndentMouseUp = function (e) {
            if (this.isDraggingIndents2) {
                this.isDraggingIndents2 = false;
                var finalValue = editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left);
                if (parseInt(this.hangingIndent.style.left.replace('px', ''), 10) < 0) {
                    finalValue *= -1;
                }
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    this.documentEditor.editorModule.applyRulerMarkerValues('hangingIndent', finalValue, this.hangingIndentInitialValue);
                }
                else {
                    this.documentEditor.editorModule.applyRulerMarkerValues('hangingIndent', this.hangingIndentInitialValue, finalValue);
                }
                this.hangingIndentInitialValue = finalValue;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.display = 'none';
            }
        };
        RulerHelper.prototype.onLeftIndentMouseDown = function (e) {
            var rulerZeroPoint;
            this.isDraggingIndents3 = true;
            this.leftLineOffset = e.clientX - this.leftIndent.getBoundingClientRect().left;
            this.indentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.leftIndent.style.left);
            this.firstIndentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
            this.diff = this.firstIndentInitialValue - this.indentInitialValue;
            this.firstLineIndent = document.getElementById(this.documentEditor.element.id + '_firstLineIndent');
            var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
            var rightPosition = editor_helper_1.HelperMethods.getNumberFromString(rightIndent.style.left);
            if (this.documentEditor.layoutType === 'Pages') {
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                        (this.documentEditor.selectionModule.sectionFormat.pageWidth -
                            this.documentEditor.selectionModule.sectionFormat.leftMargin -
                            this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
                    this.minLimit2 = (rightPosition + editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    this.maxLimit2 = rulerZeroPoint - 6 + (editor_helper_1.HelperMethods.convertPointToPixel(this.documentEditor.selectionModule.sectionFormat.pageWidth) * this.documentEditor.zoomFactor);
                    this.isHangingIndent = (editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left) - rightPosition)
                        <= (editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left) - rightPosition);
                }
                else {
                    rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
                    this.minLimit2 = rulerZeroPoint - 6;
                    this.maxLimit2 = (rightPosition - editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    this.isHangingIndent = (rightPosition - editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left))
                        <= (rightPosition - editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left));
                }
            }
            else if (this.documentEditor.layoutType === 'Continuous') {
                if (this.position.paragraph.paragraphFormat.bidi) {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                        20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                    this.maxLimit2 = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20 + 40 - 6;
                    this.minLimit2 = rightPosition + (editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    this.isHangingIndent = (editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left) - rightPosition)
                        <= (editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left) - rightPosition);
                }
                else {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                    this.minLimit2 = rulerZeroPoint - 6;
                    this.maxLimit2 = (rightPosition - editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    this.isHangingIndent = (rightPosition - editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left))
                        <= (rightPosition - editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left));
                }
            }
            var value = rulerZeroPoint + e.clientX - this.leftLineOffset - this.hRuler.getBoundingClientRect().left;
            var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
            startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
            var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
            var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
            lineSvg.style.left = indicatorLineValue + 'px';
            lineSvg.style.display = 'block';
            e.stopPropagation();
        };
        RulerHelper.prototype.onLeftIndentMouseMove = function (e) {
            if (this.isDraggingIndents3) {
                var rulerZeroPoint = void 0;
                var value = void 0;
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    if (this.documentEditor.layoutType === 'Pages') {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                            (this.documentEditor.selectionModule.sectionFormat.pageWidth -
                                this.documentEditor.selectionModule.sectionFormat.leftMargin
                                - this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
                    }
                    else if (this.documentEditor.layoutType === 'Continuous') {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                            20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                    }
                    value = rulerZeroPoint + e.clientX - this.leftLineOffset - this.hRuler.getBoundingClientRect().left;
                    if (this.isHangingIndent) {
                        if ((value + this.diff) > this.maxLimit2) {
                            value = this.maxLimit2 - this.diff;
                        }
                    }
                    else {
                        if ((value) > this.maxLimit2) {
                            value = this.maxLimit2;
                        }
                    }
                    if (this.isHangingIndent) {
                        if (value < this.minLimit2) {
                            value = this.minLimit2;
                        }
                    }
                    else {
                        if ((value + this.diff) < this.minLimit2) {
                            value = this.minLimit2 - this.diff;
                        }
                    }
                }
                else {
                    if (this.documentEditor.layoutType === 'Pages') {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
                    }
                    else if (this.documentEditor.layoutType === 'Continuous') {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                    }
                    value = rulerZeroPoint + e.clientX - this.leftLineOffset - this.hRuler.getBoundingClientRect().left;
                    if (this.isHangingIndent) {
                        if ((value) > this.maxLimit2) {
                            value = this.maxLimit2;
                        }
                    }
                    else {
                        if ((value + this.diff) > this.maxLimit2) {
                            value = this.maxLimit2 - this.diff;
                        }
                    }
                    if (this.isHangingIndent) {
                        if ((value + this.diff) < this.minLimit2) {
                            value = this.minLimit2 - this.diff;
                        }
                    }
                    else {
                        if (value < this.minLimit2) {
                            value = this.minLimit2;
                        }
                    }
                }
                this.hangingIndent.style.left = value + 'px';
                this.leftIndent.style.left = value + 'px';
                this.firstLineIndent.style.left = (this.firstIndentInitialValue + (value - this.indentInitialValue)) + 'px';
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
                startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
                var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.left = indicatorLineValue + 'px';
            }
        };
        RulerHelper.prototype.onLeftIndentMouseUp = function (e) {
            if (this.isDraggingIndents3) {
                this.isDraggingIndents3 = false;
                var finalValue = editor_helper_1.HelperMethods.getNumberFromString(this.leftIndent.style.left);
                if (parseInt(this.leftIndent.style.left.replace('px', ''), 10) < 0) {
                    finalValue *= -1;
                }
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    this.documentEditor.editorModule.applyRulerMarkerValues('leftIndent', finalValue, this.indentInitialValue);
                }
                else {
                    this.documentEditor.editorModule.applyRulerMarkerValues('leftIndent', this.indentInitialValue, finalValue);
                }
                this.indentInitialValue = finalValue;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.display = 'none';
            }
        };
        RulerHelper.prototype.onRightIndentMouseDown = function (e) {
            this.isDraggingIndents4 = true;
            this.rightLineOffset = e.clientX - this.rightIndent.getBoundingClientRect().left;
            this.indentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.rightIndent.style.left);
            var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
            if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                    (this.documentEditor.selectionModule.sectionFormat.pageWidth - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                        this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
            }
            if (this.documentEditor.layoutType === 'Continuous') {
                rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                        20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                }
            }
            var value = rulerZeroPoint + e.clientX - this.rightLineOffset - this.hRuler.getBoundingClientRect().left;
            var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
            startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
            var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
            var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
            lineSvg.style.left = indicatorLineValue + 'px';
            lineSvg.style.display = 'block';
            e.stopPropagation();
        };
        RulerHelper.prototype.onRightIndentMouseMove = function (e) {
            if (this.isDraggingIndents4) {
                var rulerZeroPoint = void 0;
                var value = void 0;
                var leftIndent = document.getElementById(this.documentEditor.element.id + '_leftIndent');
                var firstLineIndent = document.getElementById(this.documentEditor.element.id + '_firstLineIndent');
                var maxValue = void 0;
                var minValue = void 0;
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    if (this.documentEditor.layoutType === 'Pages') {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin -
                            (this.documentEditor.selectionModule.sectionFormat.pageWidth -
                                this.documentEditor.selectionModule.sectionFormat.leftMargin -
                                this.documentEditor.selectionModule.sectionFormat.rightMargin)) * this.documentEditor.zoomFactor;
                    }
                    else if (this.documentEditor.layoutType === 'Continuous') {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor)
                            - 20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                    }
                    value = rulerZeroPoint + e.clientX - this.rightLineOffset - this.hRuler.getBoundingClientRect().left;
                    var nearestElement = (editor_helper_1.HelperMethods.getNumberFromString(leftIndent.style.left) - value) <= (editor_helper_1.HelperMethods.getNumberFromString(firstLineIndent.style.left) - value) ? leftIndent : firstLineIndent;
                    var indentValue = editor_helper_1.HelperMethods.getNumberFromString(nearestElement.style.left);
                    maxValue = indentValue - (editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                    minValue = rulerZeroPoint - 6;
                }
                else {
                    if (this.documentEditor.layoutType === 'Pages') {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
                    }
                    else if (this.documentEditor.layoutType === 'Continuous') {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                    }
                    value = rulerZeroPoint + e.clientX - this.rightLineOffset - this.hRuler.getBoundingClientRect().left;
                    var nearestElement = (value - editor_helper_1.HelperMethods.getNumberFromString(leftIndent.style.left))
                        <= (value - editor_helper_1.HelperMethods.getNumberFromString(firstLineIndent.style.left)) ? leftIndent : firstLineIndent;
                    var indentValue = editor_helper_1.HelperMethods.getNumberFromString(nearestElement.style.left);
                    maxValue = rulerZeroPoint + (this.documentEditor.documentHelper.currentPage.boundingRectangle.width
                        * this.documentEditor.zoomFactor) - 6;
                    minValue = indentValue + (editor_helper_1.HelperMethods.convertPointToPixel(42) * this.documentEditor.zoomFactor);
                }
                if (value < minValue) {
                    value = minValue;
                }
                else if (value > maxValue) {
                    value = maxValue;
                }
                this.rightIndent.style.left = value + 'px';
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
                startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
                var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.left = indicatorLineValue + 'px';
            }
        };
        RulerHelper.prototype.onRightIndentMouseUp = function (e) {
            if (this.isDraggingIndents4) {
                this.isDraggingIndents4 = false;
                var finalValue = editor_helper_1.HelperMethods.getNumberFromString(this.rightIndent.style.left);
                if (this.documentEditor.selectionModule.paragraphFormat.bidi) {
                    this.documentEditor.editorModule.applyRulerMarkerValues('rightIndent', this.indentInitialValue, finalValue);
                }
                else {
                    this.documentEditor.editorModule.applyRulerMarkerValues('rightIndent', finalValue, this.indentInitialValue);
                }
                this.indentInitialValue = finalValue;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.display = 'none';
            }
        };
        RulerHelper.prototype.onTabStopMouseDown = function (e) {
            e.stopPropagation();
            this.isDraggingForTab = true;
            this.tabStopOffset = e.clientX - this.tabStopElement.getBoundingClientRect().left;
            this.tabInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.tabStopElement.style.left);
            this.tabIndex = parseInt(this.tabStopElement.id.split('_')[this.tabStopElement.id.split('_').length - 1], 10);
            this.currentTabStop = this.currrentParagraph.paragraphFormat.tabs[parseInt(this.tabIndex.toString(), 10)];
            this.currentTabStopElement = this.tabStopElement;
            var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin)
                * this.documentEditor.zoomFactor;
            if (this.documentEditor.layoutType === 'Continuous') {
                rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                if (this.position.paragraph.paragraphFormat.bidi) {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor)
                        - 20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                }
            }
            var value = rulerZeroPoint + e.clientX - this.tabStopOffset - this.hRuler.getBoundingClientRect().left;
            var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
            startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
            var indicatorLineValue = startValue + (value - rulerZeroPoint);
            var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
            lineSvg.style.left = indicatorLineValue + 'px';
            lineSvg.style.display = 'block';
        };
        RulerHelper.prototype.onTabStopMouseUp = function (e) {
            if (!ej2_base_1.isNullOrUndefined(this.currentTabStopElement)) {
                this.currentTabStopElement = undefined;
            }
        };
        RulerHelper.prototype.onTabStopMouseMove = function (e) {
            if (this.isDraggingForTab) {
                var rulerZeroPoint = void 0;
                if (this.documentEditor.layoutType === 'Continuous') {
                    rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) - 20;
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        rulerZeroPoint = (this.documentEditor.hRuler.zeroPosition * this.documentEditor.zoomFactor) -
                            20 - (this.documentEditor.viewer.clientArea.width * this.documentEditor.zoomFactor);
                    }
                }
                else if (this.documentEditor.layoutType === 'Pages') {
                    rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin)
                        * this.documentEditor.zoomFactor;
                    if (this.position.paragraph.bidi) {
                        rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 + this.documentEditor.selectionModule.sectionFormat.rightMargin
                            - this.documentEditor.selectionModule.sectionFormat.pageWidth) * this.documentEditor.zoomFactor;
                    }
                }
                var value = rulerZeroPoint + e.clientX - this.tabStopOffset - this.hRuler.getBoundingClientRect().left;
                var minValue = rulerZeroPoint;
                var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
                var rightIndentValue = editor_helper_1.HelperMethods.getNumberFromString(rightIndent.style.left);
                var maxValue = rightIndentValue;
                var leftIndent = document.getElementById(this.documentEditor.element.id + '_leftIndent');
                var leftIndentValue = editor_helper_1.HelperMethods.getNumberFromString(leftIndent.style.left);
                minValue = leftIndentValue;
                if (this.position.paragraph.paragraphFormat.bidi) {
                    minValue = rightIndentValue;
                    maxValue = leftIndentValue;
                }
                if (this.justification === 'CenterTab' || this.justification === 'DecimalTab') {
                    maxValue += 4;
                }
                else if (this.justification === 'RightTab') {
                    maxValue += 5.5;
                }
                else {
                    maxValue += 1.5;
                }
                if (value < minValue) {
                    value = minValue;
                }
                else if (value > maxValue) {
                    value = maxValue;
                }
                this.tabStopElement.style.left = value + 'px';
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
                startValue = this.documentEditor.layoutType === 'Continuous' ? 0 : startValue;
                var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.left = indicatorLineValue + 'px';
            }
        };
        RulerHelper.prototype.onRenderTabStopMouseUp = function (e) {
            if (this.isDraggingForTab && !ej2_base_1.isNullOrUndefined(this.currentTabStop)) {
                if (!ej2_base_1.isNullOrUndefined(this.currentTabStopElement) && this.currentTabStopElement.style.display === 'none') {
                    this.documentEditor.editorModule.removeTabStops([this.currrentParagraph], [this.currentTabStop]);
                    this.currentTabStopElement.parentNode.removeChild(this.currentTabStopElement);
                }
                else {
                    var finalValue = editor_helper_1.HelperMethods.getNumberFromString(this.tabStopElement.style.left);
                    this.tabInitialValue = finalValue;
                    this.documentEditor.editorModule.removeTabStops([this.currrentParagraph], [this.currentTabStop]);
                    finalValue = editor_helper_1.HelperMethods.convertPixelToPoint(finalValue / this.documentEditor.zoomFactor) - 1584;
                    finalValue = this.currrentParagraph.paragraphFormat.bidi ? finalValue * -1 : finalValue;
                    this.currentTabStop.position = finalValue;
                    this.documentEditor.editorModule.updateTabStopCollection(this.currrentParagraph, [this.currentTabStop]);
                }
                this.updateTabStopMarkers(this.documentEditor);
                this.isDraggingForTab = false;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.display = 'none';
                this.currentTabStopElement = undefined;
            }
        };
        RulerHelper.prototype.onTabStopDblClick = function (event) {
            this.documentEditor.showTabDialog();
            event.stopPropagation();
        };
        RulerHelper.prototype.hideTabStopSwitch = function (show) {
            if (this.tabStopStwitch) {
                this.showHideElement(show, this.tabStopStwitch);
            }
        };
        RulerHelper.prototype.hideRulerBottom = function (show) {
            if (this.hRulerBottom) {
                this.showHideElement(show, this.hRulerBottom);
            }
            if (this.vRulerBottom) {
                this.showHideElement(show, this.vRulerBottom);
            }
        };
        RulerHelper.prototype.showHideElement = function (show, element) {
            if (show) {
                element.style.display = 'block';
            }
            else {
                element.style.display = 'none';
            }
        };
        RulerHelper.prototype.createHtmlElement = function (elementType, attribute) {
            var element = ej2_base_1.createElement(elementType, attribute);
            this.setAttributeHtml(element, attribute);
            return element;
        };
        RulerHelper.prototype.createSvgElement = function (elementType, attribute) {
            var element = document.createElementNS('http://www.w3.org/2000/svg', elementType);
            this.setAttributeSvg(element, attribute);
            return element;
        };
        RulerHelper.prototype.applyStyleAgainstCsp = function (svg, attributes) {
            var keys = attributes.split(';');
            for (var i = 0; i < keys.length; i++) {
                var attribute = keys[parseInt(i.toString(), 10)].split(':');
                if (attribute.length === 2) {
                    svg.style[attribute[0].trim()] = attribute[1].trim();
                }
            }
        };
        RulerHelper.prototype.setAttributeSvg = function (svg, attributes) {
            var keys = Object.keys(attributes);
            for (var i = 0; i < keys.length; i++) {
                if (svg && keys[parseInt(i.toString(), 10)] !== 'style') {
                    svg.setAttribute(keys[parseInt(i.toString(), 10)], attributes[keys[parseInt(i.toString(), 10)]]);
                }
                else {
                    this.applyStyleAgainstCsp(svg, attributes[keys[parseInt(i.toString(), 10)]]);
                }
            }
        };
        RulerHelper.prototype.setAttributeHtml = function (element, attributes) {
            var keys = Object.keys(attributes);
            for (var i = 0; i < keys.length; i++) {
                if (keys[parseInt(i.toString(), 10)] !== 'style') {
                    element.setAttribute(keys[parseInt(i.toString(), 10)], attributes[keys[parseInt(i.toString(), 10)]]);
                }
                else {
                    this.applyStyleAgainstCsp(element, attributes[keys[parseInt(i.toString(), 10)]]);
                }
            }
        };
        RulerHelper.prototype.renderOverlapElement = function (documentEditor) {
            var rulerSize = this.getRulerSize(documentEditor);
            var attributes = {
                'id': documentEditor.element.id + '_overlapRuler',
                style: 'height:' + rulerSize.height + 'px;width:' + rulerSize.width + 'px;position:absolute;margin-left:0;margin-top:0;diplay:none',
                class: 'e-ruler-overlap'
            };
            this.overlap = this.createHtmlElement('div', attributes);
            var element = document.getElementById(documentEditor.element.id + '_viewerContainer');
            element.insertBefore(this.overlap, element.firstChild);
            return this.overlap;
        };
        RulerHelper.prototype.renderRulerMarkerIndicatorElement = function (documentEditor) {
            if (!documentEditor.enableSelection) {
                return;
            }
            var rulerSize = this.getRulerSize(documentEditor);
            var attributes = {
                'id': documentEditor.element.id + '_markIndicator',
                style: 'height:' + rulerSize.height + 'px;width:' + rulerSize.width + 'px;position:absolute;margin-left:0;margin-top:0;z-index:5;border:1px solid #ccc;display:' + (documentEditor.layoutType === 'Pages' ? 'block;' : 'none;'),
                class: 'e-de-ruler-markIndicator'
            };
            this.markIndicator = this.createHtmlElement('div', attributes);
            this.tabStopStwitch = this.markIndicator;
            var element = document.getElementById(documentEditor.element.id + '_viewerContainer');
            element.insertBefore(this.markIndicator, element.firstChild);
            var ownerId = documentEditor.element.id;
            this.firstLineIndentRuler = document.getElementById(ownerId + '_firstLineIndent').cloneNode(true);
            this.hangingIndentRuler = document.getElementById(ownerId + '_hangingIndent').cloneNode(true);
            this.firstLineIndentRuler.style.left = '1px';
            this.firstLineIndentRuler.style.top = rulerSize.height / 2 - 3 + 'px';
            this.firstLineIndentRuler.style.display = 'none';
            this.firstLineIndentRuler.classList.add('e-de-ruler-marker');
            this.firstLineIndentRuler.setAttribute('id', ownerId + '_firstLineIndent_-1');
            this.hangingIndentRuler.style.left = '1px';
            this.hangingIndentRuler.style.top = rulerSize.height / 2 - 3 + 'px';
            this.hangingIndentRuler.style.display = 'none';
            this.hangingIndentRuler.classList.add('e-de-ruler-marker');
            this.hangingIndentRuler.setAttribute('id', ownerId + '_hangingIndent_-1');
            this.markIndicator.appendChild(this.hangingIndentRuler);
            this.markIndicator.appendChild(this.firstLineIndentRuler);
            var justification = ['Left', 'Center', 'Right', 'Decimal', 'Bar'];
            var locale = new ej2_base_1.L10n('documenteditor', documentEditor.defaultLocale);
            locale.setLocale(documentEditor.locale);
            for (var i = 0; i < 5; i++) {
                this.renderTab(documentEditor, rulerSize, undefined, justification[parseInt(i.toString(), 10)], -1, locale);
                var element_1 = document.getElementById(documentEditor.element.id + '_' + justification[parseInt(i.toString(), 10)] + 'Tab_-1');
                Eif (!ej2_base_1.isNullOrUndefined(element_1)) {
                    element_1.classList.remove('e-de-ruler-tab');
                    element_1.classList.add('e-de-ruler-marker');
                    element_1.style.display = i === 0 ? 'block' : 'none';
                    element_1.style.position = 'absolute';
                    element_1.style.margin = '4px 3px';
                    this.markIndicator.appendChild(element_1);
                }
            }
            this.markIndicator.addEventListener('click', this.onmarkIndicatorClickHandler);
        };
        RulerHelper.prototype.renderRuler = function (documentEditor, isHorizontal) {
            this.documentEditor = documentEditor;
            if (!documentEditor.enableSelection) {
                return;
            }
            this.rulerDiv = document.getElementById(documentEditor.element.id + (isHorizontal ? '_hRuler' : '_vRuler'));
            var rulerSize = this.getRulerSize(documentEditor);
            this.rulerGeometry = this.getRulerGeometry(documentEditor);
            var height = isHorizontal ? documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.x
                : (documentEditor.selectionModule.getPageTop(documentEditor.selectionModule.end.paragraph.bodyWidget.page));
            var margin = isHorizontal ? ('margin-left:' + height + 'px;') : ('margin-top:' + height + 'px;');
            Iif (documentEditor.selectionModule.isForward) {
                this.position = documentEditor.selectionModule.start;
            }
            else {
                this.position = documentEditor.selectionModule.end;
            }
            if (!this.rulerDiv) {
                var style_1 = 'height:' + (isHorizontal ? rulerSize.height : this.rulerGeometry.height) + 'px;overflow:hidden;width:' +
                    (isHorizontal ? this.rulerGeometry.width : rulerSize.width) + 'px;position:absolute;font-size:9px;text-align: left;z-index: 4;user-select:none;' + margin;
                var attributes_1 = {
                    'id': documentEditor.element.id + (isHorizontal ? '_hRuler' : '_vRuler'),
                    style: style_1, class: (isHorizontal ? 'e-de-hRuler' : 'e-de-vRuler')
                };
                this.rulerDiv = this.createHtmlElement('div', attributes_1);
            }
            this.rulerDiv.addEventListener('dblclick', this.onRulerDblClickHandler);
            var pageElement = document.getElementById(documentEditor.element.id + '_pageContainer');
            var style = 'height:' + (isHorizontal ? rulerSize.height : pageElement.getBoundingClientRect().height) + 'px;overflow:hidden;width:' +
                (isHorizontal ? pageElement.getBoundingClientRect().width : rulerSize.width) + 'px;position:absolute;z-index: 3;';
            var attributes = {
                'id': documentEditor.element.id + (isHorizontal ? '_hRulerBottom' : '_vRulerBottom'),
                style: style, class: (isHorizontal ? 'e-de-hRuler' : 'e-de-vRuler')
            };
            this.rulerOverlap = this.createHtmlElement('div', attributes);
            if (isHorizontal) {
                this.hRulerBottom = this.rulerOverlap;
            }
            else {
                this.vRulerBottom = this.rulerOverlap;
            }
            var parentElement = document.getElementById(documentEditor.element.id + '_viewerContainer');
            parentElement.insertBefore(this.rulerOverlap, parentElement.firstChild);
            var element = isHorizontal ? document.getElementById(documentEditor.element.id + '_hRulerBottom') : document.getElementById(documentEditor.element.id + '_vRulerBottom');
            element.insertBefore(this.rulerDiv, element.firstChild);
            this.renderRulerMargins(documentEditor, isHorizontal, this.rulerDiv);
            var ruler = new index_1.Ruler(this.rulerDiv, this);
            ruler.orientation = isHorizontal ? 'Horizontal' : 'Vertical';
            this.updateMargin(ruler, documentEditor, isHorizontal);
            ruler.length = ruler.zeroPosition * 2;
            ruler.appendTo();
            isHorizontal ? documentEditor.hRuler = ruler : documentEditor.vRuler = ruler;
            this.updateRulerPosition(documentEditor, isHorizontal);
            var rulerObj = document.getElementById(documentEditor.element.id + (isHorizontal ? '_hRuler' : '_vRuler'));
            isHorizontal ? documentEditor.hRuler.element = rulerObj : documentEditor.vRuler.element = rulerObj;
            Eif (rulerObj) {
                if (isHorizontal) {
                    rulerObj.scrollLeft = ruler.zeroPosition -
                        editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin);
                }
                else {
                    rulerObj.scrollTop = ruler.zeroPosition -
                        editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin);
                }
            }
            this.locale = new ej2_base_1.L10n('documenteditor', documentEditor.defaultLocale);
            if (isHorizontal) {
                this.renderIndents(documentEditor, isHorizontal, rulerSize, this.rulerGeometry, this.locale);
            }
            this.hRuler = document.getElementById(documentEditor.element.id + '_hRuler');
            if (isHorizontal) {
                document.addEventListener('mousemove', this.onHorizontalRulerMouseMoveHandler);
                this.hRuler.addEventListener('mouseenter', this.onHRulerMouseEnterHandler);
                this.hRuler.addEventListener('mouseleave', this.onHRulerMouseLeaveHandler);
                this.hRuler.addEventListener('mousedown', this.onHRulerMouseDownHandler);
                this.hRuler.addEventListener('mouseup', this.onHRulerMouseUpHandler);
                document.addEventListener('mouseup', this.onRulerMouseUpHandler);
            }
            this.vRuler = document.getElementById(documentEditor.element.id + '_vRuler');
            this.isTopRulerMargin = false;
            if (!isHorizontal) {
                document.addEventListener('mousemove', this.onVMouseMoveHandler);
                this.vRuler.addEventListener('mousedown', this.onVMouseDownHandler);
                document.addEventListener('mouseup', this.onVMouseUpHandler);
            }
        };
        RulerHelper.prototype.onHorizontalRulerMouseMoved = function (e) {
            if (this.documentEditor.isDestroyed || !this.documentEditor.documentEditorSettings.showRuler) {
                return;
            }
            var divRect = this.hRuler.getBoundingClientRect();
            var leftMargin = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin
                * this.documentEditor.zoomFactor;
            var rightMargin = (editor_helper_1.HelperMethods.convertPixelToPoint(divRect.width) -
                this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin * this.documentEditor.zoomFactor);
            var pixelValue = Math.round(e.clientX - divRect.left);
            var mouseXRelativeToDiv = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
            if (!this.isDraggingRender) {
                if (this.documentEditor.isOnIndent) {
                    this.hRuler.style.cursor = 'default';
                    if (this.hRuler.hasAttribute('title')) {
                        this.hRuler.removeAttribute('title');
                    }
                    this.resizerEnabled = false;
                }
                else if (((leftMargin - 3) <= mouseXRelativeToDiv) && ((leftMargin + 3) >= mouseXRelativeToDiv)) {
                    if (this.documentEditor.layoutType === 'Pages') {
                        this.hRuler.style.cursor = 'e-resize';
                        this.hRuler.setAttribute('title', this.locale.getConstant('Left Margin'));
                        this.resizerEnabled = true;
                        this.isLeftRulerMargin = true;
                    }
                }
                else if ((((rightMargin - 3) <= mouseXRelativeToDiv) && ((rightMargin + 3) >= mouseXRelativeToDiv))) {
                    if (this.documentEditor.layoutType === 'Pages') {
                        this.hRuler.style.cursor = 'e-resize';
                        this.hRuler.setAttribute('title', this.locale.getConstant('Right Margin'));
                        this.resizerEnabled = true;
                        this.isLeftRulerMargin = false;
                    }
                }
                else if (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.columns.length > 0) {
                    var columns = this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.columns;
                    if (this.documentEditor.layoutType === 'Pages') {
                        for (var i = 1; i <= columns.length; i++) {
                            var rulerMarginDiv = document.getElementById(this.documentEditor.element.id + '_hRuler_Margin' + i);
                            var maginLeft = rulerMarginDiv.getBoundingClientRect().left;
                            var width = rulerMarginDiv.getBoundingClientRect().width;
                            if (((maginLeft - 3) <= e.clientX) && ((maginLeft + 3) >= e.clientX)) {
                                this.hRuler.style.cursor = 'e-resize';
                                this.multiColumnElement = rulerMarginDiv;
                                this.hRuler.setAttribute('title', this.locale.getConstant('Left Margin'));
                                this.isLeftMultiColumn = true;
                                this.resizerEnabled = true;
                                break;
                            }
                            else if (((maginLeft + width - 3) <= e.clientX) && ((maginLeft + width + 3) >= e.clientX)) {
                                this.hRuler.style.cursor = 'e-resize';
                                this.multiColumnElement = rulerMarginDiv;
                                this.hRuler.setAttribute('title', this.locale.getConstant('Right Margin'));
                                this.isRightMultiColumn = true;
                                this.resizerEnabled = true;
                                break;
                            }
                            else {
                                this.hRuler.style.cursor = 'default';
                                if (this.hRuler.hasAttribute('title')) {
                                    this.hRuler.removeAttribute('title');
                                }
                                this.isLeftMultiColumn = false;
                                this.isRightMultiColumn = false;
                                this.resizerEnabled = false;
                            }
                        }
                    }
                }
                else {
                    this.hRuler.style.cursor = 'default';
                    if (this.hRuler.hasAttribute('title')) {
                        this.hRuler.removeAttribute('title');
                    }
                    this.resizerEnabled = false;
                }
            }
            if (this.isDraggingRender) {
                var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - this.documentEditor.selectionModule.sectionFormat.leftMargin) * this.documentEditor.zoomFactor;
                var pageWidth = this.documentEditor.selectionModule.sectionFormat.pageWidth;
                var rightMarginValue = this.documentEditor.selectionModule.sectionFormat.rightMargin;
                var rightIndentValue = this.documentEditor.selectionModule.paragraphFormat.rightIndent;
                rightIndentValue = rightIndentValue > 0 ? rightIndentValue : 0;
                var minimumValue = 42;
                var firstLineIndent = this.documentEditor.selectionModule.paragraphFormat.firstLineIndent;
                var leftMarginValue = this.documentEditor.selectionModule.sectionFormat.leftMargin;
                firstLineIndent = firstLineIndent >= 0 ? firstLineIndent : 0;
                var leftIndent = this.documentEditor.selectionModule.paragraphFormat.leftIndent;
                if (this.isLeftRulerMargin) {
                    var leftMaxLimit = rulerZeroPoint + (editor_helper_1.HelperMethods.convertPointToPixel(pageWidth - rightMarginValue -
                        rightIndentValue - minimumValue - firstLineIndent - leftIndent) * this.documentEditor.zoomFactor);
                    var leftMinLimit = rulerZeroPoint;
                    if (pixelValue + rulerZeroPoint > leftMaxLimit) {
                        pixelValue = leftMaxLimit - rulerZeroPoint;
                        mouseXRelativeToDiv = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                    else if (pixelValue + rulerZeroPoint < leftMinLimit) {
                        pixelValue = leftMinLimit - rulerZeroPoint;
                        mouseXRelativeToDiv = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                }
                else {
                    var rightMinLimit = rulerZeroPoint + (editor_helper_1.HelperMethods.convertPointToPixel(leftMarginValue + leftIndent + firstLineIndent + minimumValue + rightIndentValue) * this.documentEditor.zoomFactor);
                    var rightMaxLimit = rulerZeroPoint + (editor_helper_1.HelperMethods.convertPointToPixel(pageWidth) * this.documentEditor.zoomFactor);
                    if (pixelValue + rulerZeroPoint > rightMaxLimit) {
                        pixelValue = rightMaxLimit - rulerZeroPoint;
                        mouseXRelativeToDiv = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                    else if (pixelValue + rulerZeroPoint < rightMinLimit) {
                        pixelValue = rightMinLimit - rulerZeroPoint;
                        mouseXRelativeToDiv = editor_helper_1.HelperMethods.convertPixelToPoint(pixelValue);
                    }
                }
                this.finalmouseXRelativeToDiv = mouseXRelativeToDiv;
                var currentRightMargin = (editor_helper_1.HelperMethods.convertPixelToPoint(divRect.width)
                    - (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin
                        * this.documentEditor.zoomFactor));
                if (this.documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.numberOfColumns <= 1) {
                    this.resizeRulerMargins(this.isLeftRulerMargin, this.renderInitialValue, this.currentScrollLeft, currentRightMargin, this.hRuler, mouseXRelativeToDiv, true, this.documentEditor);
                }
                var rightIndent = document.getElementById(this.documentEditor.element.id + '_rightIndent');
                if (this.isLeftRulerMargin) {
                    var difference = mouseXRelativeToDiv - this.renderInitialValue;
                    rightIndent.style.left = (this.initialRightMargin - editor_helper_1.HelperMethods.convertPointToPixel(difference)) + 'px';
                }
                else {
                    var difference = mouseXRelativeToDiv - this.renderInitialValue;
                    rightIndent.style.left = (this.initialRightMargin + editor_helper_1.HelperMethods.convertPointToPixel(difference)) + 'px';
                }
                var startValue = this.documentEditor.documentHelper.currentPage.boundingRectangle.x;
                var indicatorLineValue = startValue + pixelValue;
                var lineSvg = document.getElementById(this.documentEditor.element.id + '_hRuler_indicator_svg');
                lineSvg.style.left = indicatorLineValue + 'px';
            }
        };
        RulerHelper.prototype.updateRulerPosition = function (documentEditor, isHorizontal) {
            var rulerObj = document.getElementById(documentEditor.element.id + (isHorizontal ? '_hRuler' : '_vRuler'));
            isHorizontal ? documentEditor.hRuler.element = rulerObj : documentEditor.vRuler.element = rulerObj;
            Eif (rulerObj) {
                rulerObj.scrollLeft = 2112 - editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin);
            }
        };
        RulerHelper.prototype.updateIndicatorLines = function (documentEditor) {
            var hRulerSvg = document.getElementById(documentEditor.element.id + '_hRuler_indicator_svg');
            var hRulerLine = document.getElementById(documentEditor.element.id + '_hRuler_indicator');
            var vRulerSvg = document.getElementById(documentEditor.element.id + '_vRuler_indicator_svg');
            var vRulerLine = document.getElementById(documentEditor.element.id + '_vRuler_indicator');
            var pageContainer = document.getElementById(documentEditor.element.id + '_pageContainer');
            var pageData = pageContainer.getBoundingClientRect();
            var pageHeight = pageData.height;
            var pageWidth = pageData.width;
            hRulerSvg.style.height = pageHeight + 'px';
            hRulerLine.setAttribute('y2', "" + pageHeight);
            vRulerSvg.style.width = pageWidth + 'px';
            vRulerLine.setAttribute('x2', "" + pageWidth);
        };
        RulerHelper.prototype.createIndicatorLines = function (documentEditor) {
            if (!documentEditor.enableSelection) {
                return;
            }
            var viewerContainer = document.getElementById(documentEditor.element.id + '_viewerContainer');
            var pageContainer = document.getElementById(documentEditor.element.id + '_pageContainer');
            var data = viewerContainer.getBoundingClientRect();
            var pageData = pageContainer.getBoundingClientRect();
            var pageHeight = pageData.height;
            var pageWidth = pageData.width;
            this.hRuler = document.getElementById(documentEditor.element.id + '_hRuler');
            var hSvgAttr = {
                id: documentEditor.element.id + '_hRuler_indicator_svg',
                width: 0.5 + 'px',
                height: pageHeight + 'px',
                style: 'position:absolute;z-index:1;display:none;'
            };
            this.hSvg = this.createSvgElement('svg', hSvgAttr);
            var verticalLineAttr = { 'x1': 0, 'y1': this.hRuler.getBoundingClientRect().height + 5, 'x2': 0, 'y2': pageHeight, 'stroke-width': 0.5, 'stroke': 'black' };
            this.vLine = this.createSvgElement('line', verticalLineAttr);
            this.vLine.setAttribute('id', documentEditor.element.id + '_hRuler_indicator');
            this.hSvg.appendChild(this.vLine);
            viewerContainer.insertBefore(this.hSvg, viewerContainer.firstChild);
            var vRuler = document.getElementById(documentEditor.element.id + '_vRuler');
            var vSvgAttr = {
                id: documentEditor.element.id + '_vRuler_indicator_svg',
                width: pageWidth + 'px',
                height: 0.5 + 'px',
                style: 'position:absolute;z-index:1;display:none;'
            };
            this.vSvg = this.createSvgElement('svg', vSvgAttr);
            var horizontalLineAttr = { 'x1': vRuler.getBoundingClientRect().width + 5, 'y1': 0, 'x2': pageWidth, 'y2': 0, 'stroke-width': 0.5, 'stroke': 'black' };
            this.hLine = this.createSvgElement('line', horizontalLineAttr);
            this.hLine.setAttribute('id', documentEditor.element.id + '_vRuler_indicator');
            this.vSvg.appendChild(this.hLine);
            viewerContainer.insertBefore(this.vSvg, viewerContainer.firstChild);
        };
        RulerHelper.prototype.updateIndentMarkers = function (documentEditor) {
            Iif (ej2_base_1.isNullOrUndefined(documentEditor) || ej2_base_1.isNullOrUndefined(documentEditor.element)
                || ej2_base_1.isNullOrUndefined(documentEditor.element.id) || ej2_base_1.isNullOrUndefined(documentEditor.hRuler)
                || ej2_base_1.isNullOrUndefined(documentEditor.hRuler.zeroPosition)) {
                return;
            }
            var indent = undefined;
            var ownerId = documentEditor.element.id;
            var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - documentEditor.selectionModule.sectionFormat.leftMargin);
            var currentIndentValue;
            var finalValue;
            var currentMargin;
            var pixelValue;
            var rulerGeometry = this.getRulerGeometry(documentEditor);
            Iif (this.position.paragraph.paragraphFormat.bidi || (this.position.paragraph.isInsideTable
                && this.position.paragraph.associatedCell.ownerTable.tableFormat.bidi)) {
                var rulerMarginDivWidth = ((rulerGeometry.width / documentEditor.zoomFactor) -
                    (editor_helper_1.HelperMethods.convertPointToPixel((this.position.paragraph.bodyWidget.sectionFormat.rightMargin)
                        + (this.position.paragraph.bodyWidget.sectionFormat.leftMargin))));
                rulerZeroPoint -= rulerMarginDivWidth;
            }
            var paraStart = !ej2_base_1.isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['x'].toString()) : this.position.paragraph.x;
            var paraWidth = !ej2_base_1.isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
            var finalValueTemp;
            Iif (this.position.paragraph.paragraphFormat.bidi) {
                rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - documentEditor.selectionModule.sectionFormat.leftMargin -
                    (documentEditor.selectionModule.sectionFormat.pageWidth -
                        documentEditor.selectionModule.sectionFormat.leftMargin -
                        documentEditor.selectionModule.sectionFormat.rightMargin));
            }
            var leftIndent = document.getElementById(documentEditor.element.id + '_leftIndent');
            var rightIndent = document.getElementById(documentEditor.element.id + '_rightIndent');
            Iif (this.position.paragraph.paragraphFormat.bidi) {
                leftIndent.setAttribute('title', this.locale.getConstant('Right Indent'));
                rightIndent.setAttribute('title', this.locale.getConstant('Left Indent'));
                finalValueTemp = rulerZeroPoint + paraStart + paraWidth;
            }
            else {
                leftIndent.setAttribute('title', this.locale.getConstant('Left Indent'));
                rightIndent.setAttribute('title', this.locale.getConstant('Right Indent'));
                finalValueTemp = rulerZeroPoint + paraStart;
            }
            var firstLineIndent = this.position.paragraph.paragraphFormat.firstLineIndent;
            indent = document.getElementById(ownerId + '_leftIndent');
            Eif (!ej2_base_1.isNullOrUndefined(indent)) {
                if (documentEditor.layoutType === 'Pages') {
                    indent.style.left = ((finalValueTemp * documentEditor.zoomFactor) - 6) + 'px';
                }
                else Iif (documentEditor.layoutType === 'Continuous') {
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) -
                            20 - documentEditor.viewer.clientArea.width;
                        finalValueTemp = rulerZeroPoint + paraStart + paraWidth;
                        indent.style.left = finalValueTemp + 'px';
                    }
                    else {
                        rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) - 20;
                        finalValueTemp = rulerZeroPoint + (paraStart * documentEditor.zoomFactor);
                        indent.style.left = finalValueTemp + 'px';
                    }
                }
            }
            indent = document.getElementById(ownerId + '_hangingIndent');
            Eif (!ej2_base_1.isNullOrUndefined(indent)) {
                if (documentEditor.layoutType === 'Pages') {
                    indent.style.left = ((finalValueTemp * documentEditor.zoomFactor) - 6) + 'px';
                }
                else Iif (documentEditor.layoutType === 'Continuous') {
                    if (this.position.paragraph.paragraphFormat.bidi) {
                        rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) -
                            20 - documentEditor.viewer.clientArea.width;
                        finalValueTemp = rulerZeroPoint + paraStart + paraWidth;
                        indent.style.left = finalValueTemp + 'px';
                    }
                    else {
                        rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) - 20;
                        finalValueTemp = rulerZeroPoint + (paraStart * documentEditor.zoomFactor);
                        indent.style.left = finalValueTemp + 'px';
                    }
                }
            }
            indent = document.getElementById(ownerId + '_firstLineIndent');
            if (documentEditor.layoutType === 'Pages') {
                Eif (!ej2_base_1.isNullOrUndefined(indent)) {
                    Iif (this.position.paragraph.paragraphFormat.bidi) {
                        indent.style.left = (((finalValueTemp - editor_helper_1.HelperMethods.convertPointToPixel(firstLineIndent)) * documentEditor.zoomFactor) - 6) + 'px';
                    }
                    else {
                        indent.style.left = (((finalValueTemp + editor_helper_1.HelperMethods.convertPointToPixel(firstLineIndent)) * documentEditor.zoomFactor) - 6) + 'px';
                    }
                }
            }
            else Iif (documentEditor.layoutType === 'Continuous') {
                if (this.position.paragraph.paragraphFormat.bidi) {
                    rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) -
                        20 - documentEditor.viewer.clientArea.width;
                    finalValueTemp = rulerZeroPoint + paraStart + paraWidth - (editor_helper_1.HelperMethods.convertPointToPixel(firstLineIndent) * documentEditor.zoomFactor);
                }
                else {
                    rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) - 20;
                    finalValueTemp = rulerZeroPoint + ((paraStart + editor_helper_1.HelperMethods.convertPointToPixel(firstLineIndent)) * documentEditor.zoomFactor);
                }
                indent.style.left = finalValueTemp + 'px';
            }
            indent = document.getElementById(ownerId + '_rightIndent');
            if (documentEditor.layoutType === 'Pages') {
                Iif (this.position.paragraph.paragraphFormat.bidi) {
                    finalValueTemp = rulerZeroPoint + paraStart;
                }
                else {
                    finalValueTemp = rulerZeroPoint + paraStart + paraWidth;
                }
                Eif (!ej2_base_1.isNullOrUndefined(indent)) {
                    indent.style.left = ((finalValueTemp * documentEditor.zoomFactor) - 6) + 'px';
                }
            }
            else Iif (documentEditor.layoutType === 'Continuous') {
                if (this.position.paragraph.paragraphFormat.bidi) {
                    rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) -
                        20 - (documentEditor.viewer.clientArea.width * documentEditor.zoomFactor);
                    finalValueTemp = rulerZeroPoint + paraStart;
                    indent.style.left = finalValueTemp + 'px';
                }
                else {
                    rulerZeroPoint = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) - 20;
                    finalValueTemp = rulerZeroPoint + ((paraStart + paraWidth) * documentEditor.zoomFactor);
                    indent.style.left = finalValueTemp + 'px';
                }
            }
        };
        RulerHelper.prototype.updateTabStopMarkers = function (documentEditor) {
            Iif (ej2_base_1.isNullOrUndefined(documentEditor) || ej2_base_1.isNullOrUndefined(documentEditor.element)
                || ej2_base_1.isNullOrUndefined(documentEditor.element.id) || ej2_base_1.isNullOrUndefined(documentEditor.hRuler)
                || ej2_base_1.isNullOrUndefined(documentEditor.hRuler.zeroPosition)) {
                return;
            }
            var locale = new ej2_base_1.L10n('documenteditor', documentEditor.defaultLocale);
            locale.setLocale(documentEditor.locale);
            var ownerId = documentEditor.element.id;
            this.markIndicator = document.getElementById(ownerId + '_markIndicator');
            this.markIndicator.style.display = documentEditor.layoutType === 'Pages' ? 'block' : 'none';
            var paragarph = this.position.paragraph;
            var tabs = paragarph.paragraphFormat.tabs;
            var zoomFactor = documentEditor.zoomFactor;
            var rulerSize = this.getRulerSize(documentEditor);
            var RenderedTabElement = editor_helper_1.HelperMethods.convertNodeListToArray(document.querySelectorAll('.e-de-ruler-tab'));
            for (var i = 0; i < tabs.length; i++) {
                var tabStop = tabs[parseInt(i.toString(), 10)];
                var justification = tabStop.tabJustification;
                var id = documentEditor.element.id + '_' + justification + 'Tab_' + i.toString();
                var tabMarker = document.getElementById(id);
                if (!ej2_base_1.isNullOrUndefined(tabMarker)) {
                    if (!ej2_base_1.isNullOrUndefined(RenderedTabElement) && RenderedTabElement.length > 0) {
                        RenderedTabElement.splice(RenderedTabElement.indexOf(tabMarker), 1);
                    }
                    var value = this.position.paragraph.paragraphFormat.bidi ?
                        (editor_helper_1.HelperMethods.convertPointToPixel(1584 - tabStop.position))
                        : (editor_helper_1.HelperMethods.convertPointToPixel(1584 + tabStop.position));
                    if (justification === 'Center' || justification === 'Decimal') {
                        tabMarker.style.left = ((value * zoomFactor) - 4) + 'px';
                    }
                    else if (justification === 'Right') {
                        tabMarker.style.left = ((value * zoomFactor) - 5.5) + 'px';
                    }
                    else {
                        tabMarker.style.left = ((value * zoomFactor) - 1.5) + 'px';
                    }
                }
                else {
                    if (justification !== 'List' && !ej2_base_1.isNullOrUndefined(justification)) {
                        this.renderTab(documentEditor, rulerSize, tabStop, justification, i, locale);
                    }
                }
            }
            Eif (!ej2_base_1.isNullOrUndefined(RenderedTabElement)) {
                for (var i = 0; i < RenderedTabElement.length; i++) {
                    var elementToRemove = RenderedTabElement[parseInt(i.toString(), 10)];
                    if (!ej2_base_1.isNullOrUndefined(elementToRemove)) {
                        elementToRemove.parentNode.removeChild(elementToRemove);
                    }
                }
            }
        };
        RulerHelper.prototype.renderRulerMargins = function (documentEditor, isHorizontal, rulerContainer) {
            var rulerSize = this.getRulerSize(documentEditor);
            var rulerGeometry = this.getRulerGeometry(documentEditor);
            var height = isHorizontal ? documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.x
                : (documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.y + rulerSize.height);
            var leftMarginValue = 2112 * documentEditor.zoomFactor;
            var rulerMargin = isHorizontal ? ('margin-left:' + leftMarginValue + 'px;') : ('margin-top:' + leftMarginValue + 'px;');
            var rulerHeight = (isHorizontal ? rulerSize.height : (rulerGeometry.height -
                (editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin
                    + documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin) * documentEditor.zoomFactor)));
            if (isHorizontal) {
                for (var i = 1; i <= 13; i++) {
                    this.rulerMarginDiv = document.getElementById(documentEditor.element.id + '_hRuler_Margin' + i);
                    if (!this.rulerMarginDiv) {
                        var rulerstyle = 'height:' + rulerHeight + 'px;overflow:hidden;width:' +
                            (rulerGeometry.width - (editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin + documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin) * documentEditor.zoomFactor)) + 'px;position:absolute;' + 'font-size:9px;text-align: left;z-index: -1;display: block' + rulerMargin;
                        var rulerattributes = {
                            'id': documentEditor.element.id + '_hRuler_Margin' + i,
                            style: rulerstyle,
                            class: 'e-de-ruler-margin'
                        };
                        this.rulerMarginDiv = this.createHtmlElement('div', rulerattributes);
                    }
                    rulerContainer.appendChild(this.rulerMarginDiv);
                }
            }
            else {
                Eif (!this.verticalRulerMarginDiv) {
                    this.verticalRulerMarginDiv = document.getElementById(documentEditor.element.id + '_vRuler_Margin');
                    var rulerstyle = 'height:' + rulerHeight + 'px;overflow:hidden;width:' +
                        rulerSize.width + 'px;position:absolute;' + 'font-size:9px;text-align: left;z-index: -1;' + rulerMargin;
                    var rulerattributes = {
                        'id': documentEditor.element.id + '_vRuler_Margin',
                        style: rulerstyle,
                        class: 'e-de-ruler-margin'
                    };
                    this.verticalRulerMarginDiv = this.createHtmlElement('div', rulerattributes);
                }
                rulerContainer.appendChild(this.verticalRulerMarginDiv);
            }
        };
        RulerHelper.prototype.updateRulerMargins = function (documentEditor) {
            var rulerGeometry = this.getRulerGeometry(documentEditor);
            var leftMarginValue = (documentEditor.hRuler.zeroPosition) * documentEditor.zoomFactor;
            this.updateHorizontalRulerMargin(documentEditor);
            var verticalRulerMarginDiv = document.getElementById(documentEditor.element.id + '_vRuler_Margin');
            var rulerMarginDivHeight = rulerGeometry.height - (editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin
                * documentEditor.zoomFactor) + (documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin
                * documentEditor.zoomFactor)));
            verticalRulerMarginDiv.style.marginTop = leftMarginValue + 'px';
            verticalRulerMarginDiv.style.height = rulerMarginDivHeight + 'px';
        };
        RulerHelper.prototype.updateHorizontalRulerMargin = function (documentEditor) {
            var columns = documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.columns;
            var leftMarginValue = (documentEditor.hRuler.zeroPosition) * documentEditor.zoomFactor;
            var skipLoop = false;
            var paraBidi = this.position.paragraph.paragraphFormat.bidi;
            var tableBidi = false;
            var currnLefttMargin = editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin - 72);
            var currentRightMargin = editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin - 72);
            Iif (this.position.paragraph.isInsideTable) {
                tableBidi = this.position.paragraph.associatedCell.ownerTable.tableFormat.bidi;
            }
            var rulerMarginDivWidth = (this.getRulerGeometry(documentEditor).width -
                (editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin
                    * documentEditor.zoomFactor) + (documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin
                    * documentEditor.zoomFactor))));
            Iif (paraBidi || tableBidi) {
                leftMarginValue = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) - rulerMarginDivWidth;
            }
            for (var i = 0; i < 13; i++) {
                var horizontalRulerMarginDiv = document.getElementById(documentEditor.element.id + '_hRuler_Margin' + (i + 1));
                Eif (horizontalRulerMarginDiv) {
                    if ((columns.length === 0 && !skipLoop) || (documentEditor.layoutType === 'Continuous' && !skipLoop)) {
                        Iif (paraBidi || tableBidi) {
                            var startValue = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) - rulerMarginDivWidth;
                            horizontalRulerMarginDiv.style.marginLeft = startValue + 'px';
                        }
                        else {
                            horizontalRulerMarginDiv.style.marginLeft = leftMarginValue + 'px';
                        }
                        horizontalRulerMarginDiv.style.display = 'block';
                        Iif (documentEditor.layoutType === 'Continuous') {
                            var paraWidth = !ej2_base_1.isNullOrUndefined(this.position.paragraph['absoluteXPosition']) ? parseFloat(this.position.paragraph['absoluteXPosition']['width'].toString()) : this.position.paragraph.width;
                            horizontalRulerMarginDiv.style.width = (paraWidth * documentEditor.zoomFactor) + 'px';
                        }
                        else {
                            horizontalRulerMarginDiv.style.width = rulerMarginDivWidth + 'px';
                        }
                        skipLoop = true;
                    }
                    else Iif ((columns.length >= i + 1) && documentEditor.layoutType === 'Pages') {
                        if (paraBidi || tableBidi) {
                            horizontalRulerMarginDiv.style.marginLeft = leftMarginValue + 'px';
                            leftMarginValue -= ((currnLefttMargin + currentRightMargin) / (columns.length)) * documentEditor.zoomFactor;
                            leftMarginValue = leftMarginValue + (columns[parseInt(i.toString(), 10)].width +
                                columns[parseInt(i.toString(), 10)].space) * documentEditor.zoomFactor;
                        }
                        else {
                            horizontalRulerMarginDiv.style.marginLeft = leftMarginValue + 'px';
                            leftMarginValue -= ((currnLefttMargin + currentRightMargin) / (columns.length)) * documentEditor.zoomFactor;
                            leftMarginValue = leftMarginValue + (columns[parseInt(i.toString(), 10)].width +
                                columns[parseInt(i.toString(), 10)].space) * documentEditor.zoomFactor;
                        }
                        horizontalRulerMarginDiv.style.display = 'block';
                        horizontalRulerMarginDiv.style.width = (columns[parseInt(i.toString(), 10)].width - ((currnLefttMargin + currentRightMargin) / columns.length)) * documentEditor.zoomFactor + 'px';
                    }
                    else {
                        horizontalRulerMarginDiv.style.display = 'none';
                    }
                }
            }
        };
        RulerHelper.prototype.resizeVRulerMargins = function (isRulerTopMargin, currentTopMargin, currentScrollTop, currentBottomMargin, ruler, mousePosition, documentEditor) {
            var rulerMarginDiv = document.getElementById(documentEditor.element.id + '_vRuler_Margin');
            var rulerGeometry = this.getRulerGeometry(documentEditor);
            if (isRulerTopMargin) {
                rulerMarginDiv.style.height = (rulerGeometry.height - editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin * documentEditor.zoomFactor) + mousePosition)).toString() + 'px';
                if (currentTopMargin < mousePosition) {
                    ruler.scrollTop = currentScrollTop - editor_helper_1.HelperMethods.convertPointToPixel(mousePosition - currentTopMargin);
                }
                else {
                    ruler.scrollTop = currentScrollTop + editor_helper_1.HelperMethods.convertPointToPixel(currentTopMargin - mousePosition);
                }
            }
            else {
                var bottomMargin = editor_helper_1.HelperMethods.convertPixelToPoint(rulerGeometry.height) - mousePosition;
                rulerMarginDiv.style.height = (rulerGeometry.height - editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin * documentEditor.zoomFactor) + (bottomMargin))).toString() + 'px';
                if (currentBottomMargin < mousePosition) {
                }
                else {
                }
            }
        };
        RulerHelper.prototype.resizeRulerMargins = function (isRulerLeftMargin, currentLeftMargin, currentScrollLeft, currentRightMargin, ruler, mousePosition, isHorizontal, documentEditor) {
            var rulerMarginDiv = document.getElementById(documentEditor.element.id + (isHorizontal ? '_hRuler_Margin1' : '_vRuler_Margin'));
            var rulerGeometry = this.getRulerGeometry(documentEditor);
            if (!ej2_base_1.isNullOrUndefined(isRulerLeftMargin) && isRulerLeftMargin) {
                rulerMarginDiv.style.width = (rulerGeometry.width - editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin * documentEditor.zoomFactor) + mousePosition)).toString() + 'px';
                if (currentLeftMargin < mousePosition) {
                    ruler.scrollLeft = currentScrollLeft - editor_helper_1.HelperMethods.convertPointToPixel(mousePosition - currentLeftMargin);
                }
                else {
                    ruler.scrollLeft = currentScrollLeft + editor_helper_1.HelperMethods.convertPointToPixel(currentLeftMargin - mousePosition);
                }
            }
            else {
                var rightMargin = editor_helper_1.HelperMethods.convertPixelToPoint(rulerGeometry.width) - mousePosition;
                rulerMarginDiv.style.width = (rulerGeometry.width - editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin * documentEditor.zoomFactor) + (rightMargin))).toString() + 'px';
                if (currentRightMargin < mousePosition) {
                }
                else {
                }
            }
        };
        RulerHelper.prototype.getRulerOrigin = function () {
            var range = 1584;
            var pixelValue = editor_helper_1.HelperMethods.convertPointToPixel(1584);
        };
        RulerHelper.prototype.renderIndents = function (documentEditor, isHorizontal, rulerSize, rulerGeometry, locale) {
            this.hRuler = document.getElementById(documentEditor.element.id + '_hRuler');
            this.firstLineIndent = document.getElementById(documentEditor.element.id + '_firstLineIndent');
            if (!this.firstLineIndent) {
                var margin = ('left:' + (editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin) - 6) * documentEditor.zoomFactor + 'px;');
                var style = 'height:' + ((rulerSize.height - 3) / 2) + 'px;overflow:hidden;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 5;' + margin;
                var attributes = {
                    'id': documentEditor.element.id + '_firstLineIndent',
                    style: style,
                    'data-name': 'FirstLineIndent',
                    class: 'e-de-ruler-indent'
                };
                this.firstLineIndent = this.createHtmlElement('div', attributes);
                this.firstLineIndent.setAttribute('title', locale.getConstant('First Line Indent'));
                var attr = {
                    'id': documentEditor.element.id + '_firstLineIndent_svg',
                    width: rulerSize.width + 'px',
                    height: ((rulerSize.height - 3) / 2) + 'px',
                    style: 'position:inherit;left:0px'
                };
                this.firstLineIndentSvg = this.createSvgElement('svg', attr);
                this.firstLineIndentSvg.setAttribute('fill', 'none');
                var pathattr = {
                    style: 'position:inherit;left:0px'
                };
                this.firstLineIndentPath = this.createSvgElement('path', pathattr);
                this.firstLineIndentPath.setAttribute('class', 'e-de-ruler-indent-svg');
                this.firstLineIndentPath.setAttribute('d', 'M 0.5 0.5 H 11.5 V 2.7128 L 6 5.4211 L 0.5 2.7128 V 0.5 Z');
                this.firstLineIndentPath.setAttribute('fill', 'white');
                this.firstLineIndentPath.setAttribute('stroke', '#A1A1A1');
                this.firstLineIndentSvg.appendChild(this.firstLineIndentPath);
                this.firstLineIndent.appendChild(this.firstLineIndentSvg);
                this.hRuler.append(this.firstLineIndent);
                this.firstLineIndent.addEventListener('dblclick', this.onDoubleClickHandler);
                this.isDraggingIndents1 = false;
                this.indentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
                var indentsInitialValue2 = editor_helper_1.HelperMethods.getNumberFromString(this.firstLineIndent.style.left);
                this.firstLineIndent.addEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.firstLineIndent.addEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.firstLineIndent.addEventListener('mousedown', this.onFirstLineIndentMouseDownHandler);
                document.addEventListener('mousemove', this.onIndentMouseMoveHandler);
                document.addEventListener('mouseup', this.onIndentMouseUpHandler);
            }
            this.hangingIndent = document.getElementById(documentEditor.element.id + '_hangingIndent');
            if (!this.hangingIndent) {
                var margin = ('left:' + (editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin) - 6) + 'px;');
                var style = 'height:' + (rulerSize.height / 2) + 'px;top:' + (((rulerSize.height - 3) / 2) + 1) + 'px;overflow:hidden;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 5;' + margin;
                var attributes = {
                    'id': documentEditor.element.id + '_hangingIndent',
                    style: style,
                    'data-name': 'HangingIndent',
                    class: 'e-de-ruler-indent'
                };
                this.hangingIndent = this.createHtmlElement('div', attributes);
                this.hangingIndent.setAttribute('title', locale.getConstant('Hanging Indent'));
                var attr = {
                    'id': documentEditor.element.id + '_hangingIndent_svg',
                    width: rulerSize.width + 'px',
                    height: ((rulerSize.height - 3) / 2) + 'px',
                    style: 'position:inherit;left:0px'
                };
                this.hangingIndentSvg = this.createSvgElement('svg', attr);
                this.hangingIndentSvg.setAttribute('fill', 'none');
                var pathattr = {
                    style: 'position:inherit;left:0px'
                };
                this.hangingIndentPath = this.createSvgElement('path', pathattr);
                this.hangingIndentPath.setAttribute('class', 'e-de-ruler-indent-svg');
                this.hangingIndentPath.setAttribute('d', 'M 0.5 5.3211 H 11.5 V 3.1083 L 6 0.4 L 0.5 3.1083 V 5.3211 Z');
                this.hangingIndentPath.setAttribute('fill', 'white');
                this.hangingIndentPath.setAttribute('stroke', '#A1A1A1');
                this.hangingIndentSvg.appendChild(this.hangingIndentPath);
                this.hangingIndent.appendChild(this.hangingIndentSvg);
                this.hRuler.append(this.hangingIndent);
                this.hangingIndent.addEventListener('dblclick', this.onDoubleClickHandler);
                this.hangingIndentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left);
                var initialValue2 = editor_helper_1.HelperMethods.getNumberFromString(this.hangingIndent.style.left);
                this.hangingIndent.addEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.hangingIndent.addEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.hangingIndent.addEventListener('mousedown', this.onHangIndentMouseDownHandler);
                document.addEventListener('mousemove', this.onHangIndentMouseMoveHandler);
                document.addEventListener('mouseup', this.onHangIndentMouseUpHandler);
            }
            this.leftIndent = document.getElementById(documentEditor.element.id + '_leftIndent');
            if (!this.leftIndent) {
                var margin = ('left:' + (editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin) - 6) + 'px;');
                var style = 'height:4px;top:11px;overflow:hidden;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 5;' + margin;
                var attributes = {
                    'id': documentEditor.element.id + '_leftIndent',
                    style: style,
                    class: 'e-de-ruler-indent'
                };
                this.leftIndent = this.createHtmlElement('div', attributes);
                this.leftIndent.setAttribute('title', locale.getConstant('Left Indent'));
                var attr = {
                    'id': documentEditor.element.id + '_leftIndent_svg',
                    width: rulerSize.width + 'px',
                    height: '4px',
                    style: 'position:inherit;left:0px'
                };
                this.leftIndentSvg = this.createSvgElement('svg', attr);
                this.leftIndentSvg.setAttribute('fill', 'none');
                var pathattr = {
                    style: 'position:inherit;left:0px'
                };
                this.leftIndentPath = this.createSvgElement('path', pathattr);
                this.leftIndentPath.setAttribute('class', 'e-de-ruler-indent-svg');
                this.leftIndentPath.setAttribute('d', 'M 0.5 3.5 H 11.5 V 0.5 H 0.5 V 3.5 Z');
                this.leftIndentPath.setAttribute('fill', 'white');
                this.leftIndentPath.setAttribute('stroke', '#A1A1A1');
                this.leftIndentSvg.appendChild(this.leftIndentPath);
                this.leftIndent.appendChild(this.leftIndentSvg);
                this.hRuler.append(this.leftIndent);
                this.leftIndent.addEventListener('dblclick', this.onDoubleClickHandler);
                this.indentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.leftIndent.style.left);
                var initialValue2 = editor_helper_1.HelperMethods.getNumberFromString(this.leftIndent.style.left);
                this.leftIndent.addEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.leftIndent.addEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.leftIndent.addEventListener('mousedown', this.onLeftIndentMouseDownHandler);
                document.addEventListener('mousemove', this.onLeftIndentMouseMoveHandler);
                document.addEventListener('mouseup', this.onLeftIndentMouseUpHandler);
            }
            this.rightIndent = document.getElementById(documentEditor.element.id + '_rightIndent');
            if (!this.rightIndent) {
                var margin = ('left:' + (documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.width - editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin) - 6) + 'px;');
                var style = 'height:7px;top:8px;overflow:hidden;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 4;' + margin;
                var attributes = {
                    'id': documentEditor.element.id + '_rightIndent',
                    style: style,
                    class: 'e-de-ruler-indent'
                };
                this.rightIndent = this.createHtmlElement('div', attributes);
                this.rightIndent.setAttribute('title', locale.getConstant('Right Indent'));
                var attr = {
                    'id': documentEditor.element.id + '_rightIndent_svg',
                    width: rulerSize.width + 'px',
                    height: '7px',
                    style: 'position:inherit;left:0px'
                };
                this.rightIndentSvg = this.createSvgElement('svg', attr);
                this.rightIndentSvg.setAttribute('fill', 'none');
                var pathattr = {
                    style: 'position:inherit;left:0px'
                };
                this.rightIndentPath = this.createSvgElement('path', pathattr);
                this.rightIndentPath.setAttribute('class', 'e-de-ruler-indent-svg');
                this.rightIndentPath.setAttribute('d', 'M 0.5 6.5 H 11.5 V 4.2872 L 6 1.5789 L 0.5 4.2872 V 6.5 Z');
                this.rightIndentPath.setAttribute('fill', 'white');
                this.rightIndentPath.setAttribute('stroke', '#A1A1A1');
                this.rightIndentSvg.appendChild(this.rightIndentPath);
                this.rightIndent.appendChild(this.rightIndentSvg);
                this.hRuler.append(this.rightIndent);
                this.rightIndent.addEventListener('dblclick', this.onDoubleClickHandler);
                this.indentInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.rightIndent.style.left);
                var initialValue2 = editor_helper_1.HelperMethods.getNumberFromString(this.rightIndent.style.left);
                this.rightIndent.addEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.rightIndent.addEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.rightIndent.addEventListener('mousedown', this.onRightIndentMouseDownHandler);
                document.addEventListener('mousemove', this.onRightIndentMouseMoveHandler);
                document.addEventListener('mouseup', this.onRightIndentMouseUpHandler);
            }
            this.updateIndentMarkers(documentEditor);
        };
        RulerHelper.prototype.updateRuler = function (documentEditor, rerenderRuler) {
            if (documentEditor.isDestroyed || documentEditor.rulerHelper && documentEditor.documentEditorSettings && !documentEditor.documentEditorSettings.showRuler ||
                documentEditor.isReadOnlyMode) {
                return;
            }
            var hOffset = 0;
            Iif (ej2_base_1.isNullOrUndefined(documentEditor.hRuler) && ej2_base_1.isNullOrUndefined(documentEditor.vRuler)) {
                return;
            }
            if (documentEditor.selectionModule.isForward) {
                this.position = documentEditor.selectionModule.start;
            }
            else {
                this.position = documentEditor.selectionModule.end;
            }
            this.updateRulerDimension(documentEditor, documentEditor.hRuler, hOffset, rerenderRuler);
            this.updateRulerDimension(documentEditor, documentEditor.vRuler, hOffset, rerenderRuler);
            this.updateRulerMargins(documentEditor);
            this.updateIndentMarkers(documentEditor);
            this.updateTabStopMarkers(documentEditor);
            Iif (this.position.paragraph.isInsideTable) {
                this.updateTableMarkers(documentEditor, documentEditor.hRuler);
            }
            else {
                this.removeTableMarkers(documentEditor, documentEditor.hRuler);
            }
            this.updateIndicatorLines(documentEditor);
        };
        RulerHelper.prototype.removeTableMarkers = function (documentEditor, ruler) {
            var renderedTableMarkers = editor_helper_1.HelperMethods.convertNodeListToArray(document.querySelectorAll('.e-de-ruler-table-marker'));
            Eif (!ej2_base_1.isNullOrUndefined(renderedTableMarkers)) {
                for (var i = 0; i < renderedTableMarkers.length; i++) {
                    var elementToRemove = renderedTableMarkers[parseInt(i.toString(), 10)];
                    if (!ej2_base_1.isNullOrUndefined(elementToRemove)) {
                        elementToRemove.parentNode.removeChild(elementToRemove);
                    }
                }
            }
        };
        RulerHelper.prototype.updateTableMarkers = function (documentEditor, ruler) {
            var renderedTableMarkers = editor_helper_1.HelperMethods.convertNodeListToArray(document.querySelectorAll('.e-de-ruler-table-marker'));
            if (ej2_base_1.isNullOrUndefined(renderedTableMarkers)) {
                this.renderTableMarkers(documentEditor, ruler);
            }
            else if (this.position.paragraph.isInsideTable) {
                this.renderTableMarkers(documentEditor, ruler);
            }
        };
        RulerHelper.prototype.renderTableMarkers = function (documentEditor, ruler) {
            var _this = this;
            this.removeTableMarkers(documentEditor, documentEditor.hRuler);
            var intialPosition;
            var tablewidget = this.position.paragraph.containerWidget.ownerTable;
            var tableRowWidget = this.position.paragraph.associatedCell.ownerRow.clone();
            var cellWidgets = tableRowWidget.childWidgets;
            var value = this.position.paragraph.associatedCell.ownerTable.tableFormat.bidi ? cellWidgets.length : 0;
            if (this.position.paragraph.associatedCell.ownerTable.tableFormat.bidi) {
                cellWidgets.reverse();
            }
            var tableXPos;
            this.hRuler = document.getElementById(documentEditor.element.id + '_hRuler');
            var _loop_1 = function (i) {
                var tableMarker = document.getElementById(documentEditor.element.id + '_tableMarker_' + value);
                var margin = void 0;
                if (i === 0) {
                    tableXPos = (cellWidgets[parseInt(i.toString(), 10)].x
                        - cellWidgets[parseInt(i.toString(), 10)].margin.left)
                        * documentEditor.zoomFactor + this_1.hRuler.scrollLeft;
                    margin = ('left:' + (tableXPos - 4) + 'px;');
                }
                else {
                    tableXPos = tableXPos + ((cellWidgets[i - 1].width
                        + cellWidgets[i - 1].margin.left
                        + cellWidgets[i - 1].margin.right) * documentEditor.zoomFactor);
                    margin = 'left:' + (tableXPos - 4) + 'px;';
                }
                var style = 'height:' + (ruler.thickness) + 'px;overflow:hidden;width:10px;position:absolute;font-size:11px;text-align: left;z-index: 4;' + margin;
                var attributes = {
                    'id': documentEditor.element.id + '_tableMarker_' + value,
                    'class': 'e-de-ruler-table-marker',
                    style: style
                };
                tableMarker = this_1.createHtmlElement('div', attributes);
                var locale = new ej2_base_1.L10n('documenteditor', documentEditor.defaultLocale);
                tableMarker.setAttribute('title', locale.getConstant('Move Table Column'));
                var attr = {
                    'id': documentEditor.element.id + '_tableMarker_svg' + i,
                    width: 9 + 'px',
                    height: 11 + 'px',
                    style: 'position:inherit;left:0px;top:3px;'
                };
                var svg = this_1.createSvgElement('svg', attr);
                svg.setAttribute('fill', 'none');
                var pathattr = {
                    style: 'position:inherit;left:0px;'
                };
                var pathElement = this_1.createSvgElement('path', pathattr);
                pathElement.setAttribute('class', 'e-de-ruler-table-svg');
                pathElement.setAttribute('d', 'M1 1V0H2V1H3V0H4V1H5V0H6V1H7V2H6V3H7V4H6V5H7V6H6V7H7V8H0V7H1V6H0V5H1V4H0V3H1V2H0V1H1ZM2 2V3H3V2H2ZM4 2V3H5V2H4ZM5 4H4V5H5V4ZM5 6H4V7H5V6ZM3 7V6H2V7H3ZM2 5H3V4H2V5Z');
                pathElement.setAttribute('fill', '#A1A1A1');
                svg.appendChild(pathElement);
                tableMarker.appendChild(svg);
                this_1.hRuler.append(tableMarker);
                if (this_1.position.paragraph.associatedCell.ownerTable.tableFormat.bidi) {
                    value--;
                }
                else {
                    value++;
                }
                tableMarker.addEventListener('dblclick', function (event) {
                    documentEditor.showDialog('TableProperties');
                    event.stopPropagation();
                });
                var tableMarkerOffset;
                tableMarker.addEventListener('mousedown', function (e) {
                    tableMarkerOffset = e.clientX - tableMarker.getBoundingClientRect().left;
                    documentEditor.startXPosition = editor_helper_1.HelperMethods.convertPixelToPoint(e.clientX);
                    documentEditor.isTableMarkerDragging = true;
                    var cursorPoint = new editor_helper_1.Point(e.clientX, e.clientY);
                    var touchPoint = documentEditor.viewer.findFocusedPage(cursorPoint, true, true);
                    var currentMarkerPostion;
                    if (e.currentTarget instanceof HTMLElement) {
                        var parts = e.currentTarget.id.split('_');
                        var value_1 = parts[parts.length - 1];
                        currentMarkerPostion = parseInt(value_1, 10);
                    }
                    var tableWidget = documentEditor.selectionModule.end.paragraph.containerWidget.ownerTable;
                    documentEditor.editorModule.tableResize.currentResizingTable = tableWidget;
                    documentEditor.editorModule.tableResize.resizeNode = 0;
                    documentEditor.editorModule.tableResize.resizerPosition = currentMarkerPostion;
                    documentEditor.editorModule.tableResize.startingPoint.x = touchPoint.x;
                    documentEditor.editorModule.tableResize.startingPoint.y = touchPoint.y;
                    documentEditor.editorHistoryModule.initResizingHistory(touchPoint, documentEditor.editorModule.tableResize);
                    var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - documentEditor.selectionModule.sectionFormat.leftMargin) * documentEditor.zoomFactor;
                    var value = rulerZeroPoint + e.clientX - tableMarkerOffset - _this.hRuler.getBoundingClientRect().left;
                    var startValue = documentEditor.documentHelper.currentPage.boundingRectangle.x;
                    var indicatorLineValue = startValue + (value - rulerZeroPoint) + 6;
                    var lineSvg = document.getElementById(documentEditor.element.id + '_hRuler_indicator_svg');
                    lineSvg.style.left = (indicatorLineValue - 6) + 'px';
                    lineSvg.style.display = 'block';
                });
                document.addEventListener('mousemove', function (e) {
                    if (documentEditor.isDestroyed || !documentEditor.documentEditorSettings.showRuler) {
                        return;
                    }
                    if (documentEditor.isTableMarkerDragging) {
                        _this.hRuler = document.getElementById(documentEditor.element.id + '_hRuler');
                        var rulerZeroPoint = editor_helper_1.HelperMethods.convertPointToPixel(1584 - documentEditor.selectionModule.sectionFormat.leftMargin) * documentEditor.zoomFactor;
                        if (documentEditor.selectionModule.end.paragraph.associatedCell.ownerTable.tableFormat.bidi) {
                            var rulerGeometry = _this.getRulerGeometry(documentEditor);
                            var rulerMarginDivWidth = (rulerGeometry.width - (editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin * documentEditor.zoomFactor)
                                + (documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin
                                    * documentEditor.zoomFactor))));
                            rulerZeroPoint -= rulerMarginDivWidth;
                        }
                        var value_2 = rulerZeroPoint + e.clientX - tableMarkerOffset - _this.hRuler.getBoundingClientRect().left;
                        tableMarker.style.left = value_2 + 'px';
                        var startValue = documentEditor.documentHelper.currentPage.boundingRectangle.x;
                        var indicatorLineValue = startValue + (value_2 - rulerZeroPoint) + 6;
                        var lineSvg = document.getElementById(documentEditor.element.id + '_hRuler_indicator_svg');
                        lineSvg.style.left = (indicatorLineValue - 6) + 'px';
                    }
                });
                document.addEventListener('mouseup', function (e) {
                    if (documentEditor.isDestroyed || !documentEditor.documentEditorSettings.showRuler) {
                        return;
                    }
                    if (documentEditor.isTableMarkerDragging) {
                        var cursorPoint = new editor_helper_1.Point(e.clientX, e.clientY);
                        var dragValue = _this.position.paragraph.associatedCell.ownerTable.tableFormat.bidi ?
                            (documentEditor.startXPosition - editor_helper_1.HelperMethods.convertPixelToPoint(e.clientX))
                            : (editor_helper_1.HelperMethods.convertPixelToPoint(e.clientX) - documentEditor.startXPosition);
                        documentEditor.editorModule.tableResize.handleResizing(cursorPoint, true, (dragValue / documentEditor.zoomFactor));
                        documentEditor.editorModule.tableResize.updateResizingHistory(documentEditor.viewer.findFocusedPage(cursorPoint, true, true));
                        documentEditor.isTableMarkerDragging = false;
                        var lineSvg = document.getElementById(documentEditor.element.id + '_hRuler_indicator_svg');
                        lineSvg.style.display = 'none';
                    }
                });
            };
            var this_1 = this;
            for (var i = 0; i <= cellWidgets.length; i++) {
                _loop_1(i);
            }
        };
        RulerHelper.prototype.updateRulerDimension = function (documentEditor, ruler, offset, rerenderRuler) {
            var isHorizontal = ruler.orientation === 'Horizontal' ? true : false;
            var rulerSize = this.getRulerSize(documentEditor);
            var rulerGeometry = this.getRulerGeometry(documentEditor);
            this.updateRulerDiv(documentEditor, rulerGeometry, isHorizontal, ruler);
            this.updateRulerSpace(documentEditor, rulerGeometry, isHorizontal, ruler);
            this.updateMargin(ruler, documentEditor, isHorizontal);
            ruler.length = documentEditor.zoomFactor < 1 ?
                ((ruler.zeroPosition * 2) / documentEditor.zoomFactor)
                : ((ruler.zeroPosition * 2) * documentEditor.zoomFactor);
            var rulerObj = ruler.element;
            if (isHorizontal) {
                rulerObj.style.marginLeft = (documentEditor.layoutType === 'Pages' ? documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.x : 0) + 'px';
            }
            else {
                rulerObj.parentElement.style.display = documentEditor.layoutType === 'Pages' ? 'block' : 'none';
                rulerObj.style.marginTop = documentEditor.selectionModule.getPageTop(documentEditor.selectionModule.end.paragraph.bodyWidget.page) + 'px';
            }
            Iif (rerenderRuler) {
                ruler.offset = offset;
                ruler.scale = documentEditor.zoomFactor;
                ruler.length = documentEditor.zoomFactor < 1 ?
                    ((ruler.zeroPosition * 2) / documentEditor.zoomFactor)
                    : ((ruler.zeroPosition * 2) * documentEditor.zoomFactor);
                ruler.updateRuler();
            }
            if (isHorizontal) {
                Eif (documentEditor.layoutType === 'Pages') {
                    var paraBidi = this.position.paragraph.paragraphFormat.bidi;
                    var tableBidi = false;
                    Iif (this.position.paragraph.isInsideTable) {
                        tableBidi = this.position.paragraph.associatedCell.ownerTable.tableFormat.bidi;
                    }
                    Iif (paraBidi || tableBidi) {
                        var rulerMarginDivWidth = (rulerGeometry.width - (editor_helper_1.HelperMethods.convertPointToPixel((documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin * documentEditor.zoomFactor))));
                        rulerObj.scrollLeft = (documentEditor.hRuler.zeroPosition * documentEditor.zoomFactor) - rulerMarginDivWidth;
                    }
                    else {
                        rulerObj.scrollLeft = (ruler.zeroPosition - editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin)) * documentEditor.zoomFactor;
                    }
                }
                else {
                    var paraBidi = this.position.paragraph.paragraphFormat.bidi;
                    var tableBidi = false;
                    if (this.position.paragraph.isInsideTable) {
                        tableBidi = this.position.paragraph.associatedCell.ownerTable.tableFormat.bidi;
                    }
                    if (paraBidi || tableBidi) {
                        rulerObj.scrollLeft = ((ruler.zeroPosition - documentEditor.viewer.clientActiveArea.width)
                            * documentEditor.zoomFactor) - 20;
                    }
                    else {
                        rulerObj.scrollLeft = (ruler.zeroPosition * documentEditor.zoomFactor) - 20;
                    }
                }
            }
            else {
                rulerObj.scrollTop = (ruler.zeroPosition - editor_helper_1.HelperMethods.convertPointToPixel(documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin)) * documentEditor.zoomFactor;
            }
        };
        RulerHelper.prototype.updateRulerSpace = function (documentEditor, rulerGeometry, isHorizontal, ruler) {
            this.rulerSpaceDiv = document.getElementById(documentEditor.element.id + (isHorizontal ? '_hRuler_ruler_space' : '_vRuler_ruler_space'));
            Eif (this.rulerSpaceDiv && documentEditor && rulerGeometry) {
                this.rulerSpaceDiv.style.width = (isHorizontal ? (rulerGeometry.width + (ruler.segmentWidth * 2)) : ruler.thickness) + 'px';
                this.rulerSpaceDiv.style.height = (isHorizontal ? ruler.thickness : (rulerGeometry.height + (ruler.segmentWidth * 2))) + 'px';
            }
        };
        RulerHelper.prototype.updateRulerDiv = function (documentEditor, rulerGeometry, isHorizontal, ruler) {
            this.parentRulerDiv = document.getElementById(documentEditor.element.id + (isHorizontal ? '_hRuler' : '_vRuler'));
            Eif (this.parentRulerDiv && documentEditor && rulerGeometry) {
                this.parentRulerDiv.style.width = (isHorizontal ? documentEditor.layoutType === 'Continuous' ? rulerGeometry.width / documentEditor.zoomFactor : rulerGeometry.width : ruler.thickness) + 'px';
                this.parentRulerDiv.style.height = (isHorizontal ? ruler.thickness : rulerGeometry.height) + 'px';
                this.parentRulerDiv = document.getElementById(documentEditor.element.id + '_overlapRuler');
                Eif (this.parentRulerDiv) {
                    isHorizontal ? (this.parentRulerDiv.style.height === ruler.thickness + 'px') : (this.parentRulerDiv.style.width === ruler.thickness + 'px');
                }
            }
            if (isHorizontal) {
                Eif (this.hRulerBottom) {
                    var pageElement = document.getElementById(documentEditor.element.id + '_pageContainer');
                    this.hRulerBottom.style.width = pageElement.getBoundingClientRect().width + 'px';
                }
            }
        };
        RulerHelper.prototype.getRulerGeometry = function (documentEditor) {
            var rulerSize = this.getRulerSize(documentEditor);
            var height = (documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.height
                * documentEditor.zoomFactor);
            var width = (documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.width
                * documentEditor.zoomFactor);
            return new size_1.Size(width, height);
        };
        RulerHelper.prototype.getVerticalHeight = function (documentEditor) {
            var pageheight = editor_helper_1.HelperMethods.convertPixelToPoint(documentEditor.selectionModule.end.paragraph.bodyWidget.page.boundingRectangle.height);
            var containerHeight = documentEditor.element.getBoundingClientRect().height;
            if (pageheight < containerHeight) {
                return pageheight;
            }
            else {
                return containerHeight - documentEditor.documentHelper.pages[0].boundingRectangle.y;
            }
        };
        RulerHelper.prototype.renderTab = function (documentEditor, rulerSize, tabStop, tabJustification, i, locale) {
            this.hRuler = document.getElementById(documentEditor.element.id + '_hRuler');
            var zoomFactor = documentEditor.documentHelper.zoomFactor;
            var value;
            switch (tabJustification) {
                case 'Left': {
                    this.leftTab = document.getElementById(documentEditor.element.id + '_LeftTab' + '_' + i);
                    if (!this.leftTab) {
                        var style = '';
                        Iif (!ej2_base_1.isNullOrUndefined(tabStop)) {
                            value = this.position.paragraph.paragraphFormat.bidi ?
                                (editor_helper_1.HelperMethods.convertPointToPixel(1584 - tabStop.position))
                                : (editor_helper_1.HelperMethods.convertPointToPixel(1584 + tabStop.position));
                            var margin = ('left:' + ((value - 1.5) * zoomFactor) + 'px;');
                            style = 'height:9px;overflow:hidden;top:7px;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 4;' + margin;
                        }
                        var attributes = {
                            'id': documentEditor.element.id + '_LeftTab' + '_' + i,
                            'class': 'e-de-ruler-tab e-de-ruler-tab-left',
                            style: style,
                            'data-name': 'LeftTab'
                        };
                        this.leftTab = this.createHtmlElement('div', attributes);
                        this.leftTab.setAttribute('title', locale.getConstant('Left Tab'));
                        var attr = {
                            'id': documentEditor.element.id + '_leftTab_svg',
                            width: rulerSize.width / 2 + 'px',
                            height: rulerSize.height / 2 + 'px',
                            style: 'position:inherit;left:0px'
                        };
                        var svg = this.createSvgElement('svg', attr);
                        svg.setAttribute('fill', 'none');
                        var pathattr = {
                            style: 'position:inherit;left:0px'
                        };
                        var pathElement = this.createSvgElement('path', pathattr);
                        pathElement.setAttribute('class', 'e-de-ruler-tab-svg');
                        pathElement.setAttribute('d', 'M3 5H7V7H1V1H3V5Z');
                        pathElement.setAttribute('fill', '#605E5C');
                        pathElement.setAttribute('stroke', '#A1A1A1');
                        svg.appendChild(pathElement);
                        this.leftTab.appendChild(svg);
                        this.hRuler.append(this.leftTab);
                    }
                    break;
                }
                case 'Center': {
                    this.centerTab = document.getElementById(documentEditor.element.id + '_CenterTab' + '_' + i);
                    if (!this.centerTab) {
                        var style = '';
                        Iif (!ej2_base_1.isNullOrUndefined(tabStop)) {
                            value = this.position.paragraph.paragraphFormat.bidi ?
                                (editor_helper_1.HelperMethods.convertPointToPixel(1584 - tabStop.position))
                                : (editor_helper_1.HelperMethods.convertPointToPixel(1584 + tabStop.position));
                            var margin = ('left:' + ((value - 4) * zoomFactor) + 'px;');
                            style = 'height:9px;overflow:hidden;top:7px;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 4;' + margin;
                        }
                        var attributes = {
                            'id': documentEditor.element.id + '_CenterTab' + '_' + i,
                            'class': 'e-de-ruler-tab e-de-ruler-tab-center',
                            style: style,
                            'data-name': 'CenterTab'
                        };
                        this.centerTab = this.createHtmlElement('div', attributes);
                        this.centerTab.setAttribute('title', locale.getConstant('Center Tab'));
                        var attr = {
                            'id': documentEditor.element.id + '_centerTab_svg',
                            width: rulerSize.width / 2 + 'px',
                            height: rulerSize.height / 2 + 'px',
                            style: 'position:inherit;left:0px'
                        };
                        var svg = this.createSvgElement('svg', attr);
                        svg.setAttribute('fill', 'none');
                        var pathattr = {
                            style: 'position:inherit;left:0px'
                        };
                        var pathElement = this.createSvgElement('path', pathattr);
                        pathElement.setAttribute('class', 'e-de-ruler-tab-svg');
                        pathElement.setAttribute('d', 'M5 5H8V7H0V5H3V1H5V5Z');
                        pathElement.setAttribute('fill', '#605E5C');
                        pathElement.setAttribute('stroke', '#A1A1A1');
                        svg.appendChild(pathElement);
                        this.centerTab.appendChild(svg);
                        this.hRuler.append(this.centerTab);
                    }
                    break;
                }
                case 'Right': {
                    this.rightTab = document.getElementById(documentEditor.element.id + '_RightTab' + '_' + i);
                    if (!this.rightTab) {
                        var style = '';
                        Iif (!ej2_base_1.isNullOrUndefined(tabStop)) {
                            value = this.position.paragraph.paragraphFormat.bidi ?
                                (editor_helper_1.HelperMethods.convertPointToPixel(1584 - tabStop.position))
                                : (editor_helper_1.HelperMethods.convertPointToPixel(1584 + tabStop.position));
                            var margin = ('left:' + ((value - 5.5) * zoomFactor) + 'px;');
                            style = 'height:9px;overflow:hidden;top:7px;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 4;' + margin;
                        }
                        var attributes = {
                            'id': documentEditor.element.id + '_RightTab' + '_' + i,
                            'class': 'e-de-ruler-tab e-de-ruler-tab-right',
                            style: style,
                            'data-name': 'RightTab'
                        };
                        this.rightTab = this.createHtmlElement('div', attributes);
                        this.rightTab.setAttribute('title', locale.getConstant('Right Tab'));
                        var attr = {
                            'id': documentEditor.element.id + '_rightTab_svg',
                            width: rulerSize.width / 2 + 'px',
                            height: rulerSize.height / 2 + 'px',
                            style: 'position:inherit;left:0px'
                        };
                        var svg = this.createSvgElement('svg', attr);
                        svg.setAttribute('fill', 'none');
                        var pathattr = {
                            style: 'position:inherit;left:0px'
                        };
                        var pathElement = this.createSvgElement('path', pathattr);
                        pathElement.setAttribute('class', 'e-de-ruler-tab-svg');
                        pathElement.setAttribute('d', 'M5 5V1H7V7H1V5H5Z');
                        pathElement.setAttribute('fill', '#605E5C');
                        pathElement.setAttribute('stroke', '#A1A1A1');
                        svg.appendChild(pathElement);
                        this.rightTab.appendChild(svg);
                        this.hRuler.append(this.rightTab);
                    }
                    break;
                }
                case 'Decimal': {
                    this.decimalTab = document.getElementById(documentEditor.element.id + '_DecimalTab' + '_' + i);
                    if (!this.decimalTab) {
                        var style = '';
                        Iif (!ej2_base_1.isNullOrUndefined(tabStop)) {
                            value = this.position.paragraph.paragraphFormat.bidi ?
                                (editor_helper_1.HelperMethods.convertPointToPixel(1584 - tabStop.position))
                                : (editor_helper_1.HelperMethods.convertPointToPixel(1584 + tabStop.position));
                            var margin = ('left:' + ((value * zoomFactor) - 4) + 'px;');
                            style = 'height:9px;overflow:hidden;top:7px;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 4;' + margin;
                        }
                        var attributes = {
                            'id': documentEditor.element.id + '_DecimalTab' + '_' + i,
                            'class': 'e-de-ruler-tab e-de-ruler-tab-decimal',
                            style: style,
                            'data-name': 'DecimalTab'
                        };
                        this.decimalTab = this.createHtmlElement('div', attributes);
                        this.decimalTab.setAttribute('title', locale.getConstant('Decimal Tab'));
                        var attr = {
                            'id': documentEditor.element.id + '_decimalTab_svg',
                            width: rulerSize.width / 2 + 'px',
                            height: rulerSize.height / 2 + 'px',
                            style: 'position:inherit;left:0px'
                        };
                        var svg = this.createSvgElement('svg', attr);
                        svg.setAttribute('fill', 'none');
                        var pathattr = {
                            style: 'position:inherit;left:0px'
                        };
                        var pathElement = this.createSvgElement('path', pathattr);
                        pathElement.setAttribute('class', 'e-de-ruler-tab-svg');
                        pathElement.setAttribute('d', 'M6 0H4V6H0V8H4H6H10V6H6V0Z');
                        pathElement.setAttribute('fill', '#605E5C');
                        pathElement.setAttribute('clip-rule', 'evenodd');
                        pathElement.setAttribute('fill-rule', 'evenodd');
                        pathElement.setAttribute('stroke', '#A1A1A1');
                        svg.appendChild(pathElement);
                        this.decimalTab.appendChild(svg);
                        this.hRuler.append(this.decimalTab);
                    }
                    break;
                }
                case 'Bar': {
                    this.barTab = document.getElementById(documentEditor.element.id + '_BarTab' + '_' + i);
                    if (!this.barTab) {
                        var style = '';
                        Iif (!ej2_base_1.isNullOrUndefined(tabStop)) {
                            value = this.position.paragraph.paragraphFormat.bidi ?
                                (editor_helper_1.HelperMethods.convertPointToPixel(1584 - tabStop.position))
                                : (editor_helper_1.HelperMethods.convertPointToPixel(1584 + tabStop.position));
                            var margin = ('left:' + ((value - 1.5) * zoomFactor) + 'px;');
                            style = 'height:9px;overflow:hidden;top:7px;width:12px;position:absolute;font-size:11px;text-align: left;z-index: 4;' + margin;
                        }
                        var attributes = {
                            'id': documentEditor.element.id + '_BarTab' + '_' + i,
                            'class': 'e-de-ruler-tab e-de-ruler-tab-bar',
                            style: style,
                            'data-name': 'BarTab'
                        };
                        this.barTab = this.createHtmlElement('div', attributes);
                        this.barTab.setAttribute('title', locale.getConstant('Bar Tab'));
                        var attr = {
                            'id': documentEditor.element.id + '_barTab_svg',
                            width: rulerSize.width / 2 + 'px',
                            height: rulerSize.height / 2 + 'px',
                            style: 'position:inherit;left:0px'
                        };
                        var svg = this.createSvgElement('svg', attr);
                        svg.setAttribute('fill', 'none');
                        var rectAttr = {
                            style: 'position:inherit;left:0px'
                        };
                        var rect = this.createSvgElement('rect', rectAttr);
                        rect.setAttribute('width', '2');
                        rect.setAttribute('height', '8');
                        rect.setAttribute('fill', '#605E5C');
                        rect.setAttribute('stroke', '#A1A1A1');
                        svg.appendChild(rect);
                        this.barTab.appendChild(svg);
                        this.hRuler.append(this.barTab);
                    }
                    break;
                }
            }
            Iif (!ej2_base_1.isNullOrUndefined(tabStop)) {
                this.tabStopElement = document.getElementById(documentEditor.element.id + '_' + tabJustification + 'Tab' + '_' + i);
                if (!ej2_base_1.isNullOrUndefined(tabStop)) {
                    this.tabStopElement.addEventListener('dblclick', this.onTabStopDblClickHandler);
                }
                this.tabInitialValue = editor_helper_1.HelperMethods.getNumberFromString(this.tabStopElement.style.left);
                var initialValue2 = editor_helper_1.HelperMethods.getNumberFromString(this.tabStopElement.style.left);
                this.justification = this.tabStopElement.getAttribute('data-name');
                this.currrentParagraph = this.position.paragraph;
                this.tabStopElement.addEventListener('mousedown', this.onTabStopMouseDownHandler);
                this.tabStopElement.addEventListener('mouseup', this.onTabStopMouseUpHandler);
                document.addEventListener('mousemove', this.onTabStopMouseMoveHandler);
                document.addEventListener('mouseup', this.onRenderTabStopMouseUpHandler);
            }
        };
        RulerHelper.prototype.updateMargin = function (ruler, documentEditor, isHorizontal) {
            if (isHorizontal) {
                ruler.startMargin = documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.leftMargin;
                ruler.endMargin = documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.rightMargin;
            }
            else {
                ruler.startMargin = documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.topMargin;
                ruler.endMargin = documentEditor.selectionModule.end.paragraph.bodyWidget.sectionFormat.bottomMargin;
            }
        };
        RulerHelper.prototype.getTabJustification = function (dataNameValue) {
            switch (dataNameValue) {
                case 'LeftTab':
                    return 'Left';
                case 'CenterTab':
                    return 'Center';
                case 'RightTab':
                    return 'Right';
                case 'DecimalTab':
                    return 'Decimal';
                case 'BarTab':
                    return 'Bar';
            }
            return 'Left';
        };
        RulerHelper.prototype.getRulerSize = function (documentEditor) {
            var top = 0;
            var left = 0;
            top = 15;
            left = 15;
            return new size_1.Size(left, top);
        };
        RulerHelper.prototype.destroy = function () {
            this.unWireEvents();
            this.removeHTMLElements();
            this.removeSvgElements();
        };
        RulerHelper.prototype.removeHTMLElements = function () {
            var _this = this;
            if (this.tabStopStwitch) {
                this.tabStopStwitch.remove();
                this.tabStopStwitch = null;
            }
            if (this.hRulerBottom) {
                this.hRulerBottom.remove();
                this.hRulerBottom = null;
            }
            if (this.vRulerBottom) {
                this.vRulerBottom.remove();
                this.vRulerBottom = null;
            }
            if (this.overlap) {
                this.overlap.remove();
                this.overlap = null;
            }
            if (this.markIndicator) {
                this.markIndicator.remove();
                this.markIndicator = null;
            }
            if (this.rulerDiv) {
                this.rulerDiv.remove();
                this.rulerDiv = null;
            }
            if (this.rulerOverlap) {
                this.rulerOverlap.remove();
                this.rulerOverlap = null;
            }
            if (this.rulerMarginDiv) {
                this.rulerMarginDiv.remove();
                this.rulerMarginDiv = null;
            }
            if (this.verticalRulerMarginDiv) {
                this.verticalRulerMarginDiv.remove();
                this.verticalRulerMarginDiv = null;
            }
            if (this.firstLineIndent) {
                this.firstLineIndent.remove();
                this.firstLineIndent = null;
            }
            if (this.hangingIndent) {
                this.hangingIndent.remove();
                this.hangingIndent = null;
            }
            if (this.leftIndent) {
                this.leftIndent.remove();
                this.leftIndent = null;
            }
            if (this.rightIndent) {
                this.rightIndent.remove();
                this.rightIndent = null;
            }
            if (this.parentRulerDiv) {
                this.parentRulerDiv.remove();
                this.parentRulerDiv = null;
            }
            if (this.rulerSpaceDiv) {
                this.rulerSpaceDiv.remove();
                this.rulerSpaceDiv = null;
            }
            if (this.firstLineIndentRuler) {
                this.firstLineIndentRuler.remove();
                this.firstLineIndentRuler = null;
            }
            if (this.hangingIndentRuler) {
                this.hangingIndentRuler.remove();
                this.hangingIndentRuler = null;
            }
            if (this.leftTab) {
                this.leftTab.childNodes.forEach(function (element) {
                    _this.leftTab.removeChild(element);
                    element = null;
                });
                this.leftTab.innerHTML = '';
                this.leftTab.remove();
                this.leftTab = null;
            }
            if (this.rightTab) {
                this.rightTab.childNodes.forEach(function (element) {
                    _this.rightTab.removeChild(element);
                    element = null;
                });
                this.rightTab.innerHTML = '';
                this.rightTab.remove();
                this.rightTab = null;
            }
            if (this.centerTab) {
                this.centerTab.childNodes.forEach(function (element) {
                    _this.centerTab.removeChild(element);
                    element = null;
                });
                this.centerTab.innerHTML = '';
                this.centerTab.remove();
                this.centerTab = null;
            }
            if (this.decimalTab) {
                this.decimalTab.childNodes.forEach(function (element) {
                    _this.decimalTab.removeChild(element);
                    element = null;
                });
                this.decimalTab.innerHTML = '';
                this.decimalTab.remove();
                this.decimalTab = null;
            }
            if (this.barTab) {
                this.barTab.childNodes.forEach(function (element) {
                    _this.barTab.removeChild(element);
                    element = null;
                });
                this.barTab.innerHTML = '';
                this.barTab.remove();
                this.barTab = null;
            }
            if (this.vRuler) {
                this.vRuler.childNodes.forEach(function (element) {
                    _this.vRuler.removeChild(element);
                    element = null;
                });
                this.vRuler.innerHTML = '';
                this.vRuler.remove();
                this.vRuler = null;
            }
            if (this.hRuler) {
                this.hRuler.childNodes.forEach(function (element) {
                    _this.hRuler.removeChild(element);
                    element = null;
                });
                this.hRuler.innerHTML = '';
                this.hRuler.remove();
                this.hRuler = null;
            }
        };
        RulerHelper.prototype.removeSvgElements = function () {
            if (this.hSvg) {
                this.hSvg.remove();
                this.hSvg = null;
            }
            if (this.vLine) {
                this.vLine.remove();
                this.vLine = null;
            }
            if (this.vSvg) {
                this.vSvg.remove();
                this.vSvg = null;
            }
            if (this.hLine) {
                this.hLine.remove();
                this.hLine = null;
            }
            if (this.firstLineIndentSvg) {
                this.firstLineIndentSvg.remove();
                this.firstLineIndentSvg = null;
            }
            if (this.firstLineIndentPath) {
                this.firstLineIndentPath.remove();
                this.firstLineIndentPath = null;
            }
            if (this.hangingIndentSvg) {
                this.hangingIndentSvg.remove();
                this.hangingIndentSvg = null;
            }
            if (this.hangingIndentPath) {
                this.hangingIndentPath.remove();
                this.hangingIndentPath = null;
            }
            if (this.rightIndentSvg) {
                this.rightIndentSvg.remove();
                this.rightIndentSvg = null;
            }
            if (this.rightIndentPath) {
                this.rightIndentPath.remove();
                this.rightIndentPath = null;
            }
            if (this.leftIndentSvg) {
                this.leftIndentSvg.remove();
                this.leftIndentSvg = null;
            }
            if (this.leftIndentPath) {
                this.leftIndentPath.remove();
                this.leftIndentPath = null;
            }
        };
        RulerHelper.prototype.unWireEvents = function () {
            if (this.markIndicator) {
                this.markIndicator.removeEventListener('click', this.onmarkIndicatorClickHandler);
            }
            if (this.rulerDiv) {
                this.rulerDiv.removeEventListener('dblclick', this.onRulerDblClickHandler);
            }
            if (this.hRuler) {
                this.hRuler.removeEventListener('mouseenter', this.onHRulerMouseEnterHandler);
                this.hRuler.removeEventListener('mouseleave', this.onHRulerMouseLeaveHandler);
                this.hRuler.removeEventListener('mousedown', this.onHRulerMouseDownHandler);
                this.hRuler.removeEventListener('mouseup', this.onHRulerMouseUpHandler);
            }
            if (this.vRuler) {
                this.vRuler.removeEventListener('mousedown', this.onVMouseDownHandler);
            }
            if (this.firstLineIndent) {
                this.firstLineIndent.removeEventListener('dblclick', this.onDoubleClickHandler);
                this.firstLineIndent.removeEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.firstLineIndent.removeEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.firstLineIndent.removeEventListener('mousedown', this.onFirstLineIndentMouseDownHandler);
            }
            document.removeEventListener('mousemove', this.onHorizontalRulerMouseMoveHandler);
            document.removeEventListener('mouseup', this.onRulerMouseUpHandler);
            document.removeEventListener('mousemove', this.onVMouseMoveHandler);
            document.removeEventListener('mouseup', this.onVMouseUpHandler);
            document.removeEventListener('mousemove', this.onIndentMouseMoveHandler);
            document.removeEventListener('mouseup', this.onIndentMouseUpHandler);
            if (this.leftIndent) {
                this.leftIndent.removeEventListener('dblclick', this.onDoubleClickHandler);
                this.leftIndent.removeEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.leftIndent.removeEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.leftIndent.removeEventListener('mousedown', this.onLeftIndentMouseDownHandler);
            }
            document.removeEventListener('mousemove', this.onLeftIndentMouseMoveHandler);
            document.removeEventListener('mouseup', this.onLeftIndentMouseUpHandler);
            if (this.hangingIndent) {
                this.hangingIndent.removeEventListener('dblclick', this.onDoubleClickHandler);
                this.hangingIndent.removeEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.hangingIndent.removeEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.hangingIndent.removeEventListener('mousedown', this.onHangIndentMouseDownHandler);
            }
            document.removeEventListener('mousemove', this.onHangIndentMouseMoveHandler);
            document.removeEventListener('mouseup', this.onHangIndentMouseUpHandler);
            if (this.rightIndent) {
                this.rightIndent.removeEventListener('dblclick', this.onDoubleClickHandler);
                this.rightIndent.removeEventListener('mouseenter', this.onDocumentIntentTrueChangeHandler);
                this.rightIndent.removeEventListener('mouseleave', this.onDocumentIntentFalseChangeHandler);
                this.rightIndent.removeEventListener('mousedown', this.onRightIndentMouseDownHandler);
            }
            document.removeEventListener('mousemove', this.onRightIndentMouseMoveHandler);
            document.removeEventListener('mouseup', this.onRightIndentMouseUpHandler);
            Iif (this.tabStopElement) {
                this.tabStopElement.removeEventListener('dblclick', this.onTabStopDblClickHandler);
                this.tabStopElement.removeEventListener('mousedown', this.onTabStopMouseDownHandler);
                this.tabStopElement.removeEventListener('mouseup', this.onTabStopMouseUpHandler);
            }
            document.removeEventListener('mousemove', this.onTabStopMouseMoveHandler);
            document.removeEventListener('mouseup', this.onRenderTabStopMouseUpHandler);
            this.onmarkIndicatorClickHandler = undefined;
        };
        return RulerHelper;
    }());
    exports.RulerHelper = RulerHelper;
});