#5 added Hitgroup-Puppet to DamageSite

This commit is contained in:
2021-11-06 01:44:39 +01:00
committed by Giovanni Harting
parent ed6c6e799a
commit f401bcf879
16 changed files with 589 additions and 78 deletions

View File

@@ -14,6 +14,7 @@
"bootstrap": "^5.1.2",
"core-js": "^3.18.2",
"echarts": "^5.2.1",
"jquery": "^3.6.0",
"luxon": "^2.0.2",
"string-sanitizer": "^2.0.2",
"vue": "^3.2.19",

View File

@@ -0,0 +1,90 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="22.710474"
height="34.224064"
viewBox="0 0 22.710474 34.224064"
fill="none"
version="1.1"
id="svg20"
sodipodi:docname="hitgroup-puppet.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
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"
>
<defs
id="defs24"/>
<sodipodi:namedview
id="namedview22"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:pageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
showgrid="false"
showguides="false"
inkscape:zoom="45.254834"
inkscape:cx="6.8832426"
inkscape:cy="13.247204"
inkscape:window-width="1920"
inkscape:window-height="1013"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg20"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"/>
<path
name="Left Arm"
d="M 7.141623,13.979265 C 6.905754,13.081578 6.573803,12.214085 6.344503,11.315133 6.14912,10.753508 5.55109,10.49614 5.241876,10.00958 4.255968,8.8777561 3.492174,7.5759991 2.7366,6.2856845 2.445057,5.6812088 2.036069,5.1361362 1.828337,4.4934508 1.580758,3.9877798 1.396356,3.4379174 1.284912,2.8830221 1.0450912,2.3970534 0.42376285,2.2078085 0.20088515,1.6538568 -0.14988915,1.0610215 0.46230955,0.63098907 0.84634695,0.26619097 1.167073,-0.21948913 1.478777,0.51967717 1.721562,0.46196457 2.221988,0.34592357 2.327274,1.350798 2.014659,1.6659107 1.90204,2.2781914 2.457994,2.4848468 2.677912,2.9824421 c 0.283461,0.5103257 0.62158,0.9892397 0.954403,1.4686636 0.316364,0.4073596 0.22333,1.0433862 0.704178,1.3535312 0.530002,0.3070581 0.883219,0.8027217 1.128144,1.3374432 0.600746,0.284699 0.708157,1.009557 1.300297,1.331256 0.561911,0.166551 1.122755,0.382215 1.462661,0.896072 0.337821,0.459847 0.597809,1.0310769 0.413315,1.6045809 -0.01734,0.552416 -0.284062,1.041744 -0.48178,1.544857 -0.293144,0.516602 -0.661617,0.986417 -1.017507,1.460419 z"
fill="#00ff00"
stroke="#000000"
stroke-width="0.2"
stroke-opacity="1"
id="arm_left"/>
<path
name="Right Arm"
d="m 13.465845,10.511011 c -0.04407,-0.482095 -0.02562,-1.1006549 0.414225,-1.4033669 0.483393,-0.292095 1.15297,-0.182342 1.496001,-0.720701 0.358485,-0.418084 0.964045,-0.573356 1.205046,-1.094438 0.307102,-0.4391491 0.627443,-0.950665 1.170345,-1.0998957 0.446107,-0.4831052 0.633357,-1.1548859 1.062974,-1.657864 0.483112,-0.6725669 1.001212,-1.3228316 1.539695,-1.9500033 0.309471,-0.03029 0.162457,-0.5724547 0.214156,-0.8022905 -0.09101,-0.3680889 -0.117665,-0.78562313 0.175524,-1.06606653 0.182496,-0.1271886 0.303406,-0.3033472 0.393901,-0.504993 0.574344,-0.1633545 0.970432,0.273269 1.317584,0.6560752 0.198068,0.25263613 0.183753,0.56027693 0.08894,0.84792963 -0.394565,0.3034063 -0.880504,0.5955276 -1.065223,1.0786114 0.0098,0.5622898 -0.352252,1.0095603 -0.522078,1.5309037 -0.369587,0.6994661 -0.84079,1.3400307 -1.17228,2.0608943 -0.393089,0.3924582 -0.463966,0.8922808 -0.867882,1.2775418 -0.330654,0.416449 -0.803109,0.707257 -1.036443,1.197868 -0.444068,0.571036 -0.868098,1.1790579 -1.498998,1.5602229 -0.456816,0.318043 -1.003104,0.693349 -1.004675,1.315514 -0.09703,0.336299 -0.0061,1.46653 -0.564246,1.019166 -0.4348,-0.286783 -0.757165,-0.702396 -1.062084,-1.113622 -0.130954,-0.346818 -0.270634,-0.691581 -0.277069,-1.067735 -0.0025,-0.02125 -0.0049,-0.0425 -0.0074,-0.06375 z"
fill="#00ff00"
stroke="#000000"
stroke-width="0.2"
stroke-opacity="1"
id="arm_right"/>
<path
name="Left Foot"
d="m 7.272912,19.523172 c -0.184719,0.05741 -0.129467,0.351238 -0.210933,0.510372 0.174224,0.152016 0.05422,0.389802 0.04436,0.588772 -0.0013,0.247717 -0.351034,0.135582 -0.19748,-0.09024 0.03084,-0.340572 0.104082,-0.697933 0.04808,-1.03281 -0.07583,-0.198426 -0.266541,0.180045 -0.448407,0.08281 -0.17623,0.0013 -0.416845,0.05569 -0.50238,-0.150218 -0.228258,-0.114102 -0.08448,0.301631 -0.117784,0.432654 0.02425,1.132071 0.0485,2.264142 0.07274,3.396213 0.100433,0.156915 0.36987,0.02761 0.541025,0.06475 0.244586,0.07838 0.271046,-0.163217 0.247011,-0.344 0.0038,-0.600774 0.03093,-1.202579 0.02024,-1.802715 0.2793,-0.07998 0.138465,0.247321 0.166593,0.410826 -0.0074,0.843739 -0.03503,1.688804 -0.0449,2.531307 0.05442,0.363863 -0.07422,0.727626 0.0045,1.090967 -0.01817,0.586736 -0.15492,1.171738 -0.0631,1.7597 0.0527,0.325734 -0.234878,0.566365 -0.274373,0.881115 -0.153124,0.610296 -0.394444,1.198013 -0.457172,1.828513 -0.04977,0.275277 -0.0322,0.650582 0.261576,0.776794 0.09582,0.145231 0.361286,0.18977 0.325933,0.376589 -0.0021,0.401159 -0.01765,0.801976 -0.03301,1.202797 0.214991,0.115489 -0.07675,0.300015 -0.142538,0.427799 -0.151959,0.28232 -0.479683,0.410492 -0.661971,0.657733 -0.08162,0.217206 -0.240579,0.379066 -0.256494,0.617942 -0.114494,0.234828 0.165146,0.266053 0.331496,0.266497 0.636007,0.04325 1.281523,0.03538 1.912273,-0.04329 0.200158,-0.08538 0.44146,-0.0087 0.604404,-0.184484 0.229527,-0.06519 0.09453,-0.322005 0.120853,-0.494012 -0.03158,-0.292452 0.02756,-0.605286 -0.06425,-0.88421 0.226623,-0.04848 0.08753,-0.332107 0.130908,-0.498414 0.01571,-0.411605 -0.0059,-0.847163 0.149989,-1.233995 0.148236,-0.343555 0.42796,-0.660127 0.428762,-1.046445 -0.117161,-0.521954 -0.02941,-1.055709 -0.0076,-1.581529 -0.0168,-0.261572 0.04835,-0.53795 -0.06305,-0.784699 0.15597,-0.326082 0.251116,-0.679102 0.341978,-1.024793 0.03243,-0.272303 0.0054,-0.574597 0.07471,-0.828301 0.361994,-0.232617 0.252629,-0.719603 0.273085,-1.085465 0.08359,-0.09799 0.187223,-0.272508 0.231626,-0.458848 0.06762,-0.241155 0.191547,-0.487214 0.139471,-0.733682 -0.0098,-0.217022 0.142734,-0.311169 0.163034,-0.506685 0.154935,-0.535548 0.07265,-1.093344 0.08572,-1.642322 -0.0028,-0.461965 -0.0055,-0.923929 -0.0083,-1.385894 -1.055541,-0.02237 -2.111081,-0.04473 -3.166622,-0.0671 z"
fill="#00ff00"
stroke="#000000"
stroke-width="0.2"
stroke-opacity="1"
id="foot_left"/>
<path
name="Right Foot"
d="m 10.439534,19.590272 c 1.191659,-0.02307 2.383319,-0.04613 3.574978,-0.0692 0.296758,0.139654 0.391035,0.470491 0.630079,0.674659 0.124849,0.148775 0.462793,0.121668 0.420314,0.387926 -0.0294,0.216545 0.29903,0.131364 0.331248,0.353588 0.151032,0.224853 0.188138,0.523532 0.0097,0.744535 -0.05968,0.1884 -0.396724,0.146265 -0.229852,0.391949 0.06725,0.232558 0.142715,0.46712 0.0533,0.705179 -0.0099,0.227864 -0.290644,0.290322 -0.426614,0.441196 -0.256549,0.08778 -0.1322,0.284279 -0.05774,0.466542 0.134249,0.164044 -0.1078,0.412577 0.07124,0.53773 0.07317,0.196 -0.106227,0.390499 0.0012,0.58703 0.08741,0.270534 0.170719,0.539458 0.184299,0.827105 0.07998,0.410105 0.07841,0.823706 0.04519,1.238662 -0.06141,0.33742 0.10491,0.64977 0.208878,0.960637 0.230454,0.307233 0.363174,0.661656 0.478413,1.024519 0.107564,0.280149 0.230309,0.569511 0.135931,0.872952 -0.01394,0.245414 -0.149787,0.440273 -0.298905,0.62259 -0.165507,0.247406 -0.0965,0.570785 -0.142638,0.854003 -0.0031,0.282187 0.06015,0.563476 -0.05223,0.833583 -0.135774,0.169199 -0.06223,0.337558 0.01186,0.523197 0.08992,0.409465 0.342927,0.756268 0.552255,1.1062 0.06681,0.195723 0.09715,0.409458 -0.179679,0.390618 -0.627992,0.119353 -1.270898,0.0352 -1.89489,-0.0691 -0.113554,-0.135666 -0.321878,-0.203583 -0.2774,-0.418938 -0.02267,-0.407301 -0.04498,-0.814581 0.05278,-1.214671 0.0022,-0.114868 -0.135205,-0.239102 -0.09648,-0.443839 -0.03314,-0.351043 0.08887,-0.720608 -0.100783,-1.04353 -0.0987,-0.155231 -0.01666,-0.4971 -0.267826,-0.48854 -0.301776,0.0055 -0.460222,-0.339001 -0.369532,-0.598804 0.06946,-0.401034 -0.07011,-0.799965 -0.09726,-1.200417 -0.111144,-0.510681 -0.04833,-1.037487 -0.03363,-1.549973 -0.08073,-0.319924 -0.22389,-0.61055 -0.415184,-0.878545 -0.172809,-0.182809 -0.08748,-0.504431 -0.336875,-0.622907 -0.166561,-0.20208 -0.140432,-0.509275 -0.176332,-0.76214 -0.0149,-0.236728 0.02665,-0.490225 -0.14852,-0.679339 -0.255086,-0.586883 -0.492476,-1.187301 -0.661997,-1.806402 -0.156314,-0.106217 -0.3877,-0.167764 -0.497367,-0.301737 8e-6,-0.798773 1.5e-5,-1.597545 2.2e-5,-2.396318 z"
fill="#00ff00"
stroke="#000000"
stroke-width="0.2"
stroke-opacity="1"
id="foot_right"/>
<path
name="Head"
d="m 9.346912,8.5213721 c -0.0047,-0.111419 0.01572,-0.243568 -0.07189,-0.327213 -0.079,-0.03344 -0.09995,-0.109268 -0.120565,-0.185334 -0.04923,-0.166127 -0.134034,-0.329727 -0.106185,-0.507723 -0.01488,-0.06588 0.0459,-0.17713 -0.03906,-0.200988 C 8.920142,7.2581441 8.794008,7.2891241 8.74237,7.1867541 8.70153,7.1189751 8.72327,7.0247724 8.70656,6.9468023 8.68606,6.6603974 8.70986,6.3730485 8.768,6.0921085 8.82333,6.0324085 8.919641,6.0580515 8.97263,6.0328625 9.02137,5.9501605 8.90946,5.9195524 8.88566,5.8565782 8.84491,5.6199484 8.92321,5.3864043 8.98263,5.1596939 9.06046,4.9962344 9.157699,4.8395771 9.282292,4.7083685 9.452077,4.53491 9.658852,4.4044859 9.878879,4.3041782 c 0.121576,-0.059262 0.262195,-0.069416 0.393819,-0.096197 0.164317,-0.020982 0.328726,-0.033802 0.493545,-0.010099 0.269566,0.026621 0.544086,0.070326 0.790793,0.1848388 0.171348,0.1153223 0.345429,0.2326844 0.48827,0.38182 0.09034,0.1341507 0.189878,0.2634704 0.235159,0.4212689 0.07412,0.2283032 0.08961,0.4704318 0.111037,0.7083942 -0.05158,0.050578 -0.07229,0.1366292 0.0056,0.1736974 0.05696,0.041719 0.141902,0.016364 0.195513,0.071976 0.07048,0.047334 0.04423,0.1582458 0.05112,0.2347486 -0.0013,0.1955198 0.0073,0.3928958 -0.002,0.5872793 -0.03009,0.078666 -0.05185,0.1745557 -0.108304,0.2342277 -0.06127,0.03307 -0.171705,0.02415 -0.200081,0.08531 -0.02931,0.139928 -0.02329,0.288519 -0.06492,0.42425 -0.07374,0.18833 -0.202699,0.347489 -0.334569,0.498386 -0.03489,0.06218 -0.03029,0.159075 -0.05684,0.206915 -0.843354,0.03679 -1.686707,0.07358 -2.530061,0.110375 z"
fill="#00ff00"
stroke="#000000"
stroke-width="0.2"
stroke-opacity="1"
id="head"/>
<path
name="Stomach"
id="stomach"
d="m 14.915071,13.987706 -7.761718,0.0098 c -0.03737,0.131549 -0.02717,0.281656 -0.04102,0.421875 -0.728656,0.472621 -0.618724,0.852167 -0.652344,1.736328 -0.125444,0.118325 -0.242976,0.278867 -0.101562,0.435547 0.180318,0.255927 0.01133,0.64729 0.285156,0.84375 0.196575,0.241742 0.515574,0.239833 0.796875,0.283203 0.235304,-0.100158 0.207612,0.198209 0.132812,0.328125 -0.105759,0.35002 -0.12621,0.732568 -0.304687,1.0625 -0.130882,0.20556 0.252245,0.184062 0.142578,0.416016 0.617503,0.01346 1.236013,0.0256 1.853516,0.03906 1.573515,0.05491 3.147101,-0.02598 4.720703,-0.04297 0.05118,-0.116083 -0.04363,-0.353986 -0.04883,-0.517579 -0.0794,-0.199166 -0.01274,-0.331946 0.105468,-0.460937 -0.07545,-0.179535 -0.114786,-0.250942 -0.06641,-0.4375 0.0111,-0.195491 -0.08442,-0.430194 0.01563,-0.617188 0.149269,-0.05468 0.360515,0.0067 0.533203,-0.0039 0.182605,0.0085 0.218168,-0.185306 0.425782,-0.103516 0.10962,-0.155632 0.05373,-0.36994 0.04883,-0.550781 -0.03413,-0.19184 0.01464,-0.428139 -0.07227,-0.591797 0.04411,-0.135718 -0.109647,-0.465373 0.09766,-0.439453 -0.01706,-0.43839 0.02073,-0.88148 -0.06445,-1.314453 0.0064,-0.165841 -0.117713,-0.349091 -0.04492,-0.496094 z"
style="fill:#00ff00;fill-opacity:1;stroke:#000000;stroke-width:0.2;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"/>
<path
name="Chest"
id="chest"
d="m 11.977571,8.4173941 c -0.952543,0.01861 -1.906804,0.07511 -2.859375,0.117187 -0.231459,-0.005 -0.329425,0.225494 -0.328125,0.425782 -0.116651,0.126828 -0.182759,-0.233998 -0.373047,-0.205079 -0.203602,0.02035 -0.410929,0.131857 -0.615234,0.185547 0.07309,0.06154 0.147613,0.122064 0.220703,0.183594 0.32146,0.338489 0.552435,0.76664 0.673828,1.2187499 0.02508,0.259591 -0.06175,0.529484 -0.08008,0.792969 -0.0167,0.460821 -0.269929,0.856987 -0.417969,1.283203 -0.235465,0.496628 -0.592962,0.927886 -0.916015,1.371094 -0.06949,0.05912 -0.10712,0.130333 -0.128906,0.207031 l 7.761718,-0.0098 c 0.01361,-0.02749 0.03085,-0.05355 0.06055,-0.07813 0.14058,-0.150077 0.24616,-0.316672 0.25586,-0.527343 0.0202,-0.257625 0.178225,-0.511206 0.103515,-0.767578 -0.122762,-0.125993 -0.129326,0.260686 -0.273437,0.310546 -0.251918,-0.199357 -0.518419,-0.385497 -0.761719,-0.59375 -0.208857,-0.299375 -0.52889,-0.535083 -0.625,-0.898437 -0.172968,-0.365785 -0.199202,-0.768248 -0.226563,-1.166016 0.02952,-0.3578019 0.0323,-0.7637689 0.291016,-1.0429689 0.208465,-0.123342 0.17626,-0.190105 -0.03711,-0.300781 -0.211415,-0.201797 -0.497989,-0.122297 -0.75586,-0.0918 -0.189632,0.08624 -0.336928,-0.0675 -0.386718,-0.240234 -0.139402,-0.15767 -0.379065,-0.163928 -0.582032,-0.173828 z"
style="fill:#00ff00;fill-opacity:1;stroke:#000000;stroke-width:0.2;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"/>
</svg>

