import { Icon , point , Util } from "leaflet" ; import "../../src/plugins/BeautifyIcon.css" ; const defaults = { iconColor : "#1EB300" , iconAnchor : { "marker" : [ 14 , 34 ] , "circle" : [ 11 , 10 ] , "circle-dot" : [ 5 , 5 ] , "rectangle-dot" : [ 5 , 6 ] , "doughnut" : [ 8 , 8 ] } , popupAnchor : { "marker" : [ 0 , - 25 ] , "circle" : [ - 3 , - 76 ] , "circle-dot" : [ 0 , - 2 ] , "rectangle-dot" : [ 0 , - 2 ] , "doughnut" : [ 0 , - 2 ] } , innerIconAnchor : { marker : [ - 2 , 5 ] , circle : [ 0 , 2 ] } , iconSize : { "marker" : [ 28 , 28 ] , "circle" : [ 22 , 22 ] , "circle-dot" : [ 2 , 2 ] , "rectangle-dot" : [ 2 , 2 ] , "doughnut" : [ 15 , 15 ] } } ; const IconClass = Icon . extend ( { options : { icon : "leaf" , iconSize : defaults . iconSize . circle , iconAnchor : defaults . iconAnchor . marker , iconShape : "marker" , iconStyle : "" , innerIconAnchor : [ 0 , 3 ] , innerIconStyle : "" , isAlphaNumericIcon : false , text : 1 , borderColor : defaults . iconColor , borderWidth : 2 , borderStyle : "solid" , backgroundColor : "white" , textColor : defaults . iconColor , customClasses : "" , spin : false , prefix : "fa" , html : "" } , initialize ( options ) { this . applyDefaults ( options ) ; this . options = ( ! options || ! options . html ) ? Util . setOptions ( this , options ) : options ; } , applyDefaults ( options ) { if ( options ) { if ( ! options . iconSize && options . iconShape ) { options . iconSize = defaults . iconSize [ options . iconShape ] ; } if ( ! options . iconAnchor && options . iconShape ) { options . iconAnchor = defaults . iconAnchor [ options . iconShape ] ; } if ( ! options . popupAnchor && options . iconShape ) { options . popupAnchor = defaults . popupAnchor [ options . iconShape ] ; } if ( ! options . innerIconAnchor ) { if ( options . iconShape === "circle" || options . iconShape === "marker" ) { if ( options . iconShape === "circle" && options . isAlphaNumericIcon ) { options . innerIconAnchor = [ 0 , - 1 ] ; } else if ( options . iconShape === "marker" && ! options . isAlphaNumericIcon ) { options . innerIconAnchor = defaults . innerIconAnchor [ options . iconShape ] ; } } } } } , createIcon ( ) { const iconDiv = document . createElement ( "div" ) ; const options = this . options ; iconDiv . innerHTML = ! options . html ? this . createIconInnerHtml ( ) : options . html ; this . _setIconStyles ( iconDiv ) ; if ( this . options . iconShape === "marker" ) { const wrapperDiv = document . createElement ( "div" ) ; wrapperDiv . className = "beautify-marker" + ( options . props . owner . _currSelRow === options . props . row ? " selected" : "" ) ; wrapperDiv . appendChild ( iconDiv ) ; return wrapperDiv ; } return iconDiv ; } , createIconInnerHtml ( ) { const options = this . options ; if ( options . iconShape === "circle-dot" || options . iconShape === "rectangle-dot" || options . iconShape === "doughnut" ) { return "" ; } const innerIconStyle = this . getInnerIconStyle ( options ) ; if ( options . isAlphaNumericIcon ) { return '<div style="' + innerIconStyle + '">' + options . text + "</div>" ; } let spinClass = "" ; if ( options . spin ) { spinClass = " fa-spin" ; } return '<i class="' + options . prefix + " " + options . icon + spinClass + '" style="' + innerIconStyle + '"></i>' ; } , getInnerIconStyle ( options ) { const innerAnchor = point ( options . innerIconAnchor ) ; return "color:" + options . textColor + ";margin-top:" + innerAnchor . y + "px; margin-left:" + innerAnchor . x + "px;" + options . innerIconStyle ; } , _setIconStyles ( iconDiv ) { const options = this . options ; const size = point ( options . iconSize ) ; const anchor = point ( options . iconAnchor ) ; iconDiv . className = "beautify-marker " ; if ( options . iconShape ) { iconDiv . className += options . iconShape ; } if ( options . customClasses ) { iconDiv . className += " " + options . customClasses ; } iconDiv . style . backgroundColor = options . backgroundColor ; iconDiv . style . color = options . textColor ; iconDiv . style . borderColor = options . borderColor ; iconDiv . style . borderWidth = options . borderWidth + "px" ; iconDiv . style . borderStyle = options . borderStyle ; if ( size ) { iconDiv . style . width = size . x + "px" ; iconDiv . style . height = size . y + "px" ; } if ( anchor ) { iconDiv . style . marginLeft = ( - anchor . x ) + "px" ; iconDiv . style . marginTop = ( - anchor . y ) + "px" ; } if ( options . iconStyle ) { let cStyle = iconDiv . getAttribute ( "style" ) ; cStyle += options . iconStyle ; iconDiv . setAttribute ( "style" , cStyle ) ; } } } ) ; export function BeautifyIcon ( options ) { return new ( IconClass as any ) ( options ) ; }