-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #269 from jaewonjjang/dev
feature#269 마커 토글 이미지 변경 및 리팩토링
- Loading branch information
Showing
13 changed files
with
843 additions
and
624 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,59 @@ | ||
let DetailTabDisplay = false; | ||
let SideBarDisplay = true; | ||
function ShowDetailTab(){ | ||
const GSTDetailTab = document.getElementsByClassName("main__GSTDetailTab"); | ||
GSTDetailTab[0].style.marginLeft = "0vw"; | ||
const SideSearchBar = document.getElementsByClassName("main__SideSearchBar"); | ||
SideSearchBar[0].style.borderRadius = "0"; | ||
DetailTabDisplay = true; | ||
} | ||
|
||
function appendNewChart(){ | ||
document.getElementById('myChart').remove(); | ||
const newChart = document.createElement('canvas'); | ||
newChart.id= 'myChart'; | ||
|
||
document.getElementsByClassName('main__GSTdetail__Contents__Chart')[0].append(newChart); | ||
} | ||
|
||
function closeDetailTab() { | ||
const GSTDetailTab = document.getElementsByClassName("main__GSTDetailTab"); | ||
GSTDetailTab[0].style.marginLeft = "-22vw"; | ||
const SideSearchBar = document.getElementsByClassName("main__SideSearchBar"); | ||
SideSearchBar[0].style.borderRadius = "0 5px 5px 0"; | ||
DetailTabDisplay = false; | ||
} | ||
|
||
function MoveSideBar(e){ | ||
if(SideBarDisplay){ | ||
HideSideBar(); | ||
} | ||
else { | ||
ShowSideBar(); | ||
} | ||
} | ||
|
||
function ShowSideBar(){ | ||
const SideBar = document.getElementsByClassName("main__SearchBarnDetailTab"); | ||
const HideSideBarButton = document.getElementsByClassName("main__SearchBarHideButton"); | ||
|
||
SideBar[0].style.marginLeft = "0vw"; | ||
SideBarDisplay = true; | ||
HideSideBarButton.innerHTML = "<img src='img/🦆 icon _chevron left_.svg'>"; | ||
} | ||
|
||
function HideSideBar(){ | ||
const SideBar = document.getElementsByClassName("main__SearchBarnDetailTab"); | ||
const HideSideBarButton = document.getElementsByClassName("main__SearchBarHideButton"); | ||
if(DetailTabDisplay){ | ||
SideBar[0].style.marginLeft = "-44vw"; | ||
} | ||
else { | ||
SideBar[0].style.marginLeft = "-22vw"; | ||
} | ||
SideBarDisplay = false; | ||
HideSideBarButton.innerHTML = "<img src='img/🦆 icon _chevron right_.svg'>"; | ||
|
||
} | ||
|
||
export {ShowDetailTab, appendNewChart, closeDetailTab, DetailTabDisplay, MoveSideBar, ShowSideBar, HideSideBar, SideBarDisplay} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,191 @@ | ||
const brandLogoMapper = (brandName) => { | ||
switch(brandName) { | ||
case "알뜰": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/알뜰.png"; | ||
case "오일뱅크": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/오일뱅크.png"; | ||
case "E1": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/E1.png"; | ||
case "ex-OIL": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/ex.png"; | ||
case "ex": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/ex.png"; | ||
case "GS": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/GS.png"; | ||
case "S-Oil": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/S-Oil.png"; | ||
case "SK": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/SK_Gas.png"; | ||
case "NH-OIL": | ||
return "https://team6-public-image.s3.ap-northeast-2.amazonaws.com/주유소+로고_0213/NH-OIL.png"; | ||
} | ||
return "./img/GasStation_Image/custom.png"; | ||
} | ||
|
||
function ResetOptionButton(){ | ||
$("#sort_GG").css("opacity", "0.5"); | ||
$("#sort_HH").css("opacity", "0.5"); | ||
$("#sort_LL").css("opacity", "0.5"); | ||
} | ||
|
||
function transStId(stId){ | ||
switch(stId){ | ||
case 'S-Oil': return 'S-OIL'; | ||
case '오일뱅크' : return '현대오일뱅크'; | ||
case '알뜰' : return '알뜰주유소'; | ||
case 'ex-OIL' : return '알뜰(ex)'; | ||
case 'NH-OIL' : return 'NH-OIL'; | ||
case 'SK' : return 'SK'; | ||
case 'GS' : return 'GS칼텍스'; | ||
case '자가상표' : return '자가상표'; | ||
case 'E1' : return 'E1'; | ||
} | ||
return '자가상표'; | ||
} | ||
|
||
function SelectStIdLogo(stId, name, radius){ | ||
return ` | ||
<div class='main__ResultList'> | ||
<img class='main__ResultList__Title_Logo' src = ${brandLogoMapper(stId)}> | ||
<div class='main__ResultList_TitlenContents'> | ||
<div class='main__ResultList__Title'> | ||
<div id="stName">${name}</div> | ||
<div id="stRadius">${Math.round(radius*10)/10}km</div> | ||
</div> | ||
`; | ||
} | ||
|
||
function highhHsaleInfo(Resultelem) { | ||
return `<div class='main__ResultList__Contents'> | ||
휘발유: <span> ${Resultelem.hhPrice == 0 ? '-' : Resultelem.hhPrice} </span> | ||
<i class="fa-solid fa-circle-check"></i> | ||
경유: <span> ${Resultelem.ggPrice == 0 ? '-' : Resultelem.ggPrice} </span> | ||
LPG: <span> ${Resultelem.llPrice == 0 ? '-' : Resultelem.llPrice} </span></div></div></div>`; | ||
} | ||
|
||
function nohHsaleInfo(Resultelem) { | ||
return `<div class='main__ResultList__Contents'> | ||
휘발유: <span> ${Resultelem.hhPrice == 0 ? '-' : Resultelem.hhPrice} </span> | ||
경유: <span> ${Resultelem.ggPrice == 0 ? '-' : Resultelem.ggPrice} </span> | ||
LPG: <span> ${Resultelem.llPrice == 0 ? '-' : Resultelem.llPrice} </span></div></div></div>`; | ||
} | ||
|
||
|
||
function FillSTDetail(ResultArrayElem){ | ||
const ST_name = document.getElementById("GSTdetail__Name"); | ||
ST_name.innerHTML = ResultArrayElem.name; | ||
|
||
const ST_Price = document.getElementsByClassName("main__GSTdetail__Contents__Oilprice"); | ||
var PriceinnerHtml = ""; | ||
PriceinnerHtml += "<i class='fa-solid fa-gas-pump'></i>"; | ||
if(ResultArrayElem.hhPrice != 0){ | ||
PriceinnerHtml += "휘발유 : " + ResultArrayElem.hhPrice + "  "; | ||
} | ||
if(ResultArrayElem.ggPrice != 0) { | ||
PriceinnerHtml += "경유 : " + ResultArrayElem.ggPrice; + "  "; | ||
} | ||
if(ResultArrayElem.llPrice != 0) { | ||
PriceinnerHtml += "LPG : " + ResultArrayElem.llPrice; | ||
} | ||
ST_Price[0].innerHTML = PriceinnerHtml; | ||
|
||
const ST_addr = document.getElementById("GSTdetail_addr"); | ||
ST_addr.innerHTML = `${ResultArrayElem.upperAddrName} ${ResultArrayElem.middleAddrName} ${ResultArrayElem.lowerAddrName} | ||
${ResultArrayElem.detailAddrName} ${ResultArrayElem.firstNo} | ||
( ${ResultArrayElem.roadName} ${ResultArrayElem.buildingNo1} )` | ||
|
||
const ST_phone = document.getElementById("GSTdetail_phone"); | ||
var telNolen = ResultArrayElem.telNo.length; | ||
if(ResultArrayElem.telNo.includes('02')) { | ||
var psTelNo = ResultArrayElem.telNo.slice(0, 2) + '-' + ResultArrayElem.telNo.slice(2, telNolen-4) + '-' + ResultArrayElem.telNo.slice(telNolen-4, telNolen); | ||
} | ||
else { | ||
var psTelNo = ResultArrayElem.telNo.slice(0, 3) + '-' + ResultArrayElem.telNo.slice(3, telNolen-4) + '-' + ResultArrayElem.telNo.slice(telNolen-4, telNolen); | ||
} | ||
|
||
ST_phone.innerHTML = psTelNo; | ||
|
||
const ST_url = document.getElementById("GSTdetail_url"); | ||
ST_url.innerHTML = `https://www.${ResultArrayElem.stId}.com`; | ||
|
||
const ST_PriceTable = document.getElementsByClassName("main__GSTdetail__Contents__OilPriceTable__Contents"); | ||
ST_PriceTable[0].innerHTML = ""; | ||
if(ResultArrayElem.hhPrice != 0){ | ||
const ST_OilPrice = document.createElement("div"); | ||
ST_OilPrice.classList.add("main__GSTdetail__Contents__OilPriceTable__Contents__Row"); | ||
ST_OilPrice.innerHTML = addHpriceTotable(ResultArrayElem); | ||
ST_PriceTable[0].append(ST_OilPrice); | ||
} | ||
|
||
if(ResultArrayElem.ggPrice != 0) { | ||
const ST_OilPrice = document.createElement("div"); | ||
ST_OilPrice.classList.add("main__GSTdetail__Contents__OilPriceTable__Contents__Row"); | ||
ST_OilPrice.innerHTML = addGpriceTotable(ResultArrayElem); | ||
ST_PriceTable[0].append(ST_OilPrice); | ||
} | ||
|
||
if(ResultArrayElem.highHhPrice != 0) { | ||
const ST_OilPrice = document.createElement("div"); | ||
ST_OilPrice.classList.add("main__GSTdetail__Contents__OilPriceTable__Contents__Row"); | ||
ST_OilPrice.innerHTML = addHHpriceTotable(ResultArrayElem); | ||
ST_PriceTable[0].append(ST_OilPrice); | ||
} | ||
|
||
if(ResultArrayElem.llPrice != 0) { | ||
const ST_OilPrice = document.createElement("div"); | ||
ST_OilPrice.classList.add("main__GSTdetail__Contents__OilPriceTable__Contents__Row"); | ||
ST_OilPrice.innerHTML = addLPGpriceTotable(ResultArrayElem); | ||
ST_PriceTable[0].append(ST_OilPrice); | ||
} | ||
} | ||
|
||
function addHpriceTotable(ResultArrayElem){ | ||
return `<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Oil"> | ||
휘발유 | ||
</div> | ||
<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Price"> | ||
<span id="Contents_HH">${ResultArrayElem.hhPrice}</span> | ||
</div>` | ||
} | ||
|
||
function addGpriceTotable(ResultArrayElem){ | ||
return `<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Oil"> | ||
경유 | ||
</div> | ||
<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Price"> | ||
<span id="Contents_HH">${ResultArrayElem.ggPrice}</span> | ||
</div>` | ||
} | ||
|
||
function addHHpriceTotable(ResultArrayElem){ | ||
return `<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Oil"> | ||
고급 휘발유 | ||
</div> | ||
<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Price"> | ||
<span id="Contents_HH">${ResultArrayElem.highHhPrice}</span> | ||
</div>` | ||
} | ||
|
||
function addLPGpriceTotable(ResultArrayElem){ | ||
return `<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Oil"> | ||
LPG | ||
</div> | ||
<div class="main__GSTdetail__Contents__OilPriceTable__Contents__Price"> | ||
<span id="Contents_HH">${ResultArrayElem.llPrice}</span> | ||
</div>` | ||
} | ||
|
||
function hnHhPrice(Resultelem){ | ||
return `<div class='main__ResultList__Contents'> | ||
휘발유: <span>${Resultelem.hhPrice == 0 ? '-' : Resultelem.hhPrice}</span> | ||
<i class="fa-solid fa-circle-check"></i> | ||
</div></div></div>`; | ||
} | ||
|
||
function onlyhPrice(Resultelem){ | ||
return `<div class='main__ResultList__Contents'> | ||
휘발유: <span>${Resultelem.hhPrice == 0 ? '-' : Resultelem.hhPrice}</span> | ||
</div></div></div>`; | ||
} | ||
export {brandLogoMapper, ResetOptionButton, transStId, SelectStIdLogo, highhHsaleInfo, nohHsaleInfo, FillSTDetail, hnHhPrice, onlyhPrice}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,37 @@ | ||
function AdjustLocationToCurLocation(lon, lat){ | ||
$.ajax({ | ||
method : "GET", | ||
url : "https://apis.openapi.sk.com/tmap/geo/reversegeocoding?version=1&format=json&callback=result&appKey=l7xx7250af6176574c63a12302edf09d020c", | ||
async : false, | ||
data : { | ||
"coordType" : "WGS84GEO", | ||
"addressType" : "A10", | ||
"lon" : lon, | ||
"lat" : lat | ||
}, | ||
success : function(response) { | ||
var arrResult = response.addressInfo; | ||
|
||
var lastLegal = arrResult.legalDong.charAt(arrResult.legalDong.length - 1); | ||
|
||
var newRoadAddr = arrResult.city_do + ' ' + arrResult.gu_gun + ' '; | ||
|
||
if (arrResult.eup_myun == '' && (lastLegal == "읍" || lastLegal == "면")) { | ||
newRoadAddr += arrResult.legalDong; | ||
} | ||
else { | ||
newRoadAddr += arrResult.eup_myun; | ||
} | ||
newRoadAddr += ' ' + arrResult.roadName + ' ' + arrResult.buildingIndex; | ||
|
||
var result = "<div>" + newRoadAddr + "</div>"; | ||
const curAddr = document.getElementsByClassName("main__CurrentLocationAddress"); | ||
curAddr[0].innerHTML = result; | ||
}, | ||
error : function(request, error) { | ||
console.log("code:" + request.status + ", message:" + request.responseText + ", error:" + error); | ||
} | ||
}); | ||
} | ||
|
||
export {AdjustLocationToCurLocation}; |
Oops, something went wrong.