After

Width:  |  Height:  |  Size: 13 KiB

View File

@@ -1,47 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px"
height="32px" viewBox="0 0 24 32" enable-background="new 0 0 24 32" xml:space="preserve">
<symbol id="dude-transit" viewBox="0 -25.1 21.25 25.118">
<path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M15.5-4.2l0.75-1.05l1-3.1l3.9-2.65v-0.05
c0.067-0.1,0.1-0.233,0.1-0.4c0-0.2-0.05-0.383-0.15-0.55c-0.167-0.233-0.383-0.35-0.65-0.35l-4.3,1.8l-1.2,1.65l-1.5-3.95
l2.25-5.05l-3.25-6.9c-0.267-0.2-0.633-0.3-1.1-0.3c-0.3,0-0.55,0.15-0.75,0.45c-0.1,0.133-0.15,0.25-0.15,0.35
c0,0.067,0.017,0.15,0.05,0.25c0.033,0.1,0.067,0.184,0.1,0.25l2.55,5.6L10.7-14l-3.05-4.9L0.8-18.7
c-0.367,0.033-0.6,0.184-0.7,0.45c-0.067,0.3-0.1,0.467-0.1,0.5c0,0.5,0.2,0.767,0.6,0.8l5.7,0.15l2.15,5.4l3.1,5.65L9.4-5.6
c-1.367-2-2.1-3.033-2.2-3.1C7.1-8.8,6.95-8.85,6.75-8.85C6.35-8.85,6.1-8.667,6-8.3C5.9-8,5.9-7.8,6-7.7H5.95l2.5,4.4l3.7,0.3
L14-3.5L15.5-4.2z M14.55-2.9c-0.333,0.4-0.45,0.85-0.35,1.35c0.033,0.5,0.25,0.9,0.65,1.2S15.7,0.066,16.2,0
c0.5-0.067,0.9-0.3,1.2-0.7c0.333-0.4,0.467-0.85,0.4-1.35c-0.066-0.5-0.3-0.9-0.7-1.2c-0.4-0.333-0.85-0.45-1.35-0.35
C15.25-3.533,14.85-3.3,14.55-2.9z"/>
</symbol>
<g id="Layer_1">
<g>
<circle cx="18.019" cy="5.867" r="2.079"/>
<path d="M22.709,17.534c-0.772-0.228-4.19-1.772-4.19-1.772s-0.16-0.114-0.388-0.331c-0.224-0.219-1.41-1.281-1.41-1.281
l-1.424,3.833c0,0-0.098,0.259,0.028,0.485c0.131,0.226,2.195,4.932,2.195,4.932s0.193,0.288,0.159,0.451
c-0.029,0.158-3.575,7.574-3.575,7.574s-0.265,0.521-0.521,0.556c-0.258,0.033-0.644,0.037-0.994-0.105
c-0.455-0.186-0.869-0.646-0.774-0.936c0.095-0.286,2.869-6.477,2.869-6.477s0.033-0.064,0-0.257
c-0.033-0.197-2.722-4.58-2.722-4.58s-3.046,4.9-3.146,5.126c-0.096,0.227-0.548,0.405-0.548,0.405l-7.283-0.276
c0,0-0.482,0.065-0.675-0.289c-0.194-0.356-0.2-1.346,0.107-1.619c0.246-0.218,0.858-0.187,0.858-0.187l5.769-0.16l2.29-5.672
l0.386-0.711l3.286-5.915l-2.418-0.112c0,0-2.093,2.936-2.449,3.351c-0.352,0.421-0.966,0.163-1.192-0.029
c-0.222-0.192-0.61-0.645-0.289-1.097C6.935,12.055,8.787,8.7,9.32,7.737C9.411,7.572,9.881,7.44,9.881,7.44l3.563-0.205
l0.758,0.063L15.36,7.64l1.386,0.515c0,0,0.709,0.129,0.934,0.58c0.228,0.452,0.807,1.481,0.807,1.481l0.772,2.516l0.131,0.385
l3.866,2.58c0,0,0.516,0.258,0.581,0.452c0.064,0.191,0.29,0.643,0,0.998C23.546,17.5,23.481,17.759,22.709,17.534z"/>
</g>
<g>
<circle fill="#FFFFFF" cx="17.863" cy="5.433" r="2.079"/>
<path fill="#FFFFFF" d="M22.554,17.101c-0.772-0.229-4.189-1.773-4.189-1.773s-0.16-0.114-0.389-0.331
c-0.224-0.219-1.41-1.281-1.41-1.281l-1.424,3.833c0,0-0.098,0.259,0.029,0.485c0.131,0.226,2.194,4.932,2.194,4.932
s0.193,0.288,0.16,0.451c-0.03,0.158-3.576,7.574-3.576,7.574s-0.265,0.521-0.521,0.556c-0.258,0.033-0.644,0.037-0.994-0.105
c-0.454-0.186-0.869-0.646-0.774-0.936c0.095-0.286,2.869-6.476,2.869-6.476s0.033-0.065,0-0.258
c-0.033-0.197-2.722-4.58-2.722-4.58s-3.046,4.9-3.145,5.126c-0.097,0.227-0.548,0.406-0.548,0.406L0.83,24.447
c0,0-0.481,0.064-0.675-0.29c-0.194-0.356-0.2-1.346,0.107-1.619c0.246-0.218,0.858-0.187,0.858-0.187l5.769-0.16l2.29-5.672
l0.386-0.711l3.286-5.914l-2.418-0.113c0,0-2.093,2.936-2.449,3.351c-0.352,0.421-0.966,0.163-1.192-0.029
c-0.222-0.192-0.61-0.645-0.289-1.097c0.276-0.386,2.129-3.74,2.662-4.703c0.091-0.164,0.561-0.297,0.561-0.297l3.563-0.205
l0.758,0.064l1.159,0.34l1.386,0.515c0,0,0.709,0.129,0.935,0.58c0.227,0.452,0.806,1.481,0.806,1.481l0.772,2.516l0.131,0.386
l3.866,2.579c0,0,0.517,0.258,0.581,0.452c0.064,0.191,0.29,0.643,0,0.998C23.391,17.065,23.327,17.324,22.554,17.101z"/>
</g>
</g>
<g id="Layer_2">
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.8 KiB

