Adding initial arrow player support.

This commit is contained in:
Sergiotarxz 2024-01-15 16:24:00 +01:00
parent 40e392e003
commit c945cc453b
3 changed files with 118 additions and 24 deletions

View File

@ -13,6 +13,7 @@ import VectorSource from 'ol/source/Vector'
import Stroke from 'ol/style/Stroke'
import Fill from 'ol/style/Fill'
import CircleStyle from 'ol/style/Circle'
import Icon from 'ol/style/Icon'
import Style from 'ol/style/Style'
import ConquerLogin from '@burguillosinfo/conquer/login'
import InterfaceManager from '@burguillosinfo/conquer/interface-manager'
@ -127,20 +128,6 @@ export default class Conquer {
})
this.interfaceManager.push(newNodeUI)
this.removeState(MapState.SELECT_WHERE_TO_CREATE_NODE)
// const style = new Style({
// image: new CircleStyle({
// radius: 14,
// fill: new Fill({color: 'white'}),
// stroke: new Stroke({
// color: 'gray',
// width: 2,
// })
// })
// })
// const mapNode = new MapNode(style, feature, `server-node-${++this.createNodeCounter}`)
// this.getServerNodes()[mapNode.getId()] = mapNode
// this.refreshLayers()
}
private isStateFillingFormCreateNode(): boolean {
@ -444,17 +431,17 @@ export default class Conquer {
}
const styles: StylesInterface = {
currentPositionFeature: new Style({
image: new CircleStyle({
radius: 14,
fill: new Fill({color: color}),
stroke: new Stroke({
color: 'beige',
width: 2,
})
})
image: new Icon({
crossOrigin: 'anonymous',
src: '/img/arrow-player.svg',
color: color,
scale: 0.2,
}),
zIndex: 4,
})
};
const features = [this.currentPositionFeature]
const features = [];
features.push(this.currentPositionFeature);
for (const key in this.getServerNodes()) {
styles[key] = await this.getServerNodes()[key].getStyle()
features.push(this.getServerNodes()[key].getFeature())

107
public/img/arrow-player.svg Normal file
View File

@ -0,0 +1,107 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="180"
height="180"
viewBox="0 0 180 180"
version="1.1"
id="svg5"
inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
sodipodi:docname="arrow-player.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview7"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="true"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="px"
showgrid="false"
inkscape:zoom="4.3444444"
inkscape:cx="86.432225"
inkscape:cy="90"
inkscape:window-width="1920"
inkscape:window-height="1043"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer3" />
<defs
id="defs2" />
<g
inkscape:groupmode="layer"
id="layer3"
inkscape:label="Layer 3"
style="stroke:none;stroke-opacity:1;fill:#000000;fill-opacity:0.99906439">
<ellipse
style="display:inline;fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:3.22896;stroke-dasharray:none;stroke-opacity:1"
id="path1514"
cy="90"
cx="90"
rx="87.179558"
ry="88.385521" />
</g>
<g
inkscape:groupmode="layer"
id="layer2"
inkscape:label="Layer 2"
style="stroke:none;stroke-opacity:1;fill:#000000;fill-opacity:0.99906439">
<path
style="stroke:none;stroke-opacity:1;fill:#000000;fill-opacity:0.999064;display:inline;stroke-width:3.305;stroke-dasharray:none"
d="m 28.658815,141.34251 c -0.325678,6.15261 4.86944,12.88765 14.628956,8.97159 38.996707,-18.73253 63.312439,-19.63928 94.835559,1.74882 9.98035,3.8071 14.6147,-2.83203 15.90752,-6.31374 C 155.26857,105.50676 119.58918,11.778083 91.471615,7.1391499 64.56409,12.696105 28.358025,90.690537 28.658815,141.34251 Z"
id="path1682"
sodipodi:nodetypes="cccccc" />
</g>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
style="display:inline">
<path
style="fill:#ffffff;fill-opacity:0.999064;stroke:#000000;stroke-width:2.88197;stroke-dasharray:none;stroke-opacity:1"
id="path7203"
sodipodi:type="arc"
sodipodi:cx="74.857635"
sodipodi:cy="50.984001"
sodipodi:rx="12.305052"
sodipodi:ry="10.465668"
sodipodi:start="6.0340459"
sodipodi:end="6.0280938"
sodipodi:open="true"
sodipodi:arc-type="arc"
d="M 86.782769,48.403481 A 12.305052,10.465668 0 0 1 77.909434,61.12269 12.305052,10.465668 0 0 1 62.941585,53.594694 12.305052,10.465668 0 0 1 71.770374,40.853082 12.305052,10.465668 0 0 1 86.764498,48.343158" />
<path
style="display:inline;fill:#ffffff;fill-opacity:0.999064;stroke:#000000;stroke-width:2.8579;stroke-dasharray:none;stroke-opacity:1"
id="path7203-7"
sodipodi:type="arc"
sodipodi:cx="110.57592"
sodipodi:cy="50.984138"
sodipodi:rx="12.09339"
sodipodi:ry="10.471755"
sodipodi:start="6.0340459"
sodipodi:end="6.0280938"
sodipodi:open="true"
sodipodi:arc-type="arc"
d="m 122.29593,48.402118 a 12.09339,10.471755 0 0 1 -8.72071,12.726606 12.09339,10.471755 0 0 1 -14.710381,-7.532374 12.09339,10.471755 0 0 1 8.676921,-12.749023 12.09339,10.471755 0 0 1 14.73621,7.494432" />
<path
style="fill:#000000;fill-opacity:0;stroke:#ffffff;stroke-width:2.26257;stroke-dasharray:none;stroke-opacity:1"
id="path7803"
sodipodi:type="arc"
sodipodi:cx="93.89315"
sodipodi:cy="100.6772"
sodipodi:rx="22.730469"
sodipodi:ry="15.978166"
sodipodi:start="0.031220556"
sodipodi:end="3.1729889"
sodipodi:open="true"
sodipodi:arc-type="arc"
d="M 116.61254,101.17597 A 22.730469,15.978166 0 0 1 104.63719,114.75778 22.730469,15.978166 0 0 1 81.91671,114.25759 22.730469,15.978166 0 0 1 71.173884,100.17563" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.2 KiB

File diff suppressed because one or more lines are too long