This file is indexed.

/usr/lib/thunderbird-addons/extensions/{e2fda1a4-762b-4020-b5ad-a41df1933103}/chrome/calendar/content/calendar/calendar-multiday-view.xml is in xul-ext-lightning 1:24.4.0+build1-0ubuntu1.

This file is owned by root:root, with mode 0o644.

The actual contents of the file can be viewed below.

   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
2610
2611
2612
2613
2614
2615
2616
2617
2618
2619
2620
2621
2622
2623
2624
2625
2626
2627
2628
2629
2630
2631
2632
2633
2634
2635
2636
2637
2638
2639
2640
2641
2642
2643
2644
2645
2646
2647
2648
2649
2650
2651
2652
2653
2654
2655
2656
2657
2658
2659
2660
2661
2662
2663
2664
2665
2666
2667
2668
2669
2670
2671
2672
2673
2674
2675
2676
2677
2678
2679
2680
2681
2682
2683
2684
2685
2686
2687
2688
2689
2690
2691
2692
2693
2694
2695
2696
2697
2698
2699
2700
2701
2702
2703
2704
2705
2706
2707
2708
2709
2710
2711
2712
2713
2714
2715
2716
2717
2718
2719
2720
2721
2722
2723
2724
2725
2726
2727
2728
2729
2730
2731
2732
2733
2734
2735
2736
2737
2738
2739
2740
2741
2742
2743
2744
2745
2746
2747
2748
2749
2750
2751
2752
2753
2754
2755
2756
2757
2758
2759
2760
2761
2762
2763
2764
2765
2766
2767
2768
2769
2770
2771
2772
2773
2774
2775
2776
2777
2778
2779
2780
2781
2782
2783
2784
2785
2786
2787
2788
2789
2790
2791
2792
2793
2794
2795
2796
2797
2798
2799
2800
2801
2802
2803
2804
2805
2806
2807
2808
2809
2810
2811
2812
2813
2814
2815
2816
2817
2818
2819
2820
2821
2822
2823
2824
2825
2826
2827
2828
2829
2830
2831
2832
2833
2834
2835
2836
2837
2838
2839
2840
2841
2842
2843
2844
2845
2846
2847
2848
2849
2850
2851
2852
2853
2854
2855
2856
2857
2858
2859
2860
2861
2862
2863
2864
2865
2866
2867
2868
2869
2870
2871
2872
2873
2874
2875
2876
2877
2878
2879
2880
2881
2882
2883
2884
2885
2886
2887
2888
2889
2890
2891
2892
2893
2894
2895
2896
2897
2898
2899
2900
2901
2902
2903
2904
2905
2906
2907
2908
2909
2910
2911
2912
2913
2914
2915
2916
2917
2918
2919
2920
2921
2922
2923
2924
2925
2926
2927
2928
2929
2930
2931
2932
2933
2934
2935
2936
2937
2938
2939
2940
2941
2942
2943
2944
2945
2946
2947
2948
2949
2950
2951
2952
2953
2954
2955
2956
2957
2958
2959
2960
2961
2962
2963
2964
2965
2966
2967
2968
2969
2970
2971
2972
2973
2974
2975
2976
2977
2978
2979
2980
2981
2982
2983
2984
2985
2986
2987
2988
2989
2990
2991
2992
2993
2994
2995
2996
2997
2998
2999
3000
3001
3002
3003
3004
3005
3006
3007
3008
3009
3010
3011
3012
3013
3014
3015
3016
3017
3018
3019
3020
3021
3022
3023
3024
3025
3026
3027
3028
3029
3030
3031
3032
3033
3034
3035
3036
3037
3038
3039
3040
3041
3042
3043
3044
3045
3046
3047
3048
3049
3050
3051
3052
3053
3054
3055
3056
3057
3058
3059
3060
3061
3062
3063
3064
3065
3066
3067
3068
3069
3070
3071
3072
3073
3074
3075
3076
3077
3078
3079
3080
3081
3082
3083
3084
3085
3086
3087
3088
3089
3090
3091
3092
3093
3094
3095
3096
3097
3098
3099
3100
3101
3102
3103
3104
3105
3106
3107
3108
3109
3110
3111
3112
3113
3114
3115
3116
3117
3118
3119
3120
3121
3122
3123
3124
3125
3126
3127
3128
3129
3130
3131
3132
3133
3134
3135
3136
3137
3138
3139
3140
3141
3142
3143
3144
3145
3146
3147
3148
3149
3150
3151
3152
3153
3154
3155
3156
3157
3158
3159
3160
3161
3162
3163
3164
3165
3166
3167
3168
3169
3170
3171
3172
3173
3174
3175
3176
3177
3178
3179
3180
3181
3182
3183
3184
3185
3186
3187
3188
3189
3190
3191
3192
3193
3194
3195
3196
3197
3198
3199
3200
3201
3202
3203
3204
3205
3206
3207
3208
3209
3210
3211
3212
3213
3214
3215
3216
3217
3218
3219
3220
3221
3222
3223
3224
3225
3226
3227
3228
3229
3230
3231
3232
3233
3234
3235
3236
3237
3238
3239
3240
3241
3242
3243
3244
3245
3246
3247
3248
3249
3250
3251
3252
3253
3254
3255
3256
3257
3258
3259
3260
3261
3262
3263
3264
3265
3266
3267
3268
3269
3270
3271
3272
3273
3274
3275
3276
3277
3278
3279
3280
3281
3282
3283
3284
3285
3286
3287
3288
3289
3290
3291
3292
3293
3294
3295
3296
3297
3298
3299
3300
3301
3302
3303
3304
3305
3306
3307
3308
3309
3310
3311
3312
3313
3314
3315
3316
3317
3318
3319
3320
3321
3322
3323
3324
3325
3326
3327
3328
3329
3330
3331
3332
3333
3334
3335
3336
3337
3338
3339
3340
3341
3342
3343
3344
3345
3346
3347
3348
3349
3350
3351
3352
3353
3354
3355
3356
3357
3358
3359
3360
3361
3362
3363
3364
3365
3366
3367
3368
3369
3370
3371
3372
3373
3374
3375
3376
3377
3378
3379
3380
3381
3382
3383
3384
3385
3386
3387
3388
3389
3390
3391
3392
3393
3394
3395
3396
3397
3398
3399
3400
3401
3402
3403
3404
3405
3406
3407
3408
3409
3410
3411
3412
3413
3414
3415
3416
3417
3418
3419
3420
3421
3422
3423
3424
3425
3426
3427
3428
3429
3430
3431
3432
3433
3434
3435
3436
3437
3438
3439
3440
3441
3442
3443
3444
3445
3446
3447
3448
3449
3450
3451
3452
3453
3454
3455
3456
3457
3458
3459
3460
3461
3462
3463
3464
3465
3466
3467
3468
3469
3470
3471
3472
3473
3474
3475
3476
3477
3478
3479
3480
3481
3482
3483
3484
3485
3486
3487
3488
3489
3490
3491
3492
3493
3494
3495
3496
3497
3498
3499
3500
3501
3502
3503
3504
3505
3506
3507
3508
3509
3510
3511
3512
3513
3514
3515
3516
3517
3518
3519
3520
3521
3522
3523
3524
3525
3526
3527
3528
3529
3530
3531
3532
3533
3534
3535
3536
3537
3538
3539
3540
3541
3542
3543
3544
3545
3546
3547
3548
3549
3550
3551
3552
3553
3554
3555
3556
3557
3558
3559
3560
3561
3562
3563
3564
3565
3566
3567
3568
3569
3570
3571
3572
3573
3574
3575
3576
3577
3578
3579
3580
3581
3582
3583
3584
3585
3586
3587
3588
3589
3590
3591
3592
3593
3594
3595
3596
3597
3598
3599
3600
3601
3602
3603
3604
3605
3606
3607
3608
3609
3610
3611
3612
3613
3614
3615
3616
3617
3618
3619
3620
3621
3622
3623
3624
3625
3626
3627
3628
3629
3630
3631
3632
3633
3634
3635
3636
3637
3638
3639
3640
3641
3642
3643
3644
3645
3646
3647
3648
3649
3650
3651
3652
3653
3654
3655
3656
3657
3658
3659
3660
3661
3662
3663
3664
3665
3666
3667
3668
3669
3670
3671
3672
3673
3674
3675
3676
3677
3678
3679
3680
3681
3682
3683
3684
3685
3686
3687
3688
3689
3690
3691
3692
3693
3694
3695
3696
3697
3698
3699
3700
3701
3702
3703
3704
3705
3706
3707
3708
3709
3710
3711
3712
3713
3714
3715
3716
3717
3718
3719
3720
3721
3722
3723
3724
3725
3726
3727
3728
3729
3730
3731
3732
3733
3734
3735
3736
3737
3738
3739
3740
3741
3742
3743
3744
3745
3746
3747
3748
3749
3750
3751
3752
3753
3754
3755
3756
3757
3758
3759
3760
3761
3762
3763
3764
3765
3766
3767
3768
3769
3770
3771
3772
3773
3774
3775
3776
3777
3778
3779
3780
3781
3782
3783
3784
3785
3786
3787
3788
3789
3790
3791
3792
3793
3794
3795
3796
3797
3798
<?xml version="1.0" encoding="UTF-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
   - file, You can obtain one at http://mozilla.org/MPL/2.0/.
-->

<!-- Note that this file depends on helper functions in calUtils.js-->

<!DOCTYPE bindings SYSTEM "chrome://global/locale/global.dtd" >