View File

@@ -0,0 +1,54 @@
<template>
<div class="damage-site">
<div class="total-damage">
<h3 class="text-center mt-2">Total Damage</h3>
<TotalDamage/>
</div>
<div class="hitgroup">
<h3 class="text-center">Hitgroup-Puppet</h3>
<HitgroupPuppet :equipment_map="data.equipment_map" :stats="data.stats" />
</div>
</div>
</template>
<script>
import HitgroupPuppet from '@/components/HitgroupPuppet'
import TotalDamage from "@/components/TotalDamage"
import {onMounted, reactive} from "vue";
import {useStore} from "vuex";
import {GetWeaponDmg} from "@/utils";
export default {
name: "DamageSite.vue",
components: {HitgroupPuppet, TotalDamage},
setup() {
const store = useStore()
const data = reactive({
equipment_map: {},
stats: [],
})
const getWeaponDamage = async () => {
const resData = await GetWeaponDmg(store.state.matchDetails.match_id)
data.equipment_map = resData.equipment_map
data.stats = resData.stats
}
onMounted(() => {
getWeaponDamage()
})
return {data}
}
}
</script>
<style scoped>
.damage-site {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
</style>

View File

@@ -8,7 +8,7 @@
<script>
import {getPlayerValue} from "@/utils";
import {GetPlayerValue} from "@/utils";
import {useStore} from "vuex";
import {onBeforeMount, onMounted, onUnmounted, reactive, ref, watch} from "vue";
@@ -54,7 +54,7 @@ export default {
}
const parseObject = async () => {
data.rounds = await getPlayerValue(store.state.matchDetails.match_id)
data.rounds = await GetPlayerValue(store.state.matchDetails.match_id)
for (const round in data.rounds) {
for (const player in data.rounds[round]) {

View File

@@ -0,0 +1,364 @@
<template>
<div class="hitgroup pt-2">
<div class="select-group mb-4">
<select v-if="store.state.playersArr" v-model="data.selectPlayer" class="form-select">
<option disabled value="">Select a Player</option>
<option value="All">All</option>
<option value="Team 1">Team 1</option>
<option value="Team 2">Team 2</option>
<option disabled></option>
<option v-for="(value, index) in props.stats" :key="index"
:value="Object.keys(value).toString() === store.state.playersArr[index].player.steamid64 ? store.state.playersArr[index].player : ''">
{{
Object.keys(value).toString() === store.state.playersArr[index].player.steamid64 ? store.state.playersArr[index].player.name : ''
}}
</option>
</select>
<select v-model="data.selectWeapon" class="form-select">
<option disabled value="">Select a Weapon</option>
<option class="select-hr" value="All">All</option>
<option disabled></option>
<option v-for="(value, index) in data.eq_map" :key="index" :value="value">
{{ Object.values(value).toString().charAt(0).toUpperCase() + Object.values(value).toString().slice(1) }}
</option>
</select>
</div>
<div v-show="false" :key="data.selectWeapon || data.selectPlayer">{{ processDmg() }}</div>
<div id="hitgroup-puppet"></div>
</div>
</template>
<script>
import * as echarts from 'echarts/core';
import {GeoComponent, TooltipComponent, VisualMapComponent} from 'echarts/components';
import {MapChart} from 'echarts/charts';
import {CanvasRenderer} from 'echarts/renderers';
import {onMounted, onUnmounted, reactive, ref} from "vue";
import {useStore} from "vuex";
import $ from 'jquery'
export default {
name: "HitgroupPuppet.vue",
props: {
equipment_map: {
type: Object,
required: true,
},
stats: {
type: Array,
required: true
}
},
setup(props) {
const store = useStore()
const data = reactive({
selectPlayer: '',
selectWeapon: '',
eq_map: []
})
console.log(store.state.playersArr)
setTimeout(() => {
for (let i in props.equipment_map) {
if (i < 500) {
const obj = {}
obj[i] = props.equipment_map[i]
data.eq_map.push(obj)
}
}
}, 400)
let myChart1
const getWindowWidth = () => {
const windowWidth = window.innerWidth
if (windowWidth <= 750)
return windowWidth
else
return 650
}
const setHeight = () => {
const windowWidth = getWindowWidth()
if (windowWidth >= 751)
return windowWidth * 3 / 7.5
else if (windowWidth >= 501 && windowWidth <= 750)
return windowWidth * 3 / 6.5
else
return windowWidth * 3 / 5.5
}
const width = ref(getWindowWidth())
const height = ref(setHeight())
const processDmg = () => {
let arr = []
if (data.selectPlayer && data.selectWeapon) {
switch (data.selectPlayer) {
case "All":
props.stats.forEach(player => {
Object.values(player).forEach(enemies => {
Object.values(enemies).forEach(weapons => {
Object.values(weapons).forEach(weapon => {
// 0: weapon
// 1: hitgroup
// 2: dmg
if (weapon) {
if (weapon[0] === parseInt(Object.keys(data.selectWeapon).toString())) {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
} else if (data.selectWeapon === 'All') {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
}
}
})
})
})
})
break;
case "Team 1":
props.stats.forEach(player => {
store.state.playersArr.forEach(p => {
if (p.player.steamid64 === Object.keys(player).toString() && p.team_id === 1)
Object.values(player).forEach(enemies => {
Object.values(enemies).forEach(weapons => {
Object.values(weapons).forEach(weapon => {
// 0: weapon
// 1: hitgroup
// 2: dmg
if (weapon) {
if (weapon[0] === parseInt(Object.keys(data.selectWeapon).toString())) {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
} else if (data.selectWeapon === 'All') {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
}
}
})
})
})
})
})
break;
case "Team 2":
props.stats.forEach(player => {
store.state.playersArr.forEach(p => {
if (p.player.steamid64 === Object.keys(player).toString() && p.team_id === 2)
Object.values(player).forEach(enemies => {
Object.values(enemies).forEach(weapons => {
Object.values(weapons).forEach(weapon => {
// 0: weapon
// 1: hitgroup
// 2: dmg
if (weapon) {
if (weapon[0] === parseInt(Object.keys(data.selectWeapon).toString())) {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
} else if (data.selectWeapon === 'All') {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
}
}
})
})
})
})
})
break;
default:
props.stats.forEach(player => {
if (Object.keys(player).toString() === data.selectPlayer.steamid64) {
Object.values(player).forEach(enemies => {
Object.values(enemies).forEach(weapons => {
Object.values(weapons).forEach(weapon => {
// 0: weapon
// 1: hitgroup
// 2: dmg
if (weapon) {
if (weapon[0] === parseInt(Object.keys(data.selectWeapon).toString())) {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
} else if (data.selectWeapon === 'All') {
let obj = {}
obj[weapon[1]] = weapon[2]
arr.push(obj)
}
}
})
})
})
}
})
break;
}
buildCharts(sumDmgArr(arr))
}
}
const sumDmgArr = (arr) => {
let holder = {};
arr.forEach(function (d) {
// eslint-disable-next-line no-prototype-builtins
if (holder.hasOwnProperty(parseInt(Object.keys(d).toString()))) {
holder[parseInt(Object.keys(d).toString())] = holder[parseInt(Object.keys(d).toString())] + parseInt(Object.values(d).toString());
} else {
holder[parseInt(Object.keys(d).toString())] = parseInt(Object.values(d).toString());
}
});
let arr2 = [];
for (let i = 1; i < 8; i++) {
if (holder[i] !== undefined) {
arr2.push(holder[i])
} else {
arr2.push(0)
}
}
return arr2
}
const getMax = (arr) => {
let max = 0
for (let i = 0; i < 7; i++) {
if (arr[i] > max)
max = arr[i]
}
return max
}
const optionGen = (arr = []) => {
return {
tooltip: {},
visualMap: {
left: 'center',
bottom: '5%',
textStyle: {
color: 'white',
},
min: 0,
max: getMax(arr) || 100,
orient: 'horizontal',
realtime: true,
calculable: true,
inRange: {
color: ['#00ff00', '#db6e00', '#cf0000']
}
},
series: [
{
name: 'Hitgroup Dummy',
type: 'map',
map: 'hitgroup-puppet',
top: '0%',
emphasis: {
label: {
show: false
}
},
selectedMode: false,
data: [
{name: 'Head', value: arr[0] || 0},
{name: 'Chest', value: arr[1] || 0},
{name: 'Stomach', value: arr[2] || 0},
{name: 'Left Arm', value: arr[3] || 0},
{name: 'Right Arm', value: arr[4] || 0},
{name: 'Left Foot', value: arr[5] || 0},
{name: 'Right Foot', value: arr[6] || 0}
]
}
]
}
}
const disposeCharts = () => {
if (myChart1 != null && myChart1 !== '' && myChart1 !== undefined) {
myChart1.dispose()
}
}
const buildCharts = (arr) => {
disposeCharts()
myChart1 = echarts.init(document.getElementById('hitgroup-puppet'), {}, {width: 500, height: 500})
const url = require('@/assets/images/icons/hitgroup-puppet.svg')
$.get(url, function (svg) {
echarts.registerMap('hitgroup-puppet', {svg: svg})
myChart1.setOption(optionGen(arr));
})
}
onMounted(() => {
if (store.state.matchDetails.stats) {
echarts.use([
TooltipComponent,
VisualMapComponent,
GeoComponent,
MapChart,
CanvasRenderer
]);
buildCharts()
}
})
onUnmounted(() => {
disposeCharts()
})
window.onresize = () => {
if (window.innerWidth <= 750) {
width.value = getWindowWidth() - 20
height.value = setHeight()
}
buildCharts()
}
return {props, data, store, processDmg}
}
}
</script>
<style lang="scss" scoped>
.hitgroup {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.select-group {
display: flex;
flex-direction: row;
gap: 1rem;
.form-select {
background: var(--bs-secondary);
color: var(--bs-primary);
width: 250px;
}
}
}
</style>

View File

@@ -1,8 +1,11 @@
import { createApp } from 'vue'
import {createApp} from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import 'bootstrap'
import '@/scss/custom.scss'
createApp(App).use(store).use(router).mount('#app')
createApp(App)
.use(store)
.use(router)
.mount('#app')

View File

@@ -73,7 +73,7 @@ const routes = [
{
path: 'damage',
components: {
score: lazyLoadComponent('DamageChart')
score: lazyLoadComponent('DamageSite')
}
}
]

View File

@@ -5,7 +5,8 @@ export default createStore({
id64: '',
vanityUrl: '',
matchDetails: {},
playerDetails: {}
playerDetails: {},
playersArr: []
},
mutations: {
changeId64(state, payload) {
@@ -20,6 +21,9 @@ export default createStore({
changePlayerDetails(state, payload) {
state.playerDetails = payload.data
},
changePlayesArr(state, payload) {
state.playersArr = payload.data
},
resetId64(state) {
state.id64 = ''
},
@@ -27,10 +31,13 @@ export default createStore({
state.vanityUrl = ''
},
resetMatchDetails(state) {
state.matchDetails = ''
state.matchDetails = {}
},
resetPlayerDetails(state) {
state.playerDetails = ''
state.playerDetails = {}
},
resetPlayesArr(state) {
state.playersArr = []
},
},
actions: {

View File

@@ -55,7 +55,7 @@ export const TrackMe = async (id64, authcode, sharecode = '') => {
return [status, statusError]
}
export const getPlayerValue = async (match_id) => {
export const GetPlayerValue = async (match_id) => {
try {
const res = await axios.get(`${API_URL}/match/${match_id}/rounds`)
@@ -67,7 +67,7 @@ export const getPlayerValue = async (match_id) => {
}
}
export const getMatchDetails = async (match_id) => {
export const GetMatchDetails = async (match_id) => {
try {
const res = await axios.get(`${API_URL}/match/${match_id}`)
@@ -80,7 +80,7 @@ export const getMatchDetails = async (match_id) => {
}
}
export const loadMoreMatches = async (player_id, date) => {
export const LoadMoreMatches = async (player_id, date) => {
try {
const res = await axios.get(`${API_URL}/player/${player_id}/next/${date}`)
@@ -93,7 +93,7 @@ export const loadMoreMatches = async (player_id, date) => {
}
}
export const getPlayerMeta = async (player_id, limit = 4) => {
export const GetPlayerMeta = async (player_id, limit = 4) => {
try {
const res = await axios.get(`${API_URL}/player/${player_id}/meta/${limit}`)
@@ -105,3 +105,16 @@ export const getPlayerMeta = async (player_id, limit = 4) => {
console.log(err.response.status, err.response.statusText)
}
}
export const GetWeaponDmg = async (match_id) => {
try {
const res = await axios.get(`${API_URL}/match/${match_id}/weapons`)
if (res.status === 200) {
return res.data
}
} catch (e) {
// TODO: 400, 404
console.log(e)
}
}

View File

@@ -99,3 +99,11 @@ export const sortObjectValue = (obj, direction = 'asc') => {
return sortable
}
export const CreatePlayersArray = (stats) => {
let arr = []
for (let i in stats) {
arr.push({team_id: stats[i].team_id, player: stats[i].player})
}
return arr
}

View File

@@ -3,7 +3,7 @@ import {GoToLink, GoToMatch, GoToPlayer} from "./GoTo";
import {SaveLastVisitedToLocalStorage} from "./LocalStorage";
import {GetHLTV_1} from "./HLTV";
import {DisplayRank, LoadImage} from "./Display";
import {getMatchDetails, getPlayerMeta, getPlayerValue, GetUser, loadMoreMatches, TrackMe} from "./ApiRequests";
import {GetMatchDetails, GetPlayerMeta, GetPlayerValue, GetUser, LoadMoreMatches, TrackMe, GetWeaponDmg} from "./ApiRequests";
import {
checkStatEmpty,
closeNav,
@@ -14,7 +14,8 @@ import {
GetWinLoss,
setTitle,
truncate,
sortObjectValue
sortObjectValue,
CreatePlayersArray
} from "./Utils";
export {
@@ -32,10 +33,10 @@ export {
LoadImage,
GetUser,
TrackMe,
getPlayerValue,
loadMoreMatches,
getPlayerMeta,
getMatchDetails,
GetPlayerValue,
LoadMoreMatches,
GetPlayerMeta,
GetMatchDetails,
setTitle,
GetWinLoss,
truncate,
@@ -45,5 +46,7 @@ export {
GetAvgRank,
FixMapName,
closeNav,
sortObjectValue
sortObjectValue,
GetWeaponDmg,
CreatePlayersArray
}

View File

@@ -14,10 +14,12 @@
<div class="m-auto map">
<img v-if="data.matchDetails.map" :alt="data.matchDetails.map"
:src="require('../assets/images/map_icons/map_icon_' + data.matchDetails.map + '.svg')"
:title="data.matchDetails.map" class="map-icon">
:title="data.matchDetails.map" class="map-icon"
>
<img v-if="!data.matchDetails.map" :src="require('../assets/images/map_icons/map_icon_lobby_mapveto.svg')"
alt="Map icon"
class="map-icon" title="Map unknown">
class="map-icon" title="Map unknown"
>
</div>
<div v-if="route.fullPath.split('/')[3] !== 'overview'" class="score-team-2">
<h1 :class="checkWin(2)" :style="data.score[1] < 10 ? 'padding-left: 20px;' : ''">{{ data.score[1] }}</h1>
@@ -46,10 +48,10 @@
<img v-if="data.matchDetails.parsed"
:alt="DisplayRank(data.avgRank)[1]"
:src="DisplayRank(data.avgRank)[0]"
:title="DisplayRank(data.avgRank)[1]"
:title="'Average Rank: ' + DisplayRank(data.avgRank)[1]"
class="rank-icon"/>
<span v-if="data.matchDetails.replay_url" class="text-muted px-2"></span>
<a v-if="data.matchDetails.replay_url" :href="data.matchDetails.replay_url" class="text-white">
<a v-if="data.matchDetails.replay_url" :href="data.matchDetails.replay_url" class="text-white" title="Download Match">
<i class="fas fa-download"></i>
</a>
</p>
@@ -116,12 +118,13 @@
import {onBeforeMount, onBeforeUnmount, onMounted, reactive, watch} from "vue";
import {
closeNav,
CreatePlayersArray,
DisplayRank,
FixMapName,
FormatDuration,
FormatFullDate,
GetAvgRank,
getMatchDetails,
GetMatchDetails,
GoToLink,
LoadImage
} from "../utils";
@@ -150,7 +153,7 @@ export default {
// Functions
const GetMatch = async () => {
if (matchIdPattern.test(props.match_id)) {
const res = await getMatchDetails(props.match_id)
const res = await GetMatchDetails(props.match_id)
if (res.map)
document.title = `${FixMapName(res.map)} | csgoWTF`
@@ -168,6 +171,10 @@ export default {
LoadImage(data.matchDetails.map ? data.matchDetails.map : 'random')
store.commit({
type: 'changePlayesArr',
data: CreatePlayersArray(data.stats)
})
data.avgRank = GetAvgRank(data.stats)
console.log(data.matchDetails)

View File

@@ -313,14 +313,14 @@ import {
FormatFullDuration,
FormatVacDate,
GetHLTV_1,
getPlayerMeta,
GetPlayerMeta,
GetUser,
GetWinLoss,
GoToLink,
GoToMatch,
GoToPlayer,
LoadImage,
loadMoreMatches,
LoadMoreMatches,
SaveLastVisitedToLocalStorage,
setTitle,
sortObjectValue,
@@ -429,7 +429,7 @@ export default {
}
const setMoreMatches = async () => {
const res = await loadMoreMatches(store.state.playerDetails.steamid64, data.matches[data.matches.length - 1].date)
const res = await LoadMoreMatches(store.state.playerDetails.steamid64, data.matches[data.matches.length - 1].date)
res.matches.forEach(e => data.matches.push(e))
@@ -446,7 +446,7 @@ export default {
}, 2000)
})
data.playerMeta = await getPlayerMeta(props.id, displayCounter)
data.playerMeta = await GetPlayerMeta(props.id, displayCounter)
}
const TrackPlayer = async () => {
@@ -512,7 +512,7 @@ export default {
watch(() => props.id, async () => {
await GetPlayer()
data.playerMeta = await getPlayerMeta(props.id, displayCounter)
data.playerMeta = await GetPlayerMeta(props.id, displayCounter)
})
watch(() => data.playerMeta, () => {
@@ -530,7 +530,7 @@ export default {
wrapper.style.minHeight = height + 'px'
await GetPlayer()
data.playerMeta = await getPlayerMeta(props.id, displayCounter)
data.playerMeta = await GetPlayerMeta(props.id, displayCounter)
})
return {

View File

@@ -4037,6 +4037,7 @@ __metadata:
echarts: ^5.2.1
eslint: ^6.8.0
eslint-plugin-vue: ^7.19.1
jquery: ^3.6.0
luxon: ^2.0.2
sass: ^1.42.1
sass-loader: ^10.2.0
@@ -7051,6 +7052,13 @@ fsevents@~2.3.2:
languageName: node
linkType: hard
"jquery@npm:^3.6.0":
version: 3.6.0
resolution: "jquery@npm:3.6.0"
checksum: 8fd5fef4aa48fd374ec716dd1c1df1af407814a228e15c1260ca140de3a697c2a77c30c54ff1d238b6a3ab4ddc445ddeef9adce6c6d28e4869d85eb9d3951c0e
languageName: node
linkType: hard
"js-message@npm:1.0.7":
version: 1.0.7
resolution: "js-message@npm:1.0.7"