Hugging Face's logo

Spaces:
shukdevdatta123
/
DhakaMetroWeb
Running

App Files Community
shukdevdatta123 commited on
Commit
824f8af
·
verified ·
1 Parent(s): 99840f0

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +1 -1116
index.html CHANGED
@@ -1,4 +1,4 @@
1
- <!-- <script type="text/javascript">
2
  var gk_isXlsx = false;
3
  var gk_xlsxFileLookup = {};
4
  var gk_fileData = {};
@@ -486,1119 +486,4 @@
486
  }
487
  </script>
488
  </body>
489
- </html> -->
490
-
491
- <!DOCTYPE html>
492
- <html lang="en">
493
- <head>
494
- <meta charset="UTF-8">
495
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
496
- <title>Dhaka Metro Rail Fare Checker</title>
497
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
498
- <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
499
- <style>
500
- @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
501
-
502
- :root {
503
- --primary: #3498db;
504
- --primary-dark: #2980b9;
505
- --secondary: #e74c3c;
506
- --accent: #f39c12;
507
- --dark: #2c3e50;
508
- --light: #ecf0f1;
509
- --success: #2ecc71;
510
- --gray-light: #f8f9fa;
511
- --shadow: 0 10px 30px rgba(0,0,0,0.1);
512
- --shadow-sm: 0 5px 15px rgba(0,0,0,0.05);
513
- --transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
514
- }
515
-
516
- * {
517
- margin: 0;
518
- padding: 0;
519
- box-sizing: border-box;
520
- }
521
-
522
- body {
523
- font-family: 'Poppins', sans-serif;
524
- background-color: var(--light);
525
- color: var(--dark);
526
- overflow-x: hidden;
527
- position: relative;
528
- }
529
-
530
- /* Preloader */
531
- .preloader {
532
- position: fixed;
533
- top: 0;
534
- left: 0;
535
- width: 100%;
536
- height: 100%;
537
- background: var(--primary);
538
- z-index: 9999;
539
- display: flex;
540
- justify-content: center;
541
- align-items: center;
542
- animation: fadeOut 1.5s ease-in-out forwards;
543
- animation-delay: 2s;
544
- }
545
-
546
- .preloader__train {
547
- width: 100px;
548
- height: 40px;
549
- background: white;
550
- border-radius: 10px;
551
- position: relative;
552
- animation: trainMove 2s infinite;
553
- }
554
-
555
- .preloader__train:before {
556
- content: "🚇";
557
- position: absolute;
558
- font-size: 24px;
559
- top: 5px;
560
- left: 10px;
561
- }
562
-
563
- .preloader__track {
564
- width: 200px;
565
- height: 10px;
566
- background: rgba(255,255,255,0.3);
567
- border-radius: 5px;
568
- margin-top: 20px;
569
- position: relative;
570
- overflow: hidden;
571
- }
572
-
573
- .preloader__track:before {
574
- content: "";
575
- position: absolute;
576
- width: 30%;
577
- height: 100%;
578
- background: white;
579
- animation: trackMove 1s infinite linear;
580
- }
581
-
582
- header {
583
- background: linear-gradient(135deg, var(--primary), var(--primary-dark));
584
- color: white;
585
- padding: 2rem;
586
- text-align: center;
587
- box-shadow: var(--shadow);
588
- position: relative;
589
- overflow: hidden;
590
- }
591
-
592
- header:before {
593
- content: "";
594
- position: absolute;
595
- top: -50%;
596
- left: -50%;
597
- width: 200%;
598
- height: 200%;
599
- background: radial-gradient(circle, rgba(255,255,255,0.1) 10%, transparent 70%);
600
- animation: headerPulse 15s infinite linear;
601
- }
602
-
603
- header h1 {
604
- font-size: 2.5rem;
605
- font-weight: 700;
606
- display: flex;
607
- align-items: center;
608
- justify-content: center;
609
- gap: 15px;
610
- position: relative;
611
- z-index: 2;
612
- }
613
-
614
- header h1:after {
615
- content: "Premium";
616
- position: absolute;
617
- top: -10px;
618
- right: -20px;
619
- background: var(--accent);
620
- color: white;
621
- font-size: 0.8rem;
622
- padding: 3px 10px;
623
- border-radius: 15px;
624
- transform: rotate(15deg);
625
- animation: badgePulse 2s infinite;
626
- }
627
-
628
- .metro-icon {
629
- font-size: 2.5rem;
630
- animation: trainIcon 4s infinite;
631
- }
632
-
633
- .page-wrapper {
634
- display: flex;
635
- position: relative;
636
- min-height: calc(100vh - 97px); /* keep or adjust */
637
- }
638
-
639
- .page-wrapper main {
640
- flex: 1 1 0%;
641
- transition: margin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), width 0.4s;
642
- }
643
-
644
- .page-wrapper .sidebar-toggle {
645
- position: absolute;
646
- top: 40px;
647
- left: 320px;
648
- transition: left 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
649
- z-index: 200;
650
- }
651
-
652
- .page-wrapper .sidebar-toggle.sidebar-at-edge {
653
- left: 0;
654
- }
655
-
656
-
657
-
658
- aside#sidebar {
659
- width: 320px;
660
- min-width: 320px;
661
- max-width: 320px;
662
- transition: width 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.4s;
663
- height: auto;
664
- padding: 30px 25px;
665
- overflow-y: auto;
666
- background: white;
667
- box-shadow: var(--shadow);
668
- z-index: 100;
669
- position: relative;
670
- }
671
-
672
- aside#sidebar.collapsed {
673
- width: 0 !important;
674
- min-width: 0 !important;
675
- max-width: 0 !important;
676
- padding: 0 !important;
677
- overflow: hidden;
678
- }
679
-
680
- .sidebar-toggle {
681
- position: absolute;
682
- top: 40px;
683
- left: 320px; /* default: aligns with sidebar edge */
684
- transition: left 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
685
- z-index: 200;
686
- }
687
-
688
- #sidebar.collapsed ~ .sidebar-toggle {
689
- left: 0; /* when sidebar is hidden, move chevron to edge */
690
- }
691
-
692
- .sidebar-toggle:hover {
693
- transform: scale(1.1);
694
- }
695
-
696
- .sidebar-header {
697
- display: flex;
698
- align-items: center;
699
- gap: 10px;
700
- margin-bottom: 20px;
701
- padding-bottom: 15px;
702
- border-bottom: 2px dashed rgba(0,0,0,0.1);
703
- }
704
-
705
- .sidebar-icon {
706
- width: 40px;
707
- height: 40px;
708
- background: var(--primary);
709
- border-radius: 12px;
710
- display: flex;
711
- justify-content: center;
712
- align-items: center;
713
- color: white;
714
- }
715
-
716
- aside h2 {
717
- color: var(--dark);
718
- font-weight: 600;
719
- font-size: 1.5rem;
720
- margin-bottom: 15px;
721
- position: relative;
722
- }
723
-
724
- .instruction-step {
725
- background: var(--gray-light);
726
- padding: 15px;
727
- border-radius: 12px;
728
- margin-bottom: 15px;
729
- position: relative;
730
- transition: var(--transition);
731
- box-shadow: var(--shadow-sm);
732
- }
733
-
734
- .instruction-step:hover {
735
- transform: translateY(-5px);
736
- box-shadow: var(--shadow);
737
- }
738
-
739
- .step-number {
740
- position: absolute;
741
- top: -10px;
742
- left: -10px;
743
- width: 30px;
744
- height: 30px;
745
- background: var(--primary);
746
- color: white;
747
- border-radius: 50%;
748
- display: flex;
749
- justify-content: center;
750
- align-items: center;
751
- font-weight: 600;
752
- }
753
-
754
- .instruction-step h3 {
755
- margin-bottom: 10px;
756
- padding-left: 20px;
757
- color: var(--primary-dark);
758
- }
759
-
760
- .instruction-step p {
761
- line-height: 1.6;
762
- font-size: 0.95rem;
763
- }
764
-
765
- .support-link {
766
- display: flex;
767
- align-items: center;
768
- gap: 10px;
769
- background: var(--primary);
770
- color: white;
771
- padding: 12px 15px;
772
- border-radius: 12px;
773
- text-decoration: none;
774
- margin-top: 25px;
775
- transition: var(--transition);
776
- }
777
-
778
- .support-link:hover {
779
- background: var(--primary-dark);
780
- transform: translateY(-3px);
781
- }
782
-
783
- main {
784
- flex: 1;
785
- padding: 30px;
786
- transition: var(--transition);
787
- }
788
-
789
- section {
790
- background: white;
791
- padding: 30px;
792
- border-radius: 20px;
793
- box-shadow: var(--shadow);
794
- margin-bottom: 40px;
795
- position: relative;
796
- overflow: hidden;
797
- transition: var(--transition);
798
- }
799
-
800
- section:hover {
801
- transform: translateY(-5px);
802
- }
803
-
804
- section:before {
805
- content: "";
806
- position: absolute;
807
- top: 0;
808
- left: 0;
809
- width: 100%;
810
- height: 5px;
811
- background: linear-gradient(90deg, var(--primary), var(--accent));
812
- }
813
-
814
- .section-icon {
815
- position: absolute;
816
- top: 20px;
817
- right: 20px;
818
- font-size: 1.5rem;
819
- color: var(--primary);
820
- opacity: 0.2;
821
- }
822
-
823
- h2 {
824
- color: var(--dark);
825
- margin-bottom: 30px;
826
- font-weight: 600;
827
- display: flex;
828
- align-items: center;
829
- gap: 10px;
830
- }
831
-
832
- h2 i {
833
- color: var(--primary);
834
- }
835
-
836
- .form-group {
837
- margin-bottom: 25px;
838
- }
839
-
840
- label {
841
- font-weight: 500;
842
- margin-bottom: 12px;
843
- display: block;
844
- color: var(--dark);
845
- }
846
-
847
- select {
848
- width: 100%;
849
- padding: 15px;
850
- border: 2px solid rgba(0,0,0,0.1);
851
- border-radius: 12px;
852
- font-size: 1rem;
853
- font-family: 'Poppins', sans-serif;
854
- transition: var(--transition);
855
- background: white;
856
- appearance: none;
857
- background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232c3e50' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
858
- background-position: right 15px center;
859
- background-repeat: no-repeat;
860
- background-size: 15px;
861
- }
862
-
863
- select:focus {
864
- border-color: var(--primary);
865
- outline: none;
866
- box-shadow: 0 0 0 4px rgba(52, 152, 219, 0.2);
867
- }
868
-
869
- #destination-buttons {
870
- display: flex;
871
- flex-wrap: wrap;
872
- gap: 12px;
873
- margin-bottom: 30px;
874
- }
875
-
876
- #destination-buttons button {
877
- background: white;
878
- color: var(--dark);
879
- border: 2px solid var(--primary);
880
- padding: 12px 20px;
881
- border-radius: 12px;
882
- cursor: pointer;
883
- transition: var(--transition);
884
- font-family: 'Poppins', sans-serif;
885
- font-weight: 500;
886
- display: flex;
887
- align-items: center;
888
- gap: 8px;
889
- }
890
-
891
- #destination-buttons button:hover {
892
- transform: translateY(-3px);
893
- box-shadow: var(--shadow-sm);
894
- }
895
-
896
- #destination-buttons button.selected {
897
- background: var(--primary);
898
- color: white;
899
- border-color: var(--primary);
900
- }
901
-
902
- #clear-destinations {
903
- background: var(--secondary);
904
- color: white;
905
- border: none;
906
- padding: 15px 25px;
907
- border-radius: 12px;
908
- cursor: pointer;
909
- transition: var(--transition);
910
- font-family: 'Poppins', sans-serif;
911
- font-weight: 500;
912
- display: flex;
913
- align-items: center;
914
- gap: 10px;
915
- margin-bottom: 30px;
916
- }
917
-
918
- #clear-destinations:hover {
919
- background: #c0392b;
920
- transform: translateY(-3px);
921
- box-shadow: var(--shadow-sm);
922
- }
923
-
924
- #fare-display {
925
- display: grid;
926
- grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
927
- gap: 20px;
928
- }
929
-
930
- .fare-item {
931
- background: var(--gray-light);
932
- padding: 20px;
933
- border-radius: 15px;
934
- box-shadow: var(--shadow-sm);
935
- transition: var(--transition);
936
- border-left: 5px solid var(--primary);
937
- }
938
-
939
- .fare-item:hover {
940
- transform: translateY(-5px);
941
- box-shadow: var(--shadow);
942
- }
943
-
944
- .fare-item h4 {
945
- color: var(--dark);
946
- font-size: 1.1rem;
947
- margin-bottom: 15px;
948
- display: flex;
949
- align-items: center;
950
- gap: 10px;
951
- }
952
-
953
- .fare-item p {
954
- margin-bottom: 10px;
955
- display: flex;
956
- align-items: center;
957
- gap: 10px;
958
- }
959
-
960
- .fare-amount {
961
- font-size: 1.8rem;
962
- color: var(--primary);
963
- font-weight: 600;
964
- display: block;
965
- margin: 15px 0;
966
- text-align: center;
967
- }
968
-
969
- .journey-detail {
970
- display: flex;
971
- align-items: center;
972
- gap: 15px;
973
- margin-bottom: 15px;
974
- }
975
-
976
- .station {
977
- padding: 8px 15px;
978
- background: white;
979
- border-radius: 20px;
980
- font-weight: 500;
981
- box-shadow: var(--shadow-sm);
982
- }
983
-
984
- .journey-arrow {
985
- color: var(--primary);
986
- font-size: 1.2rem;
987
- }
988
-
989
- #map {
990
- height: 500px;
991
- border-radius: 15px;
992
- margin-top: 20px;
993
- box-shadow: var(--shadow-sm);
994
- z-index: 1;
995
- }
996
-
997
- #map-controls {
998
- display: grid;
999
- grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
1000
- gap: 15px;
1001
- margin-top: 25px;
1002
- }
1003
-
1004
- #map-controls select {
1005
- margin-bottom: 0;
1006
- }
1007
-
1008
- .map-control-button {
1009
- background: var(--primary);
1010
- color: white;
1011
- border: none;
1012
- padding: 15px;
1013
- border-radius: 12px;
1014
- cursor: pointer;
1015
- transition: var(--transition);
1016
- font-family: 'Poppins', sans-serif;
1017
- font-weight: 500;
1018
- display: flex;
1019
- align-items: center;
1020
- justify-content: center;
1021
- gap: 10px;
1022
- }
1023
-
1024
- .map-control-button:hover {
1025
- transform: translateY(-3px);
1026
- box-shadow: var(--shadow-sm);
1027
- }
1028
-
1029
- .map-control-button.animate-all {
1030
- background: var(--success);
1031
- }
1032
-
1033
- .map-control-button.stop {
1034
- background: var(--secondary);
1035
- }
1036
-
1037
- .notification {
1038
- position: fixed;
1039
- top: 30px;
1040
- right: 30px;
1041
- padding: 15px 25px;
1042
- background: white;
1043
- border-radius: 12px;
1044
- box-shadow: var(--shadow);
1045
- display: flex;
1046
- align-items: center;
1047
- gap: 15px;
1048
- transform: translateX(calc(100% + 50px));
1049
- transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
1050
- z-index: 1000;
1051
- }
1052
-
1053
- .notification.show {
1054
- transform: translateX(0);
1055
- }
1056
-
1057
- .notification-icon {
1058
- width: 40px;
1059
- height: 40px;
1060
- border-radius: 50%;
1061
- background: var(--primary);
1062
- color: white;
1063
- display: flex;
1064
- justify-content: center;
1065
- align-items: center;
1066
- font-size: 1.2rem;
1067
- }
1068
-
1069
- .notification-content h3 {
1070
- color: var(--dark);
1071
- margin-bottom: 5px;
1072
- }
1073
-
1074
- .notification-content p {
1075
- color: #666;
1076
- font-size: 0.9rem;
1077
- }
1078
-
1079
- .train-route {
1080
- position: relative;
1081
- height: 5px;
1082
- background: #eee;
1083
- border-radius: 5px;
1084
- margin: 30px 0;
1085
- overflow: visible;
1086
- }
1087
-
1088
- .train-position {
1089
- position: absolute;
1090
- top: -12px;
1091
- left: 0;
1092
- font-size: 1.5rem;
1093
- transition: left 1s linear;
1094
- }
1095
-
1096
- .route-stations {
1097
- display: flex;
1098
- justify-content: space-between;
1099
- margin-top: 15px;
1100
- }
1101
-
1102
- .route-station {
1103
- display: flex;
1104
- flex-direction: column;
1105
- align-items: center;
1106
- position: relative;
1107
- }
1108
-
1109
- .station-dot {
1110
- width: 12px;
1111
- height: 12px;
1112
- background: var(--primary);
1113
- border-radius: 50%;
1114
- margin-bottom: 10px;
1115
- }
1116
-
1117
- .station-name {
1118
- font-size: 0.8rem;
1119
- text-align: center;
1120
- max-width: 80px;
1121
- }
1122
-
1123
- /* Animations */
1124
- @keyframes fadeOut {
1125
- 0% { opacity: 1; visibility: visible; }
1126
- 100% { opacity: 0; visibility: hidden; }
1127
- }
1128
-
1129
- @keyframes trainMove {
1130
- 0% { transform: translateX(-50px); }
1131
- 50% { transform: translateX(50px); }
1132
- 100% { transform: translateX(-50px); }
1133
- }
1134
-
1135
- @keyframes trackMove {
1136
- 0% { transform: translateX(-100%); }
1137
- 100% { transform: translateX(300%); }
1138
- }
1139
-
1140
- @keyframes headerPulse {
1141
- 0% { transform: rotate(0deg); }
1142
- 100% { transform: rotate(360deg); }
1143
- }
1144
-
1145
- @keyframes badgePulse {
1146
- 0% { transform: rotate(15deg) scale(1); }
1147
- 50% { transform: rotate(15deg) scale(1.1); }
1148
- 100% { transform: rotate(15deg) scale(1); }
1149
- }
1150
-
1151
- @keyframes trainIcon {
1152
- 0% { transform: translateX(0); }
1153
- 20% { transform: translateX(5px); }
1154
- 40% { transform: translateX(0); }
1155
- 60% { transform: translateX(-5px); }
1156
- 80% { transform: translateX(0); }
1157
- 100% { transform: translateX(0); }
1158
- }
1159
-
1160
- @keyframes slideUp {
1161
- 0% { opacity: 0; transform: translateY(30px); }
1162
- 100% { opacity: 1; transform: translateY(0); }
1163
- }
1164
-
1165
- /* Responsive styles */
1166
- @media (max-width: 1024px) {
1167
- .page-wrapper {
1168
- flex-direction: column;
1169
- }
1170
-
1171
- aside#sidebar {
1172
- position: relative;
1173
- width: 100%;
1174
- min-width: 100%;
1175
- max-width: 100%;
1176
- max-height: 0;
1177
- padding: 0;
1178
- overflow: hidden;
1179
- transition: max-height 0.4s, padding 0.4s;
1180
- }
1181
-
1182
- aside#sidebar.open {
1183
- max-height: 1000px;
1184
- padding: 30px 25px;
1185
- }
1186
-
1187
- .page-wrapper .sidebar-toggle {
1188
- position: absolute;
1189
- top: 25px;
1190
- left: 20px;
1191
- /* tweak as needed for mobile */
1192
- }
1193
-
1194
- .sidebar-toggle {
1195
- top: 25px;
1196
- right: 30px;
1197
- background: var(--dark);
1198
- }
1199
-
1200
- main {
1201
- margin-left: 0;
1202
- }
1203
-
1204
- #fare-display {
1205
- grid-template-columns: 1fr;
1206
- }
1207
- }
1208
-
1209
- @media (max-width: 768px) {
1210
- header h1 {
1211
- font-size: 1.8rem;
1212
- }
1213
-
1214
- main {
1215
- padding: 20px;
1216
- }
1217
-
1218
- section {
1219
- padding: 20px;
1220
- margin-bottom: 30px;
1221
- }
1222
-
1223
- #map {
1224
- height: 350px;
1225
- }
1226
-
1227
- #map-controls {
1228
- grid-template-columns: 1fr;
1229
- }
1230
- }
1231
-
1232
- @media (max-width: 480px) {
1233
- header {
1234
- padding: 1.5rem;
1235
- }
1236
-
1237
- header h1 {
1238
- font-size: 1.5rem;
1239
- }
1240
-
1241
- .page-wrapper {
1242
- min-height: calc(100vh - 81px);
1243
- }
1244
-
1245
- section:before {
1246
- height: 3px;
1247
- }
1248
-
1249
- #destination-buttons button {
1250
- width: 100%;
1251
- justify-content: center;
1252
- }
1253
-
1254
- #fare-display .fare-item {
1255
- padding: 15px;
1256
- }
1257
- }
1258
- </style>
1259
- </head>
1260
- <body>
1261
- <!-- Preloader -->
1262
- <div class="preloader">
1263
- <div class="preloader__container">
1264
- <div class="preloader__train"></div>
1265
- <div class="preloader__track"></div>
1266
- </div>
1267
- </div>
1268
-
1269
- <!-- Notification -->
1270
- <div class="notification" id="notification">
1271
- <div class="notification-icon">
1272
- <i class="fas fa-bell"></i>
1273
- </div>
1274
- <div class="notification-content">
1275
- <h3>Welcome!</h3>
1276
- <p>Explore the premium Dhaka Metro experience</p>
1277
- </div>
1278
- </div>
1279
-
1280
- <header>
1281
- <h1><i class="fas fa-train metro-icon"></i> Dhaka Metro Rail Fare Checker</h1>
1282
- </header>
1283
-
1284
- <div class="page-wrapper">
1285
- <div class="sidebar-toggle" id="sidebar-toggle" style="margin-left: 2px; border: 2px solid rgb(255, 0, 0);border-radius: 50%;width: 25px;height: 25px;display: flex;align-items: center;justify-content: center;">
1286
- <i class="fas fa-chevron-left"></i>
1287
- </div>
1288
- <aside id="sidebar">
1289
- <div class="sidebar-header">
1290
- <div class="sidebar-icon">
1291
- <i class="fas fa-info"></i>
1292
- </div>
1293
- <h2>How to Use</h2>
1294
- </div>
1295
-
1296
- <div class="instruction-step">
1297
- <div class="step-number">1</div>
1298
- <h3>Select Your Location</h3>
1299
- <p>Choose your starting station from the dropdown menu. This will be your journey's point of origin.</p>
1300
- </div>
1301
-
1302
- <div class="instruction-step">
1303
- <div class="step-number">2</div>
1304
- <h3>Choose Destinations</h3>
1305
- <p>Click on destination buttons to select where you want to go. You can select multiple destinations to compare fares.</p>
1306
- </div>
1307
-
1308
- <div class="instruction-step">
1309
- <div class="step-number">3</div>
1310
- <h3>View Fares</h3>
1311
- <p>See your calculated fares displayed below. Each fare card shows the cost for that specific journey.</p>
1312
- </div>
1313
-
1314
- <div class="instruction-step">
1315
- <div class="step-number">4</div>
1316
- <h3>Explore the Map</h3>
1317
- <p>Use the interactive map to visualize routes. You can animate specific journeys or see all stations.</p>
1318
- </div>
1319
-
1320
- <a href="https://wa.me/+8801719296601" class="support-link">
1321
- <i class="fab fa-whatsapp"></i>
1322
- <span>Contact Support</span>
1323
- </a>
1324
- </aside>
1325
-
1326
- <main>
1327
- <section id="fare-checker">
1328
- <div class="section-icon">
1329
- <i class="fas fa-ticket-alt"></i>
1330
- </div>
1331
-
1332
- <h2><i class="fas fa-calculator"></i> Check Your Fare</h2>
1333
-
1334
- <div class="form-group">
1335
- <label for="origin">Select your starting station:</label>
1336
- <select id="origin">
1337
- <option value="">Select Journey from</option>
1338
- </select>
1339
- </div>
1340
-
1341
- <div id="destination-buttons"></div>
1342
-
1343
- <button id="clear-destinations">
1344
- <i class="fas fa-times-circle"></i>
1345
- Clear All Destinations
1346
- </button>
1347
-
1348
- <div id="fare-display"></div>
1349
- </section>
1350
-
1351
- <section id="map-section">
1352
- <div class="section-icon">
1353
- <i class="fas fa-map-marked-alt"></i>
1354
- </div>
1355
-
1356
- <h2><i class="fas fa-map"></i> Interactive Metro Map</h2>
1357
-
1358
- <div id="map"></div>
1359
-
1360
- <div id="map-controls">
1361
- <select id="map-source">
1362
- <option value="">Select Source Station</option>
1363
- </select>
1364
-
1365
- <select id="map-destination">
1366
- <option value="">Select Destination Station</option>
1367
- </select>
1368
-
1369
- <button class="map-control-button" onclick="startRouteAnimation()">
1370
- <i class="fas fa-play"></i> Animate Route
1371
- </button>
1372
-
1373
- <button class="map-control-button animate-all" onclick="animateAllLocations()">
1374
- <i class="fas fa-route"></i> Animate All Stations
1375
- </button>
1376
-
1377
- <button class="map-control-button stop" onclick="stopAnimation()">
1378
- <i class="fas fa-stop"></i> Stop Animation
1379
- </button>
1380
- </div>
1381
- </section>
1382
- </main>
1383
- </div>
1384
-
1385
- <script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
1386
- <script>
1387
- // Sample fare data (would normally be loaded from data.js)
1388
- const fareData = [{"Origin":"Uttara North","Destination":"Uttara North","Fare (\u09f3)":0},{"Origin":"Uttara North","Destination":"Uttara Center","Fare (\u09f3)":20},{"Origin":"Uttara North","Destination":"Uttara South","Fare (\u09f3)":20},{"Origin":"Uttara North","Destination":"Pallabi","Fare (\u09f3)":30},{"Origin":"Uttara North","Destination":"Mirpur 11","Fare (\u09f3)":30},{"Origin":"Uttara North","Destination":"Mirpur 10","Fare (\u09f3)":40},{"Origin":"Uttara North","Destination":"Kazipara","Fare (\u09f3)":40},{"Origin":"Uttara North","Destination":"Shewrapara","Fare (\u09f3)":50},{"Origin":"Uttara North","Destination":"Agargaon","Fare (\u09f3)":60},{"Origin":"Uttara North","Destination":"Bijoy Sarani","Fare (\u09f3)":60},{"Origin":"Uttara North","Destination":"Farmgate","Fare (\u09f3)":70},{"Origin":"Uttara North","Destination":"Kawran Bazar","Fare (\u09f3)":80},{"Origin":"Uttara North","Destination":"Shahbagh","Fare (\u09f3)":80},{"Origin":"Uttara North","Destination":"Dhaka University","Fare (\u09f3)":90},{"Origin":"Uttara North","Destination":"Bangladesh Secretariat","Fare (\u09f3)":90},{"Origin":"Uttara North","Destination":"Motijheel","Fare (\u09f3)":100},{"Origin":"Uttara North","Destination":"Kamalapur","Fare (\u09f3)":100},{"Origin":"Uttara Center","Destination":"Uttara North","Fare (\u09f3)":20},{"Origin":"Uttara Center","Destination":"Uttara Center","Fare (\u09f3)":0},{"Origin":"Uttara Center","Destination":"Uttara South","Fare (\u09f3)":20},{"Origin":"Uttara Center","Destination":"Pallabi","Fare (\u09f3)":20},{"Origin":"Uttara Center","Destination":"Mirpur 11","Fare (\u09f3)":30},{"Origin":"Uttara Center","Destination":"Mirpur 10","Fare (\u09f3)":30},{"Origin":"Uttara Center","Destination":"Kazipara","Fare (\u09f3)":40},{"Origin":"Uttara Center","Destination":"Shewrapara","Fare (\u09f3)":40},{"Origin":"Uttara Center","Destination":"Agargaon","Fare (\u09f3)":50},{"Origin":"Uttara Center","Destination":"Bijoy Sarani","Fare (\u09f3)":60},{"Origin":"Uttara Center","Destination":"Farmgate","Fare (\u09f3)":60},{"Origin":"Uttara Center","Destination":"Kawran Bazar","Fare (\u09f3)":70},{"Origin":"Uttara Center","Destination":"Shahbagh","Fare (\u09f3)":80},{"Origin":"Uttara Center","Destination":"Dhaka University","Fare (\u09f3)":80},{"Origin":"Uttara Center","Destination":"Bangladesh Secretariat","Fare (\u09f3)":90},{"Origin":"Uttara Center","Destination":"Motijheel","Fare (\u09f3)":90},{"Origin":"Uttara Center","Destination":"Kamalapur","Fare (\u09f3)":100},{"Origin":"Uttara South","Destination":"Uttara North","Fare (\u09f3)":20},{"Origin":"Uttara South","Destination":"Uttara Center","Fare (\u09f3)":20},{"Origin":"Uttara South","Destination":"Uttara South","Fare (\u09f3)":0},{"Origin":"Uttara South","Destination":"Pallabi","Fare (\u09f3)":20},{"Origin":"Uttara South","Destination":"Mirpur 11","Fare (\u09f3)":20},{"Origin":"Uttara South","Destination":"Mirpur 10","Fare (\u09f3)":30},{"Origin":"Uttara South","Destination":"Kazipara","Fare (\u09f3)":30},{"Origin":"Uttara South","Destination":"Shewrapara","Fare (\u09f3)":40},{"Origin":"Uttara South","Destination":"Agargaon","Fare (\u09f3)":40},{"Origin":"Uttara South","Destination":"Bijoy Sarani","Fare (\u09f3)":50},{"Origin":"Uttara South","Destination":"Farmgate","Fare (\u09f3)":60},{"Origin":"Uttara South","Destination":"Kawran Bazar","Fare (\u09f3)":60},{"Origin":"Uttara South","Destination":"Shahbagh","Fare (\u09f3)":70},{"Origin":"Uttara South","Destination":"Dhaka University","Fare (\u09f3)":70},{"Origin":"Uttara South","Destination":"Bangladesh Secretariat","Fare (\u09f3)":80},{"Origin":"Uttara South","Destination":"Motijheel","Fare (\u09f3)":90},{"Origin":"Uttara South","Destination":"Kamalapur","Fare (\u09f3)":90},{"Origin":"Pallabi","Destination":"Uttara North","Fare (\u09f3)":30},{"Origin":"Pallabi","Destination":"Uttara Center","Fare (\u09f3)":20},{"Origin":"Pallabi","Destination":"Uttara South","Fare (\u09f3)":20},{"Origin":"Pallabi","Destination":"Pallabi","Fare (\u09f3)":0},{"Origin":"Pallabi","Destination":"Mirpur 11","Fare (\u09f3)":20},{"Origin":"Pallabi","Destination":"Mirpur 10","Fare (\u09f3)":20},{"Origin":"Pallabi","Destination":"Kazipara","Fare (\u09f3)":20},{"Origin":"Pallabi","Destination":"Shewrapara","Fare (\u09f3)":30},{"Origin":"Pallabi","Destination":"Agargaon","Fare (\u09f3)":30},{"Origin":"Pallabi","Destination":"Bijoy Sarani","Fare (\u09f3)":40},{"Origin":"Pallabi","Destination":"Farmgate","Fare (\u09f3)":50},{"Origin":"Pallabi","Destination":"Kawran Bazar","Fare (\u09f3)":50},{"Origin":"Pallabi","Destination":"Shahbagh","Fare (\u09f3)":60},{"Origin":"Pallabi","Destination":"Dhaka University","Fare (\u09f3)":60},{"Origin":"Pallabi","Destination":"Bangladesh Secretariat","Fare (\u09f3)":70},{"Origin":"Pallabi","Destination":"Motijheel","Fare (\u09f3)":80},{"Origin":"Pallabi","Destination":"Kamalapur","Fare (\u09f3)":80},{"Origin":"Mirpur 11","Destination":"Uttara North","Fare (\u09f3)":30},{"Origin":"Mirpur 11","Destination":"Uttara Center","Fare (\u09f3)":30},{"Origin":"Mirpur 11","Destination":"Uttara South","Fare (\u09f3)":20},{"Origin":"Mirpur 11","Destination":"Pallabi","Fare (\u09f3)":20},{"Origin":"Mirpur 11","Destination":"Mirpur 11","Fare (\u09f3)":0},{"Origin":"Mirpur 11","Destination":"Mirpur 10","Fare (\u09f3)":20},{"Origin":"Mirpur 11","Destination":"Kazipara","Fare (\u09f3)":20},{"Origin":"Mirpur 11","Destination":"Shewrapara","Fare (\u09f3)":20},{"Origin":"Mirpur 11","Destination":"Agargaon","Fare (\u09f3)":30},{"Origin":"Mirpur 11","Destination":"Bijoy Sarani","Fare (\u09f3)":40},{"Origin":"Mirpur 11","Destination":"Farmgate","Fare (\u09f3)":40},{"Origin":"Mirpur 11","Destination":"Kawran Bazar","Fare (\u09f3)":50},{"Origin":"Mirpur 11","Destination":"Shahbagh","Fare (\u09f3)":50},{"Origin":"Mirpur 11","Destination":"Dhaka University","Fare (\u09f3)":60},{"Origin":"Mirpur 11","Destination":"Bangladesh Secretariat","Fare (\u09f3)":70},{"Origin":"Mirpur 11","Destination":"Motijheel","Fare (\u09f3)":70},{"Origin":"Mirpur 11","Destination":"Kamalapur","Fare (\u09f3)":80},{"Origin":"Mirpur 10","Destination":"Uttara North","Fare (\u09f3)":40},{"Origin":"Mirpur 10","Destination":"Uttara Center","Fare (\u09f3)":30},{"Origin":"Mirpur 10","Destination":"Uttara South","Fare (\u09f3)":30},{"Origin":"Mirpur 10","Destination":"Pallabi","Fare (\u09f3)":20},{"Origin":"Mirpur 10","Destination":"Mirpur 11","Fare (\u09f3)":20},{"Origin":"Mirpur 10","Destination":"Mirpur 10","Fare (\u09f3)":0},{"Origin":"Mirpur 10","Destination":"Kazipara","Fare (\u09f3)":20},{"Origin":"Mirpur 10","Destination":"Shewrapara","Fare (\u09f3)":20},{"Origin":"Mirpur 10","Destination":"Agargaon","Fare (\u09f3)":20},{"Origin":"Mirpur 10","Destination":"Bijoy Sarani","Fare (\u09f3)":30},{"Origin":"Mirpur 10","Destination":"Farmgate","Fare (\u09f3)":30},{"Origin":"Mirpur 10","Destination":"Kawran Bazar","Fare (\u09f3)":40},{"Origin":"Mirpur 10","Destination":"Shahbagh","Fare (\u09f3)":50},{"Origin":"Mirpur 10","Destination":"Dhaka University","Fare (\u09f3)":50},{"Origin":"Mirpur 10","Destination":"Bangladesh Secretariat","Fare (\u09f3)":60},{"Origin":"Mirpur 10","Destination":"Motijheel","Fare (\u09f3)":60},{"Origin":"Mirpur 10","Destination":"Kamalapur","Fare (\u09f3)":70},{"Origin":"Kazipara","Destination":"Uttara North","Fare (\u09f3)":40},{"Origin":"Kazipara","Destination":"Uttara Center","Fare (\u09f3)":40},{"Origin":"Kazipara","Destination":"Uttara South","Fare (\u09f3)":30},{"Origin":"Kazipara","Destination":"Pallabi","Fare (\u09f3)":20},{"Origin":"Kazipara","Destination":"Mirpur 11","Fare (\u09f3)":20},{"Origin":"Kazipara","Destination":"Mirpur 10","Fare (\u09f3)":20},{"Origin":"Kazipara","Destination":"Kazipara","Fare (\u09f3)":0},{"Origin":"Kazipara","Destination":"Shewrapara","Fare (\u09f3)":20},{"Origin":"Kazipara","Destination":"Agargaon","Fare (\u09f3)":20},{"Origin":"Kazipara","Destination":"Bijoy Sarani","Fare (\u09f3)":20},{"Origin":"Kazipara","Destination":"Farmgate","Fare (\u09f3)":30},{"Origin":"Kazipara","Destination":"Kawran Bazar","Fare (\u09f3)":40},{"Origin":"Kazipara","Destination":"Shahbagh","Fare (\u09f3)":40},{"Origin":"Kazipara","Destination":"Dhaka University","Fare (\u09f3)":50},{"Origin":"Kazipara","Destination":"Bangladesh Secretariat","Fare (\u09f3)":50},{"Origin":"Kazipara","Destination":"Motijheel","Fare (\u09f3)":60},{"Origin":"Kazipara","Destination":"Kamalapur","Fare (\u09f3)":70},{"Origin":"Shewrapara","Destination":"Uttara North","Fare (\u09f3)":50},{"Origin":"Shewrapara","Destination":"Uttara Center","Fare (\u09f3)":40},{"Origin":"Shewrapara","Destination":"Uttara South","Fare (\u09f3)":40},{"Origin":"Shewrapara","Destination":"Pallabi","Fare (\u09f3)":30},{"Origin":"Shewrapara","Destination":"Mirpur 11","Fare (\u09f3)":20},{"Origin":"Shewrapara","Destination":"Mirpur 10","Fare (\u09f3)":20},{"Origin":"Shewrapara","Destination":"Kazipara","Fare (\u09f3)":20},{"Origin":"Shewrapara","Destination":"Shewrapara","Fare (\u09f3)":0},{"Origin":"Shewrapara","Destination":"Agargaon","Fare (\u09f3)":20},{"Origin":"Shewrapara","Destination":"Bijoy Sarani","Fare (\u09f3)":20},{"Origin":"Shewrapara","Destination":"Farmgate","Fare (\u09f3)":20},{"Origin":"Shewrapara","Destination":"Kawran Bazar","Fare (\u09f3)":30},{"Origin":"Shewrapara","Destination":"Shahbagh","Fare (\u09f3)":40},{"Origin":"Shewrapara","Destination":"Dhaka University","Fare (\u09f3)":40},{"Origin":"Shewrapara","Destination":"Bangladesh Secretariat","Fare (\u09f3)":50},{"Origin":"Shewrapara","Destination":"Motijheel","Fare (\u09f3)":50},{"Origin":"Shewrapara","Destination":"Kamalapur","Fare (\u09f3)":60},{"Origin":"Agargaon","Destination":"Uttara North","Fare (\u09f3)":60},{"Origin":"Agargaon","Destination":"Uttara Center","Fare (\u09f3)":50},{"Origin":"Agargaon","Destination":"Uttara South","Fare (\u09f3)":40},{"Origin":"Agargaon","Destination":"Pallabi","Fare (\u09f3)":30},{"Origin":"Agargaon","Destination":"Mirpur 11","Fare (\u09f3)":30},{"Origin":"Agargaon","Destination":"Mirpur 10","Fare (\u09f3)":20},{"Origin":"Agargaon","Destination":"Kazipara","Fare (\u09f3)":20},{"Origin":"Agargaon","Destination":"Shewrapara","Fare (\u09f3)":20},{"Origin":"Agargaon","Destination":"Agargaon","Fare (\u09f3)":0},{"Origin":"Agargaon","Destination":"Bijoy Sarani","Fare (\u09f3)":20},{"Origin":"Agargaon","Destination":"Farmgate","Fare (\u09f3)":20},{"Origin":"Agargaon","Destination":"Kawran Bazar","Fare (\u09f3)":20},{"Origin":"Agargaon","Destination":"Shahbagh","Fare (\u09f3)":30},{"Origin":"Agargaon","Destination":"Dhaka University","Fare (\u09f3)":30},{"Origin":"Agargaon","Destination":"Bangladesh Secretariat","Fare (\u09f3)":40},{"Origin":"Agargaon","Destination":"Motijheel","Fare (\u09f3)":50},{"Origin":"Agargaon","Destination":"Kamalapur","Fare (\u09f3)":50},{"Origin":"Bijoy Sarani","Destination":"Uttara North","Fare (\u09f3)":60},{"Origin":"Bijoy Sarani","Destination":"Uttara Center","Fare (\u09f3)":60},{"Origin":"Bijoy Sarani","Destination":"Uttara South","Fare (\u09f3)":50},{"Origin":"Bijoy Sarani","Destination":"Pallabi","Fare (\u09f3)":40},{"Origin":"Bijoy Sarani","Destination":"Mirpur 11","Fare (\u09f3)":40},{"Origin":"Bijoy Sarani","Destination":"Mirpur 10","Fare (\u09f3)":30},{"Origin":"Bijoy Sarani","Destination":"Kazipara","Fare (\u09f3)":20},{"Origin":"Bijoy Sarani","Destination":"Shewrapara","Fare (\u09f3)":20},{"Origin":"Bijoy Sarani","Destination":"Agargaon","Fare (\u09f3)":20},{"Origin":"Bijoy Sarani","Destination":"Bijoy Sarani","Fare (\u09f3)":0},{"Origin":"Bijoy Sarani","Destination":"Farmgate","Fare (\u09f3)":20},{"Origin":"Bijoy Sarani","Destination":"Kawran Bazar","Fare (\u09f3)":20},{"Origin":"Bijoy Sarani","Destination":"Shahbagh","Fare (\u09f3)":20},{"Origin":"Bijoy Sarani","Destination":"Dhaka University","Fare (\u09f3)":30},{"Origin":"Bijoy Sarani","Destination":"Bangladesh Secretariat","Fare (\u09f3)":40},{"Origin":"Bijoy Sarani","Destination":"Motijheel","Fare (\u09f3)":40},{"Origin":"Bijoy Sarani","Destination":"Kamalapur","Fare (\u09f3)":50},{"Origin":"Farmgate","Destination":"Uttara North","Fare (\u09f3)":70},{"Origin":"Farmgate","Destination":"Uttara Center","Fare (\u09f3)":60},{"Origin":"Farmgate","Destination":"Uttara South","Fare (\u09f3)":60},{"Origin":"Farmgate","Destination":"Pallabi","Fare (\u09f3)":50},{"Origin":"Farmgate","Destination":"Mirpur 11","Fare (\u09f3)":40},{"Origin":"Farmgate","Destination":"Mirpur 10","Fare (\u09f3)":30},{"Origin":"Farmgate","Destination":"Kazipara","Fare (\u09f3)":30},{"Origin":"Farmgate","Destination":"Shewrapara","Fare (\u09f3)":20},{"Origin":"Farmgate","Destination":"Agargaon","Fare (\u09f3)":20},{"Origin":"Farmgate","Destination":"Bijoy Sarani","Fare (\u09f3)":20},{"Origin":"Farmgate","Destination":"Farmgate","Fare (\u09f3)":0},{"Origin":"Farmgate","Destination":"Kawran Bazar","Fare (\u09f3)":20},{"Origin":"Farmgate","Destination":"Shahbagh","Fare (\u09f3)":20},{"Origin":"Farmgate","Destination":"Dhaka University","Fare (\u09f3)":20},{"Origin":"Farmgate","Destination":"Bangladesh Secretariat","Fare (\u09f3)":30},{"Origin":"Farmgate","Destination":"Motijheel","Fare (\u09f3)":30},{"Origin":"Farmgate","Destination":"Kamalapur","Fare (\u09f3)":40},{"Origin":"Kawran Bazar","Destination":"Uttara North","Fare (\u09f3)":80},{"Origin":"Kawran Bazar","Destination":"Uttara Center","Fare (\u09f3)":70},{"Origin":"Kawran Bazar","Destination":"Uttara South","Fare (\u09f3)":60},{"Origin":"Kawran Bazar","Destination":"Pallabi","Fare (\u09f3)":50},{"Origin":"Kawran Bazar","Destination":"Mirpur 11","Fare (\u09f3)":50},{"Origin":"Kawran Bazar","Destination":"Mirpur 10","Fare (\u09f3)":40},{"Origin":"Kawran Bazar","Destination":"Kazipara","Fare (\u09f3)":40},{"Origin":"Kawran Bazar","Destination":"Shewrapara","Fare (\u09f3)":30},{"Origin":"Kawran Bazar","Destination":"Agargaon","Fare (\u09f3)":20},{"Origin":"Kawran Bazar","Destination":"Bijoy Sarani","Fare (\u09f3)":20},{"Origin":"Kawran Bazar","Destination":"Farmgate","Fare (\u09f3)":20},{"Origin":"Kawran Bazar","Destination":"Kawran Bazar","Fare (\u09f3)":0},{"Origin":"Kawran Bazar","Destination":"Shahbagh","Fare (\u09f3)":20},{"Origin":"Kawran Bazar","Destination":"Dhaka University","Fare (\u09f3)":20},{"Origin":"Kawran Bazar","Destination":"Bangladesh Secretariat","Fare (\u09f3)":20},{"Origin":"Kawran Bazar","Destination":"Motijheel","Fare (\u09f3)":30},{"Origin":"Kawran Bazar","Destination":"Kamalapur","Fare (\u09f3)":30},{"Origin":"Shahbagh","Destination":"Uttara North","Fare (\u09f3)":80},{"Origin":"Shahbagh","Destination":"Uttara Center","Fare (\u09f3)":80},{"Origin":"Shahbagh","Destination":"Uttara South","Fare (\u09f3)":70},{"Origin":"Shahbagh","Destination":"Pallabi","Fare (\u09f3)":60},{"Origin":"Shahbagh","Destination":"Mirpur 11","Fare (\u09f3)":50},{"Origin":"Shahbagh","Destination":"Mirpur 10","Fare (\u09f3)":50},{"Origin":"Shahbagh","Destination":"Kazipara","Fare (\u09f3)":40},{"Origin":"Shahbagh","Destination":"Shewrapara","Fare (\u09f3)":40},{"Origin":"Shahbagh","Destination":"Agargaon","Fare (\u09f3)":30},{"Origin":"Shahbagh","Destination":"Bijoy Sarani","Fare (\u09f3)":20},{"Origin":"Shahbagh","Destination":"Farmgate","Fare (\u09f3)":20},{"Origin":"Shahbagh","Destination":"Kawran Bazar","Fare (\u09f3)":20},{"Origin":"Shahbagh","Destination":"Shahbagh","Fare (\u09f3)":0},{"Origin":"Shahbagh","Destination":"Dhaka University","Fare (\u09f3)":20},{"Origin":"Shahbagh","Destination":"Bangladesh Secretariat","Fare (\u09f3)":20},{"Origin":"Shahbagh","Destination":"Motijheel","Fare (\u09f3)":20},{"Origin":"Shahbagh","Destination":"Kamalapur","Fare (\u09f3)":30},{"Origin":"Dhaka University","Destination":"Uttara North","Fare (\u09f3)":90},{"Origin":"Dhaka University","Destination":"Uttara Center","Fare (\u09f3)":80},{"Origin":"Dhaka University","Destination":"Uttara South","Fare (\u09f3)":70},{"Origin":"Dhaka University","Destination":"Pallabi","Fare (\u09f3)":60},{"Origin":"Dhaka University","Destination":"Mirpur 11","Fare (\u09f3)":60},{"Origin":"Dhaka University","Destination":"Mirpur 10","Fare (\u09f3)":50},{"Origin":"Dhaka University","Destination":"Kazipara","Fare (\u09f3)":50},{"Origin":"Dhaka University","Destination":"Shewrapara","Fare (\u09f3)":40},{"Origin":"Dhaka University","Destination":"Agargaon","Fare (\u09f3)":30},{"Origin":"Dhaka University","Destination":"Bijoy Sarani","Fare (\u09f3)":30},{"Origin":"Dhaka University","Destination":"Farmgate","Fare (\u09f3)":20},{"Origin":"Dhaka University","Destination":"Kawran Bazar","Fare (\u09f3)":20},{"Origin":"Dhaka University","Destination":"Shahbagh","Fare (\u09f3)":20},{"Origin":"Dhaka University","Destination":"Dhaka University","Fare (\u09f3)":0},{"Origin":"Dhaka University","Destination":"Bangladesh Secretariat","Fare (\u09f3)":20},{"Origin":"Dhaka University","Destination":"Motijheel","Fare (\u09f3)":20},{"Origin":"Dhaka University","Destination":"Kamalapur","Fare (\u09f3)":20},{"Origin":"Bangladesh Secretariat","Destination":"Uttara North","Fare (\u09f3)":90},{"Origin":"Bangladesh Secretariat","Destination":"Uttara Center","Fare (\u09f3)":90},{"Origin":"Bangladesh Secretariat","Destination":"Uttara South","Fare (\u09f3)":80},{"Origin":"Bangladesh Secretariat","Destination":"Pallabi","Fare (\u09f3)":70},{"Origin":"Bangladesh Secretariat","Destination":"Mirpur 11","Fare (\u09f3)":70},{"Origin":"Bangladesh Secretariat","Destination":"Mirpur 10","Fare (\u09f3)":60},{"Origin":"Bangladesh Secretariat","Destination":"Kazipara","Fare (\u09f3)":50},{"Origin":"Bangladesh Secretariat","Destination":"Shewrapara","Fare (\u09f3)":50},{"Origin":"Bangladesh Secretariat","Destination":"Agargaon","Fare (\u09f3)":40},{"Origin":"Bangladesh Secretariat","Destination":"Bijoy Sarani","Fare (\u09f3)":40},{"Origin":"Bangladesh Secretariat","Destination":"Farmgate","Fare (\u09f3)":30},{"Origin":"Bangladesh Secretariat","Destination":"Kawran Bazar","Fare (\u09f3)":20},{"Origin":"Bangladesh Secretariat","Destination":"Shahbagh","Fare (\u09f3)":20},{"Origin":"Bangladesh Secretariat","Destination":"Dhaka University","Fare (\u09f3)":20},{"Origin":"Bangladesh Secretariat","Destination":"Bangladesh Secretariat","Fare (\u09f3)":0},{"Origin":"Bangladesh Secretariat","Destination":"Motijheel","Fare (\u09f3)":20},{"Origin":"Bangladesh Secretariat","Destination":"Kamalapur","Fare (\u09f3)":20},{"Origin":"Motijheel","Destination":"Uttara North","Fare (\u09f3)":100},{"Origin":"Motijheel","Destination":"Uttara Center","Fare (\u09f3)":90},{"Origin":"Motijheel","Destination":"Uttara South","Fare (\u09f3)":90},{"Origin":"Motijheel","Destination":"Pallabi","Fare (\u09f3)":80},{"Origin":"Motijheel","Destination":"Mirpur 11","Fare (\u09f3)":70},{"Origin":"Motijheel","Destination":"Mirpur 10","Fare (\u09f3)":60},{"Origin":"Motijheel","Destination":"Kazipara","Fare (\u09f3)":60},{"Origin":"Motijheel","Destination":"Shewrapara","Fare (\u09f3)":50},{"Origin":"Motijheel","Destination":"Agargaon","Fare (\u09f3)":50},{"Origin":"Motijheel","Destination":"Bijoy Sarani","Fare (\u09f3)":40},{"Origin":"Motijheel","Destination":"Farmgate","Fare (\u09f3)":30},{"Origin":"Motijheel","Destination":"Kawran Bazar","Fare (\u09f3)":30},{"Origin":"Motijheel","Destination":"Shahbagh","Fare (\u09f3)":20},{"Origin":"Motijheel","Destination":"Dhaka University","Fare (\u09f3)":20},{"Origin":"Motijheel","Destination":"Bangladesh Secretariat","Fare (\u09f3)":20},{"Origin":"Motijheel","Destination":"Motijheel","Fare (\u09f3)":0},{"Origin":"Motijheel","Destination":"Kamalapur","Fare (\u09f3)":20},{"Origin":"Kamalapur","Destination":"Uttara North","Fare (\u09f3)":100},{"Origin":"Kamalapur","Destination":"Uttara Center","Fare (\u09f3)":100},{"Origin":"Kamalapur","Destination":"Uttara South","Fare (\u09f3)":90},{"Origin":"Kamalapur","Destination":"Pallabi","Fare (\u09f3)":80},{"Origin":"Kamalapur","Destination":"Mirpur 11","Fare (\u09f3)":80},{"Origin":"Kamalapur","Destination":"Mirpur 10","Fare (\u09f3)":70},{"Origin":"Kamalapur","Destination":"Kazipara","Fare (\u09f3)":70},{"Origin":"Kamalapur","Destination":"Shewrapara","Fare (\u09f3)":60},{"Origin":"Kamalapur","Destination":"Agargaon","Fare (\u09f3)":50},{"Origin":"Kamalapur","Destination":"Bijoy Sarani","Fare (\u09f3)":50},{"Origin":"Kamalapur","Destination":"Farmgate","Fare (\u09f3)":40},{"Origin":"Kamalapur","Destination":"Kawran Bazar","Fare (\u09f3)":30},{"Origin":"Kamalapur","Destination":"Shahbagh","Fare (\u09f3)":30},{"Origin":"Kamalapur","Destination":"Dhaka University","Fare (\u09f3)":20},{"Origin":"Kamalapur","Destination":"Bangladesh Secretariat","Fare (\u09f3)":20},{"Origin":"Kamalapur","Destination":"Motijheel","Fare (\u09f3)":20},{"Origin":"Kamalapur","Destination":"Kamalapur","Fare (\u09f3)":0}];
1389
-
1390
- // Station coordinates
1391
- const coordinates = {
1392
- "Uttara North": [23.869066, 90.367445],
1393
- "Uttara Center": [23.860118, 90.365106],
1394
- "Uttara South": [23.845934, 90.363175],
1395
- "Pallabi": [23.82619516961383, 90.36481554252525],
1396
- "Mirpur 11": [23.819438208310213, 90.36528532902963],
1397
- "Mirpur 10": [23.808582994847285, 90.36821595330717],
1398
- "Kazipara": [23.800017952100532, 90.37178261495391],
1399
- "Shewrapara": [23.79070140857881, 90.37564622631841],
1400
- "Agargaon": [23.778385546736345, 90.3800557456356],
1401
- "Bijoy Sarani": [23.766638127271825, 90.38307537134754],
1402
- "Farmgate": [23.75923604938459, 90.38694218434738],
1403
- "Kawran Bazar": [23.751392319539104, 90.39275707447003],
1404
- "Shahbagh": [23.740324209546923, 90.39600784811131],
1405
- "Dhaka University": [23.732091083122114, 90.39659408796354],
1406
- "Bangladesh Secretariat": [23.73004754106779, 90.40764881366906],
1407
- "Motijheel": [23.72816566933198, 90.41923497972823],
1408
- "Kamalapur": [23.732367758919807, 90.42547378971085]
1409
- };
1410
-
1411
- const originSelect = document.getElementById('origin');
1412
- const destinationButtons = document.getElementById('destination-buttons');
1413
- const fareDisplay = document.getElementById('fare-display');
1414
-
1415
- const allStations = [...new Set(fareData.map(f => f.Origin))];
1416
-
1417
- allStations.forEach(station => {
1418
- const option = document.createElement('option');
1419
- option.value = station;
1420
- option.textContent = station;
1421
- originSelect.appendChild(option);
1422
- });
1423
-
1424
- originSelect.addEventListener('change', () => {
1425
- destinationButtons.innerHTML = '';
1426
- fareDisplay.innerHTML = '';
1427
- const selectedOrigin = originSelect.value;
1428
-
1429
- if (!selectedOrigin) return;
1430
-
1431
- const destinations = fareData
1432
- .filter(f => f.Origin === selectedOrigin)
1433
- .map(f => f.Destination);
1434
-
1435
- destinations.forEach(destination => {
1436
- const btn = document.createElement('button');
1437
- btn.textContent = destination;
1438
- btn.addEventListener('click', () => {
1439
- btn.classList.toggle('selected');
1440
- updateFares(selectedOrigin);
1441
- });
1442
- destinationButtons.appendChild(btn);
1443
- });
1444
- });
1445
-
1446
- document.getElementById('clear-destinations').addEventListener('click', () => {
1447
- document.querySelectorAll('#destination-buttons button').forEach(btn => btn.classList.remove('selected'));
1448
- fareDisplay.innerHTML = '';
1449
- });
1450
-
1451
- function updateFares(origin) {
1452
- fareDisplay.innerHTML = '';
1453
- const selectedDestinations = Array.from(document.querySelectorAll('#destination-buttons button.selected'))
1454
- .map(btn => btn.textContent);
1455
-
1456
- selectedDestinations.forEach(destination => {
1457
- const fareInfo = fareData.find(f => f.Origin === origin && f.Destination === destination);
1458
- if (fareInfo) {
1459
- const card = document.createElement('div');
1460
- card.className = 'fare-item';
1461
- card.innerHTML = `
1462
- <div class="journey-detail">
1463
- <div class="station">${origin}</div>
1464
- <div class="journey-arrow"><i class="fas fa-arrow-right"></i></div>
1465
- <div class="station">${destination}</div>
1466
- </div>
1467
- <div class="fare-amount">৳${fareInfo["Fare (৳)"]}</div>
1468
- `;
1469
- fareDisplay.appendChild(card);
1470
- }
1471
- });
1472
- }
1473
-
1474
- // Map rendering
1475
- const map = L.map('map').setView([23.8103, 90.4125], 12);
1476
-
1477
- L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
1478
- attribution: '&copy; OpenStreetMap contributors'
1479
- }).addTo(map);
1480
-
1481
- Object.entries(coordinates).forEach(([name, coord]) => {
1482
- L.marker(coord).addTo(map).bindPopup(`<strong>${name}</strong>`);
1483
- });
1484
-
1485
- const sourceSelect = document.getElementById('map-source');
1486
- const destSelect = document.getElementById('map-destination');
1487
-
1488
- allStations.forEach(station => {
1489
- const srcOption = document.createElement('option');
1490
- srcOption.value = station;
1491
- srcOption.textContent = station;
1492
- sourceSelect.appendChild(srcOption);
1493
-
1494
- const dstOption = document.createElement('option');
1495
- dstOption.value = station;
1496
- dstOption.textContent = station;
1497
- destSelect.appendChild(dstOption);
1498
- });
1499
-
1500
- let routeLine;
1501
-
1502
- function startRouteAnimation() {
1503
- if (routeLine) map.removeLayer(routeLine);
1504
-
1505
- const source = sourceSelect.value;
1506
- const destination = destSelect.value;
1507
-
1508
- if (!source || !destination || !coordinates[source] || !coordinates[destination]) return;
1509
-
1510
- routeLine = L.polyline([coordinates[source], coordinates[destination]], {
1511
- color: 'blue',
1512
- weight: 5,
1513
- dashArray: '10, 10'
1514
- }).addTo(map);
1515
-
1516
- map.fitBounds(routeLine.getBounds());
1517
- }
1518
-
1519
- function animateAllLocations() {
1520
- if (routeLine) map.removeLayer(routeLine);
1521
-
1522
- const allCoords = Object.values(coordinates);
1523
- routeLine = L.polyline(allCoords, {
1524
- color: 'green',
1525
- weight: 4,
1526
- dashArray: '5, 5'
1527
- }).addTo(map);
1528
-
1529
- map.fitBounds(routeLine.getBounds());
1530
- }
1531
-
1532
- function stopAnimation() {
1533
- if (routeLine) {
1534
- map.removeLayer(routeLine);
1535
- routeLine = null;
1536
- }
1537
- }
1538
-
1539
- const sidebar = document.getElementById('sidebar');
1540
- const sidebarToggle = document.getElementById('sidebar-toggle');
1541
- const icon = sidebarToggle.querySelector('i');
1542
-
1543
- function updateChevron() {
1544
- if (window.innerWidth > 1024) {
1545
- if (sidebar.classList.contains('collapsed')) {
1546
- icon.classList.remove('fa-chevron-left');
1547
- icon.classList.add('fa-chevron-right');
1548
- } else {
1549
- icon.classList.add('fa-chevron-left');
1550
- icon.classList.remove('fa-chevron-right');
1551
- }
1552
- } else {
1553
- if (sidebar.classList.contains('open')) {
1554
- icon.classList.add('fa-chevron-left');
1555
- icon.classList.remove('fa-chevron-right');
1556
- } else {
1557
- icon.classList.remove('fa-chevron-left');
1558
- icon.classList.add('fa-chevron-right');
1559
- }
1560
- }
1561
- }
1562
-
1563
- function handleSidebarToggle() {
1564
- if (window.innerWidth > 1024) {
1565
- sidebar.classList.toggle('collapsed');
1566
- sidebarToggle.classList.toggle('sidebar-at-edge', sidebar.classList.contains('collapsed'));
1567
- } else {
1568
- sidebar.classList.toggle('open');
1569
- }
1570
- updateChevron();
1571
- }
1572
-
1573
- sidebarToggle.addEventListener('click', handleSidebarToggle);
1574
-
1575
- // Keep everything normal on resize
1576
- window.addEventListener('resize', function() {
1577
- if (window.innerWidth > 1024) {
1578
- sidebar.classList.remove('open');
1579
- sidebar.classList.remove('collapsed');
1580
- sidebarToggle.classList.remove('sidebar-at-edge');
1581
- icon.classList.remove('fa-chevron-right');
1582
- icon.classList.add('fa-chevron-left');
1583
- } else {
1584
- sidebar.classList.remove('collapsed');
1585
- sidebarToggle.classList.remove('sidebar-at-edge');
1586
- icon.classList.remove('fa-chevron-left');
1587
- icon.classList.add('fa-chevron-right');
1588
- }
1589
- updateChevron();
1590
- });
1591
-
1592
- // Call once on load
1593
- updateChevron();
1594
-
1595
- // Show notification on load
1596
- window.addEventListener('load', () => {
1597
- document.querySelector('.notification').classList.add('show');
1598
- setTimeout(() => {
1599
- document.querySelector('.notification').classList.remove('show');
1600
- }, 5000);
1601
- });
1602
- </script>
1603
- </body>
1604
  </html>
 
1
+ <script type="text/javascript">
2
  var gk_isXlsx = false;
3
  var gk_xlsxFileLookup = {};
4
  var gk_fileData = {};
 
486
  }
487
  </script>
488
  </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
489
  </html>