Skip to content

Commit

Permalink
feat: new feat
Browse files Browse the repository at this point in the history
  • Loading branch information
@lucastavarex
lucastavarex committed Sep 12, 2024
1 parent 5eb0c91 commit 71ba621
Show file tree
Hide file tree
Showing 2 changed files with 117 additions and 3 deletions.
116 changes: 115 additions & 1 deletion src/pages/civitas/components/custom_multilayer_map.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -251,6 +251,16 @@ class CustomMultilayerMap extends React.Component {
{ latitude: " -22.9034", longitude: " -43.2834", t1: "Seq. Relâmpago", t2: "Méier", from: "top", side: "left" },
{ latitude: " -22.9239", longitude: " -43.2324", t1: "Roubos - 6° BPM", t2: "Tijuca", from: "bottom", side: "right" },
];
const coordinatesCasosResolvidosMobile = [
{ latitude: "-22.8368", longitude: "-43.5003", t1: "Enfrent. às Milicias", t2: "Camp.Grande e St Cruz", from: "top", side: "left" },
{ latitude: "-23.0034", longitude: "-43.4224", t1: "Roubo a Ciclistas", t2: "Recreio", from: "top", side: "left" },
{ latitude: " -23.0003", longitude: "-43.3369", t1: "Sequesto", t2: "Barra", from: "bottom", side: "right" },
{ latitude: " -22.9495", longitude: " -43.3712", t1: "Hom. de Pol. Civil", t2: "CDD", from: "top", side: "left" },
{ latitude: " -22.8834", longitude: " -43.2634", t1: "Seq. Relâmpago", t2: "Méier", from: "top", side: "left" },
];
const coordinatesCasosResolvidosMobileTijuca = [
{ latitude: " -22.9239", longitude: " -43.2324", t1: "Roubos", t2: "Tijuca", from: "bottom", side: "right" },
];
return (
<Map
ref={this.state.mapRef}
Expand Down Expand Up @@ -608,7 +618,7 @@ class CustomMultilayerMap extends React.Component {
))
}
{
(chapterNumberMap === "beforeFim") && coordinatesCasosResolvidos.map((coord, index) => (
(chapterNumberMap === "beforeFim") && !isMobile && coordinatesCasosResolvidos.map((coord, index) => (
<Marker
key={index}
latitude={coord.latitude}
Expand Down Expand Up @@ -670,6 +680,110 @@ class CustomMultilayerMap extends React.Component {
</Marker>
))
}
{
(chapterNumberMap === "beforeFim") && isMobile && coordinatesCasosResolvidosMobile.map((coord, index) => (
<Marker
key={index}
latitude={coord.latitude}
longitude={coord.longitude}
>
<div style={{ position: 'relative' }}>
<svg id="radar-circle">

<circle cx="50%" cy="50%" r="8" fill="#00BFFF" stroke="#00BFFF"></circle>
<circle cx="50%" cy="50%" r="14" fill="none" stroke="white" strokeWidth="2"></circle>

<g >
{coord.from === "top" ? (
<>
<line x1="40%" y1="20%" x2="50%" y2="50%" stroke="#00BFFF" strokeWidth="2px" />
{coord.side === "left" ? (
<line x1="40%" y1="20%" x2="-20%" y2="20%" stroke="#00BFFF" strokeWidth="2px" />
) : (
<line x1="40%" y1="0" x2="80%" y2="0" stroke="#00BFFF" strokeWidth="2px" />
)}
</>
) : (
<>
<line x1="50%" y1="50%" x2="60%" y2="100%" stroke="#00BFFF" strokeWidth="2px" />
{coord.side === "left" ? (
<line x1="60%" y1="100%" x2="20%" y2="100%" stroke="#00BFFF" strokeWidth="2px" />
) : (
<line x1="60%" y1="100%" x2="100%" y2="100%" stroke="#00BFFF" strokeWidth="2px" />
)}
</>
)}
</g>
</svg>
<h1 style={{
color: "white",
fontWeight: "lighter",
fontSize: "13px",
position: 'absolute',
top: `${coord.from === 'top' ? "10px" : "131px"}`, // Adjust as needed
left: `${coord.from === 'top' ? "5px" : "186px"}`, // Adjust as needed
// transform: 'translate(-50%, -50%)',
zIndex: 10
}}>
{coord.t1}
</h1>
<h1 style={{
color: "white",
fontWeight: "lighter",
fontSize: "11px",
position: 'absolute',
top: `${coord.from === 'top' ? "30px" : "148px"}`, // Adjust as needed
left: `${coord.from === 'top' ? "5px" : "186px"}`, // Adjust as needed
// transform: 'translate(-50%, -50%)',
zIndex: 10
}}>
{coord.t2}
</h1>
</div>
</Marker>
))
}
{
(chapterNumberMap === "beforeFim") && isMobile && coordinatesCasosResolvidosMobileTijuca.map((coord, index) => (
<Marker
key={index}
latitude={coord.latitude}
longitude={coord.longitude}
>
<div style={{ position: 'relative' }}>
<svg id="radar-circle">

<circle cx="50%" cy="50%" r="8" fill="#00BFFF" stroke="#00BFFF"></circle>
<circle cx="50%" cy="50%" r="14" fill="none" stroke="white" strokeWidth="2"></circle>
<line x1="50%" y1="50%" x2="22%" y2="50%" stroke="#00BFFF" strokeWidth="2px" /> </svg>
<h1 style={{
color: "white",
fontWeight: "lighter",
fontSize: "13px",
position: 'absolute',
top: `${coord.from === 'top' ? "0px" : "55px"}`, // Adjust as needed
left: `${coord.from === 'top' ? "5px" : "65px"}`, // Adjust as needed
// transform: 'translate(-50%, -50%)',
zIndex: 10
}}>
{coord.t1}
</h1>
<h1 style={{
color: "white",
fontWeight: "lighter",
fontSize: "11px",
position: 'absolute',
top: `${coord.from === 'top' ? "30px" : "75px"}`, // Adjust as needed
left: `${coord.from === 'top' ? "5px" : "70px"}`, // Adjust as needed
// transform: 'translate(-50%, -50%)',
zIndex: 10
}}>
{coord.t2}
</h1>
</div>
</Marker>
))
}

{
(chapterNumberMap == "exemplo7" || chapterNumberMap == "seop3" || chapterNumberMap == "exemplo71" || chapterNumberMap == "exemplo72" || chapterNumberMap == "exemplo73" || chapterNumberMap == "seop1") && (
Expand Down
4 changes: 2 additions & 2 deletions src/pages/civitas/story.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ export default function SubsidioSPPO() {
});
};
const [chapterNumberMap, setChapterNumberMap] = useState("capa");
// console.log(chapterNumberMap);
console.log(chapterNumberMap);
useEffect(() => {
switch (chapterNumberMap) {
case "capa":
Expand Down Expand Up @@ -937,7 +937,7 @@ export default function SubsidioSPPO() {
animationLoopLength={21600}
animationSpeed={1}
/>
<styles.Logo src={logo}></styles.Logo>
{((chapterNumberMap == "capa" || chapterNumberMap == "zoom") && <styles.Logo src={logo}></styles.Logo>)}
{(chapterNumberMap !== "capa" && chapterNumberMap !== "zoom" && chapterNumberMap !== "exemplo1" && chapterNumberMap !== "exemplo10" && chapterNumberMap !== "seop7" && chapterNumberMap !== "drawMap" && chapterNumberMap !== "fim" && chapterNumberMap !== "beforeFim") &&
<div className="clock">
{currentHour} AM
Expand Down

0 comments on commit 71ba621

Please sign in to comment.