<bindings id="calendar-multiday-view-bindings"
  xmlns="http://www.mozilla.org/xbl"
  xmlns:html="http://www.w3.org/1999/xhtml"
  xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
  xmlns:xbl="http://www.mozilla.org/xbl">

  <!--
     - This is the time bar that displays time divisions to the side
     - or top of a multiday view.
    -->
  <binding id="calendar-time-bar">
    <content>
      <xul:stack anonid="timebarboxstack" style="display: block; position: absolute" xbl:inherits="orient,width,height" flex="1">
        <xul:box anonid="topbox" xbl:inherits="orient,width,height" flex="1"/>
        <xul:box anonid="timeIndicatorBoxTimeBar" class="timeIndicator-timeBar" xbl:inherits="orient" hidden="true"/>
      </xul:stack>
    </content>

    <implementation>
      <field name="mPixPerMin">0.6</field>
      <field name="mStartMin">0*60</field>
      <field name="mEndMin">24*60</field>
      <field name="mDayStartHour">0</field>
      <field name="mDayEndHour">24</field>

      <constructor>
        this.relayout();
      </constructor>

      <method name="setDayStartEndHours">
        <parameter name="aDayStartHour"/>
        <parameter name="aDayEndHour"/>
        <body><![CDATA[
          if (aDayStartHour * 60 < this.mStartMin ||
              aDayStartHour > aDayEndHour ||
              aDayEndHour * 60 > this.mEndMin) {
              throw Components.results.NS_ERROR_INVALID_ARG;
          }
          if (this.mDayStartHour != aDayStartHour ||
              this.mDayEndHour != aDayEndHour) {
              this.mDayEndHour = aDayEndHour;
              this.mDayStartHour = aDayStartHour;

              var topbox = document.getAnonymousElementByAttribute(this, "anonid", "topbox");
              if (topbox.childNodes.length) {
                  // This only needs to be done if the initial relayout has
                  // already happened, otherwise it will be done then.
                  for (var hour = this.mStartMin / 60; hour < this.mEndMin / 60; hour++) {
                      if (hour < this.mDayStartHour || hour > this.mDayEndHour) {
                          topbox.childNodes[hour].setAttribute("off-time", "true");
                      } else {
                          topbox.childNodes[hour].removeAttribute("off-time");
                      }
                  }
              }
          }
        ]]></body>
      </method>

      <method name="setAttribute">
        <parameter name="aAttr"/>
        <parameter name="aVal"/>
        <body><![CDATA[
          var needsrelayout = false;
          if (aAttr == "orient") {
              if (this.getAttribute("orient") != aVal)
                  needsrelayout = true;
          }

          // this should be done using lookupMethod(), see bug 286629
          var ret = XULElement.prototype.setAttribute.call (this, aAttr, aVal);

          if (needsrelayout) {
              this.relayout();
          }

          return ret;
        ]]></body>
      </method>

      <property name="pixelsPerMinute"
        onget="return this.mPixPerMin"
        onset="if (this.mPixPerMin != val) { this.mPixPerMin = val; this.relayout(); } return val;"/>

      <method name="relayout">
        <body><![CDATA[
          //dump ("calendar-time-bar: relayout\n");
          var topbox = document.getAnonymousElementByAttribute(this, "anonid", "topbox");
          var orient = topbox.getAttribute("orient");
          var otherorient = getOtherOrientation(orient);

          //dump ("calendar-time-bar: orient: " + orient + " other: " + otherorient + "\n");

          function makeTimeBox(timestr, size) {
              var box = createXULElement("box");
              box.setAttribute("orient", orient);

              if (orient == "horizontal") {
                  box.setAttribute("width", size);
              } else {
                  box.setAttribute("height", size);
              }

              var label = createXULElement("label");
              label.setAttribute("class", "calendar-time-bar-label");
              label.setAttribute("value", timestr);
              label.setAttribute("align", "center");

              box.appendChild(label);

              return box;
          }

          while (topbox.lastChild)
              topbox.removeChild(topbox.lastChild);

          var formatter = Components.classes["@mozilla.org/intl/scriptabledateformat;1"].
                          getService(Components.interfaces.nsIScriptableDateFormat);
          var timeString;
          var theMin = this.mStartMin;
          var theHour = Math.floor(theMin / 60);
          var durLeft = this.mEndMin - this.mStartMin;

          while (durLeft > 0) {
              var dur;
              if (this.mEndMin - theMin < 60) {
                  dur = this.mEndMin - theMin;
              } else {
                  dur = theMin % 60;
              }
              theMin += dur;
              if (dur == 0) dur = 60;

              // calculate duration pixel as the difference between
              // start pixel and end pixel to avoid rounding errors.
              var startPix = Math.round(theMin * this.mPixPerMin);
              var endPix   = Math.round((theMin + dur) * this.mPixPerMin);
              var durPix   = endPix - startPix;
              var box;
              if (dur != 60) {
                  box = makeTimeBox("", durPix);
              } else {
                  timeString = formatter.FormatTime("",
                                                    Components.interfaces.nsIScriptableDateFormat.timeFormatNoSeconds,
                                                    theHour, 0, 0);
                  box = makeTimeBox(timeString, durPix);
              }

              // Set up workweek hours
              if (theHour < this.mDayStartHour || theHour >= this.mDayEndHour) {
                  box.setAttribute("off-time", "true");
              }

              box.setAttribute("class", "calendar-time-bar-box-" + (theHour % 2 == 0 ? "even" : "odd"));
              topbox.appendChild(box);

              durLeft -= dur;
              theMin += dur;
              theHour++;
          }
        ]]></body>
      </method>
    </implementation>
  </binding>

  <!--
     - A simple gripbar that is displayed at the start and end of an
     - event box.  Needs to handle being dragged and resizing the
     - event, thus changing its start/end time.
    -->
  <binding id="calendar-event-gripbar">
     <content>
       <xul:box anonid="thebox"
                flex="1"
                pack="center"
                xbl:inherits="align=whichside">
         <xul:image xbl:inherits="class"/>
       </xul:box>
     </content>

    <implementation>
      <property name="parentorient">
        <getter><![CDATA[
          return this.getAttribute("parentorient");
        ]]></getter>
        <setter><![CDATA[
          var thebox = document.getAnonymousElementByAttribute(this, "anonid", "thebox");
          this.setAttribute("parentorient", val);
          thebox.setAttribute("orient", getOtherOrientation(val));
          return val;
        ]]></setter>
      </property>

      <!-- private -->
      <constructor><![CDATA[
        this.parentorient = this.getAttribute("parentorient");
      ]]></constructor>
    </implementation>

    <handlers>
      <handler event="mousedown" button="0"><![CDATA[
        // store the attribute 'whichside' in the event object
        // but *don't* call stopPropagation(). as soon as the
        // enclosing event box will receive the event it will
        // make use of this information in order to invoke the
        // appropriate action.
        event.whichside = this.getAttribute("whichside");
      ]]></handler>
      <handler event="click" button="0"><![CDATA[
        event.stopPropagation();
      ]]></handler>
    </handlers>
  </binding>

  <!--
     - A column for displaying event boxes in.  One column per
     - day; it manages the layout of the events given via add/deleteEvent.
    -->
  <binding id="calendar-event-column">
    <content>
      <xul:stack anonid="boxstack" flex="1" class="multiday-column-box-stack" style="min-width: 1px; min-height: 1px">
        <xul:box anonid="bgbox" flex="1" class="multiday-column-bg-box" style="min-width: 1px; min-height: 1px"/>
        <xul:box anonid="topbox" class="multiday-column-top-box" flex="1" style="min-width: 1px; min-height: 1px"
                 xbl:inherits="context" equalsize="always" mousethrough="always"/>
        <xul:box anonid="timeIndicatorBox" xbl:inherits="orient" class="timeIndicator" mousethrough="always" hidden="true"/>
        <xul:box anonid="fgbox" flex="1" class="fgdragcontainer" style="min-width: 1px; min-height: 1px; overflow:hidden;">
          <xul:box anonid="fgdragspacer" style="display: inherit; overflow: hidden;">
            <xul:spacer flex="1"/>
            <xul:label anonid="fgdragbox-startlabel" class="fgdragbox-label"/>
          </xul:box>
          <xul:box anonid="fgdragbox" class="fgdragbox" />
          <xul:label anonid="fgdragbox-endlabel" class="fgdragbox-label"/>
        </xul:box>
      </xul:stack>
      <xul:calendar-event-box anonid="config-box" hidden="true" xbl:inherits="orient"/>
    </content>

    <implementation>
      <constructor><![CDATA[
        this.mEventInfos = Array();
        this.mTimezone = UTC();
      ]]></constructor>

      <!-- fields -->
      <field name="mPixPerMin">0.6</field>
      <field name="mStartMin">0*60</field>
      <field name="mEndMin">24*60</field>
      <field name="mDayStartMin">8*60</field>
      <field name="mDayEndMin">17*60</field>
      <!--an array of objects that contain information about the events that are to be
      displayed. The contained fields are:
      event:        The event that is to be displayed in a 'calendar-event-box'
      layoutStart:  The 'start'-datetime object of the event in the timezone of the view
      layoutEnd:    The 'end'-datetime object of the event in the timezone of the view.
                    The 'layoutEnd' may be different from the real 'end' time of the
                    event because it considers a certain minimum duration of the event
                    that is basically dependent of the font-size of the event-box label -->
      <field name="mEventInfos">new Array()</field>
      <field name="mEventMap">null</field>
      <field name="mCalendarView">null</field>
      <field name="mDate">null</field>
      <field name="mTimezone">null</field>
      <field name="mDragState">null</field>
      <field name="mLayoutBatchCount">0</field>
      <!-- Since we'll often be getting many events in rapid succession, this
           timer helps ensure that we don't re-compute the event map too many
           times in a short interval, and therefore improves performance.-->
      <field name="mEventMapTimeout">null</field>
      <!-- Sometimes we need to add resize handlers for columns with special
           widths.  When we relayout, we need to cancel those handlers -->
      <field name="mHandlersToRemove">new Array()</field>

      <!-- Set this true so that we know in our onAddItem listener to start
         - modifying an event when it comes back to us as created
        -->
      <field name="mCreatedNewEvent">false</field>
      <field name="mEventToEdit">null</field>
      <field name="mSelectedItemIds">new Object()</field>

      <!-- properties -->
      <property name="pixelsPerMinute">
        <getter><![CDATA[
          return this.mPixPerMin;
        ]]></getter>
        <setter><![CDATA[
          if (val <= 0.0)
            val = 0.01;
          if (val != this.mPixPerMin) {
            this.mPixPerMin = val;
            this.relayout();
          }
          return val;
        ]]></setter>
      </property>

      <field name="mSelected">false</field>
      <property name="selected">
        <getter><![CDATA[
          return this.mSelected;
        ]]></getter>
        <setter><![CDATA[
          this.mSelected = val;
          if (this.bgbox && this.bgbox.hasChildNodes()) {
            var child = this.bgbox.firstChild;
            while (child) {
              if (val) {
                child.setAttribute("selected", "true");
              } else {
                child.removeAttribute("selected");
              }
              child = child.nextSibling;
            }
          }
          return val;
        ]]></setter>
      </property>

      <property name="date">
        <getter><![CDATA[
          return this.mDate;
        ]]></getter>
        <setter><![CDATA[
          this.mDate = val;

          if (!compareObjects(val.timezone, this.mTimezone)) {
              //dump ("++ column tz: " + val.timezone + "\n");
              this.mTimezone = val.timezone;
              if (!this.mLayoutBatchCount) {
                  this.recalculateStartEndMinutes();
              }
          }

          return val;
        ]]></setter>
      </property>

      <property name="calendarView"
        onget="return this.mCalendarView;"
        onset="return (this.mCalendarView = val);" />

      <property
        name="topbox"
        readonly="true">
        <getter><![CDATA[
          return document.getAnonymousElementByAttribute(this, "anonid", "topbox");
        ]]></getter>
      </property>

      <property
        name="bgbox"
        readonly="true">
        <getter><![CDATA[
          return document.getAnonymousElementByAttribute(this, "anonid", "bgbox");
        ]]></getter>
      </property>

      <field name="mFgboxes">null</field>
      <field name="mMinDuration">null</field>
      <property
        name="fgboxes"
        readonly="true">
        <getter><![CDATA[
          if (this.mFgboxes == null) {
              this.mFgboxes = {
                  box: document.getAnonymousElementByAttribute(this, "anonid", "fgbox"),
                  dragbox: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox"),
                  dragspacer: document.getAnonymousElementByAttribute(this, "anonid", "fgdragspacer"),
                  startlabel: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox-startlabel"),
                  endlabel: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox-endlabel")
              };
          }
          return this.mFgboxes;
        ]]></getter>
      </property>

      <property name="timeIndicatorBox"
        readonly="true">
        <getter><![CDATA[
          return document.getAnonymousElementByAttribute(this, "anonid", "timeIndicatorBox");
        ]]></getter>
      </property>

      <property
        name="events"
        readonly="true"
        onget="return this.methods"/>

      <field name="mDayOff">false</field>
      <property name="dayOff">
        <getter><![CDATA[
          return this.mDayOff;
        ]]></getter>
        <setter><![CDATA[
          this.mDayOff = val;
          return val;
        ]]></setter>
      </property>

      <!-- mEventInfos -->
      <field name="mSelectedChunks">[]</field>

      <method name="selectOccurrence">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
          if (aOccurrence) {
              this.mSelectedItemIds[aOccurrence.hashId] = true;
              var chunk = this.findChunkForOccurrence(aOccurrence);
              if (!chunk) {
                  return;
              }
              chunk.selected = true;
              this.mSelectedChunks.push(chunk);
          }
        ]]></body>
      </method>

      <method name="unselectOccurrence">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
          if (aOccurrence) {
              delete this.mSelectedItemIds[aOccurrence.hashId];
              var chunk = this.findChunkForOccurrence(aOccurrence);
              if (!chunk) {
                  return;
              }
              chunk.selected = false;
              var index = this.mSelectedChunks.indexOf(chunk);
              this.mSelectedChunks.splice(index, 1);
          }
        ]]></body>
      </method>

      <method name="findChunkForOccurrence">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
          for each (var chunk in this.mEventBoxes) {
              if (chunk.occurrence.hashId == aOccurrence.hashId) {
                  return chunk;
              }
          }

          return null;
        ]]></body>
      </method>

      <method name="startLayoutBatchChange">
        <body><![CDATA[
            this.mLayoutBatchCount++;
        ]]></body>
      </method>
      <method name="endLayoutBatchChange">
        <body><![CDATA[
            this.mLayoutBatchCount--;
            if (this.mLayoutBatchCount == 0)
              this.relayout();
        ]]></body>
      </method>

      <method name="setAttribute">
        <parameter name="aAttr"/>
        <parameter name="aVal"/>
        <body><![CDATA[
          // this should be done using lookupMethod(), see bug 286629
          var ret = XULElement.prototype.setAttribute.call (this, aAttr, aVal);

          if (aAttr == "orient" && this.getAttribute("orient") != aVal) {
              this.relayout();
          }

          return ret;
        ]]></body>
      </method>

      <method name="internalDeleteEvent">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
           var itemIndex = -1;
           var occ;
           for (var i in this.mEventInfos) {
               occ = this.mEventInfos[i].event;
               if (occ.hashId == aOccurrence.hashId)
               {
                   itemIndex = i;
                   break;
               }
           }

           if (itemIndex != -1) {
               delete this.mSelectedItemIds[occ.hashId];
               function isNotItem(a) {
                  return !a.occurrence || (a.occurrence.hashId != aOccurrence.hashId);
               }
               this.mSelectedChunks = this.mSelectedChunks.filter(isNotItem);

               this.mEventInfos.splice(itemIndex, 1);
               return true;
           } else {
               return false;
           }
        ]]></body>
      </method>

      <method name="recalculateStartEndMinutes">
        <body><![CDATA[
          for each (var chunk in this.mEventInfos) {
              var mins = this.getStartEndMinutesForOccurrence(chunk.event);
              chunk.startMinute = mins.start;
              chunk.endMinute = mins.end;
          }

          this.relayout();
        ]]></body>
      </method>

      <!-- This function returns the start and end minutes of the occurrence
           part in the day of this column, moreover, the real start and end
           minutes of the whole occurrence (which could span multiple days)
           relative to the time 0:00 of the day in this column -->
      <method name="getStartEndMinutesForOccurrence">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
           let stdate = aOccurrence.startDate || aOccurrence.entryDate || aOccurrence.dueDate;
           let enddate = aOccurrence.endDate || aOccurrence.dueDate || aOccurrence.entryDate;

           if (!compareObjects(stdate.timezone, this.mTimezone)) {
               stdate = stdate.getInTimezone (this.mTimezone);
           }

           if (!compareObjects(enddate.timezone, this.mTimezone)) {
               enddate = enddate.getInTimezone (this.mTimezone);
           }

           var startHour   = stdate.hour;
           var startMinute = stdate.minute;
           var endHour   = enddate.hour;
           var endMinute = enddate.minute;

           // Handle cases where an event begins or ends on a day other than this
           if (stdate.compare(this.mDate) == -1) {
               startHour = 0;
               startMinute = 0;
           }
           if (enddate.compare(this.mDate) == 1) {
               endHour = 24;
               endMinute = 0;
           }

           // For occurrences that span multiple days, we figure out the real
           // occurrence start and end minutes relative to the date of this
           // column and time 0:00
           let durend = enddate.subtractDate(this.mDate);
           let durstart = stdate.subtractDate(this.mDate);
           // 'durend' is always positive, instead 'durstart' might be negative
           // if the event starts one or more days before the date of this column
           let realStart_ = (durstart.days * 24 + durstart.hours) * 60 + durstart.minutes;
           realStart_ = durstart.isNegative ? -1 * realStart_ : realStart_;
           let realEnd_ = (durend.days * 24 + durend.hours) * 60 + durend.minutes;

           return { start:        startHour * 60 + startMinute,
                    end:          endHour   * 60 + endMinute,
                    realStart:    realStart_,
                    realEnd:      realEnd_ };
        ]]></body>
      </method>

      <method name="createChunk">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
           var mins = this.getStartEndMinutesForOccurrence(aOccurrence);

           var chunk = {
               startMinute: mins.start,
               endMinute: mins.end,
               event: aOccurrence
           };
           return chunk;
        ]]></body>
      </method>

      <method name="addEvent">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
           this.internalDeleteEvent(aOccurrence);

           var chunk = this.createChunk(aOccurrence);
           this.mEventInfos.push(chunk);
           if (this.mEventMapTimeout) {
               clearTimeout(this.mEventMapTimeout);
           }
           var column = this;

           if (this.mCreatedNewEvent) {
               this.mEventToEdit = aOccurrence;
           }
           // Fun with scoping...
           this.mEventMapTimeout = setTimeout(function() { column.relayout.call(column) }, 5);
        ]]></body>
      </method>

      <method name="deleteEvent">
        <parameter name="aOccurrence"/>
        <body><![CDATA[
           if (this.internalDeleteEvent(aOccurrence))
             this.relayout();
        ]]></body>
      </method>

      <method name="clear">
        <body><![CDATA[
          while (this.bgbox && this.bgbox.hasChildNodes()) {
              this.bgbox.removeChild(this.bgbox.lastChild);
          }
          while (this.topbox && this.topbox.hasChildNodes()) {
              this.topbox.removeChild(this.topbox.lastChild);
          }
          for each (let handler in this.mHandlersToRemove) {
              this.calendarView.viewBroadcaster.removeEventListener(this.calendarView.getAttribute("type") + "viewresized", handler, true);
          }
          this.mHandlersToRemove = [];
          this.mSelectedChunks = [];
        ]]></body>
      </method>

      <method name="relayout">
        <body><![CDATA[

          if (this.mLayoutBatchCount > 0)
              return;
          this.clear();

          let orient = this.getAttribute("orient");
          this.bgbox.setAttribute("orient", orient);

          // bgbox is used mainly for drawing the grid.  at some point it may
          // also be used for all-day events.
          let otherorient = getOtherOrientation(orient);
          let configBox = document.getAnonymousElementByAttribute(this, "anonid", "config-box");
          configBox.removeAttribute("hidden");
          let minSize = configBox.getOptimalMinSize();
          configBox.setAttribute("hidden", "true");
          this.mMinDuration = Components.classes["@mozilla.org/calendar/duration;1"]
                                            .createInstance(Components.interfaces.calIDuration);
          this.mMinDuration.minutes = parseInt(minSize/this.mPixPerMin);

          let theMin = this.mStartMin;
          while (theMin < this.mEndMin) {
              let dur = theMin % 60;
              theMin += dur;
              if (dur == 0) dur = 60;

              let box = createXULElement("spacer");
              // we key off this in a CSS selector
              box.setAttribute("orient", orient);
              box.setAttribute("class", "calendar-event-column-linebox");

              if (this.mSelected) {
                  box.setAttribute("selected", "true");
              }
              if (this.mDayOff) {
                  box.setAttribute("weekend", "true");
              }
              if (theMin < this.mDayStartMin || theMin >= this.mDayEndMin) {
                  box.setAttribute("off-time", "true");
              }

              // Carry forth the day relation
              box.setAttribute("relation", this.getAttribute("relation"));

              // calculate duration pixel as the difference between
              // start pixel and end pixel to avoid rounding errors.
              let startPix = Math.round(theMin * this.mPixPerMin);
              let endPix   = Math.round((theMin + dur) * this.mPixPerMin);
              let durPix   = endPix - startPix;
              if (orient == "vertical")
                  box.setAttribute("height", durPix);
              else
                  box.setAttribute("width", durPix);

              box.setAttribute("style", "min-width: 1px; min-height: 1px;");

              this.bgbox.appendChild(box);
              theMin += 60;
          }

          // fgbox is used for dragging events
          this.fgboxes.box.setAttribute("orient", orient);
          document.getAnonymousElementByAttribute(this, "anonid", "fgdragspacer").setAttribute("orient", orient);

          // this one is set to otherorient, since it will contain
          // child boxes set to "orient" (one for each set of
          // overlapping event areas)
          this.topbox.setAttribute("orient", otherorient);

          this.mEventMap = this.computeEventMap();
          this.mEventBoxes = new Array();

          if (!this.mEventMap.length) {
              return;
          }

          // First of all we create a xul:stack which
          // will hold all events for this event column.
          // The stack will be grouped below .../calendar-event-column/stack/topbox.
          let stack = createXULElement("stack");
          stack.setAttribute("flex", "1");
          this.topbox.appendChild(stack);

          let boxToEdit;
          let columnCount = 1;
          let spanTotal = 0;

          for each (let layer in this.mEventMap) {

              // The event-map (this.mEventMap) contains an array of layers.
              // For each layer we create a box below the stack just created above.
              // So each different layer lives in a box that's contained in the stack.
              let xulColumn = createXULElement("box");
              xulColumn.setAttribute("orient", otherorient);
              xulColumn.setAttribute("flex", "1");
              xulColumn.setAttribute("style", "min-width: 1px; min-height: 1px;");
              stack.appendChild(xulColumn);

              let numBlocksInserted = 0;

              // column count determined by layer with no special span columns
              if (layer.every(function (e) !e.specialSpan)) {
                  columnCount = layer.length;
              }
              spanTotal = 0;

              // Each layer contains a list of the columns that
              // need to be created for a span.
              for each (let column in layer) {
                  let innerColumn = createXULElement("box");
                  innerColumn.setAttribute("orient", orient);

                  let colFlex = column.specialSpan ? (columnCount * column.specialSpan) : 1;
                  innerColumn.setAttribute("flex", colFlex);
                  spanTotal += colFlex;

                  innerColumn.style.minWidth = "1px";
                  innerColumn.style.minHeight = "1px";
                  innerColumn.style.width = colFlex + "px";
                  innerColumn.style.height = colFlex + "px";

                  xulColumn.appendChild(innerColumn);
                  let curTime = 0;
                  for each (let chunk in column) {
                      var duration = chunk.duration;
                      if (!duration) {
                          continue;
                      }

                      if (chunk.event) {
                          let chunkBox = createXULElement("calendar-event-box");
                          let durMinutes = duration.inSeconds / 60;
                          let size = Math.max(durMinutes * this.mPixPerMin, minSize);
                          if (orient == "vertical") {
                              chunkBox.setAttribute("height", size);
                          } else {
                              chunkBox.setAttribute("width", size);
                          }
                          chunkBox.setAttribute("context",
                                                this.getAttribute("item-context") ||
                                                  this.getAttribute("context"));
                          chunkBox.setAttribute("orient", orient);

                          // Set the gripBars visibility in the chunk. Keep it
                          // hidden for tasks with only entry date OR due date.
                          if ((chunk.event.entryDate || !chunk.event.dueDate) &&
                              (!chunk.event.entryDate || chunk.event.dueDate)) {

                              let startGripVisible = (chunk.event.startDate || chunk.event.entryDate)
                                                         .compare(chunk.startDate) == 0;
                              let endGripVisible = (chunk.event.endDate || chunk.event.dueDate)
                                                       .compare(chunk.endDate) <= 0;
                              if (startGripVisible && endGripVisible) {
                                  chunkBox.setAttribute("gripBars", "both");
                              } else if (endGripVisible) {
                                  chunkBox.setAttribute("gripBars", "end");
                              } else if (startGripVisible) {
                                  chunkBox.setAttribute("gripBars", "start");
                              }
                          }

                          innerColumn.appendChild(chunkBox);
                          chunkBox.calendarView = this.calendarView;
                          chunkBox.occurrence = chunk.event;
                          chunkBox.parentColumn = this;
                          if (chunk.event.hashId in this.mSelectedItemIds) {
                              chunkBox.selected = true;
                              this.mSelectedChunks.push(chunkBox);
                          }

                          this.mEventBoxes.push(chunkBox);

                          if (this.mEventToEdit &&
                              chunkBox.occurrence.hashId == this.mEventToEdit.hashId) {
                              boxToEdit = chunkBox;
                          }
                      } else {
                          let chunkBox = createXULElement("spacer");
                          chunkBox.setAttribute("context", this.getAttribute("context"));
                          chunkBox.setAttribute("style", "min-width: 1px; min-height: 1px;");
                          chunkBox.setAttribute("orient", orient);
                          chunkBox.setAttribute("class", "calendar-empty-space-box");
                          innerColumn.appendChild(chunkBox);

                          let durMinutes = duration.inSeconds / 60;
                          if (orient == "vertical") {
                              chunkBox.setAttribute("height", durMinutes * this.mPixPerMin);
                          } else {
                              chunkBox.setAttribute("width", durMinutes * this.mPixPerMin);
                          }
                      }
                  }

                  numBlocksInserted++;
                  curTime += duration;
              }

              // add last empty column if necessary
              if (spanTotal < columnCount) {
                  let lastColumn = createXULElement("box");
                  lastColumn.setAttribute("orient", orient);
                  lastColumn.setAttribute("flex", columnCount - spanTotal);
                  lastColumn.style.minWidth = "1px";
                  lastColumn.style.minHeight = "1px";
                  lastColumn.style.width = (columnCount - spanTotal) + "px";
                  lastColumn.style.height = (columnCount - spanTotal) + "px";

                  xulColumn.appendChild(lastColumn);
              }

              if (boxToEdit) {
                  this.mCreatedNewEvent = false;
                  this.mEventToEdit = null;
                  boxToEdit.startEditing();
              }

              if (numBlocksInserted == 0) {
                  // if we didn't insert any blocks, then
                  // forget about this column
                  stack.removeChild(xulColumn);
              }
          }
        ]]></body>
      </method>

      <method name="computeEventMap">
        <body><![CDATA[
          /* We're going to create a series of 'blobs'.  A blob is a series of
           * events that create a continuous block of busy time.  In other
           * words, a blob ends when there is some time such that no events
           * occupy that time.
           *
           * Each blob will be an array of objects with the following properties:
           *    item:     the event/task
           *    startCol: the starting column to display the event in (0-indexed)
           *    colSpan:  the number of columns the item spans
           *
           * An item with no conflicts will have startCol: 0 and colSpan: 1.
           */
          var blobs = new Array();
          var currentBlob = new Array();
          function sortByStart(aEventInfo, bEventInfo) {
              // If you pass in tasks without both entry and due dates, I will
              // kill you
              var startComparison = aEventInfo.layoutStart.compare(bEventInfo.layoutStart);
              if (startComparison != 0) {
                  return startComparison;
              } else {
                  // If the items start at the same time, return the longer one
                  // first
                  return bEventInfo.layoutEnd.compare(aEventInfo.layoutEnd);
              }
          }
          var self = this;
          this.mEventInfos.forEach(function(aEventInfo) {
              let item = aEventInfo.event.clone();
              let start = item.startDate || item.entryDate || item.dueDate;
              start = start.getInTimezone(self.mTimezone);
              aEventInfo.layoutStart = start;
              let end = item.endDate || item.dueDate || item.entryDate;
              end = end.getInTimezone(self.mTimezone);
              let secEnd = start.clone();
              secEnd.addDuration(self.mMinDuration);
              if (secEnd.nativeTime > end.nativeTime) {
                   aEventInfo.layoutEnd = secEnd;
              } else {
                   aEventInfo.layoutEnd = end;
              }
              return aEventInfo;
          });
          this.mEventInfos.sort(sortByStart);

          // The end time of the last ending event in the entire blob
          var latestItemEnd;

          // This array keeps track of the last (latest ending) item in each of
          // the columns of the current blob. We could reconstruct this data at
          // any time by looking at the items in the blob, but that would hurt
          // perf.
          var colEndArray = new Array();

          /* Go through a 3 step process to try and place each item.
           * Step 1: Look for an existing column with room for the item.
           * Step 2: Look for a previously placed item that can be shrunk in
           *         width to make room for the item.
           * Step 3: Give up and create a new column for the item.
           *
           * (The steps are explained in more detail as we come to them)
           */
          for (var i in this.mEventInfos) {
              var curItemInfo = {event: this.mEventInfos[i].event,
                                 layoutStart: this.mEventInfos[i].layoutStart,
                                 layoutEnd: this.mEventInfos[i].layoutEnd};
              if (!latestItemEnd) {
                 latestItemEnd = curItemInfo.layoutEnd;
              }
              if (currentBlob.length && latestItemEnd &&
                  curItemInfo.layoutStart.compare(latestItemEnd) != -1) {
                  // We're done with this current blob because item starts
                  // after the last event in the current blob ended.
                  blobs.push({blob: currentBlob, totalCols: colEndArray.length});

                  // Reset our variables
                  currentBlob = new Array();
                  colEndArray = new Array();
              }

              // Place the item in its correct place in the blob
              var placedItem = false;

              // Step 1
              // Look for a possible column in the blob that has been left open. This
              // would happen if we already have multiple columns but some of
              // the cols have events before latestItemEnd.  For instance
              //       |      |      |
              //       |______|      |
              //       |ev1   |______|
              //       |      |ev2   |
              //       |______|      |
              //       |      |      |
              //       |OPEN! |      |<--Our item's start time might be here
              //       |      |______|
              //       |      |      |
              //
              // Remember that any time we're starting a new blob, colEndArray
              // will be empty, but that's ok.
              for (var ii = 0; ii < colEndArray.length; ++ii) {
                  var colStart = colEndArray[ii].layoutStart;
                  var colEnd = colEndArray[ii].layoutEnd;
                  if (colEnd.compare(curItemInfo.layoutStart) != 1) {
                      // Yay, we can jump into this column
                      colEndArray[ii] = curItemInfo;

                      // Check and see if there are any adjacent columns we can
                      // jump into as well.
                      var lastCol = Number(ii) + 1;
                      while (lastCol < colEndArray.length) {
                          var nextColStart = colEndArray[lastCol].layoutStart;
                          var nextColEnd = colEndArray[lastCol].layoutEnd;
                          // If the next column's item ends after we start, we
                          // can't expand any further
                          if (nextColEnd.compare(curItemInfo.layoutStart) == 1) {
                              break;
                          }
                          colEndArray[lastCol] = curItemInfo;
                          lastCol++;
                      }
                      // Now construct the info we need to push into the blob
                      currentBlob.push({itemInfo: curItemInfo,
                                        startCol: ii,
                                        colSpan: lastCol - ii});

                      // Update latestItemEnd
                      if (latestItemEnd &&
                          curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
                          latestItemEnd = curItemInfo.layoutEnd;
                      }
                      placedItem = true;
                      break; // Stop iterating through colEndArray
                  }
              }

              if (placedItem) {
                  // Go get the next item
                  continue;
              }

              // Step 2
              // OK, all columns (if there are any) overlap us.  Look if the
              // last item in any of the last items in those columns is taking
              // up 2 or more cols. If so, shrink it and stick the item in the
              // created space. For instance
              //       |______|______|______|
              //       |ev1   |ev3   |ev4   |
              //       |      |      |      |
              //       |      |______|      |
              //       |      |      |______|
              //       |      |_____________|
              //       |      |ev2          |
              //       |______|             |<--If our item's start time is
              //       |      |_____________|   here, we can shrink ev2 and jump
              //       |      |      |      |   in column #3
              //
              for (var jj=1; jj<colEndArray.length; ++jj) {
                  if (colEndArray[jj].event.hashId == colEndArray[jj-1].event.hashId) {
                      // Good we found a item that spanned multiple columns.
                      // Find it in the blob so we can modify its properties
                      for (var kk in currentBlob) {
                          if (currentBlob[kk].itemInfo.event.hashId == colEndArray[jj].event.hashId) {
                              // Take all but the first spot that the item spanned
                              var spanOfShrunkItem = currentBlob[kk].colSpan;
                              currentBlob.push({itemInfo: curItemInfo,
                                                startCol: Number(currentBlob[kk].startCol) + 1,
                                                colSpan: spanOfShrunkItem - 1});

                              // Update colEndArray
                              for (var ll = jj; ll < jj + spanOfShrunkItem - 1; ll++) {
                                  colEndArray[ll] = curItemInfo;
                              }

                              // Modify the data on the old item
                              currentBlob[kk] = {itemInfo: currentBlob[kk].itemInfo,
                                                 startCol: currentBlob[kk].startCol,
                                                 colSpan: 1};
                              // Update latestItemEnd
                              if (latestItemEnd &&
                                  curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
                                  latestItemEnd = curItemInfo.layoutEnd;
                              }
                              break; // Stop iterating through currentBlob
                          }
                      }
                      placedItem = true;
                      break; // Stop iterating through colEndArray
                  }
              }

              if (placedItem) {
                  // Go get the next item
                  continue;
              }

              // Step 3
              // Guess what? We still haven't placed the item.  We need to
              // create a new column for it.

              // All the items in the last column, except for the one* that
              // conflicts with the item we're trying to place, need to have
              // their span extended by 1, since we're adding the new column
              //
              // * Note that there can only be one, because we sorted our
              //   events by start time, so this event must start later than
              //   the start of any possible conflicts.
              var lastColNum = colEndArray.length;
              for (var mm in currentBlob) {
                  var mmStart = currentBlob[mm].itemInfo.layoutStart;
                  var mmEnd = currentBlob[mm].itemInfo.layoutEnd;
                  if (currentBlob[mm].startCol + currentBlob[mm].colSpan == lastColNum &&
                      mmEnd.compare(curItemInfo.layoutStart) != 1) {
                      currentBlob[mm] = {itemInfo: currentBlob[mm].itemInfo,
                                         startCol: currentBlob[mm].startCol,
                                         colSpan: currentBlob[mm].colSpan + 1};
                  }
              }
              currentBlob.push({itemInfo: curItemInfo,
                                startCol: colEndArray.length,
                                colSpan: 1});
              colEndArray.push(curItemInfo);

              // Update latestItemEnd
              if (latestItemEnd && curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
                  latestItemEnd = curItemInfo.layoutEnd;
              }
              // Go get the next item
          }
          // Add the last blob
          blobs.push({blob: currentBlob,
                      totalCols: colEndArray.length});
          return this.setupBoxStructure(blobs);
        ]]></body>
      </method>
      <method name="setupBoxStructure">
        <parameter name="aBlobs"/>
        <body><![CDATA[
          // This is actually going to end up being a 3-d array
          // 1st dimension: "layers", sets of columns of events that all
          //                should have equal width*
          // 2nd dimension: "columns", individual columns of non-conflicting
          //                items
          // 3rd dimension: "chunks", individual items or placeholders for
          //                the blank time in between them
          //
          // * Note that 'equal width' isn't strictly correct.  If we're
          //   oriented differently, it will be height (and we'll have rows
          //   not columns).  What's more, in the 'specialSpan' case, the
          //   columns won't actually have the same size, but will only all
          //   be multiples of a common size.  See the note in the relayout
          //   function for more info on this (fairly rare) case.
          var layers = [];

          // When we start a new blob, move to a new set of layers
          var layerOffset = 0;
          for each (var glob in aBlobs) {

              var layerArray = [];
              var layerCounter = 1;

              for each (var data in glob.blob) {

                  // from the item at hand we need to figure out on which
                  // layer and on which column it should go.
                  var layerIndex;
                  var specialSpan = null;

                  // each blob receives its own layer, that's the first part of the story. within
                  // a given blob we need to distribute the items on different layers depending on
                  // the number of columns each item spans. if each item just spans a single column
                  // the blob will cover *one* layer. if the blob contains items that span more than
                  // a single column, this blob will cover more than one layer. the algorithm places
                  // the items on the first layer in the case an item covers a single column. new layers
                  // are introduced based on the start column and number of spanning columns of an item.
                  if (data.colSpan != 1) {
                      var index = glob.totalCols * data.colSpan + data.startCol;
                      layerIndex = layerArray[index];
                      if (!layerIndex) {
                          layerIndex = layerCounter++;
                          layerArray[index] = layerIndex;
                      }
                      var offset = ((glob.totalCols - data.colSpan) % glob.totalCols)
                      if (offset != 0) {
                          specialSpan = data.colSpan / glob.totalCols;
                      }
                  } else {
                      layerIndex = 0;
                  }
                  layerIndex += layerOffset;

                  // Make sure there's room to insert stuff
                  while (layerIndex >= layers.length) {
                      layers.push([]);
                  }

                  while (data.startCol >= layers[layerIndex].length) {
                      layers[layerIndex].push([]);
                      if (specialSpan) {
                          layers[layerIndex][layers[layerIndex].length - 1].specialSpan = 1 / glob.totalCols;
                      }
                  }

                  // we now retrieve the column from 'layerIndex' and 'startCol'.
                  var col = layers[layerIndex][data.startCol];
                  if (specialSpan) {
                      col.specialSpan = specialSpan;
                  }

                  // take into account that items can span several days.
                  // that's why i'm clipping the start- and end-time to the
                  // timespan of this column.
                  var start = data.itemInfo.layoutStart;
                  var end = data.itemInfo.layoutEnd;
                  if (start.year  != this.date.year ||
                      start.month != this.date.month ||
                      start.day   != this.date.day) {
                      start = start.clone();
                      start.resetTo(this.date.year,
                                    this.date.month,
                                    this.date.day,
                                    0,this.mStartMin,0,
                                    start.timezone);
                  }
                  if (end.year  != this.date.year ||
                      end.month != this.date.month ||
                      end.day   != this.date.day) {
                      end = end.clone();
                      end.resetTo(this.date.year,
                                  this.date.month,
                                  this.date.day,
                                  0,this.mEndMin,0,
                                  end.timezone);
                  }
                  var prevEnd;
                  if (col.length > 0) {
                      // Fill in time gaps with a placeholder
                      prevEnd = col[col.length - 1].endDate.clone();
                  } else {
                      // First event in the column, add a placeholder for the
                      // blank time from this.mStartMin to the event's start
                      prevEnd = start.clone();
                      prevEnd.hour = 0;
                      prevEnd.minute = this.mStartMin;
                  }
                  prevEnd.timezone = floating();
                  // the reason why we need to calculate time durations
                  // based on floating timezones is that we need avoid
                  // dst gaps in this case. converting the date/times to
                  // floating conveys this idea in a natural way. note that
                  // we explicitly don't use getInTimezone() as it would
                  // be slightly more expensive in terms of performance.
                  var floatstart = start.clone();
                  floatstart.timezone = floating();
                  var dur = floatstart.subtractDate(prevEnd);
                  if (dur.inSeconds) {
                      col.push({duration: dur});
                  }
                  var floatend = end.clone();
                  floatend.timezone = floating();
                  col.push({event: data.itemInfo.event,
                            endDate: end,
                            startDate: start,
                            duration: floatend.subtractDate(floatstart)});
              }
              layerOffset = layers.length;
          }
          return layers;
        ]]></body>
      </method>

      <method name="getShadowElements">
        <parameter name="aStart"/>
        <parameter name="aEnd"/>
        <body><![CDATA[
            // aStart and aEnd are start and end minutes of the occurrence
            // from time 0:00 of the dragging column
            let shadows = 1;
            let offset = 0;
            let startMin;
            if (aStart < 0) {
                shadows += Math.ceil(Math.abs(aStart) / this.mEndMin);
                offset = shadows - 1;
                let reminder = Math.abs(aStart) % this.mEndMin;
                startMin = this.mEndMin - (reminder ? reminder : this.mEndMin);
            } else {
                startMin = aStart;
            }
            shadows += Math.floor(aEnd / this.mEndMin);

            // return values needed to build the shadows while dragging
            return { shadows:  shadows,      // number of shadows
                     offset:   offset,       // Offset first<->selected shadows
                     startMin: startMin,     // First shadow start minute
                     endMin:   aEnd % this.mEndMin   // Last shadow end minute
                   };
        ]]></body>
      </method>

      <method name="firstLastShadowColumns">
        <parameter name="aOffset"/>
        <parameter name="aShadows"/>
        <body><![CDATA[
          let firstCol = this;
          let lastCol = this;
          let firstIndex = (aOffset != null ? aOffset : this.mDragState.offset);
          let lastIndex = firstIndex;
          while (firstCol.previousSibling && firstIndex > 0) {
              firstCol = firstCol.previousSibling;
              firstIndex--;
          }
          let lastShadow = (aShadows != null ? aShadows : this.mDragState.shadows);
          while (lastCol.nextSibling && lastIndex < lastShadow - 1) {
              lastCol = lastCol.nextSibling;
              lastIndex++;
          }

          // returns first and last column with shadows that are visible in the
          // week and the positions of these (visible) columns in the set of
          // columns shadows of the occurrence
          return { firstCol:    firstCol,
                   firstIndex:  firstIndex,
                   lastCol:     lastCol,
                   lastIndex:   lastIndex };
        ]]></body>
      </method>

      <method name="updateShadowsBoxes">
        <parameter name="aStart"/>
        <parameter name="aEnd"/>
        <parameter name="aCurrentOffset"/>
        <parameter name="aCurrentShadows"/>
        <parameter name="aSizeattr"/>
        <body><![CDATA[
          let lateralColumns = this.firstLastShadowColumns(aCurrentOffset, aCurrentShadows);
          let firstCol = lateralColumns.firstCol;
          let firstIndex = lateralColumns.firstIndex;
          let lastCol = lateralColumns.lastCol;
          let lastIndex = lateralColumns.lastIndex;

          // remove the first/last shadow when start/end time goes in the
          // next/previous day. This happens when current offset is different
          // from offset stored in mDragState
          if (aCurrentOffset != null) {
              if (this.mDragState.offset > aCurrentOffset && firstCol.previousSibling) {
                  firstCol.previousSibling.fgboxes.dragbox.removeAttribute("dragging");
                  firstCol.previousSibling.fgboxes.box.removeAttribute("dragging");
              }
              let currentOffsetEndSide = aCurrentShadows - 1 - aCurrentOffset;
              if ((this.mDragState.shadows - 1 - this.mDragState.offset) > currentOffsetEndSide &&
                   lastCol.nextSibling) {
                  lastCol.nextSibling.fgboxes.dragbox.removeAttribute("dragging");
                  lastCol.nextSibling.fgboxes.box.removeAttribute("dragging");
              }
          }

          // set shadow boxes size for every part of the occurrence
          let firstShadowSize = (aCurrentShadows == 1) ? aEnd - aStart : this.mEndMin - aStart;
          let column = firstCol;
          for (let i = firstIndex; column && i <= lastIndex; i++) {
              column.fgboxes.box.setAttribute("dragging", "true");
              column.fgboxes.dragbox.setAttribute("dragging", "true");
              if (i == 0) {
                  // first shadow
                  column.fgboxes.dragspacer.setAttribute(aSizeattr, aStart * column.mPixPerMin);
                  column.fgboxes.dragbox.setAttribute(aSizeattr, firstShadowSize * column.mPixPerMin);
              } else if (i == (aCurrentShadows - 1)) {
                  // last shadow
                  column.fgboxes.dragspacer.setAttribute(aSizeattr, 0);
                  column.fgboxes.dragbox.setAttribute(aSizeattr, aEnd * column.mPixPerMin);
              } else {
                  // an intermediate shadow (full day)
                  column.fgboxes.dragspacer.setAttribute(aSizeattr, 0);
                  column.fgboxes.dragbox.setAttribute(aSizeattr, this.mEndMin * column.mPixPerMin);
              }
              column = column.nextSibling;
          }
        ]]></body>
      </method>

      <method name="onEventSweepKeypress">
        <parameter name="event"/>
        <body><![CDATA[
          let col = document.calendarEventColumnDragging;
          if (col && event.keyCode == event.DOM_VK_ESCAPE) {
              window.removeEventListener("mousemove", col.onEventSweepMouseMove, false);
              window.removeEventListener("mouseup", col.onEventSweepMouseUp, false);
              window.removeEventListener("keypress", col.onEventSweepKeypress, false);

              let lateralColumns = col.firstLastShadowColumns();
              let column = lateralColumns.firstCol;
              let index = lateralColumns.firstIndex;
              while (column && index < col.mDragState.shadows) {
                  column.fgboxes.dragbox.removeAttribute("dragging");
                  column.fgboxes.box.removeAttribute("dragging");
                  column = column.nextSibling;
                  index++;
              }

              col.mDragState = null;
              document.calendarEventColumnDragging = null;
          }
        ]]></body>
      </method>

      <!--
         - Event sweep handlers
        -->
      <method name="onEventSweepMouseMove">
        <parameter name="event"/>
        <body><![CDATA[
          let col = document.calendarEventColumnDragging;
          if (!col) return;

          let dragState = col.mDragState;

          let lateralColumns = col.firstLastShadowColumns();
          let firstCol = lateralColumns.firstCol;
          let firstIndex = lateralColumns.firstIndex;
          if (event.clientX < (event.target.boxObject.x) ||
              event.clientX > (event.target.boxObject.x + event.target.boxObject.width) ||
              event.clientY < (event.target.boxObject.y) ||
              event.clientY > (event.target.boxObject.y + event.target.boxObject.height)) {

              // Remove the drag state
              for (let column = firstCol, i = firstIndex;
                   column && i < col.mDragState.shadows;
                   column = column.nextSibling, i++) {
                  column.fgboxes.dragbox.removeAttribute("dragging");
                  column.fgboxes.box.removeAttribute("dragging");
              }

              window.removeEventListener("mousemove", col.onEventSweepMouseMove, false);
              window.removeEventListener("mouseup", col.onEventSweepMouseUp, false);
              window.removeEventListener("keypress", col.onEventSweepKeypress, false);
              document.calendarEventColumnDragging = null;
              col.mDragState = null;

              // the multiday view currently exhibits a less than optimal strategy
              // in terms of item selection. items don't get automatically selected
              // when clicked and dragged, as to differentiate inline editing from
              // the act of selecting an event. but the application internal drop
              // targets will ask for selected items in order to pull the data from
              // the packets. that's why we need to make sure at least the currently
              // dragged event is contained in the set of selected items.
              let selectedItems = this.getSelectedItems({});
              if (!selectedItems.some(
                  function (aItem) {
                      return (aItem.hashId == item.hashId);
                  })) {
                  col.calendarView.setSelectedItems(1,
                      [event.ctrlKey ? item.parentItem : item]);
              }
              invokeEventDragSession(dragState.dragOccurrence, col);
              return;
          }

          col.fgboxes.box.setAttribute("dragging", "true");
          col.fgboxes.dragbox.setAttribute("dragging", "true");
          let minutesInDay = col.mEndMin - col.mStartMin;

          // check if we need to jump a column
          let jumpedColumns;
          let newcol = col.calendarView.findColumnForClientPoint(event.screenX, event.screenY);
          if (newcol && newcol != col) {
              // Find how many columns we are jumping by subtracting the dates.
              let dur = newcol.mDate.subtractDate(col.mDate);
              jumpedColumns = dur.days;
              jumpedColumns *= dur.isNegative ? -1 : 1;
              if (dragState.dragType == "modify-start") {
                  // prevent dragging the start date after the end date in a new column
                  if ((dragState.limitEndMin - minutesInDay * jumpedColumns) < 0) {
                      return;
                  }
                  dragState.limitEndMin -= minutesInDay * jumpedColumns;
              } else if (dragState.dragType == "modify-end") {
                  // prevent dragging the end date before the start date in a new column
                  if ((dragState.limitStartMin - minutesInDay * jumpedColumns) > minutesInDay) {
                      return;
                  }
                  dragState.limitStartMin -= minutesInDay * jumpedColumns;
              } else if (dragState.dragType == "new") {
                  dragState.limitEndMin -= minutesInDay * jumpedColumns;
                  dragState.limitStartMin -= minutesInDay * jumpedColumns;
                  dragState.jumpedColumns += jumpedColumns;
              }
              // kill our drag state
              for (let column = firstCol, i = firstIndex;
                   column && i < col.mDragState.shadows;
                   column = column.nextSibling, i++) {
                  column.fgboxes.dragbox.removeAttribute("dragging");
                  column.fgboxes.box.removeAttribute("dragging");
              }

              // jump ship
              newcol.acceptInProgressSweep(dragState);

              // restart event handling
              col.onEventSweepMouseMove(event);

              return;
          }

          let mousePos;
          let sizeattr;
          if (col.getAttribute("orient") == "vertical") {
              mousePos = event.screenY - col.parentNode.boxObject.screenY;
              sizeattr = "height";
          } else {
              mousePos = event.screenX - col.parentNode.boxObject.screenX;
              sizeattr = "width";
          }
          // don't let mouse position go outside the window edges
          let pos = Math.max(0, mousePos) - dragState.mouseOffset;

          // snap interval: 15 minutes or 1 minute if modifier key is pressed
          let snapIntMin = (event.shiftKey &&
                            !event.ctrlKey &&
                            !event.altKey  &&
                            !event.metaKey) ? 1 : 15;
          let interval = col.mPixPerMin * snapIntMin;
          let curmin = Math.floor(pos / interval) * snapIntMin;
          let deltamin = curmin - dragState.origMin;

          let shadowElements;
          if (dragState.dragType == "new") {
              // Extend deltamin in a linear way over the columns
              deltamin += minutesInDay * dragState.jumpedColumns;
              if (deltamin < 0) {
                  // create a new event modifying the start. End time is fixed
                  shadowElements = {shadows: 1 - dragState.jumpedColumns,
                                    offset: 0,
                                    startMin: curmin,
                                    endMin: dragState.origMin};
              } else {
                  // create a new event modifying the end. Start time is fixed
                  shadowElements = {shadows: dragState.jumpedColumns + 1,
                                    offset: dragState.jumpedColumns,
                                    startMin: dragState.origMin,
                                    endMin: curmin};
              }
              dragState.startMin = shadowElements.startMin;
              dragState.endMin = shadowElements.endMin;
          } else if (dragState.dragType == "move") {
              // if we're moving, we modify startMin and endMin of the shadow.
              shadowElements = col.getShadowElements(dragState.origMinStart + deltamin,
                                                     dragState.origMinEnd + deltamin);
              dragState.startMin = shadowElements.startMin;
              dragState.endMin = shadowElements.endMin;
              // Keep track of the last start position because it will help to
              // build the event at the end of the drag session.
              dragState.lastStart = dragState.origMinStart + deltamin;
          } else if (dragState.dragType == "modify-start") {
              // if we're modifying the start, the end time is fixed.
              shadowElements = col.getShadowElements(dragState.origMin + deltamin, dragState.limitEndMin);
              dragState.startMin = shadowElements.startMin;
              dragState.endMin = shadowElements.endMin;

              // but we need to not go past the end; if we hit
              // the end, then we'll clamp to the previous snap interval minute
              if (dragState.startMin >= dragState.limitEndMin) {
                  dragState.startMin = Math.ceil((dragState.limitEndMin - snapIntMin) / snapIntMin) * snapIntMin;
              }
          } else if (dragState.dragType == "modify-end") {
              // if we're modifying the end, the start time is fixed.
              shadowElements = col.getShadowElements(dragState.limitStartMin, dragState.origMin + deltamin);
              dragState.startMin = shadowElements.startMin;
              dragState.endMin = shadowElements.endMin;

              // but we need to not go past the start; if we hit
              // the start, then we'll clamp to the next snap interval minute
              if (dragState.endMin <= dragState.limitStartMin) {
                  dragState.endMin = Math.floor((dragState.limitStartMin + snapIntMin) / snapIntMin) * snapIntMin;
              }
          }
          let currentOffset = shadowElements.offset;
          let currentShadows = shadowElements.shadows;

          // now we can update the shadow boxes position and size
          col.updateShadowsBoxes(dragState.startMin, dragState.endMin,
                                 currentOffset, currentShadows,
                                 sizeattr);

          // update the labels
          let lateralColumns = col.firstLastShadowColumns(currentOffset, currentShadows);
          col.updateDragLabels(lateralColumns.firstCol, lateralColumns.lastCol);

          col.mDragState.offset = currentOffset;
          col.mDragState.shadows = currentShadows;
        ]]></body>
      </method>

      <method name="onEventSweepMouseUp">
        <parameter name="event"/>
        <body><![CDATA[
          let col = document.calendarEventColumnDragging;
          if (!col) return;

          let dragState = col.mDragState;

          let lateralColumns = col.firstLastShadowColumns();
          let column = lateralColumns.firstCol;
          let index = lateralColumns.firstIndex;
          while (column && index < dragState.shadows) {
              column.fgboxes.dragbox.removeAttribute("dragging");
              column.fgboxes.box.removeAttribute("dragging");
              column = column.nextSibling;
              index++;
          }

          window.removeEventListener("mousemove", col.onEventSweepMouseMove, false);
          window.removeEventListener("mouseup", col.onEventSweepMouseUp, false);
          window.removeEventListener("keypress", col.onEventSweepKeypress, false);

          document.calendarEventColumnDragging = null;

          // if the user didn't sweep out at least a few pixels, ignore
          // unless we're in a different column
          if (dragState.origColumn == col) {
              var ignore = false;
              if (col.getAttribute("orient") == "vertical") {
                  if (Math.abs(event.screenY - dragState.origLoc) < 3)
                      ignore = true;
              } else {
                  if (Math.abs(event.screenX - dragState.origLoc) < 3)
                      ignore = true;
              }

              if (ignore) {
                  col.mDragState = null;
                  return;
              }
          }

          var newStart;
          var newEnd;
          var startTZ;
          var endTZ;
          let dragDay = col.mDate;
          if (dragState.dragType != "new") {
              var oldStart = dragState.dragOccurrence.startDate ||
                             dragState.dragOccurrence.entryDate ||
                             dragState.dragOccurrence.dueDate;
              var oldEnd = dragState.dragOccurrence.endDate ||
                           dragState.dragOccurrence.dueDate ||
                           dragState.dragOccurrence.entryDate;
              newStart = oldStart.clone();
              newEnd = oldEnd.clone();

              // Our views are pegged to the default timezone.  If the event
              // isn't also in the timezone, we're going to need to do some
              // tweaking. We could just do this for every event but
              // getInTimezone is slow, so it's much better to only do this
              // when the timezones actually differ from the view's.
              if (col.mTimezone != newStart.timezone ||
                  col.mTimezone != newEnd.timezone) {
                  startTZ = newStart.timezone;
                  endTZ = newEnd.timezone;
                  newStart = newStart.getInTimezone(col.calendarView.mTimezone);
                  newEnd = newEnd.getInTimezone(col.calendarView.mTimezone);
              }
          }

          if (dragState.dragType == "modify-start") {
              newStart.resetTo(dragDay.year, dragDay.month, dragDay.day,
                               0, dragState.startMin + col.mStartMin, 0,
                               newStart.timezone);
          } else if (dragState.dragType == "modify-end") {
              newEnd.resetTo(dragDay.year, dragDay.month, dragDay.day,
                             0, dragState.endMin + col.mStartMin, 0,
                             newEnd.timezone);
          } else if (dragState.dragType == "new") {
              let startDay = dragState.origColumn.mDate;
              let draggedForward = (dragDay.compare(startDay) > 0);
              newStart = draggedForward ? startDay.clone() : dragDay.clone();
              newEnd = draggedForward ? dragDay.clone() : startDay.clone();
              newStart.isDate = false;
              newEnd.isDate = false;
              newStart.resetTo(newStart.year, newStart.month, newStart.day,
                               0, dragState.startMin + col.mStartMin, 0,
                               newStart.timezone);
              newEnd.resetTo(newEnd.year, newEnd.month, newEnd.day,
                             0, dragState.endMin + col.mStartMin, 0,
                             newEnd.timezone);

              // Edit the event title on the first of the new event's occurrences
              if (draggedForward) {
                  dragState.origColumn.mCreatedNewEvent = true;
              } else {
                  col.mCreatedNewEvent = true;
              }
          } else if (dragState.dragType == "move") {
              // Figure out the new date-times of the event by adding the duration
              // of the total movement (days and minutes) to the old dates.
              let duration = dragDay.subtractDate(dragState.origColumn.mDate);
              let minutes = dragState.lastStart - dragState.realStart;

              // Since both boxDate and beginMove are dates (note datetimes),
              // subtractDate will only give us a non-zero number of hours on
              // DST changes. While strictly speaking, subtractDate's behavior
              // is correct, we need to move the event a discrete number of
              // days here. There is no need for normalization here, since
              // addDuration does the job for us. Also note, the duration used
              // here is only used to move over multiple days. Moving on the
              // same day uses the minutes from the dragState.
              if (duration.hours == 23) {
                  // entering DST
                  duration.hours++;
              } else if (duration.hours == 1) {
                  // leaving DST
                  duration.hours--;
              }

              if (duration.isNegative) {
                  // Adding negative minutes to a negative duration makes the
                  // duration more positive, but we want more negative, and
                  // vice versa.
                  minutes *= -1;
              }
              duration.minutes = minutes;
              duration.normalize();

              newStart.addDuration(duration);
              newEnd.addDuration(duration);
          }

          // If we tweaked tzs, put times back in their original ones
          if (startTZ) {
              newStart = newStart.getInTimezone(startTZ);
          }
          if (endTZ) {
              newEnd = newEnd.getInTimezone(endTZ);
          }

          if (dragState.dragType == "new") {
              // We won't pass a calendar, since the display calendar is the
              // composite anyway. createNewEvent() will use the selected
              // calendar.
              // TODO We might want to get rid of the extra displayCalendar
              // member.
              col.calendarView.controller.createNewEvent(null,
                                                         newStart,
                                                         newEnd);
          } else if (dragState.dragType == "move" ||
                     dragState.dragType == "modify-start" ||
                     dragState.dragType == "modify-end")
          {
              col.calendarView.controller.modifyOccurrence(dragState.dragOccurrence,
                                                           newStart, newEnd);
          }
          document.calendarEventColumnDragging = null;
          col.mDragState = null;
        ]]></body>
      </method>

      <!-- This is called by an event box when a grippy on either side is dragged,
         - or when the middle is pressed to drag the event to move it.  We create
         - the same type of view that we use to sweep out a new event, but we
         - initialize it based on the event's values and what type of dragging
         - we're doing.  In addition, we constrain things like not being able to
         - drag the end before the start and vice versa.
        -->
      <method name="startSweepingToModifyEvent">
        <parameter name="aEventBox"/>
        <parameter name="aOccurrence"/>
        <!-- "start", "end", "middle" -->
        <parameter name="aGrabbedElement"/>
        <!-- mouse screenX/screenY from the event -->
        <parameter name="aMouseX"/>
        <parameter name="aMouseY"/>
        <parameter name="aSnapInt"/>
        <body><![CDATA[
          if (!isCalendarWritable(aOccurrence.calendar)
              || !userCanModifyItem(aOccurrence)
              || (aOccurrence.calendar instanceof Components.interfaces.calISchedulingSupport && aOccurrence.calendar.isInvitation(aOccurrence))
              || aOccurrence.calendar.getProperty("capabilities.events.supported") === false) {
              return;
          }

          this.mDragState = {
              origColumn: this,
              dragOccurrence: aOccurrence,
              mouseOffset: 0,
              offset: null,
              shadows: null,
              limitStartMin: null,
              lastStart: 0,
              jumpedColumns: 0
          };

          // snap interval: 15 minutes or 1 minute if modifier key is pressed
          let snapIntMin = aSnapInt || 15;
          let sizeattr;
          if (this.getAttribute("orient") == "vertical") {
              this.mDragState.origLoc = aMouseY;
              sizeattr = "height";
          } else {
              this.mDragState.origLoc = aMouseX;
              sizeattr = "width";
          }

          let mins = this.getStartEndMinutesForOccurrence(aOccurrence);

          // these are only used to compute durations or to compute UI
          // sizes, so offset by this.mStartMin for sanity here (at the
          // expense of possible insanity later)
          mins.start -= this.mStartMin;
          mins.end -= this.mStartMin;

          if (aGrabbedElement == "start") {
              this.mDragState.dragType = "modify-start";
              // we have to use "realEnd" as fixed end value
              this.mDragState.limitEndMin = mins.realEnd;

              // snap start
              this.mDragState.origMin = Math.floor(mins.start / snapIntMin) * snapIntMin;

              // show the shadows and drag labels when clicking on gripbars
              let shadowElements = this.getShadowElements(this.mDragState.origMin,
                                                          this.mDragState.limitEndMin);
              this.mDragState.startMin = shadowElements.startMin;
              this.mDragState.endMin = shadowElements.endMin;
              this.mDragState.shadows = shadowElements.shadows;
              this.mDragState.offset = shadowElements.offset;
              this.updateShadowsBoxes(this.mDragState.origMin, this.mDragState.endMin,
                                      0, this.mDragState.shadows,
                                      sizeattr);

              // update drag labels
              let lastCol = this.firstLastShadowColumns().lastCol;
              this.updateDragLabels(this, lastCol);

          } else if (aGrabbedElement == "end") {
              this.mDragState.dragType =  "modify-end";
              // we have to use "realStart" as fixed end value
              this.mDragState.limitStartMin = mins.realStart;

              // snap end
              this.mDragState.origMin = Math.floor(mins.end / snapIntMin) * snapIntMin;

              // show the shadows and drag labels when clicking on gripbars
              let shadowElements = this.getShadowElements(this.mDragState.limitStartMin,
                                                          this.mDragState.origMin);
              this.mDragState.startMin = shadowElements.startMin;
              this.mDragState.endMin = shadowElements.endMin;
              this.mDragState.shadows = shadowElements.shadows;
              this.mDragState.offset = shadowElements.offset;
              this.updateShadowsBoxes(this.mDragState.startMin, this.mDragState.endMin,
                                      shadowElements.offset, this.mDragState.shadows,
                                      sizeattr);

              // update drag labels
              let firstCol = this.firstLastShadowColumns().firstCol;
              this.updateDragLabels(firstCol, this);

          } else if (aGrabbedElement == "middle") {
              this.mDragState.dragType = "move";
              // in a move, origMin will be the start minute of the element where
              // the drag occurs. Along with mouseOffset, it allows to track the
              // shadow position. origMinStart and origMinEnd allow to figure out
              // the real shadow size.
              // We snap to the start and add the real duration to find the end
              let limitDurationMin = mins.realEnd - mins.realStart;
              this.mDragState.origMin = Math.floor(mins.start / snapIntMin) * snapIntMin;
              this.mDragState.origMinStart = Math.floor(mins.realStart / snapIntMin) * snapIntMin;
              this.mDragState.origMinEnd = this.mDragState.origMinStart + limitDurationMin;
              // Keep also track of the real Start, it will be used at the end
              // of the drag session to calculate the new start and end datetimes.
              this.mDragState.realStart = mins.realStart;

              let shadowElements = this.getShadowElements(this.mDragState.origMinStart,
                                                          this.mDragState.origMinEnd);
              this.mDragState.shadows = shadowElements.shadows;
              this.mDragState.offset = shadowElements.offset;
              // we need to set a mouse offset, since we're not dragging from
              // one end of the element
              if (aEventBox) {
                  if (this.getAttribute("orient") == "vertical")
                      this.mDragState.mouseOffset = aMouseY - aEventBox.boxObject.screenY;
                  else
                      this.mDragState.mouseOffset = aMouseX - aEventBox.boxObject.screenX;
              }
          } else {
              // Invalid grabbed element.
          }

          document.calendarEventColumnDragging = this;

          window.addEventListener("mousemove", this.onEventSweepMouseMove, false);
          window.addEventListener("mouseup", this.onEventSweepMouseUp, false);
          window.addEventListener("keypress", this.onEventSweepKeypress, false);
        ]]></body>
      </method>

      <!-- called by sibling columns to tell us to take over the sweeping
         - of an event.
        -->
      <method name="acceptInProgressSweep">
        <parameter name="aDragState"/>
        <body><![CDATA[
          this.mDragState = aDragState;
          document.calendarEventColumnDragging = this;

          this.fgboxes.box.setAttribute("dragging", "true");
          this.fgboxes.dragbox.setAttribute("dragging", "true");

          // the same event handlers are still valid,
          // because they use document.calendarEventColumnDragging.
          // So we really don't have anything to do here.
        ]]></body>
      </method>

      <method name="updateDragLabels">
        <parameter name="aFirstColumn"/>
        <parameter name="aLastColumn"/>
        <body><![CDATA[
          if (!this.mDragState) return;

          let firstColumn = (aFirstColumn || this);
          let lastColumn = (aLastColumn || this);
          let realstartmin = this.mDragState.startMin + this.mStartMin;
          let realendmin = this.mDragState.endMin + this.mStartMin;
          var starthr = Math.floor(realstartmin / 60);
          var startmin = realstartmin % 60;

          var endhr = Math.floor(realendmin / 60);
          var endmin = realendmin % 60;

          var formatter = Components.classes["@mozilla.org/intl/scriptabledateformat;1"].
                          getService(Components.interfaces.nsIScriptableDateFormat);
          var startstr = formatter.FormatTime("",
                                              Components.interfaces.nsIScriptableDateFormat.timeFormatNoSeconds,
                                              starthr, startmin, 0);
          var endstr = formatter.FormatTime("",
                                            Components.interfaces.nsIScriptableDateFormat.timeFormatNoSeconds,
                                            endhr, endmin, 0);

          // Tasks without Entry or Due date have a string as first label
          // instead of the time.
          if (cal.isToDo(this.mDragState.dragOccurrence)) {
              if (!this.mDragState.dragOccurrence.dueDate) {
                  startstr = calGetString("calendar", "dragLabelTasksWithOnlyEntryDate");
              } else if(!this.mDragState.dragOccurrence.entryDate) {
                  startstr = calGetString("calendar", "dragLabelTasksWithOnlyDueDate");
              }
          }
          firstColumn.fgboxes.startlabel.setAttribute("value", startstr);
          lastColumn.fgboxes.endlabel.setAttribute("value", endstr);

        ]]></body>
      </method>

      <method name="setDayStartEndMinutes">
        <parameter name="aDayStartMin"/>
        <parameter name="aDayEndMin"/>
        <body><![CDATA[
          if (aDayStartMin < this.mStartMin || aDayStartMin > aDayEndMin ||
            aDayEndMin > this.mEndMin) {
            throw Components.results.NS_ERROR_INVALID_ARG;
          }
          if (this.mDayStartMin != aDayStartMin ||
            this.mDayEndMin != aDayEndMin) {

            this.mDayStartMin = aDayStartMin;
            this.mDayEndMin = aDayEndMin;
          }
        ]]></body>
      </method>

      <method name="getClickedDateTime">
        <parameter name="event"/>
        <body><![CDATA[
          let newStart = this.date.clone();
          newStart.isDate = false;
          newStart.hour = 0;

          const ROUND_INTERVAL = 15;

          let interval = this.mPixPerMin * ROUND_INTERVAL;
          let pos;
          if (this.getAttribute("orient") == "vertical") {
              pos = event.screenY - this.parentNode.boxObject.screenY;
          } else {
              pos = event.screenX - this.parentNode.boxObject.screenX;
          }
          newStart.minute = (Math.round(pos/interval) * ROUND_INTERVAL) + this.mStartMin;
          event.stopPropagation();
          return newStart;
        ]]></body>
      </method>
    </implementation>

    <handlers>
      <handler event="dblclick" button="0"><![CDATA[
        if (this.calendarView.controller) {
            let newStart = getClickedDateTime(event);
            this.calendarView.controller.createNewEvent(null, newStart, null);
        }
      ]]></handler>

      <handler event="click" button="0"><![CDATA[
        if (!(event.ctrlKey || event.metaKey)) {
          this.calendarView.setSelectedItems(0, []);
          this.focus();
        }
      ]]></handler>

      <handler event="click" button="2"><![CDATA[
        let newStart = getClickedDateTime(event);
        this.calendarView.selectedDateTime = newStart;
      ]]></handler>

      <!-- mouse down handler, in empty event column regions.  Starts sweeping out a new
         - event.
        -->
      <handler event="mousedown"><![CDATA[
        // select this column
        this.calendarView.selectedDay = this.mDate;

        // If the selected calendar is readOnly, we don't want any sweeping.
        let calendar = getSelectedCalendar();
        if (!isCalendarWritable(calendar) ||
            calendar.getProperty("capabilities.events.supported") === false) {
            return;
        }

        // Only start sweeping out an event if the left button was clicked
        if (event.button != 0) {
            return;
        }

        this.mDragState = {
            origColumn: this,
            dragType: "new",
            mouseOffset: 0,
            offset: null,
            shadows: null,
            limitStartMin: null,
            limitEndMin: null,
            jumpedColumns: 0
        };

        // snap interval: 15 minutes or 1 minute if modifier key is pressed
        let snapIntMin = (event.shiftKey &&
                          !event.ctrlKey &&
                          !event.altKey  &&
                          !event.metaKey) ? 1 : 15;
        let interval = this.mPixPerMin * snapIntMin;

        if (this.getAttribute("orient") == "vertical") {
            this.mDragState.origLoc = event.screenY;
            this.mDragState.origMin = Math.floor((event.screenY - this.parentNode.boxObject.screenY)/interval) * snapIntMin;
            this.mDragState.limitEndMin = this.mDragState.origMin;
            this.mDragState.limitStartMin = this.mDragState.origMin;
            this.fgboxes.dragspacer.setAttribute("height", this.mDragState.origMin * this.mPixPerMin);
        } else {
            this.mDragState.origLoc = event.screenX;
            this.mDragState.origMin = Math.floor((event.screenX - this.parentNode.boxObject.screenX)/interval) * snapIntMin;
            this.fgboxes.dragspacer.setAttribute("width", this.mDragState.origMin * this.mPixPerMin);
        }

        document.calendarEventColumnDragging = this;

        window.addEventListener("mousemove", this.onEventSweepMouseMove, false);
        window.addEventListener("mouseup", this.onEventSweepMouseUp, false);
        window.addEventListener("keypress", this.onEventSweepKeypress, false);
      ]]></handler>
    </handlers>
  </binding>

  <binding id="calendar-header-container" extends="chrome://calendar/content/widgets/calendar-widgets.xml#dragndropContainer">
    <content xbl:inherits="selected" flex="1" class="calendar-event-column-header">
        <children/>
    </content>

    <implementation>
      <field name="mItemBoxes">null</field>
      <constructor><![CDATA[
        this.mItemBoxes = new Array();
      ]]></constructor>

      <property name="date">
        <getter><![CDATA[
          return this.mDate;
        ]]></getter>
        <setter><![CDATA[
          this.mDate = val;
          return val;
        ]]></setter>
      </property>
      <method name="findBoxForItem">
        <parameter name="aItem"/>
        <body><![CDATA[
          for each (var item in this.mItemBoxes) {
              if (aItem && item.occurrence.hasSameIds(aItem)) {
                  // We can return directly, since there will only be one box per
                  // item in the header.
                  return item;
              }
          }
          return null;
        ]]></body>
      </method>

      <method name="addEvent">
        <parameter name="aItem"/>
        <body><![CDATA[
          // prevent same items being added
          if (this.mItemBoxes.some(function (itemBox) {
                                     return itemBox.occurrence.hashId == aItem.hashId;
                                   })) {
            return;
          }

          var itemBox = createXULElement("calendar-editable-item");
          this.appendChild(itemBox);
          itemBox.calendarView = this.calendarView;
          itemBox.occurrence = aItem;
          var ctxt = this.calendarView.getAttribute("item-context") ||
                     this.calendarView.getAttribute("context");
          itemBox.setAttribute("context", ctxt);

          if (aItem.hashId in this.calendarView.mFlashingEvents) {
            itemBox.setAttribute("flashing", "true");
          }

          this.mItemBoxes.push(itemBox);
          itemBox.parentBox = this;
        ]]></body>
      </method>

      <method name="deleteEvent">
        <parameter name="aItem"/>
        <body><![CDATA[
          for (var i in this.mItemBoxes) {
            if (this.mItemBoxes[i].occurrence.hashId == aItem.hashId) {
              this.removeChild(this.mItemBoxes[i]);
              this.mItemBoxes.splice(i, 1);
              break;
            }
          }
        ]]></body>
      </method>

      <method name="onDropItem">
        <parameter name="aItem"/>
        <body><![CDATA[
         let newItem = cal.moveItem(aItem, this.mDate);
         newItem = cal.setItemToAllDay(newItem, true);
         return newItem;
        ]]></body>
      </method>

      <method name="selectOccurrence">
        <parameter name="aItem"/>
        <body><![CDATA[
          for each (let itemBox in this.mItemBoxes) {
            if (aItem && (itemBox.occurrence.hashId == aItem.hashId)) {
              itemBox.selected = true;
            }

          }
        ]]></body>
      </method>
      <method name="unselectOccurrence">
        <parameter name="aItem"/>
        <body><![CDATA[
          for each (let itemBox in this.mItemBoxes) {
            if (aItem && (itemBox.occurrence.hashId == aItem.hashId)) {
              itemBox.selected = false;
            }
          }
        ]]></body>
      </method>

    </implementation>

    <handlers>
      <handler event="dblclick" button="0"><![CDATA[
        this.calendarView.controller.createNewEvent(null, this.mDate, null, true);
      ]]></handler>
      <handler event="mousedown"><![CDATA[
        this.calendarView.selectedDay = this.mDate;
      ]]></handler>
      <handler event="click" button="0"><![CDATA[
        if (!(event.ctrlKey || event.metaKey)) {
          this.calendarView.setSelectedItems(0, []);
        }
      ]]></handler>
      <handler event="click" button="2"><![CDATA[
        let newStart = this.calendarView.selectedDay.clone();
        newStart.isDate = true;
        this.calendarView.selectedDateTime = newStart;
        event.stopPropagation();
      ]]></handler>
      <handler event="wheel"><![CDATA[
        if (this.getAttribute("orient") == "vertical") {
            // In vertical view (normal), don't let the parent multiday view
            // handle the scrolling in its bubbling phase. The default action
            // will make the box scroll here.

            // TODO We could scroll by the height of exactly one event box, but
            // since a normal box's boxObject doesn't implement nsIScrollBoxObject,
            // there is no way to scroll by pixels. Using a xul:scrollbox has
            // problems since the equalsize attribute isn't inherited by the
            // inner box, and even if that is worked around, something makes the
            // rotated view look bad in that case.
            event.stopPropagation();
        }
      ]]></handler>
    </handlers>
  </binding>

  <!--
     -  An individual event box, to be inserted into a column.
    -->
  <binding id="calendar-event-box" extends="chrome://calendar/content/calendar-view-core.xml#calendar-editable-item">
    <content mousethrough="never" tooltip="itemTooltip">
        <xul:box xbl:inherits="orient,width,height" flex="1">
          <xul:box anonid="event-container"
                   class="calendar-color-box"
                   xbl:inherits="orient,readonly,flashing,alarm,allday,priority,progress,
                                 status,calendar,categories,calendar-uri,calendar-id,todoType"
                   flex="1">
            <xul:box class="calendar-event-selection" orient="horizontal" flex="1">
              <xul:stack anonid="eventbox"
                         align="stretch"
                         class="calendar-event-box-container"
                         flex="1"
                         xbl:inherits="context,parentorient=orient,readonly,flashing,alarm,allday,priority,progress,status,calendar,categories">
                <xul:hbox class="calendar-event-details"
                          anonid="calendar-event-details"
                          align="start">
                  <xul:image anonid="item-icon"
                             class="calendar-item-image"
                             xbl:inherits="progress,allday,itemType,todoType"/>
                  <xul:description anonid="event-name" class="calendar-event-details-core" flex="1"/>
                  <xul:textbox anonid="event-name-textbox"
                               class="plain calendar-event-details-core calendar-event-name-textbox"
                               flex="1"
                               hidden="true"
                               wrap="true"/>
                </xul:hbox>
                <xul:stack mousethrough="always">
                  <xul:calendar-category-box anonid="category-box" xbl:inherits="categories" pack="end" />
                  <xul:hbox align="right">
                    <xul:hbox anonid="alarm-icons-box"
                              class="alarm-icons-box"
                              pack="end"
                              align="top"
                              xbl:inherits="flashing"/>
                    <xul:image anonid="item-classification-box"
                               class="item-classification-box"
                               pack="end"/>
                  </xul:hbox>
                </xul:stack>
                <xul:box xbl:inherits="orient">
                  <xul:calendar-event-gripbar anonid="gripbar1"
                                              class="calendar-event-box-grippy-top"
                                              mousethrough="never"
                                              whichside="start"
                                              xbl:inherits="parentorient=orient"/>
                  <xul:spacer mousethrough="always" flex="1"/>
                  <xul:calendar-event-gripbar anonid="gripbar2"
                                              class="calendar-event-box-grippy-bottom"
                                              mousethrough="never"
                                              whichside="end"
                                              xbl:inherits="parentorient=orient"/>
                </xul:box>
                <!-- Do not insert anything here, otherwise the event boxes will
                     not be resizable using the gripbars. If you want to insert
                     additional elements, do so above the box with the gripbars. -->
              </xul:stack>
            </xul:box>
          </xul:box>
      </xul:box>
    </content>

    <implementation>
      <constructor><![CDATA[
         this.orient = this.getAttribute("orient");
      ]]></constructor>

      <!-- fields -->
      <field name="mParentColumn">null</field>

      <!-- methods/properties -->
      <method name="setAttribute">
        <parameter name="aAttr"/>
        <parameter name="aVal"/>
        <body><![CDATA[
          var needsrelayout = false;
          if (aAttr == "orient") {
              if (this.getAttribute("orient") != aVal)
                  needsrelayout = true;
          }

          // this should be done using lookupMethod(), see bug 286629
          var ret = XULElement.prototype.setAttribute.call (this, aAttr, aVal);

          if (needsrelayout) {
              var otherorient = "vertical";
              if (val != "horizontal") otherorient = "horizontal";
              var eventbox = document.getAnonymousElementByAttribute(this, "anonid", "eventbox");
              eventbox.setAttribute("orient", val);
              var gb1 = document.getAnonymousElementByAttribute(this, "anonid", "gripbar1");
              gb1.parentorient = val;
              var gb2 = document.getAnonymousElementByAttribute(this, "anonid", "gripbar2");
              gb2.parentorient = val;
          }

          return ret;
        ]]></body>
      </method>

      <method name="getOptimalMinSize">
        <body><![CDATA[
          if (this.getAttribute("orient") == "vertical") {
              var minHeight = getOptimalMinimumHeight(this.eventNameLabel) +
                              getSummarizedStyleValues(document.getAnonymousElementByAttribute(this, "anonid", "eventbox"), ["margin-bottom", "margin-top"]) +
                              getSummarizedStyleValues(this, ["border-bottom-width", "border-top-width"]);
              this.setAttribute("minheight", minHeight);
              this.setAttribute("minwidth", "1");
              return minHeight;
          } else {
              this.eventNameLabel.setAttribute("style", "min-width: 2em");
              var minWidth = getOptimalMinimumWidth(this.eventNameLabel);
              this.setAttribute("minwidth", minWidth);
              this.setAttribute("minheight", "1");
              return minWidth;
          }
        ]]></body>
      </method>

      <property name="parentColumn"
        onget="return this.mParentColumn;"
        onset="return (this.mParentColumn = val);"/>

      <property name="startMinute" readonly="true">
        <getter><![CDATA[
            if (!this.mOccurrence)
                return 0;
            var startDate = this.mOccurrence.startDate || this.mOccurrence.entryDate;
            return startDate.hour * 60 + startDate.minute;
        ]]></getter>
      </property>

      <property name="endMinute" readonly="true">
        <getter><![CDATA[
            if (!this.mOccurrence)
                return 0;
            var endDate = this.mOccurrence.endDate || this.mOccurrence.dueDate;
            return endDate.hour * 60 + endDate.minute;
        ]]></getter>
      </property>

      <method name="setEditableLabel">
        <body><![CDATA[
          var evl = this.eventNameLabel;
          var item = this.mOccurrence;

          if (item.title && item.title != "") {
            // Use <description> textContent so it can wrap.
            evl.textContent = item.title;
          } else {
            evl.textContent = calGetString("calendar", "eventUntitled");
          }

          var gripbar = document.getAnonymousElementByAttribute(this, "anonid", "gripbar1").boxObject.height;
          var height = document.getAnonymousElementByAttribute(this, "anonid", "eventbox").boxObject.height;
          evl.setAttribute("style", "max-height: " + Math.max(0, height-gripbar*2) + "px");
        ]]></body>
      </method>
    </implementation>

    <handlers>
      <handler event="mousedown" button="0"><![CDATA[
        event.stopPropagation();

        if (this.mEditing)
            return;

        this.parentColumn.calendarView.selectedDay = this.parentColumn.mDate;
        this.mMouseX = event.screenX;
        this.mMouseY = event.screenY;

        let whichside = event.whichside;
        if (!whichside) {
            // may be click or drag,
            // so wait for mousemove (or mouseout if fast) to start item move drag
            this.mInMouseDown = true;
            return;
        } else {
            this.calendarView.setSelectedItems(1,
                [event.ctrlKey ? this.mOccurrence.parentItem : this.mOccurrence]);

            let snapIntMin = (event.shiftKey &&
                              !event.ctrlKey &&
                              !event.altKey  &&
                              !event.metaKey) ? 1 : 15;
            // start edge resize drag
            this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, whichside,
                                                         event.screenX, event.screenY,
                                                         snapIntMin);
        }
      ]]></handler>

      <handler event="mousemove"><![CDATA[
        if (!this.mInMouseDown)
            return;
        var dx = Math.abs(event.screenX - this.mMouseX);
        var dy = Math.abs(event.screenY - this.mMouseY);
        // more than a 3 pixel move?
        if ((dx*dx + dy*dy) > 9) {
            if (this.parentColumn) {
                if (this.editingTimer) {
                    clearTimeout(this.editingTimer);
                    this.editingTimer = null;
                }

                this.calendarView.setSelectedItems(1, [this.mOccurrence]);

                this.mEditing = false;

                this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, "middle", this.mMouseX, this.mMouseY);
                this.mInMouseDown = false;
            }
        }
      ]]></handler>

      <handler event="mouseout"><![CDATA[
        if (!this.mEditing && this.mInMouseDown && this.parentColumn) { 
            if (this.editingTimer) {
                clearTimeout(this.editingTimer);
                this.editingTimer = null;
            }

            this.calendarView.setSelectedItems(1, [this.mOccurrence]);

            this.mEditing = false;

            this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, "middle", this.mMouseX, this.mMouseY);
            this.mInMouseDown = false;
        }
      ]]></handler>

      <handler event="mouseup"><![CDATA[
        if (this.mEditing)
            return;

        this.mInMouseDown = false;
      ]]></handler>

      <handler event="mouseover"><![CDATA[
        if (this.calendarView && this.calendarView.controller) {
            event.stopPropagation();
            onMouseOverItem(event);
        }
      ]]></handler>
    </handlers>
  </binding>

  <binding id="calendar-multiday-view" extends="chrome://calendar/content/calendar-base-view.xml#calendar-base-view">
    <content flex="1" orient="vertical" xbl:inherits="context,item-context">
      <xul:box anonid="mainbox" class="multiday-view-main-box" flex="1">
        <!-- these boxes are tricky: width or height in CSS depend on orient -->
        <xul:box anonid="labelbox" class="multiday-view-label-box">
          <xul:box anonid="labeltimespacer" class="multiday-view-label-time-spacer"/>
          <xul:box anonid="labeldaybox"
                   class="multiday-view-label-day-box"
                   flex="1"
                   equalsize="always"/>
          <xul:box anonid="labelscrollbarspacer" class="multiday-labelscrollbarspacer"/>
        </xul:box>
        <xul:box anonid="headerbox" class="multiday-view-header-box">
          <xul:box anonid="headertimespacer" class="multiday-view-header-time-spacer"/>
          <xul:box anonid="headerdaybox" class="multiday-view-header-day-box" flex="1" equalsize="always" />
          <xul:box anonid="headerscrollbarspacer" class="multiday-headerscrollbarspacer"/>
        </xul:box>
        <xul:scrollbox anonid="scrollbox" flex="1">
          <!-- the orient of the calendar-time-bar needs to be the opposite of the parent -->
          <xul:calendar-time-bar xbl:inherits="orient" anonid="timebar"/>
          <xul:box anonid="daybox" class="multiday-view-day-box" flex="1"
                   equalsize="always"/>
        </xul:scrollbox>
      </xul:box>
    </content>

    <implementation implements="calICalendarView">
      <constructor><![CDATA[
        // get day start/end hour from prefs and set on the view
        this.setDayStartEndMinutes(cal.getPrefSafe("calendar.view.daystarthour", 8) * 60,
                                   cal.getPrefSafe("calendar.view.dayendhour", 17) * 60);

        // initially scroll to the day start hour in the view
        this.scrollToMinute(this.mDayStartMin);

        // get visible hours from prefs and set on the view
        let visibleMinutes = cal.getPrefSafe("calendar.view.visiblehours", 9) * 60;
        this.setVisibleMinutes(visibleMinutes);

        var self = this;
        // set the flex attribute at the scrollbox-innerbox
        // (this can be removed, after Bug 343555 is fixed)
        let scrollbox = document.getAnonymousElementByAttribute(
                       this, "anonid", "scrollbox");
        document.getAnonymousElementByAttribute(
            scrollbox, "class", "box-inherit scrollbox-innerbox").flex = "1";

        // set the time interval for the time indicator timer
        this.setTimeIndicatorInterval(getPrefSafe("calendar.view.timeIndicatorInterval", 15));
        this.enableTimeIndicator();

        this.reorient();
      ]]></constructor>

      <property name="daysInView" readonly="true">
        <getter><![CDATA[
          return this.labeldaybox.childNodes && this.labeldaybox.childNodes.length;
        ]]></getter>
      </property>

      <property name="supportsZoom" readonly="true"
                onget="return true;"/>
      <property name="supportsRotation" readonly="true"
                onget="return true"/>

      <method name="setTimeIndicatorInterval">
        <parameter name="aPrefInterval"/>
        <body><![CDATA[
          // If the preference just edited by the user is outside the valid
          // range [0, 1440], we change it into the nearest limit (0 or 1440).
          let newTimeInterval = Math.max(0, Math.min(1440, aPrefInterval));
          if (newTimeInterval != aPrefInterval) {
              cal.setPref("calendar.view.timeIndicatorInterval", newTimeInterval);
          }

          if (newTimeInterval != this.mTimeIndicatorInterval) {
              this.mTimeIndicatorInterval = newTimeInterval;
          }
          if (this.mTimeIndicatorInterval == 0) {
              timeIndicator.cancel();
          }
        ]]></body>
      </method>

      <method name="enableTimeIndicator">
        <body><![CDATA[
          // Hide or show the time indicator if the preference becomes 0 or greater than 0.
          let hideIndicator = this.mTimeIndicatorInterval == 0;
          setBooleanAttribute(this.timeBarTimeIndicator, "hidden", hideIndicator)
          let todayColumn = this.findColumnForDate(this.today());
          if (todayColumn) {
              setBooleanAttribute(todayColumn.column.timeIndicatorBox, "hidden", hideIndicator)
          }
          // Update the timer but only under some circumstances, otherwise
          // it will update the wrong view or it will start without need.
          let currentMode = document.getElementById("modeBroadcaster").getAttribute("mode");
          let currView = currentView().type;
          if (currentMode == "calendar" && currView == this.type && !hideIndicator
              && (currView == "day" || currView == "week")) {
              this.updateTimeIndicatorPosition(true);
          }
        ]]></body>
      </method>

      <method name="updateTimeIndicatorPosition">
        <parameter name="aUpdateTheTimer"/>
        <parameter name="aPpmChanged"/>
        <parameter name="aViewChanged"/>
        <body><![CDATA[
          let now = cal.now();
          let nowMinutes = now.hour * 60 + now.minute;
          if (aUpdateTheTimer) {
              let prefInt = this.mTimeIndicatorInterval;
              if (prefInt == 0) {
                  timeIndicator.cancel()
                  return;
              }

              // Increase the update interval if pixels per minute is small.
              let oldPrefInt = prefInt;
              if (aPpmChanged && this.mPixPerMin < 0.6) {
                  prefInt = Math.round(prefInt / this.mPixPerMin);
              }
              if (!aPpmChanged || aViewChanged || oldPrefInt != prefInt) {
                  // Synchronize the timer with a multiple of the interval.
                  let firstInterval = (prefInt - nowMinutes % prefInt) * 60 - now.second;
                  if (timeIndicator.timer) {
                      timeIndicator.cancel();
                  }
                  timeIndicator.lastView = this.id;
                  let self = this;
                  timeIndicator.timer = setTimeout(function() {self.updateTimeIndicatorPosition(false);
                                                               timeIndicator.start(prefInt * 60, self);},
                                                   firstInterval * 1000);
                  // Set the time for the first positioning of the indicator.
                  let time = Math.floor(nowMinutes / prefInt) * prefInt;
                  document.getElementById("day-view").mTimeIndicatorMinutes = time;
                  document.getElementById("week-view").mTimeIndicatorMinutes = time;
              }
          } else if (aUpdateTheTimer === false) {
              // Set the time for every positioning after the first
              document.getElementById("day-view").mTimeIndicatorMinutes = nowMinutes;
              document.getElementById("week-view").mTimeIndicatorMinutes = nowMinutes;
          }
          // Update the position of the indicator.
          let position = Math.round(this.mPixPerMin * this.mTimeIndicatorMinutes) - 1;
          let posAttr = (this.orient == "vertical" ? "top: " : "left: ");
          this.timeBarTimeIndicator.setAttribute("style", posAttr + position + "px;");
          let todayColumn = this.findColumnForDate(this.today());
          if (todayColumn) {
              todayColumn.column.timeIndicatorBox.setAttribute("style", "margin-" + posAttr + position + "px;");
          }
        ]]></body>
      </method>

      <method name="handlePreference">
        <parameter name="aSubject"/>
        <parameter name="aTopic"/>
        <parameter name="aPreference"/>
        <body><![CDATA[
            aSubject.QueryInterface(Components.interfaces.nsIPrefBranch);
            switch (aPreference) {

                case "calendar.view.daystarthour":
                    this.setDayStartEndMinutes(aSubject.getIntPref(aPreference) * 60,
                                               this.mDayEndMin);
                    this.refreshView();
                    break;

                case "calendar.view.dayendhour":
                    this.setDayStartEndMinutes(this.mDayStartMin,
                                               aSubject.getIntPref(aPreference) * 60);
                    this.refreshView();
                    break;

                case "calendar.view.visiblehours":
                    this.setVisibleMinutes(aSubject.getIntPref(aPreference) * 60);
                    this.refreshView();
                    break;

                case "calendar.view.timeIndicatorInterval":
                    this.setTimeIndicatorInterval(aSubject.getIntPref(aPreference));
                    this.enableTimeIndicator();
                    break;

                default:
                    this.handleCommonPreference(aSubject, aTopic, aPreference);
                    break;
            }
            return;
        ]]></body>
      </method>

      <method name="onResize">
        <parameter name="aRealSelf"/>
        <body><![CDATA[
          let self = this;
          let isARelayout = true;
          if (aRealSelf) {
              self = aRealSelf;
              isARelayout = false;
          }
          let scrollbox = document.getAnonymousElementByAttribute(self, "anonid", "scrollbox");
          let size;
          if (self.orient == "horizontal") {
              size = scrollbox.boxObject.width;
          } else {
              size = scrollbox.boxObject.height;
          }
          let ppm = size / self.mVisibleMinutes;
          ppm = Math.floor(ppm * 1000) / 1000;
          if (ppm < self.mMinPixelsPerMinute) {
              ppm = self.mMinPixelsPerMinute;
          }
          let ppmChanged = (self.pixelsPerMinute != ppm);
          self.pixelsPerMinute = ppm;
          setTimeout(function(){self.scrollToMinute(self.mFirstVisibleMinute)}, 0);

          // Fit the weekday labels while scrolling.
          self.adjustWeekdayLength(self.getAttribute("orient") == "horizontal");

          // Adjust the time indicator position and the related timer.
          if (this.mTimeIndicatorInterval != 0) {
              let viewChanged = isARelayout && (timeIndicator.lastView != this.id);
              let currentMode = document.getElementById("modeBroadcaster").getAttribute("mode");
              if (currentMode == "calendar" && (!timeIndicator.timer || ppmChanged || viewChanged)) {
                  self.updateTimeIndicatorPosition(true, ppmChanged, viewChanged);
              }
          }
        ]]></body>
      </method>

      <!-- mDateList will always be sorted before being set -->
      <field name="mDateList">null</field>
      <!-- array of { date: calIDatetime, column: colbox, header: hdrbox }  -->
      <field name="mDateColumns">null</field>
      <field name="mPixPerMin">0.6</field>
      <field name="mMinPixelsPerMinute">0.1</field>
      <field name="mSelectedDayCol">null</field>
      <field name="mSelectedDay">null</field>
      <field name="mStartMin">0*60</field>
      <field name="mEndMin">24*60</field>
      <field name="mDayStartMin">0</field>
      <field name="mDayEndMin">0</field>
      <field name="mVisibleMinutes">9*60</field>
      <field name="mClickedTime">null</field>
      <field name="mTimeIndicatorInterval">15</field>
      <field name="mModeHandler">null</field>
      <field name="mTimeIndicatorMinutes">0</field>

      <method name="flashAlarm">
        <parameter name="aAlarmItem"/>
        <parameter name="aStop"/>
        <body><![CDATA[
          var showIndicator = cal.getPrefSafe("calendar.alarms.indicator.show", true);
          var totaltime = cal.getPrefSafe("calendar.alarms.indicator.totaltime", 3600);

          if (!aStop && (!showIndicator || totaltime < 1)) {
            // No need to animate if the indicator should not be shown.
            return;
          }

          // Helper function to save some duplicate code
          function setFlashingAttribute(aBox) {
            if (aStop) {
              aBox.removeAttribute("flashing");
            } else {
              aBox.setAttribute("flashing", "true");
            }
          }

          // Make sure the flashing attribute is set or reset on all visible
          // boxes.
          var columns = this.findColumnsForItem(aAlarmItem);
          for each (var col in columns) {
            var box = col.column.findChunkForOccurrence(aAlarmItem);
            if (box && box.eventbox) {
              setFlashingAttribute(box.eventbox);
            }
            box = col.header.findBoxForItem(aAlarmItem);
            if (box) {
              setFlashingAttribute(box);
            }
          }

          if (!aStop) {
            // Set up a timer to stop the flashing after the total time.
            var this_ = this;
            this.mFlashingEvents[aAlarmItem.hashId] = aAlarmItem;
            setTimeout(function() { this_.flashAlarm(aAlarmItem, true) }, totaltime);
          } else {
            // We are done flashing, prevent newly created event boxes from flashing.
            delete this.mFlashingEvents[aAlarmItem.hashId];
          }
        ]]></body>
      </method>

      <!-- calICalendarView -->
      <property name="supportsDisjointDates"
        onget="return true"/>
      <property name="hasDisjointDates"
        onget="return (this.mDateList != null);"/>

      <property name="startDate">
        <getter><![CDATA[
          if (this.mStartDate) return this.mStartDate;
          else if (this.mDateList && this.mDateList.length > 0) return this.mDateList[0];
          else return null;
        ]]></getter>
      </property>

      <property name="endDate">
        <getter><![CDATA[
          if (this.mEndDate) return this.mEndDate;
          else if (this.mDateList && this.mDateList.length > 0) return this.mDateList[this.mDateList.length-1];
          else return null;
        ]]></getter>
      </property>

      <method name="showDate">
        <parameter name="aDate"/>
        <body><![CDATA[
          var targetDate = aDate.getInTimezone(this.mTimezone);
          targetDate.isDate = true;

          if (this.mStartDate && this.mEndDate) {
              if (this.mStartDate.compare(targetDate) <= 0 &&
                  this.mEndDate.compare(targetDate) >= 0)
                  return;
          } else if (this.mDateList) {
              for each (var d in this.mDateList) {
                  // if date is already visible, nothing to do
                  if (d.compare(targetDate) == 0)
                      return;
              }
          }

          // if we're only showing one date, then continue
          // to only show one date; otherwise, show the week.
          if (this.numVisibleDates == 1) {
            this.setDateRange(aDate, aDate);
          } else {
            this.setDateRange(aDate.startOfWeek, aDate.endOfWeek);
          }

          this.selectedDay = targetDate;
        ]]></body>
      </method>

      <method name="setDateRange">
        <parameter name="aStartDate"/>
        <parameter name="aEndDate"/>
        <body><![CDATA[
          this.rangeStartDate = aStartDate;
          this.rangeEndDate = aEndDate;
          // normalize dates to display timezone
          var startDate = aStartDate.getInTimezone(this.mTimezone);
          startDate.isDate = true;
          var endDate = aEndDate.getInTimezone(this.mTimezone);
          endDate.isDate = true;
          // make sure unnormalized version not used below
          aStartDate = aEndDate = null;

          if (this.mStartDate && this.mEndDate &&
              this.mStartDate.compare(startDate) == 0 &&
              this.mEndDate.compare(endDate) == 0) {
              // Do not change anything if the date range already matches.
              // XXX In general it should be possible to return here, but
              // lightning doesn't like it when first initializing the view.
              // return;
          }

          if (this.mDisplayDaysOff) {
            // tell old date columns to forget old selected occurrences.
            var selectedItems = this.getSelectedItems({});
            this.setSelectedItems(0, [], true); // suppress event, will restore

            startDate.makeImmutable();
            endDate.makeImmutable();
            this.mDateList = null;
            this.mStartDate = startDate;
            this.mEndDate = endDate;
            //
            // For a true multiday view (e.g, 3 days advanced by one day
            // at a time), a smarter refresh could reuse boxes, comparing
            // the current date range and add/remove, instead of just
            // replacing.
            //
            this.refresh();

            // restore selected item occurrences in view with new date columns.
            this.setSelectedItems(selectedItems.length, selectedItems, true);
          } else { // workdays only
            var dateList = new Array();
            for (var d = startDate.clone(); d.compare(endDate) <= 0;) {
              if (this.mDaysOffArray.indexOf(d.weekday) == -1) {
                var workday = d.clone();
                workday.makeImmutable();
                dateList.push(workday);
              }
              d.day += 1;
            }
            this.setDateList(dateList.length, dateList);
          }

          // Update the navigation bar.
          cal.navigationBar.setDateRange(startDate, endDate);
        ]]></body>
      </method>

      <method name="setDateList">
        <parameter name="aCount"/>
        <parameter name="aDates"/>
        <body><![CDATA[
          // tell old date columns to forget old selected occurrences.
          var selectedItems = this.getSelectedItems({});
          this.setSelectedItems(0, [], true); // suppress event, will restore

          this.mStartDate = null;
          this.mEndDate = null;

          if (aCount == 0) {
              this.mDateList = null;
          } else {
              aDates.sort (function(a, b) { return a.compare(b); });
              this.mDateList = aDates.map(
                  function dateMapper(d) {
                      if (d.isDate && !d.isMutable)
                          return d;

                      var newDate = d.clone();
                      newDate.isDate = true;
                      newDate.makeImmutable();
                      return newDate;
                  }
              );
          }

          this.refresh();

          // restore selected item occurrences in view with new date columns.
          this.setSelectedItems(selectedItems.length, selectedItems, true);
        ]]></body>
      </method>

      <method name="getDateList">
        <parameter name="aCount"/>
        <body><![CDATA[
           var dates = new Array();
           if (this.mStartDate && this.mEndDate) {
               var d = this.mStartDate.clone();
               while (d.compare(this.mEndDate) <= 0) {
                   dates.push(d.clone());
                   d.day += 1;
               }
           } else if (this.mDateList) {
               for each (var d in this.mDateList)
                   dates.push(d.clone());
           }

           aCount.value = dates.length;
           return dates;
        ]]></body>
      </method>

      <property name="selectedDateTime">
        <getter><![CDATA[
            return this.mClickedTime;
        ]]></getter>
        <setter><![CDATA[
            this.mClickedTime = val;
        ]]></setter>
      </property>

      <property name="selectedDay">
        <getter><![CDATA[
          var selected;
          if (this.numVisibleDates == 1) {
              selected = this.mDateColumns[0].date;
          } else if (this.mSelectedDay) {
              selected = this.mSelectedDay;
          } else if (this.mSelectedDayCol) {
              selected = this.mSelectedDayCol.date;
          }

          // TODO Make sure the selected day is valid
          // TODO select now if it is in the range?
          return selected;
        ]]></getter>
        <setter><![CDATA[
          // ignore if just 1 visible, it's always selected,
          // but we don't indicate it
          if (this.numVisibleDates == 1) {
            this.fireEvent("dayselect", val);
            return val;
          }

          if (this.mSelectedDayCol) {
            this.mSelectedDayCol.column.selected = false;
            this.mSelectedDayCol.header.removeAttribute("selected");
          }

          if (val) {
            this.mSelectedDayCol = this.findColumnForDate(val);
            if (this.mSelectedDayCol) {
              this.mSelectedDay = this.mSelectedDayCol.date;
              this.mSelectedDayCol.column.selected = true;
              this.mSelectedDayCol.header.setAttribute("selected", "true");
            } else {
              this.mSelectedDay = val;
            }
          }
          var headerColLabel = this.selectColumnHeader(val);
          this.fireEvent("dayselect", val);
          return val;
        ]]></setter>
      </property>

      <method name="getSelectedItems">
        <parameter name="aCount"/>
        <body><![CDATA[
          aCount.value = this.mSelectedItems.length;
          return this.mSelectedItems;
        ]]></body>
      </method>
      <method name="setSelectedItems">
        <parameter name="aCount"/>
        <parameter name="aItems"/>
        <parameter name="aSuppressEvent"/>
        <body><![CDATA[
          for each (var item in this.mSelectedItems) {
              for each (var occ in this.getItemOccurrencesInView(item)) {
                  var cols = this.findColumnsForItem(occ);
                  for each (let col in cols) {
                      col.header.unselectOccurrence(occ);
                      col.column.unselectOccurrence(occ);
                  }
              }
          }
          this.mSelectedItems = aItems || [];

          for each (var item in this.mSelectedItems) {
              for each (var occ in this.getItemOccurrencesInView(item)) {
                  let cols = this.findColumnsForItem(occ);
                  if (cols.length > 0) {
                      let start = item.startDate || item.entryDate || item.dueDate;
                      for each (let col in cols) {
                          if (start.isDate) {
                              col.header.selectOccurrence(occ);
                          } else {
                              col.column.selectOccurrence(occ);
                          }
                      }
                  }
              }
          }

          if (!aSuppressEvent) {
              this.fireEvent("itemselect", this.mSelectedItems);
          }
        ]]></body>
      </method>

      <method name="getItemOccurrencesInView">
        <parameter name="aItem"/>
        <body><![CDATA[
          if (aItem.recurrenceInfo && aItem.recurrenceStartDate) {
              // if selected a parent item, show occurrence(s) in view range
              return aItem.getOccurrencesBetween(this.startDate, this.queryEndDate, {}, 0);
          } else if (aItem.recurrenceStartDate) {
              return [aItem];
          } else { // undated todo
              return [];
          }
        ]]></body>
      </method>

      <method name="centerSelectedItems">
        <body><![CDATA[
          var displayTZ = calendarDefaultTimezone();
          var lowMinute = 24 * 60;
          var highMinute = 0;

          for each (var item in this.mSelectedItems) {
              var startDateProperty = calGetStartDateProp(item);
              var endDateProperty = calGetEndDateProp(item);

              var occs = [];
              if (item.recurrenceInfo) {
                  // if selected a parent item, show occurrence(s) in view range
                  occs = item.getOccurrencesBetween(this.startDate, this.queryEndDate, {}, 0);
              } else {
                  occs = [item];
              }

              for each (var occ in occs) {
                  var occStart = occ[startDateProperty];
                  var occEnd = occ[endDateProperty];
                  // must have at least one of start or end
                  if (!occStart && !occEnd) {
                      continue; // task with no dates
                  }

                  // if just has single datetime, treat as zero duration item
                  // (such as task with due datetime or start datetime only)
                  occStart = (occStart || occEnd);
                  occEnd   = (occEnd || occStart);
                  // Now both occStart and occEnd are datetimes.

                  // skip occurrence if all-day: it won't show in time view.
                  if (occStart.isDate || occEnd.isDate) {
                     continue;
                  }

                  // Trim dates to view.  (Not mutated so just reuse view dates)
                  if (this.startDate.compare(occStart) > 0) {
                      occStart = this.startDate;
                  }
                  if (this.queryEndDate.compare(occEnd) < 0) {
                      occEnd = this.queryEndDate;
                  }

                  // Convert to display timezone if different
                  if (occStart.timezone != displayTZ) {
                      occStart = occStart.getInTimezone(displayTZ);
                  }
                  if (occEnd.timezone != displayTZ) { 
                      occEnd = occEnd.getInTimezone(displayTZ);
                  }
                  // If crosses midnite in current TZ, set end just
                  // before midnite after start so start/title usually visible.
                  if (!sameDay(occStart, occEnd)) {
                      occEnd = occStart.clone();
                      occEnd.day = occStart.day;
                      occEnd.hour = 23;
                      occEnd.minute = 59;
                  }

                  // Ensure range shows occ
                  lowMinute = Math.min(occStart.hour * 60 + occStart.minute,
                                       lowMinute);
                  highMinute = Math.max(occEnd.hour * 60 + occEnd.minute,
                                        highMinute);
              }
          }

          var displayDuration = highMinute - lowMinute;
          if (this.mSelectedItems.length &&
              displayDuration >= 0) {
              let minute;
              if (displayDuration <= this.mVisibleMinutes) {
                  minute = lowMinute + (displayDuration - this.mVisibleMinutes) / 2
              } else if (this.mSelectedItems.length == 1) {
                  // If the displayDuration doesn't fit into the visible
                  // minutes, but only one event is selected, then go ahead and
                  // center the event start.

                  minute = Math.max(0, lowMinute - (this.mVisibleMinutes / 2));
              }
              this.scrollToMinute(minute);
          }
        ]]></body>
      </method>

      <property name="pixelsPerMinute">
        <getter><![CDATA[
          return this.mPixPerMin
        ]]></getter>
        <setter><![CDATA[
          this.mPixPerMin = val;

          let timebar = document.getAnonymousElementByAttribute(this, "anonid", "timebar");
          timebar.pixelsPerMinute = val;

          for each (let col in this.mDateColumns) {
              col.column.pixelsPerMinute = val;
          }
          return val;
        ]]></setter>
      </property>

      <!-- private -->

      <property name="numVisibleDates" readonly="true">
        <getter><![CDATA[
          if (this.mDateList)
            return this.mDateList.length;

          var count = 0;

          if (!this.mStartDate || !this.mEndDate) {
            // The view has not been initialized, so there are 0 visible dates.
            return count;
          }

          var d = this.mStartDate.clone();
          while (d.compare(this.mEndDate) <= 0) {
            count++;
            d.day += 1;
          }

          return count;
        ]]></getter>
      </property>

      <property name="orient">
        <getter><![CDATA[return (this.getAttribute("orient") || "vertical");]]></getter>
        <setter><![CDATA[this.setAttribute("orient", val); return val;]]></setter>
      </property>

      <property name="timeBarTimeIndicator" readonly="true">
        <getter><![CDATA[
          let timebar = document.getAnonymousElementByAttribute(this, "anonid", "timebar");
          return document.getAnonymousElementByAttribute(timebar, "anonid", "timeIndicatorBoxTimeBar");
        ]]></getter>
      </property>

      <method name="setAttribute">
        <parameter name="aAttr"/>
        <parameter name="aVal"/>
        <body><![CDATA[
          var needsreorient = false;
          var needsrelayout = false;
          if (aAttr == "orient") {
              if (this.getAttribute("orient") != aVal)
                  needsreorient = true;
          }

          if (aAttr == "context" || aAttr == "item-context")
              needsrelayout = true;

          // this should be done using lookupMethod(), see bug 286629
          var ret = XULElement.prototype.setAttribute.call (this, aAttr, aVal);

          if (needsrelayout && !needsreorient)
              this.relayout();

          if (needsreorient)
              this.reorient();

          return ret;
        ]]></body>
      </method>

      <method name="reorient">
        <body><![CDATA[
          var orient = this.getAttribute("orient");
          var otherorient = "vertical";
          if (!orient) orient = "horizontal";
          if (orient == "vertical") otherorient = "horizontal";

          if (orient == "horizontal") {
              this.pixelsPerMinute = 1.5;
          } else {
              this.pixelsPerMinute = 0.6;
          }

          var normalelems = ['mainbox', 'timebar'];
          var otherelems = ['labelbox', 'labeldaybox', 'headertimespacer',
                            'headerbox', 'headerdaybox', 'scrollbox', 'daybox'];

          for each (var id in normalelems) {
              document.getAnonymousElementByAttribute(this, "anonid", id).setAttribute("orient", orient);
          }
          for each (var id in otherelems) {
              document.getAnonymousElementByAttribute(this, "anonid", id).setAttribute("orient", otherorient);
          }

          var scrollbox = document.getAnonymousElementByAttribute(
                         this, "anonid", "scrollbox");
          var mainbox = document.getAnonymousElementByAttribute(
                        this, "anonid", "mainbox");

          if (orient == "vertical") {
              scrollbox.setAttribute(
                  "style", "overflow-x: hidden; overflow-y: auto;");
              mainbox.setAttribute(
                  "style", "overflow-x: auto; overflow-y: hidden;");
          } else {
              scrollbox.setAttribute(
                  "style", "overflow-x: auto; overflow-y: hidden;");
              mainbox.setAttribute(
                  "style", "overflow-x: hidden; overflow-y: auto;");
          }

          var boxes = ["daybox", "headerdaybox"];
          for each (var boxname in boxes) {
              var box = document.getAnonymousElementByAttribute(this, "anonid", boxname);
              setAttributeToChildren(box, "orient", orient);
          }
          var box = document.getAnonymousElementByAttribute(this, "anonid", "labeldaybox");
          setAttributeToChildren(this.labeldaybox, "orient", otherorient);

          // Refresh
          this.refresh();
        ]]></body>
      </method>

      <method name="relayout">
        <body><![CDATA[
          var orient = this.getAttribute("orient");
          if (!orient) orient = "horizontal";
          var otherorient = getOtherOrientation(orient);

          var computedDateList;
          if (this.mDateList) {
              computedDateList = this.mDateList;
          } else if (this.mStartDate && this.mEndDate) {
              computedDateList = new Array();

              var theDate = this.mStartDate.clone();
              while (theDate.compare(this.mEndDate) <= 0) {
                  computedDateList.push(theDate.clone());
                  theDate.day += 1;
              }
          }

          var daybox = document.getAnonymousElementByAttribute(this, "anonid", "daybox");
          var headerdaybox = document.getAnonymousElementByAttribute(this, "anonid", "headerdaybox");

          if (!computedDateList || computedDateList.length == 0)
              return;

          var calView = this;
          var dayStartMin = this.mDayStartMin;
          var dayEndMin = this.mDayEndMin;
          function setUpDayEventsBox(aDayBox) {
              aDayBox.setAttribute("class", "calendar-event-column-" + (counter % 2 == 0 ? "even" : "odd"));
              aDayBox.setAttribute("context", calView.getAttribute("context"));
              aDayBox.setAttribute("item-context", calView.getAttribute("item-context") || calView.getAttribute("context"));
              aDayBox.startLayoutBatchChange();
              aDayBox.date = d;
              aDayBox.setAttribute("orient", orient);
              aDayBox.calendarView = calView;
              aDayBox.setDayStartEndMinutes(dayStartMin, dayEndMin);
          }

          function setUpDayHeaderBox(aDayBox) {
              aDayBox.date = d;
              aDayBox.calendarView = calView;
              aDayBox.setAttribute("orient", "vertical");
              // Since the calendar-header-container boxes have the same vertical
              // orientation for normal and rotated views, it needs an attribute
              // "rotated" in order to have different css rules.
              setBooleanAttribute(aDayBox, "rotated", orient == "horizontal");
          }

          this.mDateColumns = new Array();


          // get today's date
          var today = this.today();
          var counter = 0;
          var dayboxkids = daybox.childNodes;
          var headerboxkids = headerdaybox.childNodes;
          let labelboxkids = this.labeldaybox.childNodes;
          let updateTimeIndicator = false;

          for each (var d in computedDateList) {
              var dayEventsBox;
              if (counter < dayboxkids.length) {
                  dayEventsBox = dayboxkids[counter];
                  dayEventsBox.removeAttribute("relation");
                  dayEventsBox.mEventInfos = new Array();
              } else {
                  dayEventsBox = createXULElement("calendar-event-column");
                  dayEventsBox.setAttribute("flex", "1");
                  daybox.appendChild(dayEventsBox);
              }
              setUpDayEventsBox(dayEventsBox);

              var dayHeaderBox;
              if (counter < headerboxkids.length) {
                  dayHeaderBox = headerboxkids[counter];
                  // Delete backwards to make sure we get them all
                  // and delete until no more elements are left.
                  while(dayHeaderBox.mItemBoxes.length != 0) {
                      var num = dayHeaderBox.mItemBoxes.length;
                      dayHeaderBox.deleteEvent(dayHeaderBox.mItemBoxes[num-1].occurrence);
                  }
              } else {
                  dayHeaderBox = createXULElement("calendar-header-container");
                  dayHeaderBox.setAttribute("flex", "1");
                  headerdaybox.appendChild(dayHeaderBox);
              }
              setUpDayHeaderBox(dayHeaderBox);

              if (0 <= this.mDaysOffArray.indexOf(d.weekday)) {
                  dayEventsBox.dayOff = true;
                  dayHeaderBox.setAttribute("weekend", "true");
              } else {
                  dayEventsBox.dayOff = false;
                  dayHeaderBox.removeAttribute("weekend");
              }
              var labelbox;
              if (counter < labelboxkids.length) {
                  labelbox = labelboxkids[counter];
                  labelbox.date = d;
              } else {
                  labelbox = createXULElement("calendar-day-label");
                  labelbox.setAttribute("orient", otherorient);
                  this.labeldaybox.appendChild(labelbox);
                  labelbox.date = d;
              }
              // Set attributes for date relations and for the time indicator.
              let headerDayBox = document.getAnonymousElementByAttribute(
                                     this, "anonid", "headerdaybox");
              headerDayBox.removeAttribute("todaylastinview");
              dayEventsBox.timeIndicatorBox.setAttribute("hidden", "true");
              switch (d.compare(today)) {
                  case -1:
                      dayHeaderBox.setAttribute("relation", "past");
                      dayEventsBox.setAttribute("relation", "past");
                      labelbox.setAttribute("relation", "past");
                      break;
                  case 0:
                      let relation_ = this.numVisibleDates == 1 ? "today1day" : "today";
                      dayHeaderBox.setAttribute("relation", relation_);
                      dayEventsBox.setAttribute("relation", relation_);
                      labelbox.setAttribute("relation", relation_);
                      setBooleanAttribute(dayEventsBox.timeIndicatorBox, "hidden", this.mTimeIndicatorInterval == 0)
                      updateTimeIndicator = true;

                      // Due to equalsize=always being set on the dayboxes
                      // parent, there are a few issues showing the border of
                      // the last daybox correctly. To work around this, we're
                      // setting an attribute we can use in CSS. For more
                      // information about this hack, see bug 455045
                      if (dayHeaderBox == headerdaybox.childNodes[headerdaybox.childNodes.length - 1] &&
                          this.numVisibleDates > 1) {
                          headerDayBox.setAttribute("todaylastinview", "true");
                      }
                      break;
                  case 1:
                      dayHeaderBox.setAttribute("relation", "future");
                      dayEventsBox.setAttribute("relation", "future");
                      labelbox.setAttribute("relation", "future");
                      break;
              }
              // We don't want to actually mess with our original dates, plus
              // they're likely to be immutable.
              var d2 = d.clone();
              d2.isDate = true;
              d2.makeImmutable();
              this.mDateColumns.push ( { date: d2, column: dayEventsBox, header: dayHeaderBox } );
              counter++;
          }

          // Remove any extra columns that may have been hanging around
          function removeExtraKids(elem) {
              while (counter < elem.childNodes.length) {
                  elem.removeChild(elem.childNodes[counter]);
              }
          }
          removeExtraKids(daybox);
          removeExtraKids(headerdaybox);
          removeExtraKids(this.labeldaybox);

          if (updateTimeIndicator) {
              this.updateTimeIndicatorPosition();
          }

          // fix pixels-per-minute
          this.onResize();
          for each (let col in this.mDateColumns) {
               col.column.endLayoutBatchChange();
          }

          // Adjust scrollbar spacers
          this.adjustScrollBarSpacers();
        ]]></body>
      </method>

      <method name="findColumnForDate">
        <parameter name="aDate"/>
        <body><![CDATA[
          for each (var col in this.mDateColumns) {
              if (col.date.compare(aDate) == 0)
                  return col;
          }
          return null;
        ]]></body>
      </method>

      <method name="findDayBoxForDate">
        <parameter name="aDate"/>
        <body><![CDATA[
            let col = this.findColumnForDate(aDate);
            return (col && col.header);
        ]]></body>
      </method>

      <method name="selectColumnHeader">
        <parameter name="aDate"/>
        <body><![CDATA[
          let child = this.labeldaybox.firstChild;
          while (child) {
              if (child.date.compare(aDate) == 0) {
                  child.setAttribute("selected", "true");
              } else {
                  child.removeAttribute("selected");
              }
              child = child.nextSibling;
            }
        ]]></body>
      </method>

      <method name="findColumnsForOccurrences">
        <parameter name="aOccurrences"/>
        <body><![CDATA[
          if (!this.mDateColumns || !this.mDateColumns.length) {
            return [];
          }

          var occMap = {};
          for each (var occ in aOccurrences) {
              var startDate = occ[calGetStartDateProp(occ)]
                              .getInTimezone(this.mStartDate.timezone);
              var endDate = occ[calGetEndDateProp(occ)]
                              .getInTimezone(this.mEndDate.timezone) || startDate;
              if (startDate.compare(this.mStartDate) >= 0 &&
                  endDate.compare(this.mEndDate) <= 0) {
                  for (var i = startDate.day; i <= endDate.day; i++) {
                      occMap[i] = true;
                  }
              }
          }

          return this.mDateColumns.filter(function(col) {
              return (col.date.day in occMap);
          });
        ]]></body>
      </method>

      <method name="findColumnsForItem">
        <parameter name="aItem"/>
        <body><![CDATA[
          let columns = new Array();

          if (!this.mDateColumns) {
            return columns;
          }

          // Note that these may be dates or datetimes
          let startDate = aItem.startDate || aItem.entryDate || aItem.dueDate;
          if (!startDate) {
              return columns;
          }
          let tz = this.mDateColumns[0].date.timezone;
          let targetDate = startDate.getInTimezone(tz);
          let finishDate = (aItem.endDate || aItem.dueDate || aItem.entryDate || startDate)
                               .getInTimezone(tz);

          if (!targetDate.isDate) {
            // Set the time to 00:00 so that we get all the boxes
            targetDate.hour = 0;
            targetDate.minute = 0;
            targetDate.second = 0;
          }

          if (targetDate.compare(finishDate) == 0) {
              // We have also to handle zero length events in particular for
              // tasks without entry or due date.
              let col = this.findColumnForDate(targetDate);
              if (col) {
                  columns.push(col);
              }
          }

          while (targetDate.compare(finishDate) == -1) {
            let col = this.findColumnForDate(targetDate);

            // This might not exist if the event spans the view start or end
            if (col) {
                columns.push(col);
            }
            targetDate.day += 1;
          }

          return columns;
        ]]></body>
      </method>

      <!-- for the given client-coord-system point, return
         - the calendar-event-column that contains it.  If
         - no column contains it, return null.
        -->
      <method name="findColumnForClientPoint">
        <parameter name="aClientX"/>
        <parameter name="aClientY"/>
        <body><![CDATA[
          for each (var col in this.mDateColumns) {
              let bo = document.getAnonymousElementByAttribute(col.column, "anonid", "boxstack").boxObject;
              if ((aClientX >= bo.screenX) && (aClientX <= (bo.screenX + bo.width)) &&
                  (aClientY >= bo.screenY) && (aClientY <= (bo.screenY + bo.height)))
              {
                  return col.column;
              }
          }
          return null;
        ]]></body>
      </method>

      <method name="adjustScrollbarSpacersForAlldayEvents">
        <parameter name="aEvent"/>
        <body><![CDATA[
          var startDate = aEvent[calGetStartDateProp(aEvent)];
          var endDate = aEvent[calGetEndDateProp(aEvent)];
          if (startDate && startDate.isDate ||
              endDate && endDate.isDate) {
              // If this is an all day event, then the header with allday
              // events could possibly get a scrollbar. Readjust them.
              this.adjustScrollBarSpacers();
          }
        ]]></body>
      </method>

      <method name="doAddItem">
        <parameter name="aEvent"/>
        <body><![CDATA[
          var cols = this.findColumnsForItem(aEvent);
          if (!cols.length)
              return;

          for each (let col in cols) {
              let column = col.column;
              let header = col.header;

              let estart = aEvent.startDate || aEvent.entryDate || aEvent.dueDate;
              if (estart.isDate) {
                  header.addEvent(aEvent);
              } else {
                  column.addEvent(aEvent);
              }
          }

          this.adjustScrollbarSpacersForAlldayEvents(aEvent);
        ]]></body>
      </method>

      <method name="doDeleteItem">
        <parameter name="aEvent"/>
        <body><![CDATA[
          var cols = this.findColumnsForItem(aEvent);
          if (!cols.length)
              return;

          function isNotItem(a) {
              return (a.hashId != aEvent.hashId);
          }
          var oldLength = this.mSelectedItems.length;
          this.mSelectedItems = this.mSelectedItems.filter(isNotItem);

          for each (let col in cols) {
              let column = col.column;
              let header = col.header;

              let estart = aEvent.startDate || aEvent.entryDate || aEvent.dueDate;
              if (estart.isDate) {
                  header.deleteEvent(aEvent);
              } else {
                  column.deleteEvent(aEvent);
              }
          }

          // If a deleted event was selected, we need to announce that the
          // selection changed.
          if (oldLength != this.mSelectedItems.length) {
              this.fireEvent("itemselect", this.mSelectedItems);
          }

          this.adjustScrollbarSpacersForAlldayEvents(aEvent);
        ]]></body>
      </method>

      <method name="deleteItemsFromCalendar">
        <parameter name="aCalendar"/>
        <body><![CDATA[
          for each (let col in this.mDateColumns) {
              // get all-day events in column header and events within the column
              let colEvents = [ box.occurrence for each (box in col.header.mItemBoxes) ]
                              .concat([ info.event for each (info in col.column.mEventInfos) ]);

              for each (let event in colEvents) {
                  if (event.calendar.id == aCalendar.id) {
                      this.doDeleteItem(event);
                  }
              }
          }
        ]]></body>
      </method>

      <method name="adjustScrollBarSpacers">
        <body><![CDATA[
          // get the view's orientation
          var propertyName;
          if (this.getAttribute("orient") == "vertical") {
              propertyName = "width";
          } else {
              propertyName = "height";
          }

          // get the width/height of the scrollbox scrollbar
          var scrollbox = document.getAnonymousElementByAttribute(
                         this, "anonid", "scrollbox");
          var propertyValue = scrollbox.boxObject.firstChild
                              .boxObject[propertyName];
          // Check if we need to show the headerScrollbarSpacer at all
          var headerPropertyValue = propertyValue;
          var headerDayBox = document.getAnonymousElementByAttribute(
                             this, "anonid", "headerdaybox");
          if (headerDayBox) {
            // Only do this when there are multiple days
            var headerDayBoxMaxHeight = parseInt(document.defaultView.getComputedStyle(headerDayBox, null)
                                                         .getPropertyValue("max-height"), 10);
            if (this.getAttribute("orient") == "vertical" &&
                headerDayBox.boxObject.height >= headerDayBoxMaxHeight) {
                // If the headerDayBox is just as high as the max-height, then
                // there is already a scrollbar and we don't need to show the
                // headerScrollbarSpacer. This is only valid for the non-rotated
                // view.
                headerPropertyValue = 0;
            }
          }

          // set the same width/height for the label and header box spacers
          var headerScrollBarSpacer = document.getAnonymousElementByAttribute(
                                      this, "anonid", "headerscrollbarspacer");
          headerScrollBarSpacer.setAttribute(propertyName, headerPropertyValue);
          var labelScrollBarSpacer = document.getAnonymousElementByAttribute(
                                     this, "anonid", "labelscrollbarspacer");
          labelScrollBarSpacer.setAttribute(propertyName, propertyValue);
        ]]></body>
      </method>

      <field name="mFirstVisibleMinute">0</field>
      <method name="scrollToMinute">
        <parameter name="aMinute"/>
        <body><![CDATA[
          let scrollbox = document.getAnonymousElementByAttribute(this, "anonid", "scrollbox");
          let scrollBoxObject = scrollbox.boxObject.QueryInterface(Components.interfaces.nsIScrollBoxObject);
          // 'aMinute' will be the first minute showed in the view, so it must
          // belong to the range 0 <-> (24*60 - minutes_showed_in_the_view) but
          // we consider 25 hours instead of 24 to let the view scroll until
          // showing events that start just before 0.00
          let maxFirstMin = 25 * 60 - Math.round(scrollBoxObject.height / this.mPixPerMin);
          aMinute = Math.min(maxFirstMin, Math.max(0, aMinute));

          if (scrollBoxObject && scrollbox.scrollHeight > 0) {
            let x = {}, y = {};
            scrollBoxObject.getPosition(x, y);
            let pos = Math.round(aMinute * this.mPixPerMin);
            if (scrollbox.getAttribute("orient") == "horizontal") {
              scrollBoxObject.scrollTo(x.value, pos);
            } else {
              scrollBoxObject.scrollTo(pos, y.value);
            }
          }

          // Set the first visible minute in any case, we want to move to the
          // right minute as soon as possible if we couldn't do so above.
          this.mFirstVisibleMinute = aMinute;
        ]]></body>
      </method>

      <method name="setDayStartEndMinutes">
        <parameter name="aDayStartMin"/>
        <parameter name="aDayEndMin"/>
        <body><![CDATA[
          if (aDayStartMin < this.mStartMin || aDayStartMin > aDayEndMin ||
            aDayEndMin > this.mEndMin) {
            throw Components.results.NS_ERROR_INVALID_ARG;
          }
          if (this.mDayStartMin != aDayStartMin ||
            this.mDayEndMin != aDayEndMin) {

            this.mDayStartMin = aDayStartMin;
            this.mDayEndMin = aDayEndMin;

            // Also update on the time-bar
            document.getAnonymousElementByAttribute(this, "anonid", "timebar")
                    .setDayStartEndHours(this.mDayStartMin / 60,
                                         this.mDayEndMin / 60);
          }

        ]]></body>
      </method>

      <method name="setVisibleMinutes">
        <parameter name="aVisibleMinutes"/>
        <body><![CDATA[
          if (aVisibleMinutes <= 0 ||
            aVisibleMinutes > (this.mEndMin - this.mStartMin)) {
            throw Components.results.NS_ERROR_INVALID_ARG;
          }
          if (this.mVisibleMinutes != aVisibleMinutes) {
            this.mVisibleMinutes = aVisibleMinutes;
          }
          return this.mVisibleMinutes;
        ]]></body>
      </method>

      <method name="zoomIn">
        <parameter name="aLevel"/>
        <body><![CDATA[
          let visibleHours = cal.getPrefSafe("calendar.view.visiblehours", 9);
          visibleHours += (aLevel || 1);

          cal.setPref("calendar.view.visiblehours", Math.min(visibleHours, 24));
        ]]></body>
      </method>
      <method name="zoomOut">
        <parameter name="aLevel"/>
        <body><![CDATA[
          let visibleHours = cal.getPrefSafe("calendar.view.visiblehours", 9);
          visibleHours -= (aLevel || 1);

          cal.setPref("calendar.view.visiblehours", Math.max(1, visibleHours));
        ]]></body>
      </method>
      <method name="zoomReset">
        <body><![CDATA[
          cal.setPref("calendar.view.visiblehours", 9);
        ]]></body>
      </method>
    </implementation>

    <handlers>
      <handler event="click" button="2"><![CDATA[
        this.selectedDateTime = null;
      ]]></handler>
      <handler event="wheel" phase="bubbling"><![CDATA[
        if (!event.ctrlKey && !event.shiftKey &&
            !event.altKey && !event.metaKey) {
            // Only shift hours if no modifier is pressed.

            let minute = this.mFirstVisibleMinute;
            if (event.deltaMode == event.DOM_DELTA_LINE) {
                if (this.rotated && event.deltaX != 0) {
                    minute += event.deltaX < 0 ? -60 : 60;
                } else if (!this.rotated && event.deltaY != 0) {
                    minute += event.deltaY < 0 ? -60 : 60;
                }
            } else if (event.deltaMode == event.DOM_DELTA_PIXEL) {
                if (this.rotated && event.deltaX != 0) {
                   minute += Math.ceil(event.deltaX / this.mPixPerMin);
                } else if (!this.rotated && event.deltaY != 0) {
                   minute += Math.ceil(event.deltaY / this.mPixPerMin);
                }
            }
            this.scrollToMinute(minute);
        }

        // We are taking care of scrolling, so prevent the default
        // action in any case.
        event.preventDefault();
      ]]></handler>

      <handler event="scroll" phase="bubbling"><![CDATA[
        let scrollbox = document.getAnonymousElementByAttribute(this, "anonid", "scrollbox");
        let scrollBoxObject = scrollbox.boxObject.QueryInterface(Components.interfaces.nsIScrollBoxObject);
        if (scrollBoxObject && scrollbox.scrollHeight > 0) {
            // We need to update the first visible minute, but only if the
            // scrollbox has been sized.
            let x = {}, y = {};
            scrollBoxObject.getPosition(x, y);
            if (scrollbox.getAttribute("orient") == "horizontal") {
                this.mFirstVisibleMinute = Math.round(y.value/this.mPixPerMin);
            } else {
                this.mFirstVisibleMinute = Math.round(x.value/this.mPixPerMin);
            }
        }
      ]]></handler>
    </handlers>
  </binding>
</bindings>