From eb24c56bf681119f4e95e34570edd701c6547aad Mon Sep 17 00:00:00 2001 From: Araozu Date: Sun, 8 Sep 2024 22:02:05 -0500 Subject: [PATCH] Improve route editor --- public/n/lines.json | 29 +----- public/n/routes_1.json | 5 +- public/n/routes_5.json | 2 + src/new_types.ts | 39 ++++--- src/pages/Editor.tsx | 229 ++++++++++++++++++++++++----------------- src/pages/Index.tsx | 25 ++--- src/pages/Index2.tsx | 65 ++++++++---- tailwind.config.js | 5 + 8 files changed, 228 insertions(+), 171 deletions(-) diff --git a/public/n/lines.json b/public/n/lines.json index 11c321c..049ba9b 100644 --- a/public/n/lines.json +++ b/public/n/lines.json @@ -2,36 +2,9 @@ { "id": 1, "name": "1", + "district": "Hunter/Tiabaya", "color": "#ea4fb2", "hover_bg": "#ea4fb2", "hover_on_bg": "white" - }, - { - "id": 2, - "name": "2", - "color": "black", - "hover_bg": "black", - "hover_on_bg": "white" - }, - { - "id": 3, - "name": "3", - "color": "#eab308", - "hover_bg": "#eab308", - "hover_on_bg": "white" - }, - { - "id": 4, - "name": "4", - "color": "#ff7300", - "hover_bg": "#ff7300", - "hover_on_bg": "white" - }, - { - "id": 5, - "name": "5", - "color": "#b8860b", - "hover_bg": "#b8860b", - "hover_on_bg": "white" } ] \ No newline at end of file diff --git a/public/n/routes_1.json b/public/n/routes_1.json index 09d6e87..3d48e3a 100644 --- a/public/n/routes_1.json +++ b/public/n/routes_1.json @@ -1,6 +1,3 @@ [ - { - "name": "D", - "points": [[-16.43611408449085,-71.56457662582399],[-16.43708170446484,-71.56467318534852],[-16.437318461809493,-71.564759016037],[-16.437704478600303,-71.56507015228273],[-16.43908898584533,-71.56543493270875],[-16.43934118126953,-71.56559586524965],[-16.43977866235094,-71.56595528125764],[-16.44035510650618,-71.56601428985597],[-16.44100360413526,-71.56557440757753],[-16.441307264978878,-71.56554222106935],[-16.4417087141788,-71.56565487384798],[-16.442274859075635,-71.56564414501192],[-16.442985111247793,-71.56603574752809],[-16.444364434129913,-71.56604647636415],[-16.444611475999316,-71.56589627265932],[-16.444812197286705,-71.56538665294649],[-16.445002624982866,-71.56519889831544],[-16.44519305249221,-71.56496286392213],[-16.446093720613227,-71.56433522701265],[-16.446464279998143,-71.56397044658662],[-16.446948064796985,-71.56296193599702],[-16.4476788863553,-71.56193733215333],[-16.448718501013264,-71.56080543994905],[-16.44876482034863,-71.5604192018509],[-16.44972208413762,-71.55911028385164],[-16.450669050121338,-71.55950188636781],[-16.45166747664264,-71.5589600801468],[-16.452202713487203,-71.5581500530243],[-16.45243430589496,-71.55781745910646],[-16.453756950570444,-71.55656754970552],[-16.452326229472394,-71.55537128448488],[-16.451662330127366,-71.5549260377884],[-16.449505928210936,-71.55285000801088],[-16.44803400287958,-71.55419111251832],[-16.447869311238982,-71.5541857481003],[-16.446384593628075,-71.55553221702577],[-16.44641032690298,-71.55581653118135],[-16.446868378625545,-71.555934548378],[-16.445052299289685,-71.55775845050813],[-16.44317374811287,-71.55574679374696],[-16.44007538563583,-71.55893325805665],[-16.439756282373104,-71.55928194522859],[-16.438096092680166,-71.56110584735872],[-16.43628438421201,-71.56216263771059],[-16.434787727688384,-71.56215190887453],[-16.43443773390786,-71.56204998493196],[-16.433032605470288,-71.55990421772005],[-16.432862754091463,-71.55980765819551],[-16.432466433630058,-71.5599310398102],[-16.432245111462098,-71.56015634536745],[-16.432106141599874,-71.56076788902284],[-16.431946583487317,-71.56113266944887],[-16.431539967059596,-71.5616261959076],[-16.42878112932906,-71.55944824218751],[-16.418481181795133,-71.55068278312685],[-16.41818263267867,-71.54941678047182],[-16.41835789056568,-71.54899835586549],[-16.419366777931167,-71.54789328575136],[-16.42225443170917,-71.54470682144166],[-16.4225066489863,-71.54422938823701],[-16.422851516978476,-71.54376268386842],[-16.423052260751902,-71.5425342321396],[-16.42317064800826,-71.54162764549257],[-16.424261866280478,-71.53878450393678],[-16.424653056244814,-71.53801739215852],[-16.424879534285353,-71.53753459453584],[-16.425440581021903,-71.53548002243043],[-16.425615586094548,-71.53456270694734],[-16.425996478943297,-71.53413891792299],[-16.42623324979738,-71.53377413749696],[-16.426845764364096,-71.53388142585756],[-16.426922971945565,-71.53380632400514],[-16.426928119116567,-71.5330070257187],[-16.42575970780081,-71.53304994106294],[-16.425382020805007,-71.53293728828432],[-16.42510921838347,-71.5331143140793],[-16.424702587648202,-71.53307139873506],[-16.42319444344202,-71.53182685375215],[-16.42222675430749,-71.53132796287538],[-16.42140833260937,-71.53124749660493],[-16.4204560766114,-71.53139233589174],[-16.418144906171182,-71.53220236301424],[-16.417213223903843,-71.53262615203859],[-16.41650287751858,-71.53317868709566],[-16.415658694382287,-71.5338170528412],[-16.4131003853041,-71.5349864959717],[-16.412395171452776,-71.53511524200441],[-16.412122350809817,-71.53484165668489],[-16.411360510007153,-71.53411209583284],[-16.410454533277075,-71.53257787227632],[-16.409625766777793,-71.53098464012147],[-16.409270580054535,-71.52987420558931],[-16.40902349325588,-71.5284687280655],[-16.40875581553656,-71.52764260768892],[-16.40845210383218,-71.5273153781891],[-16.407911598778853,-71.52581334114076],[-16.407103412231507,-71.52453124523164],[-16.406732777787767,-71.52351200580598],[-16.406300370044494,-71.52281463146211],[-16.405687790763388,-71.5219831466675],[-16.40507520955399,-71.52080833911897],[-16.404184646877496,-71.51963889598848],[-16.4037316423339,-71.51877522468568],[-16.40348454850207,-71.5183997154236],[-16.402393213659135,-71.51755213737489],[-16.401337907638037,-71.51670455932619],[-16.400308335274527,-71.5158784389496],[-16.399577335590926,-71.51534199714662],[-16.399721476590855,-71.5116995573044],[-16.39982958227077,-71.51160299777986],[-16.39982443438263,-71.51143133640291],[-16.399618518744667,-71.51138305664064],[-16.399407454989678,-71.51145815849306],[-16.39679119266764,-71.50865325271027],[-16.39671397312591,-71.50810608207124],[-16.395823372197867,-71.50611588298219],[-16.39589544410075,-71.50600859462159],[-16.395828520191806,-71.50545605956452],[-16.39539094022041,-71.50492498217957],[-16.394639329974606,-71.50423833667176],[-16.39452092535631,-71.50397011577027],[-16.394546665496854,-71.50312253772157],[-16.39452092535631,-71.50400230227845],[-16.39463418194923,-71.50425979434388],[-16.39544242026808,-71.5049464398517],[-16.395607156329206,-71.50491425334351],[-16.396065327766298,-71.50508591472047],[-16.396477166340272,-71.50488206683534],[-16.396621309635364,-71.50484988032716],[-16.396590421795416,-71.50550970374482],[-16.39703314703345,-71.50550433932679],[-16.397120662368334,-71.50465139686006],[-16.397316861757762,-71.50526762008668],[-16.397471300332434,-71.50531053543092],[-16.397558815470365,-71.50502622127534],[-16.398475148081776,-71.50389432907106],[-16.399422363776072,-71.50562703609468],[-16.40059093330978,-71.50485455989839],[-16.403962757618064,-71.51043355464937],[-16.405002606154213,-71.50974690914155],[-16.406099074087503,-71.51157081127168],[-16.410279702669953,-71.50507450103761],[-16.41048560702776,-71.50533199310304],[-16.410948891036064,-71.5062975883484],[-16.41184971789374,-71.50625467300416],[-16.411592339217233,-71.51222527027132],[-16.41162322467637,-71.51242911815645],[-16.411834275182784,-71.512708067894],[-16.41242624489347,-71.51251494884492],[-16.41262699942977,-71.51293337345125],[-16.412415949783426,-71.51338398456575],[-16.415808159041003,-71.51539027690889],[-16.418268631919567,-71.51598036289217],[-16.420270960300837,-71.51664018630983],[-16.42251004344991,-71.51638805866243],[-16.42436305827661,-71.51566386222841],[-16.42567559975737,-71.51888787746431],[-16.425186614751482,-71.51902735233308],[-16.425387356113287,-71.51953160762788],[-16.426041050905813,-71.51939213275911],[-16.42618002510584,-71.5194618701935],[-16.425274117421864,-71.52120530605318],[-16.425047792736184,-71.52218699455263],[-16.42519706208033,-71.52603864669801],[-16.42525368145672,-71.53289973735811],[-16.4253308896707,-71.53468608856203],[-16.424656603566326,-71.5374004840851],[-16.424033787605453,-71.53892397880556],[-16.422999498081907,-71.5414881706238],[-16.422901699832654,-71.54197096824647],[-16.42281979114636,-71.54327988624574],[-16.422691109110254,-71.54372513294221],[-16.422377124584724,-71.54414355754854],[-16.422006519246292,-71.54433131217958],[-16.420992498250737,-71.5454524755478],[-16.41900047206226,-71.54760897159578],[-16.4181011026198,-71.54866039752962],[-16.418090807810206,-71.54886960983278],[-16.416721593274993,-71.55031263828279],[-16.416510548071834,-71.55024826526643],[-16.416284060281942,-71.55006051063539],[-16.416258323016404,-71.54987275600435],[-16.416814247194306,-71.54925048351289],[-16.418440831031216,-71.55072033405305],[-16.424131733393413,-71.55561804771425],[-16.43150003748286,-71.56165301799776],[-16.431973565490395,-71.56116485595705],[-16.432127976547683,-71.56076788902284],[-16.43227209342375,-71.56016170978548],[-16.43248826853736,-71.5599685907364],[-16.432879441941004,-71.55986130237581],[-16.433023558259613,-71.5599310398102],[-16.43441324584529,-71.56204462051393],[-16.43480956233482,-71.56218945980073],[-16.436250706389085,-71.56225919723512],[-16.43817564640912,-71.56114876270296],[-16.440038805475872,-71.55914247035982],[-16.440158542419972,-71.55895471572877],[-16.44310764810332,-71.55590236186983],[-16.44454358386859,-71.55737221240999],[-16.4460978822953,-71.5557897090912],[-16.446422121788814,-71.55576288700105],[-16.446854440270926,-71.5558809041977],[-16.447410276904378,-71.5548884868622],[-16.447966111946002,-71.55436277389528],[-16.448074190796998,-71.55420184135438],[-16.44895940578747,-71.55339717864992],[-16.449489503528966,-71.55385851860048],[-16.44999901358563,-71.55337035655977],[-16.45157385439345,-71.55488312244417],[-16.45230980502918,-71.55538737773897],[-16.453725086866996,-71.55656754970552],[-16.452409657861214,-71.55782282352449],[-16.451658268058484,-71.55894935131074],[-16.450685574197806,-71.55946969985963],[-16.44970772889402,-71.55906200408937],[-16.448740171848755,-71.56041383743288],[-16.448688705913373,-71.56081080436708],[-16.447660918623953,-71.56193733215333],[-16.44690436379199,-71.56296193599702],[-16.446415432229752,-71.56398117542268],[-16.445186230296617,-71.5649199485779],[-16.44478993498551,-71.56534373760225],[-16.44457423678586,-71.56586945056917],[-16.444337488288557,-71.56602501869203],[-16.44298389894412,-71.56598746776582],[-16.442283940295894,-71.56557977199556],[-16.441713340903885,-71.56561732292177],[-16.441311891713557,-71.56548321247102],[-16.440972203288776,-71.56553149223329],[-16.440344292817773,-71.56598210334779],[-16.43979872961245,-71.56591773033144],[-16.439124493722076,-71.56539201736452],[-16.437765721150942,-71.56502187252046],[-16.4373179417436,-71.56469464302064],[-16.437065743691868,-71.56459271907808],[-16.436146188732675,-71.56452298164369]] - } + {"name":"","departure":[[-16.436073789050543,-71.56459271907808],[-16.436634803462546,-71.5646141767502],[-16.437236991440884,-71.564759016037],[-16.43771050546292,-71.56510770320894],[-16.4391104532101,-71.56549930572511],[-16.43978468914921,-71.56598746776582],[-16.44035598647145,-71.56604111194612],[-16.440989043703073,-71.56557977199556],[-16.441302998149865,-71.56555294990541],[-16.441652979557702,-71.56569242477418],[-16.442270592267896,-71.56570315361024],[-16.442517636801803,-71.56576216220857],[-16.443016871671276,-71.56606256961824],[-16.444365314077018,-71.56608402729036],[-16.44463294275347,-71.5658748149872],[-16.444885130976296,-71.56535446643831],[-16.445075558600905,-71.56514525413515],[-16.445157905623983,-71.56499505043031],[-16.446110040540923,-71.56433522701265],[-16.446475453241817,-71.56395971775056],[-16.446955916299906,-71.562956571579],[-16.447753643887435,-71.5618944168091],[-16.448772671778055,-71.56081080436708],[-16.448802817768104,-71.56040847301485],[-16.449199104885604,-71.55983448028566],[-16.44971890883882,-71.55914783477785],[-16.45064528866979,-71.55951261520387],[-16.451690033950474,-71.5589761734009],[-16.45225614973289,-71.55810713768007],[-16.45242083765037,-71.55786573886873],[-16.45378465409445,-71.55658364295961],[-16.452950925935525,-71.55578434467317],[-16.452384812180345,-71.55534446239473],[-16.451674594406025,-71.55489385128023],[-16.449476670484906,-71.55279099941255],[-16.448051064437347,-71.55414819717409],[-16.447927545730835,-71.55414283275606],[-16.446383555266852,-71.55549466609956],[-16.44637326195588,-71.55583798885347],[-16.44679014061372,-71.555934548378],[-16.44506600702521,-71.55772089958192],[-16.443187455981075,-71.5556985139847],[-16.440091611356817,-71.55887424945833],[-16.43972103980777,-71.55923902988435],[-16.438074046589133,-71.56108975410463],[-16.43644762707824,-71.56204998493196],[-16.43626233791531,-71.56212508678438],[-16.435073394913626,-71.56213581562044],[-16.434635903232838,-71.56210899353029],[-16.434496935080915,-71.56199634075166],[-16.433055778014655,-71.55986666679384],[-16.432885926656073,-71.55979692935945],[-16.43240725384663,-71.5599149465561],[-16.4322425489513,-71.56009197235109],[-16.432071176629677,-71.56079471111299],[-16.431978529982942,-71.56099319458009],[-16.431551325429275,-71.56159400939943],[-16.4305738539,-71.56075716018678],[-16.42885472345518,-71.55943214893342],[-16.427342352944493,-71.55809640884401],[-16.423806221876152,-71.55514597892763],[-16.420722992506974,-71.55254960060121],[-16.418594687946023,-71.550709605217],[-16.418363055185868,-71.5502053499222],[-16.418213780594265,-71.54937386512758],[-16.418285844204522,-71.54913783073427],[-16.418543487859125,-71.54884278774263],[-16.42222898628675,-71.5448033809662],[-16.42251723461452,-71.54425084590913],[-16.42287239714489,-71.54378950595857],[-16.42297534268454,-71.54344081878664],[-16.42307314089671,-71.54265761375429],[-16.4231760863301,-71.54171884059907],[-16.42321726448818,-71.54156863689424],[-16.424241568362994,-71.53888642787935],[-16.424812911395264,-71.53768479824068],[-16.42492100313136,-71.53746485710145],[-16.42547175532945,-71.5354210138321],[-16.4256313187588,-71.53458416461946],[-16.42604824193979,-71.5341228246689],[-16.426233540844226,-71.53380095958711],[-16.426717376039566,-71.533961892128],[-16.42696444035557,-71.53380095958711],[-16.426959293185536,-71.53297483921052],[-16.42575999884836,-71.53299629688264],[-16.425409988805505,-71.53288900852205],[-16.425188658600145,-71.53303921222688],[-16.424751144661922,-71.53305530548097],[-16.42357242573948,-71.53208971023561],[-16.422681947752764,-71.53146207332613],[-16.42220324980815,-71.5312957763672],[-16.42166278297004,-71.5312045812607],[-16.420581844786142,-71.53131186962129],[-16.41881115210876,-71.53188049793245],[-16.417889767854493,-71.53228282928468],[-16.41714339193377,-71.53261542320253],[-16.41666468035254,-71.53294801712038],[-16.41631980138627,-71.53328597545625],[-16.41573299099325,-71.53373122215272],[-16.41537266794468,-71.53390288352968],[-16.413359994066372,-71.53484702110292],[-16.41253326363852,-71.53508841991426],[-16.412373689459923,-71.53504014015199],[-16.411719948716385,-71.53440713882448],[-16.411164009977597,-71.53379559516908],[-16.410536003194935,-71.53262615203859],[-16.40982048479972,-71.53132796287538],[-16.409619727367147,-71.53080224990846],[-16.409321164648432,-71.52995467185976],[-16.409193712029378,-71.52901589870454],[-16.4089466251331,-71.52800202369691],[-16.40881793391701,-71.5276211500168],[-16.408673799653954,-71.52749776840211],[-16.408488484015983,-71.5273153781891],[-16.40798916044626,-71.52579724788667],[-16.40724789422706,-71.5246492624283],[-16.407103758800964,-71.52439177036287],[-16.40678974911014,-71.52347445487977],[-16.406691942709518,-71.52328670024873],[-16.405801387431556,-71.52211725711824],[-16.405534922984064,-71.52163445949556],[-16.405020148583493,-71.52060449123384],[-16.40424798442957,-71.51959061622621],[-16.40356847743992,-71.5184909105301],[-16.402883820270635,-71.51786863803865],[-16.402080760672213,-71.51727318763734],[-16.401309759527816,-71.51662409305574],[-16.40037799663822,-71.51586234569551],[-16.399621257749914,-71.5153205394745],[-16.399796286053622,-71.51173174381258],[-16.39987350437285,-71.51149034500123],[-16.399760250827477,-71.51133477687837],[-16.399487412470314,-71.51142060756685],[-16.399369990850612,-71.51141524314882],[-16.39683720745614,-71.50865256786348],[-16.39671365620388,-71.50825560092927],[-16.396729100114715,-71.50809466838838],[-16.396157674598438,-71.50684475898744],[-16.39586938721513,-71.50614202022554],[-16.395931163118885,-71.5059918165207],[-16.39584364724939,-71.50546073913576],[-16.395725243363376,-71.50521397590639],[-16.395225887051964,-71.50471508502962],[-16.3946338650238,-71.5041893720627],[-16.39455149659899,-71.5040445327759],[-16.394582384762398,-71.50312185287477],[-16.39452060843073,-71.50313794612886]],"departure_arrows":[],"return":[[-16.436073789050543,-71.56459271907808],[-16.436634803462546,-71.5646141767502],[-16.437236991440884,-71.564759016037],[-16.43771050546292,-71.56510770320894],[-16.4391104532101,-71.56549930572511],[-16.43978468914921,-71.56598746776582],[-16.44035598647145,-71.56604111194612],[-16.440989043703073,-71.56557977199556],[-16.441302998149865,-71.56555294990541],[-16.441652979557702,-71.56569242477418],[-16.442270592267896,-71.56570315361024],[-16.442517636801803,-71.56576216220857],[-16.443016871671276,-71.56606256961824],[-16.444365314077018,-71.56608402729036],[-16.44463294275347,-71.5658748149872],[-16.444885130976296,-71.56535446643831],[-16.445075558600905,-71.56514525413515],[-16.445157905623983,-71.56499505043031],[-16.446110040540923,-71.56433522701265],[-16.446475453241817,-71.56395971775056],[-16.446955916299906,-71.562956571579],[-16.447753643887435,-71.5618944168091],[-16.448772671778055,-71.56081080436708],[-16.448802817768104,-71.56040847301485],[-16.449199104885604,-71.55983448028566],[-16.44971890883882,-71.55914783477785],[-16.45064528866979,-71.55951261520387],[-16.451690033950474,-71.5589761734009],[-16.45225614973289,-71.55810713768007],[-16.45242083765037,-71.55786573886873],[-16.45378465409445,-71.55658364295961],[-16.452950925935525,-71.55578434467317],[-16.452384812180345,-71.55534446239473],[-16.451674594406025,-71.55489385128023],[-16.449476670484906,-71.55279099941255],[-16.448051064437347,-71.55414819717409],[-16.447927545730835,-71.55414283275606],[-16.446383555266852,-71.55549466609956],[-16.44637326195588,-71.55583798885347],[-16.44679014061372,-71.555934548378],[-16.44506600702521,-71.55772089958192],[-16.443187455981075,-71.5556985139847],[-16.440091611356817,-71.55887424945833],[-16.43972103980777,-71.55923902988435],[-16.438074046589133,-71.56108975410463],[-16.43644762707824,-71.56204998493196],[-16.43626233791531,-71.56212508678438],[-16.435073394913626,-71.56213581562044],[-16.434635903232838,-71.56210899353029],[-16.434496935080915,-71.56199634075166],[-16.433055778014655,-71.55986666679384],[-16.432885926656073,-71.55979692935945],[-16.43240725384663,-71.5599149465561],[-16.4322425489513,-71.56009197235109],[-16.432071176629677,-71.56079471111299],[-16.431978529982942,-71.56099319458009],[-16.431551325429275,-71.56159400939943],[-16.4305738539,-71.56075716018678],[-16.42885472345518,-71.55943214893342],[-16.427342352944493,-71.55809640884401],[-16.423806221876152,-71.55514597892763],[-16.420722992506974,-71.55254960060121],[-16.418594687946023,-71.550709605217],[-16.418363055185868,-71.5502053499222],[-16.418213780594265,-71.54937386512758],[-16.418285844204522,-71.54913783073427],[-16.418543487859125,-71.54884278774263],[-16.42222898628675,-71.5448033809662],[-16.42251723461452,-71.54425084590913],[-16.42287239714489,-71.54378950595857],[-16.42297534268454,-71.54344081878664],[-16.42307314089671,-71.54265761375429],[-16.4231760863301,-71.54171884059907],[-16.42321726448818,-71.54156863689424],[-16.424241568362994,-71.53888642787935],[-16.424812911395264,-71.53768479824068],[-16.42492100313136,-71.53746485710145],[-16.42547175532945,-71.5354210138321],[-16.4256313187588,-71.53458416461946],[-16.42604824193979,-71.5341228246689],[-16.426233540844226,-71.53380095958711],[-16.426717376039566,-71.533961892128],[-16.42696444035557,-71.53380095958711],[-16.426959293185536,-71.53297483921052],[-16.42575999884836,-71.53299629688264],[-16.425409988805505,-71.53288900852205],[-16.425188658600145,-71.53303921222688],[-16.424751144661922,-71.53305530548097],[-16.42357242573948,-71.53208971023561],[-16.422681947752764,-71.53146207332613],[-16.42220324980815,-71.5312957763672],[-16.42166278297004,-71.5312045812607],[-16.420581844786142,-71.53131186962129],[-16.41881115210876,-71.53188049793245],[-16.417889767854493,-71.53228282928468],[-16.41714339193377,-71.53261542320253],[-16.41666468035254,-71.53294801712038],[-16.41631980138627,-71.53328597545625],[-16.41573299099325,-71.53373122215272],[-16.41537266794468,-71.53390288352968],[-16.413359994066372,-71.53484702110292],[-16.41253326363852,-71.53508841991426],[-16.412373689459923,-71.53504014015199],[-16.411719948716385,-71.53440713882448],[-16.411164009977597,-71.53379559516908],[-16.410536003194935,-71.53262615203859],[-16.40982048479972,-71.53132796287538],[-16.409619727367147,-71.53080224990846],[-16.409321164648432,-71.52995467185976],[-16.409193712029378,-71.52901589870454],[-16.4089466251331,-71.52800202369691],[-16.40881793391701,-71.5276211500168],[-16.408673799653954,-71.52749776840211],[-16.408488484015983,-71.5273153781891],[-16.40798916044626,-71.52579724788667],[-16.40724789422706,-71.5246492624283],[-16.407103758800964,-71.52439177036287],[-16.40678974911014,-71.52347445487977],[-16.406691942709518,-71.52328670024873],[-16.405801387431556,-71.52211725711824],[-16.405534922984064,-71.52163445949556],[-16.405020148583493,-71.52060449123384],[-16.40424798442957,-71.51959061622621],[-16.40356847743992,-71.5184909105301],[-16.402883820270635,-71.51786863803865],[-16.402080760672213,-71.51727318763734],[-16.401309759527816,-71.51662409305574],[-16.40037799663822,-71.51586234569551],[-16.399621257749914,-71.5153205394745],[-16.399796286053622,-71.51173174381258],[-16.39987350437285,-71.51149034500123],[-16.399760250827477,-71.51133477687837],[-16.399487412470314,-71.51142060756685],[-16.399369990850612,-71.51141524314882],[-16.39683720745614,-71.50865256786348],[-16.39671365620388,-71.50825560092927],[-16.396729100114715,-71.50809466838838],[-16.396157674598438,-71.50684475898744],[-16.39586938721513,-71.50614202022554],[-16.395931163118885,-71.5059918165207],[-16.39584364724939,-71.50546073913576],[-16.395725243363376,-71.50521397590639],[-16.395225887051964,-71.50471508502962],[-16.3946338650238,-71.5041893720627],[-16.39455149659899,-71.5040445327759],[-16.394582384762398,-71.50312185287477],[-16.39452060843073,-71.50313794612886]],"return_arrows":[]} ] diff --git a/public/n/routes_5.json b/public/n/routes_5.json index 3759c13..ccb453f 100644 --- a/public/n/routes_5.json +++ b/public/n/routes_5.json @@ -1,6 +1,8 @@ [ { "name": "A", + "from": "Paucarpata", + "to": "Hunter", "points": [[-16.405241389789413,-71.46819412708284],[-16.405817936371108,-71.46904170513154],[-16.406183219877896,-71.47135376930238],[-16.406507436408692,-71.47377312183382],[-16.40663612915294,-71.47448122501375],[-16.40696042071218,-71.47834360599519],[-16.407784050887134,-71.47826313972475],[-16.40789178350946,-71.47960960865022],[-16.40809769039446,-71.48210406303407],[-16.408231207589523,-71.48376166768755],[-16.408601763484274,-71.48621320724489],[-16.408823112569166,-71.48791372776033],[-16.40920403831168,-71.49039745330812],[-16.410058057281926,-71.49598181247713],[-16.410176452449175,-71.49611592292787],[-16.410459571035265,-71.49796664714815],[-16.41532399874257,-71.49724781513216],[-16.41429320867459,-71.49882495403291],[-16.41026376897537,-71.50491893291475],[-16.404526261846726,-71.5137004852295],[-16.40304428408867,-71.51595890522005],[-16.4027508590922,-71.5164363384247],[-16.40224637297652,-71.51722490787508],[-16.40190661628424,-71.51776134967805],[-16.401551415471875,-71.51815831661226],[-16.39934407738441,-71.52161836624147],[-16.399683838549226,-71.52183294296266],[-16.400759744992516,-71.52313113212587],[-16.40428085177449,-71.52744948863985],[-16.410689720345967,-71.53525471687318],[-16.4113692024676,-71.53470218181612],[-16.41202294438989,-71.53530836105348],[-16.412275174937896,-71.53564631938936],[-16.412578880673927,-71.53625786304475],[-16.41275389732341,-71.53693914413454],[-16.413304683986805,-71.53827488422395],[-16.413392192004693,-71.53893470764162],[-16.413423077178077,-71.53909564018251],[-16.414056566228403,-71.54130578041078],[-16.4139947960779,-71.54360175132753],[-16.414241876562166,-71.54371976852418],[-16.414524989231204,-71.54333889484407],[-16.4158324496653,-71.54174566268922],[-16.41735094582956,-71.54065132141115],[-16.417906866883893,-71.54021680355073],[-16.418627502922142,-71.53937995433809],[-16.419255483577643,-71.53890252113344],[-16.420145977259455,-71.53829097747804],[-16.420349737337663,-71.5386986732483],[-16.420694609156147,-71.54016852378847],[-16.420977712430563,-71.54075860977174],[-16.421358614367453,-71.54145598411561],[-16.421600538183043,-71.5426415205002],[-16.42217127931684,-71.54406845569612],[-16.42211980634092,-71.54433667659761],[-16.422372023792725,-71.54456198215486],[-16.42251100061614,-71.54439568519594],[-16.422531589766724,-71.54425621032716],[-16.422907341381645,-71.54363393783571],[-16.423128674184746,-71.54196560382844],[-16.42322647231978,-71.54153108596803],[-16.424265697770178,-71.5388596057892],[-16.42481627444026,-71.53766870498659],[-16.425058193952637,-71.53783500194551],[-16.42563468178964,-71.53892934322359],[-16.42579424508523,-71.53921365737916],[-16.426334700435724,-71.53981983661653],[-16.426525146248707,-71.53990030288698],[-16.42675162210773,-71.53979837894441],[-16.42889798248597,-71.53774917125703],[-16.429500194448174,-71.53847336769105],[-16.429886226775576,-71.53922975063325],[-16.429474458932415,-71.53953015804292],[-16.42690603731484,-71.54181003570558],[-16.426849418419835,-71.54205143451692],[-16.427117071232818,-71.54216408729555],[-16.427055305231757,-71.54296338558198],[-16.426936920341554,-71.54333353042604],[-16.426983244872407,-71.54364466667177],[-16.427127365564402,-71.54387533664705],[-16.427497961138762,-71.5441006422043],[-16.42768325866097,-71.54436349868776],[-16.427786201652452,-71.54489994049074],[-16.427935468893324,-71.54539346694948],[-16.428136207415744,-71.54582262039186],[-16.42824944443947,-71.54616057872774],[-16.42847591828898,-71.54641807079317],[-16.42870239187454,-71.54677748680116],[-16.42811561885888,-71.54730319976808],[-16.427806790244226,-71.54750168323518],[-16.428059000316267,-71.54897689819337],[-16.428182531660703,-71.54918611049654],[-16.428434741245063,-71.54948115348817],[-16.428537683838453,-71.54981911182405],[-16.428491359678176,-71.55014634132387],[-16.428661214878613,-71.55068814754488],[-16.429253133356134,-71.5513050556183],[-16.429839902936784,-71.55144453048707],[-16.430272258336014,-71.5513586997986],[-16.430668583273466,-71.55143380165102],[-16.43232078631535,-71.55210435390474],[-16.432567843506504,-71.55213654041292],[-16.43298475180415,-71.55203461647035],[-16.433664156001644,-71.5516644716263],[-16.433978122290164,-71.55149817466737],[-16.434348704797355,-71.55142307281496],[-16.434446497285506,-71.55131042003633],[-16.434621494246734,-71.55066132545473],[-16.434708992668227,-71.55051112174989],[-16.435331774411843,-71.55042529106142],[-16.436397189789382,-71.55002832412721],[-16.4380802253611,-71.55012488365175],[-16.438265765554046,-71.54999613761903],[-16.439645121963384,-71.54927194118501],[-16.439784086431477,-71.55053257942201],[-16.439887023010428,-71.55122995376588],[-16.44016982968172,-71.55204534530641],[-16.44032423422292,-71.55280709266664],[-16.44015953604126,-71.55474364757539],[-16.440957291558064,-71.55502796173097],[-16.441204337763086,-71.55506551265718],[-16.44297482636673,-71.5558969974518],[-16.443190989566972,-71.55595600605012],[-16.44456516428278,-71.55740439891817],[-16.446109169211695,-71.55583262443544],[-16.446201809116875,-71.55578434467317],[-16.446896606996276,-71.5559506416321],[-16.44741641711661,-71.55494749546052],[-16.448044304712376,-71.5543842315674],[-16.448113762238417,-71.55421793460847],[-16.448916631655013,-71.5534293651581],[-16.450934083733813,-71.55521035194398],[-16.450604705235246,-71.55566096305849],[-16.450918644129178,-71.55593991279603],[-16.451078186651102,-71.55598282814027],[-16.451227435988347,-71.5561491250992],[-16.451196556824534,-71.5564548969269],[-16.450759101476063,-71.55707716941835],[-16.44964229923137,-71.55904054641725],[-16.449348944580468,-71.5594804286957],[-16.449431289790372,-71.55953407287599],[-16.449750377148874,-71.55906200408937],[-16.450620144864867,-71.55746877193452],[-16.451299487351434,-71.55648171901704],[-16.451536227356073,-71.55627787113191],[-16.452231006136714,-71.55562877655031],[-16.452416280058024,-71.55537128448488],[-16.4520302925223,-71.55510306358339],[-16.45158254601885,-71.55480802059175],[-16.450054024309225,-71.55337035655977],[-16.44946216923512,-71.55278563499452],[-16.44801597663385,-71.55417501926424],[-16.44787701805841,-71.55415356159212],[-16.446338180737047,-71.55550539493562],[-16.44597276777773,-71.55574142932893],[-16.444552282696865,-71.55713617801668],[-16.443332510038662,-71.55584871768953],[-16.443028852362673,-71.55578434467317],[-16.44125321746039,-71.55498504638673],[-16.440995877721466,-71.55489921569826],[-16.44027017782057,-71.5546900033951],[-16.440411268567022,-71.55289292335512],[-16.440385534496837,-71.55269443988801],[-16.4402517172772,-71.55202925205232],[-16.439989229386086,-71.55118167400362],[-16.439881146033663,-71.55058085918428],[-16.439778209451646,-71.54926657676698],[-16.439469399378112,-71.54860675334932],[-16.438790015487655,-71.54782354831697],[-16.438739137580804,-71.5476679801941],[-16.438939864939325,-71.54720664024354],[-16.43896045234895,-71.54684185981752],[-16.43891413067416,-71.54612302780153],[-16.438847221568828,-71.54592990875246],[-16.438538410014786,-71.5456134080887],[-16.43839429778818,-71.5453988313675],[-16.43815783795027,-71.54499113559724],[-16.437617406879543,-71.54448151588441],[-16.437318887161393,-71.54441714286806],[-16.436840225276264,-71.54464781284334],[-16.436490235194217,-71.54465317726137],[-16.436361562211406,-71.54456198215486],[-16.436088775205864,-71.54417037963869],[-16.435404232542606,-71.5437036752701],[-16.434436604211555,-71.54344618320467],[-16.433902945770217,-71.54342472553255],[-16.433213248399237,-71.54336571693422],[-16.432595606884224,-71.54301702976228],[-16.432116933359435,-71.54307603836061],[-16.431576494091328,-71.54344618320467],[-16.430711788135376,-71.54356420040132],[-16.43072208227651,-71.54421865940095],[-16.43074781762706,-71.54481410980226],[-16.42999634398865,-71.54569923877717],[-16.42876103854141,-71.54671847820283],[-16.428313238377374,-71.54604792594911],[-16.42787573147337,-71.5448570251465],[-16.427762494231864,-71.54430449008943],[-16.42757204963141,-71.54401481151582],[-16.427206601361966,-71.54383242130281],[-16.42702839487656,-71.54337108135225],[-16.427167368370547,-71.54301702976228],[-16.427254870149117,-71.54221236705781],[-16.42709530805275,-71.54203534126283],[-16.42693059865453,-71.54195487499238],[-16.42864974612239,-71.54039919376375],[-16.42957107937389,-71.53957307338716],[-16.430085788785565,-71.53920829296113],[-16.429617403276772,-71.53836071491243],[-16.42892718782505,-71.53744876384737],[-16.42682200516377,-71.53946578502656],[-16.426513174493344,-71.53968036174776],[-16.426286698356456,-71.53955698013307],[-16.425607268362256,-71.5385538339615],[-16.42518004980112,-71.537743806839],[-16.42490724709612,-71.53744876384737],[-16.424629296776455,-71.53734147548677],[-16.42408004049632,-71.5386611223221],[-16.42299430086307,-71.54143989086153],[-16.422881060777474,-71.54196560382844],[-16.422762979896596,-71.54332816600801],[-16.422654886960412,-71.54369831085206],[-16.422418111747355,-71.54406309127809],[-16.42236149154496,-71.54408454895021],[-16.42177984669299,-71.5425342321396],[-16.42154841405977,-71.5413272380829],[-16.420894704158467,-71.54013097286226],[-16.420503506630812,-71.53863966464998],[-16.42019981327056,-71.53805494308473],[-16.41881089721777,-71.53596818447114],[-16.41825497874805,-71.53549611568452],[-16.41774538542128,-71.53469681739809],[-16.417168874189,-71.5331143140793],[-16.417055630710387,-71.53271198272706],[-16.416494559775412,-71.53313577175142],[-16.415696703823357,-71.53375267982484],[-16.415181956310697,-71.5340155363083],[-16.413292821264548,-71.53486847877504],[-16.412489804624933,-71.53507232666017],[-16.412371410865575,-71.53504014015199],[-16.41167648952109,-71.5343749523163],[-16.41106907475707,-71.53362929821016],[-16.410461658096445,-71.53255105018617],[-16.410302082218504,-71.53252422809602],[-16.410157949054955,-71.53261542320253],[-16.410044701494392,-71.53263688087465],[-16.409596858222724,-71.53216481208803],[-16.408829859880044,-71.5328085422516],[-16.407651044452155,-71.53394579887392],[-16.406909776944868,-71.53299629688264],[-16.406096438514325,-71.53370440006258],[-16.40543178564325,-71.53297483921052],[-16.40441253046889,-71.53173029422761],[-16.40104680395752,-71.5275138616562],[-16.398129337771643,-71.52395725250246],[-16.39956560579437,-71.52159154415132],[-16.401686527010007,-71.51840507984163],[-16.402024983685678,-71.51783645153047],[-16.40241621837501,-71.51727855205537],[-16.402622131053544,-71.51696741580965],[-16.403121468394342,-71.51648461818696],[-16.403183241996956,-71.51624858379365],[-16.403214128790935,-71.51600718498231],[-16.410300882146203,-71.505144238472],[-16.411030677271995,-71.50401234626771],[-16.411874704820768,-71.50282680988313],[-16.413295428804595,-71.50058984756471],[-16.415452232698442,-71.49736046791078],[-16.415498559965982,-71.49711370468141],[-16.410551435675117,-71.49787545204164],[-16.41051025483491,-71.49785935878755],[-16.410263951540458,-71.49603545665742],[-16.409486827627592,-71.49074077606203],[-16.408997915584788,-71.48732900619508],[-16.408467876155367,-71.48385286331178],[-16.40797381560177,-71.47798955440523],[-16.407139890840856,-71.47804319858552],[-16.406846664921808,-71.47451341152193],[-16.406687470161618,-71.47368192672731],[-16.406013277870493,-71.46903097629549],[-16.40538525446284,-71.46803855895998]], "arrows": [[{"lat":-16.39915309486185,"lng":-71.52227180440904},{"lat":-16.398783094861848,"lng":-71.52251180440904},{"lat":-16.39905309486185,"lng":-71.52244180440904},{"lat":-16.39912309486185,"lng":-71.52271180440904}],[{"lat":-16.400220395702352,"lng":-71.52248915163041},{"lat":-16.400120395702356,"lng":-71.52203915163042},{"lat":-16.400090395702353,"lng":-71.52232915163042},{"lat":-16.399800395702353,"lng":-71.52229915163042}],[{"lat":-16.419815299546165,"lng":-71.53747188289644},{"lat":-16.419865299546164,"lng":-71.53792188289644},{"lat":-16.419925299546165,"lng":-71.53764188289644},{"lat":-16.420205299546165,"lng":-71.53770188289643}],[{"lat":-16.419722410414096,"lng":-71.53858599103928},{"lat":-16.419292410414094,"lng":-71.5386459910393},{"lat":-16.419562410414095,"lng":-71.53869599103929},{"lat":-16.419512410414093,"lng":-71.53896599103929}],[{"lat":-16.408867719879957,"lng":-71.533028279686},{"lat":-16.40875771987996,"lng":-71.53259827968598},{"lat":-16.40873771987996,"lng":-71.53287827968599},{"lat":-16.40845771987996,"lng":-71.53285827968598}],[{"lat":-16.40799298855333,"lng":-71.53362714113237},{"lat":-16.408412988553327,"lng":-71.53348714113237},{"lat":-16.40813298855333,"lng":-71.53348714113237},{"lat":-16.40813298855333,"lng":-71.53320714113237}],[{"lat":-16.409156653428788,"lng":-71.5325415753174},{"lat":-16.40958665342879,"lng":-71.5324315753174},{"lat":-16.40930665342879,"lng":-71.5324115753174},{"lat":-16.409326653428792,"lng":-71.5321315753174}],[{"lat":-16.404241130220957,"lng":-71.5274217340088},{"lat":-16.40416113022096,"lng":-71.52698173400881},{"lat":-16.404121130220958,"lng":-71.5272617340088},{"lat":-16.403841130220957,"lng":-71.5272217340088}],[{"lat":-16.402618947836427,"lng":-71.529478171196},{"lat":-16.402698947836424,"lng":-71.52991817119599},{"lat":-16.402738947836426,"lng":-71.529638171196},{"lat":-16.403018947836426,"lng":-71.529678171196}],[{"lat":-16.428203720688902,"lng":-71.54721862304689},{"lat":-16.428633720688904,"lng":-71.5471086230469},{"lat":-16.428353720688904,"lng":-71.54708862304689},{"lat":-16.428373720688906,"lng":-71.54680862304689}],[{"lat":-16.42892174438008,"lng":-71.54659366834642},{"lat":-16.42935174438008,"lng":-71.54648366834643},{"lat":-16.42907174438008,"lng":-71.54646366834642},{"lat":-16.429091744380084,"lng":-71.54618366834642}],[{"lat":-16.439401482190135,"lng":-71.54940724674226},{"lat":-16.438951482190134,"lng":-71.54940724674226},{"lat":-16.439221482190135,"lng":-71.54949724674226},{"lat":-16.439131482190135,"lng":-71.54976724674226}],[{"lat":-16.439481173849305,"lng":-71.54863060123445},{"lat":-16.439461173849306,"lng":-71.54907060123445},{"lat":-16.439561173849306,"lng":-71.54881060123445},{"lat":-16.439821173849307,"lng":-71.54891060123445}],[{"lat":-16.434898798861827,"lng":-71.54356784458162},{"lat":-16.435228798861825,"lng":-71.54385784458162},{"lat":-16.435088798861827,"lng":-71.54361784458162},{"lat":-16.43532879886183,"lng":-71.54347784458162}],[{"lat":-16.43193145769231,"lng":-71.55193831951142},{"lat":-16.431621457692312,"lng":-71.55160831951143},{"lat":-16.43174145769231,"lng":-71.55186831951143},{"lat":-16.43148145769231,"lng":-71.55198831951144}],[{"lat":-16.449938843735985,"lng":-71.55433184135438},{"lat":-16.44976884373598,"lng":-71.55392184135438},{"lat":-16.449788843735984,"lng":-71.55420184135438},{"lat":-16.449508843735984,"lng":-71.55422184135439}],[{"lat":-16.45022812452818,"lng":-71.55353344617845},{"lat":-16.450388124528185,"lng":-71.55396344617846},{"lat":-16.450378124528182,"lng":-71.55367344617845},{"lat":-16.450668124528182,"lng":-71.55366344617845}],[{"lat":-16.413632472167837,"lng":-71.53982208198549},{"lat":-16.413702472167834,"lng":-71.53938208198548},{"lat":-16.413572472167836,"lng":-71.53963208198549},{"lat":-16.413322472167835,"lng":-71.53950208198549}],[{"lat":-16.41504674138073,"lng":-71.53408139642717},{"lat":-16.415496741380732,"lng":-71.53408139642717},{"lat":-16.41522674138073,"lng":-71.53399139642717},{"lat":-16.41531674138073,"lng":-71.53372139642717}]] }, diff --git a/src/new_types.ts b/src/new_types.ts index cdc0614..8062697 100644 --- a/src/new_types.ts +++ b/src/new_types.ts @@ -5,25 +5,40 @@ export interface Line { id: number /** E.g.: `10` */ name: string + /** name of the district of origin */ + district: string + /** color of the routes on the map */ + // map_color: string /** Hex code */ color: string - "hover_bg": string - "hover_on_bg": string + hover_bg: string + hover_on_bg: string } export type Routes = Array +export type Point = [number, number] +export type ArrowPoints = [Point,Point,Point,Point] + export interface Route { - /** Name that differentiates this route from others - * from the same line. - * - * May contain any combinatior of letters and numbers. - * - * E.g.: `A`, `B2-A` + /** + * Name that identifies this route */ name: string - /** `[lat,lng]`, stored as arrays to save space in JSON */ - points: Array<[number, number]> - arrows?: Array<[L.LatLng, L.LatLng, L.LatLng, L.LatLng]> + /** + * Set of points that buses running this route go to + */ + departure: Array + /** + * Arrows that indicate in which direction the buses go + */ + departure_arrows: Array + /** + * Set of points that buses running this route go to + */ + return: Array + /** + * Arrows that indicate in which direction the buses go + */ + return_arrows: Array } - diff --git a/src/pages/Editor.tsx b/src/pages/Editor.tsx index ed4970b..88199a3 100644 --- a/src/pages/Editor.tsx +++ b/src/pages/Editor.tsx @@ -1,14 +1,22 @@ -import { saveAs } from "file-saver"; import L from "leaflet"; -import { createEffect, createSignal, For, onMount } from "solid-js"; +import { Accessor, createEffect, createResource, createSignal, For, onMount, Setter } from "solid-js"; +import { Line, Route } from "../new_types"; let map: L.Map | null = null; export function Editor() { const container =
; - const [points, setPoints] = createSignal>([]); + const [route_name, set_route_name] = createSignal(""); + const [departure_points, set_departure_points] = createSignal>([]); + const [return_points, set_return_points] = createSignal>([]); - let currentPolyline: L.Polyline | null = null; + const [lines] = createResource>(async() => { + const data = await fetch("/n/lines.json"); + if (!data.ok) { + throw new Error("Error fetching"); + } + return data.json(); + }); onMount(() => { map = L.map(container as HTMLElement) @@ -17,52 +25,22 @@ export function Editor() { L.tileLayer("/tiles/{z}/{x}/{y}.jpg", { maxZoom: 18, minZoom: 12, - attribution: "© Map data OpenStreetMap", + attribution: "Map data © OpenStreetMap", }).addTo(map); - - // Set up click logic - map.addEventListener("click", (ev) => { - const click_lat_lng = ev.latlng; - - // Update the state - setPoints((x) => [...x, click_lat_lng]); - console.log(click_lat_lng); - }); }); - // Re-draws the polyline - createEffect(() => { - const p = points(); + const gen_route = () => { + const new_route: Route = { + name: route_name(), + departure: departure_points().map(({lat,lng}) => [lat,lng]), + departure_arrows: [], + return: departure_points().map(({lat,lng}) => [lat,lng]), + return_arrows: [], + }; - // Delete the polyline - if (p.length === 0) { - if (currentPolyline !== null) { - currentPolyline.removeFrom(map!); - } - // - } else { - // delete previous polyline, if any - if (currentPolyline !== null) { - currentPolyline.removeFrom(map!); - } - - currentPolyline = L.polyline(p, {color: "red"}); - currentPolyline.addTo(map!); - } - - }); - - const saveJson = () => { - const jsonData = JSON.stringify(points().map((obj) => [obj.lat,obj.lng])); - const file = new Blob([jsonData], {type: "application/json"}); - saveAs(file, "output.json"); - }; - - const copyPoints = () => { - const jsonData = JSON.stringify(points().map((obj) => [obj.lat,obj.lng])); - navigator.clipboard.writeText(jsonData) - .then(() => alert("Copiado")) - .catch(() => alert("Error al copiar.")); + navigator.clipboard.writeText(JSON.stringify(new_route)) + .then(() => alert("Copied to clipboard")) + .catch(() => alert("Error copying to clipboard")); }; return ( @@ -73,55 +51,37 @@ export function Editor() { Creador de rutas -

- Haz click en cualquier parte del mapa para empezar. -
- Luego, haz click izquierdo en el mapa para agregar un - punto. -
- Haz click en el boton "Retroceder" para borrar el último punto. -
- Haz click en el boton "Reiniciar" para borrar todos los puntos. -
- Presiona el boton "Guardar" para generar las - coordenadas de la ruta. -

- -
- Puntos: -
-
- - {(p) =>

{p.lat},{p.lng}

} +
+

Selecciona una linea:

+ +

Nombre de la ruta (ejm: B2-A):

+ set_route_name(e.target.value)} + /> + + + + +
+ +
- - - -
@@ -134,3 +94,86 @@ export function Editor() {
); } + +function RouteSelector(props: { + route_type: "Ida"|"Vuelta", + district: string, + color: string, + points: Accessor>, + setPoints: Setter>, +}) { + const [active, setActive] = createSignal(false); + const [points, setPoints] = [props.points, props.setPoints]; + let current_polyline: L.Polyline | undefined = undefined; + + const click_listener: L.LeafletMouseEventHandlerFn = (ev) => { + const latlng = ev.latlng; + setPoints((x) => [...x, latlng]); + }; + + const toggle_status = () => { + const new_status = !(active()); + setActive(new_status); + + if (new_status === true) { + map!.addEventListener("click", click_listener); + } else { + map!.removeEventListener("click", click_listener); + } + }; + + createEffect(() => { + const latlngs = points(); + if (latlngs.length === 0) { + current_polyline?.removeFrom(map!); + current_polyline = undefined; + } else { + current_polyline?.removeFrom(map!); + current_polyline = L.polyline(latlngs, {color: props.color}); + current_polyline.addTo(map!); + } + }); + + const pop = () => { + setPoints((p) => p.slice(0, -1)); + }; + + const active_classes = () => `${active() ? "border-green-400" : "border-transparent"}`; + const button_classes = () => `${active() ? "animate-pulse" : ""}`; + const direction_text = () => { + if (props.route_type === "Ida") return `Desde ${props.district} hacia el centro`; + else return `Desde el centro hacia ${props.district}`; + }; + return ( +
+

Ruta de {props.route_type}

+

{direction_text()}

+ +
+ Puntos: +
+
+ + {(point) =>
{point.lat}; {point.lng}
} + +
+
+ +
+ + +
+
+ ); +} + diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx index 700251a..7006614 100644 --- a/src/pages/Index.tsx +++ b/src/pages/Index.tsx @@ -1,5 +1,5 @@ import { Map, map, polyline, tileLayer } from "leaflet"; -import { createEffect, createResource, createSignal, For, onMount, Suspense } from "solid-js"; +import { createEffect, createResource, For, onMount, Suspense } from "solid-js"; import { Line, RouteWrapper, Route, LineWrapper, PointsWrapper } from "../types"; import { LineSegmentsIcon } from "../icons/LineSegmentsIcon"; @@ -85,7 +85,6 @@ function LineEl(props: { line: Line }) { } function RouteEl(props: { route: Route, parent_id: number, color: string }) { - const [draw, setDraw] = createSignal(false); const [points] = createResource(async() => { const res = await fetch(`/data/cuenca_${props.parent_id}_ruta_${props.route.id_ruta}_ida.json`); if (!res.ok) throw new Error("Error fetching data"); @@ -98,27 +97,23 @@ function RouteEl(props: { route: Route, parent_id: number, color: string }) { }); createEffect(() => { - if (points.state === "ready" && draw()) { - // Render the dots into the map - const coords = points()!.data[0]!.ruta_json; + // Render the dots into the map + const coords = points()!.data[0]!.ruta_json; - const line = polyline(coords, { color: props.color}); - line.addTo(g_map!); - } + const line = polyline(coords, { color: props.color}); + line.addTo(g_map!); }); createEffect(() => { - if (return_points.state === "ready" && draw()) { - // Render the dots into the map - const coords = return_points()!.data[0]!.ruta_json; + // Render the dots into the map + const coords = return_points()!.data[0]!.ruta_json; - const line = polyline(coords, { color: props.color}); - line.addTo(g_map!); - } + const line = polyline(coords, { color: props.color}); + line.addTo(g_map!); }); return ( -
setDraw(true)}> +
Ruta {props.route.cod_ruta}
); diff --git a/src/pages/Index2.tsx b/src/pages/Index2.tsx index 9842cc0..f9aae66 100644 --- a/src/pages/Index2.tsx +++ b/src/pages/Index2.tsx @@ -3,7 +3,7 @@ import { createResource, createSignal, For, onMount, Suspense } from "solid-js"; import { LineSegmentsIcon } from "../icons/LineSegmentsIcon"; import { Line, Lines, Route, Routes } from "../new_types"; -const LINE_OPACITY = 0.8; +const LINE_OPACITY = 1; let global_map: L.Map | null = null; @@ -11,10 +11,10 @@ let global_map: L.Map | null = null; // The first object stores Lines, the second stores routes // Indexed by their names. // The array is the polyline, and wether to render it (> 0) (set opacity to LINE_OPACITY) -const lines_store: Map> = new Map(); +const lines_store: Map, number]>> = new Map(); export function Index2() { - const container =
; + const container =
; onMount(() => { global_map = L.map(container as HTMLElement) @@ -28,8 +28,8 @@ export function Index2() { }); return ( -
-
+
+

AQP combi

@@ -38,8 +38,8 @@ export function Index2() {

-
-
+
{container} @@ -79,7 +79,7 @@ function LineEl(props: { line: Line }) { style={`color: ${props.line.color};--hover-bg: ${props.line.hover_bg};--hover-on-bg: ${props.line.hover_on_bg}`} > - + Linea {props.line.name} @@ -111,36 +111,57 @@ function RouteEl(props: { line_name: string, route: Route, color: string }) { if (!lines_store.has(line_name)) { lines_store.set(line_name, new Map()); } + // Create the arrows, if any + const arrows = []; + if (props.route.arrows) { + for (const a of props.route.arrows) { + const arrow = L.polygon(a, {color: props.color}); + arrows.push(arrow); + } + } + // store - lines_store.get(line_name)!.set(props.route.name, [line, 0]); + lines_store.get(line_name)!.set(props.route.name, [line, arrows, 0]); const set_highlighted = () => { const is_active = active(); const arr = lines_store.get(props.line_name)?.get(props.route.name); if (is_active && arr !== undefined) { - arr[1] -= 1; + arr[2] -= 1; setActive(false); } else if (!is_active && arr !== undefined) { - arr[1] += 1; + arr[2] += 1; setActive(true); } }; const active_classes = () => { - if (active()) return "underline bg-[var(--hover-bg)] text-[var(--hover-on-bg)]"; - else return ""; + if (active()) return "underline bg-[var(--hover-bg)] text-[var(--hover-on-bg)] border-[var(--hover-bg)]"; + else return "border-transparent"; }; return ( ); } @@ -148,7 +169,7 @@ function RouteEl(props: { line_name: string, route: Route, color: string }) { function highlight_route(line_name: string, route_name: string) { const arr = lines_store.get(line_name)?.get(route_name); if (arr !== undefined) { - arr[1] += 1; + arr[2] += 1; } re_render_polylines(); @@ -157,7 +178,7 @@ function highlight_route(line_name: string, route_name: string) { function unhighlight_route(line_name: string, route_name: string) { const arr = lines_store.get(line_name)?.get(route_name); if (arr !== undefined) { - arr[1] -= 1; + arr[2] -= 1; } re_render_polylines(); @@ -168,15 +189,21 @@ function re_render_polylines() { // If this is 0, then all paths should be rendered. let render_count = 0; for (const [, line_map] of lines_store) { - for (const [, [route_polilyne, active_count]] of line_map) { + for (const [, [route_polilyne, arrows, active_count]] of line_map) { if (active_count > 0) { route_polilyne.setStyle({opacity: LINE_OPACITY}); render_count += 1; // if the route has arrows and is manually toggled, // render the arrows + for (const a of arrows) { + a.addTo(global_map!); + } } else { route_polilyne.setStyle({opacity: 0}); + for (const a of arrows) { + a.removeFrom(global_map!); + } } } } diff --git a/tailwind.config.js b/tailwind.config.js index e27b25a..925189d 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -7,6 +7,11 @@ module.exports = { extend: { colors: { "c-primary": "var(--main)", + "c-bg": "var(--bg)", + "c-on-bg": "var(--on-bg)", + // colors for the routes colors + "r-hover-bg": "var(--hover-bg)", + "r-hover-on-bg": "var(--hover-on-bg)", }, }, },