Fetch scripts if provided

package.json

@@ -14,10 +14,15 @@
     "project",
     "parser"
   ],
+  "repository": {
+    "type": "git",
+    "url": "http://git.annimon.com/other-projects/RpyPlayerTS"
+  },
   "author": "aNNiMON",
   "license": "MIT",
   "dependencies": {
-    "typescript": "^5.3.3"
+    "normalize.css": "^8.0.1",
+    "typescript": "^5.4.2"
   },
   "devDependencies": {
     "parcel": "^2.12.0"

pnpm-lock.yaml

@@ -5,14 +5,17 @@ settings:
   excludeLinksFromLockfile: false
 
 dependencies:
+  normalize.css:
+    specifier: ^8.0.1
+    version: 8.0.1
   typescript:
-    specifier: ^5.3.3
+    specifier: ^5.4.2
-    version: 5.3.3
+    version: 5.4.2
 
 devDependencies:
   parcel:
     specifier: ^2.12.0
-    version: 2.12.0(typescript@5.3.3)
+    version: 2.12.0(typescript@5.4.2)
 
 packages:
 
@@ -200,7 +203,7 @@ packages:
       - '@swc/helpers'
     dev: true
 
-  /@parcel/config-default@2.12.0(@parcel/core@2.12.0)(typescript@5.3.3):
+  /@parcel/config-default@2.12.0(@parcel/core@2.12.0)(typescript@5.4.2):
     resolution: {integrity: sha512-dPNe2n9eEsKRc1soWIY0yToMUPirPIa2QhxcCB3Z5RjpDGIXm0pds+BaiqY6uGLEEzsjhRO0ujd4v2Rmm0vuFg==}
     peerDependencies:
       '@parcel/core': ^2.12.0
@@ -210,7 +213,7 @@ packages:
       '@parcel/core': 2.12.0
       '@parcel/namer-default': 2.12.0(@parcel/core@2.12.0)
       '@parcel/optimizer-css': 2.12.0(@parcel/core@2.12.0)
-      '@parcel/optimizer-htmlnano': 2.12.0(@parcel/core@2.12.0)(typescript@5.3.3)
+      '@parcel/optimizer-htmlnano': 2.12.0(@parcel/core@2.12.0)(typescript@5.4.2)
       '@parcel/optimizer-image': 2.12.0(@parcel/core@2.12.0)
       '@parcel/optimizer-svgo': 2.12.0(@parcel/core@2.12.0)
       '@parcel/optimizer-swc': 2.12.0(@parcel/core@2.12.0)
@@ -376,12 +379,12 @@ packages:
       - '@swc/helpers'
     dev: true
 
-  /@parcel/optimizer-htmlnano@2.12.0(@parcel/core@2.12.0)(typescript@5.3.3):
+  /@parcel/optimizer-htmlnano@2.12.0(@parcel/core@2.12.0)(typescript@5.4.2):
     resolution: {integrity: sha512-MfPMeCrT8FYiOrpFHVR+NcZQlXAptK2r4nGJjfT+ndPBhEEZp4yyL7n1y7HfX9geg5altc4WTb4Gug7rCoW8VQ==}
     engines: {node: '>= 12.0.0', parcel: ^2.12.0}
     dependencies:
       '@parcel/plugin': 2.12.0(@parcel/core@2.12.0)
-      htmlnano: 2.1.0(svgo@2.8.0)(typescript@5.3.3)
+      htmlnano: 2.1.0(svgo@2.8.0)(typescript@5.4.2)
       nullthrows: 1.1.1
       posthtml: 0.16.6
       svgo: 2.8.0
@@ -435,7 +438,7 @@ packages:
       '@parcel/plugin': 2.12.0(@parcel/core@2.12.0)
       '@parcel/source-map': 2.1.1
       '@parcel/utils': 2.12.0
-      '@swc/core': 1.4.2
+      '@swc/core': 1.4.6
       nullthrows: 1.1.1
     transitivePeerDependencies:
       - '@parcel/core'
@@ -456,7 +459,7 @@ packages:
       '@parcel/types': 2.12.0(@parcel/core@2.12.0)
       '@parcel/utils': 2.12.0
       '@parcel/workers': 2.12.0(@parcel/core@2.12.0)
-      '@swc/core': 1.4.2
+      '@swc/core': 1.4.6
       semver: 7.6.0
     transitivePeerDependencies:
       - '@swc/helpers'
@@ -1014,8 +1017,8 @@ packages:
       nullthrows: 1.1.1
     dev: true
 
-  /@swc/core-darwin-arm64@1.4.2:
+  /@swc/core-darwin-arm64@1.4.6:
-    resolution: {integrity: sha512-1uSdAn1MRK5C1m/TvLZ2RDvr0zLvochgrZ2xL+lRzugLlCTlSA+Q4TWtrZaOz+vnnFVliCpw7c7qu0JouhgQIw==}
+    resolution: {integrity: sha512-bpggpx/BfLFyy48aUKq1PsNUxb7J6CINlpAUk0V4yXfmGnpZH80Gp1pM3GkFDQyCfq7L7IpjPrIjWQwCrL4hYw==}
     engines: {node: '>=10'}
     cpu: [arm64]
     os: [darwin]
@@ -1023,8 +1026,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-darwin-x64@1.4.2:
+  /@swc/core-darwin-x64@1.4.6:
-    resolution: {integrity: sha512-TYD28+dCQKeuxxcy7gLJUCFLqrwDZnHtC2z7cdeGfZpbI2mbfppfTf2wUPzqZk3gEC96zHd4Yr37V3Tvzar+lQ==}
+    resolution: {integrity: sha512-vJn+/ZuBTg+vtNkcmgZdH6FQpa0hFVdnB9bAeqYwKkyqP15zaPe6jfC+qL2y/cIeC7ASvHXEKrnCZgBLxfVQ9w==}
     engines: {node: '>=10'}
     cpu: [x64]
     os: [darwin]
@@ -1032,8 +1035,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-linux-arm-gnueabihf@1.4.2:
+  /@swc/core-linux-arm-gnueabihf@1.4.6:
-    resolution: {integrity: sha512-Eyqipf7ZPGj0vplKHo8JUOoU1un2sg5PjJMpEesX0k+6HKE2T8pdyeyXODN0YTFqzndSa/J43EEPXm+rHAsLFQ==}
+    resolution: {integrity: sha512-hEmYcB/9XBAl02MtuVHszhNjQpjBzhk/NFulnU33tBMbNZpy2TN5yTsitezMq090QXdDz8sKIALApDyg07ZR8g==}
     engines: {node: '>=10'}
     cpu: [arm]
     os: [linux]
@@ -1041,8 +1044,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-linux-arm64-gnu@1.4.2:
+  /@swc/core-linux-arm64-gnu@1.4.6:
-    resolution: {integrity: sha512-wZn02DH8VYPv3FC0ub4my52Rttsus/rFw+UUfzdb3tHMHXB66LqN+rR0ssIOZrH6K+VLN6qpTw9VizjyoH0BxA==}
+    resolution: {integrity: sha512-/UCYIVoGpm2YVvGHZM2QOA3dexa28BjcpLAIYnoCbgH5f7ulDhE8FAIO/9pasj+kixDBsdqewHfsNXFYlgGJjQ==}
     engines: {node: '>=10'}
     cpu: [arm64]
     os: [linux]
@@ -1050,8 +1053,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-linux-arm64-musl@1.4.2:
+  /@swc/core-linux-arm64-musl@1.4.6:
-    resolution: {integrity: sha512-3G0D5z9hUj9bXNcwmA1eGiFTwe5rWkuL3DsoviTj73TKLpk7u64ND0XjEfO0huVv4vVu9H1jodrKb7nvln/dlw==}
+    resolution: {integrity: sha512-LGQsKJ8MA9zZ8xHCkbGkcPSmpkZL2O7drvwsGKynyCttHhpwVjj9lguhD4DWU3+FWIsjvho5Vu0Ggei8OYi/Lw==}
     engines: {node: '>=10'}
     cpu: [arm64]
     os: [linux]
@@ -1059,8 +1062,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-linux-x64-gnu@1.4.2:
+  /@swc/core-linux-x64-gnu@1.4.6:
-    resolution: {integrity: sha512-LFxn9U8cjmYHw3jrdPNqPAkBGglKE3tCZ8rA7hYyp0BFxuo7L2ZcEnPm4RFpmSCCsExFH+LEJWuMGgWERoktvg==}
+    resolution: {integrity: sha512-10JL2nLIreMQDKvq2TECnQe5fCuoqBHu1yW8aChqgHUyg9d7gfZX/kppUsuimqcgRBnS0AjTDAA+JF6UsG/2Yg==}
     engines: {node: '>=10'}
     cpu: [x64]
     os: [linux]
@@ -1068,8 +1071,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-linux-x64-musl@1.4.2:
+  /@swc/core-linux-x64-musl@1.4.6:
-    resolution: {integrity: sha512-dp0fAmreeVVYTUcb4u9njTPrYzKnbIH0EhH2qvC9GOYNNREUu2GezSIDgonjOXkHiTCvopG4xU7y56XtXj4VrQ==}
+    resolution: {integrity: sha512-EGyjFVzVY6Do89x8sfah7I3cuP4MwtwzmA6OlfD/KASqfCFf5eIaEBMbajgR41bVfMV7lK72lwAIea5xEyq1AQ==}
     engines: {node: '>=10'}
     cpu: [x64]
     os: [linux]
@@ -1077,8 +1080,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-win32-arm64-msvc@1.4.2:
+  /@swc/core-win32-arm64-msvc@1.4.6:
-    resolution: {integrity: sha512-HlVIiLMQkzthAdqMslQhDkoXJ5+AOLUSTV6fm6shFKZKqc/9cJvr4S8UveNERL9zUficA36yM3bbfo36McwnvQ==}
+    resolution: {integrity: sha512-gfW9AuXvwSyK07Vb8Y8E9m2oJZk21WqcD+X4BZhkbKB0TCZK0zk1j/HpS2UFlr1JB2zPKPpSWLU3ll0GEHRG2A==}
     engines: {node: '>=10'}
     cpu: [arm64]
     os: [win32]
@@ -1086,8 +1089,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-win32-ia32-msvc@1.4.2:
+  /@swc/core-win32-ia32-msvc@1.4.6:
-    resolution: {integrity: sha512-WCF8faPGjCl4oIgugkp+kL9nl3nUATlzKXCEGFowMEmVVCFM0GsqlmGdPp1pjZoWc9tpYanoXQDnp5IvlDSLhA==}
+    resolution: {integrity: sha512-ZuQm81FhhvNVYtVb9GfZ+Du6e7fZlkisWvuCeBeRiyseNt1tcrQ8J3V67jD2nxje8CVXrwG3oUIbPcybv2rxfQ==}
     engines: {node: '>=10'}
     cpu: [ia32]
     os: [win32]
@@ -1095,8 +1098,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core-win32-x64-msvc@1.4.2:
+  /@swc/core-win32-x64-msvc@1.4.6:
-    resolution: {integrity: sha512-oV71rwiSpA5xre2C5570BhCsg1HF97SNLsZ/12xv7zayGzqr3yvFALFJN8tHKpqUdCB4FGPjoP3JFdV3i+1wUw==}
+    resolution: {integrity: sha512-UagPb7w5V0uzWSjrXwOavGa7s9iv3wrVdEgWy+/inm0OwY4lj3zpK9qDnMWAwYLuFwkI3UG4Q3dH8wD+CUUcjw==}
     engines: {node: '>=10'}
     cpu: [x64]
     os: [win32]
@@ -1104,8 +1107,8 @@ packages:
     dev: true
     optional: true
 
-  /@swc/core@1.4.2:
+  /@swc/core@1.4.6:
-    resolution: {integrity: sha512-vWgY07R/eqj1/a0vsRKLI9o9klGZfpLNOVEnrv4nrccxBgYPjcf22IWwAoaBJ+wpA7Q4fVjCUM8lP0m01dpxcg==}
+    resolution: {integrity: sha512-A7iK9+1qzTCIuc3IYcS8gPHCm9bZVKUJrfNnwveZYyo6OFp3jLno4WOM2yBy5uqedgYATEiWgBYHKq37KrU6IA==}
     engines: {node: '>=10'}
     requiresBuild: true
     peerDependencies:
@@ -1117,16 +1120,16 @@ packages:
       '@swc/counter': 0.1.3
       '@swc/types': 0.1.5
     optionalDependencies:
-      '@swc/core-darwin-arm64': 1.4.2
+      '@swc/core-darwin-arm64': 1.4.6
-      '@swc/core-darwin-x64': 1.4.2
+      '@swc/core-darwin-x64': 1.4.6
-      '@swc/core-linux-arm-gnueabihf': 1.4.2
+      '@swc/core-linux-arm-gnueabihf': 1.4.6
-      '@swc/core-linux-arm64-gnu': 1.4.2
+      '@swc/core-linux-arm64-gnu': 1.4.6
-      '@swc/core-linux-arm64-musl': 1.4.2
+      '@swc/core-linux-arm64-musl': 1.4.6
-      '@swc/core-linux-x64-gnu': 1.4.2
+      '@swc/core-linux-x64-gnu': 1.4.6
-      '@swc/core-linux-x64-musl': 1.4.2
+      '@swc/core-linux-x64-musl': 1.4.6
-      '@swc/core-win32-arm64-msvc': 1.4.2
+      '@swc/core-win32-arm64-msvc': 1.4.6
-      '@swc/core-win32-ia32-msvc': 1.4.2
+      '@swc/core-win32-ia32-msvc': 1.4.6
-      '@swc/core-win32-x64-msvc': 1.4.2
+      '@swc/core-win32-x64-msvc': 1.4.6
     dev: true
 
   /@swc/counter@0.1.3:
@@ -1192,8 +1195,8 @@ packages:
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
     hasBin: true
     dependencies:
-      caniuse-lite: 1.0.30001591
+      caniuse-lite: 1.0.30001596
-      electron-to-chromium: 1.4.685
+      electron-to-chromium: 1.4.699
       node-releases: 2.0.14
       update-browserslist-db: 1.0.13(browserslist@4.23.0)
     dev: true
@@ -1203,8 +1206,8 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
-  /caniuse-lite@1.0.30001591:
+  /caniuse-lite@1.0.30001596:
-    resolution: {integrity: sha512-PCzRMei/vXjJyL5mJtzNiUCKP59dm8Apqc3PH8gJkMnMXZGox93RbE76jHsmLwmIo6/3nsYIpJtx0O7u5PqFuQ==}
+    resolution: {integrity: sha512-zpkZ+kEr6We7w63ORkoJ2pOfBwBkY/bJrG/UZ90qNb45Isblu8wzDgevEOrRL1r9dWayHjYiiyCMEXPn4DweGQ==}
     dev: true
 
   /chalk@2.4.2:
@@ -1260,7 +1263,7 @@ packages:
     engines: {node: '>= 10'}
     dev: true
 
-  /cosmiconfig@8.3.6(typescript@5.3.3):
+  /cosmiconfig@8.3.6(typescript@5.4.2):
     resolution: {integrity: sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==}
     engines: {node: '>=14'}
     peerDependencies:
@@ -1273,7 +1276,7 @@ packages:
       js-yaml: 4.1.0
       parse-json: 5.2.0
       path-type: 4.0.0
-      typescript: 5.3.3
+      typescript: 5.4.2
     dev: true
 
   /css-select@4.3.0:
@@ -1353,8 +1356,8 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
-  /electron-to-chromium@1.4.685:
+  /electron-to-chromium@1.4.699:
-    resolution: {integrity: sha512-yDYeobbTEe4TNooEzOQO6xFqg9XnAkVy2Lod1C1B2it8u47JNLYvl9nLDWBamqUakWB8Jc1hhS1uHUNYTNQdfw==}
+    resolution: {integrity: sha512-I7q3BbQi6e4tJJN5CRcyvxhK0iJb34TV8eJQcgh+fR2fQ8miMgZcEInckCo1U9exDHbfz7DLDnFn8oqH/VcRKw==}
     dev: true
 
   /entities@2.2.0:
@@ -1411,7 +1414,7 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
-  /htmlnano@2.1.0(svgo@2.8.0)(typescript@5.3.3):
+  /htmlnano@2.1.0(svgo@2.8.0)(typescript@5.4.2):
     resolution: {integrity: sha512-jVGRE0Ep9byMBKEu0Vxgl8dhXYOUk0iNQ2pjsG+BcRB0u0oDF5A9p/iBGMg/PGKYUyMD0OAGu8dVT5Lzj8S58g==}
     peerDependencies:
       cssnano: ^6.0.0
@@ -1440,7 +1443,7 @@ packages:
       uncss:
         optional: true
     dependencies:
-      cosmiconfig: 8.3.6(typescript@5.3.3)
+      cosmiconfig: 8.3.6(typescript@5.4.2)
       posthtml: 0.16.6
       svgo: 2.8.0
       timsort: 0.3.0
@@ -1700,6 +1703,10 @@ packages:
     resolution: {integrity: sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==}
     dev: true
 
+  /normalize.css@8.0.1:
+    resolution: {integrity: sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==}
+    dev: false
+
   /nth-check@2.1.1:
     resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
     dependencies:
@@ -1714,12 +1721,12 @@ packages:
     resolution: {integrity: sha512-5VyHfHY3cd0iza71JepYG50My+YUbrFtGoUz2ooEydPyPM7Aai/JW098juLr+RG6+rDJuzNNTsEQu2DZa1A41A==}
     dev: true
 
-  /parcel@2.12.0(typescript@5.3.3):
+  /parcel@2.12.0(typescript@5.4.2):
     resolution: {integrity: sha512-W+gxAq7aQ9dJIg/XLKGcRT0cvnStFAQHPaI0pvD0U2l6IVLueUAm3nwN7lkY62zZNmlvNx6jNtE4wlbS+CyqSg==}
     engines: {node: '>= 12.0.0'}
     hasBin: true
     dependencies:
-      '@parcel/config-default': 2.12.0(@parcel/core@2.12.0)(typescript@5.3.3)
+      '@parcel/config-default': 2.12.0(@parcel/core@2.12.0)(typescript@5.4.2)
       '@parcel/core': 2.12.0
       '@parcel/diagnostic': 2.12.0
       '@parcel/events': 2.12.0
@@ -1907,8 +1914,8 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /typescript@5.3.3:
+  /typescript@5.4.2:
-    resolution: {integrity: sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==}
+    resolution: {integrity: sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==}
     engines: {node: '>=14.17'}
     hasBin: true
 

src/main.ts

@@ -1,18 +1,17 @@
 import { Lexer } from './parser/Lexer'
 import { Parser } from './parser/Parser'
 import { PathResolver } from './utils/PathResolver';
+import { TextUtils } from './utils/TextUtils';
 import { MainView } from './view/MainView'
 import { CharactersES } from './view/gamemodel/CharactersES';
 import { MapPlacesES } from './view/gamemodel/MapPlacesES';
 
-let rpyscript = '';
+function run(data: string, resourcesDir: string = '/resources/es/'): void {
-
-function run(data: string): void {
     const tokens = new Lexer(data).process().getTokens();
     const parser = new Parser(tokens);
-    const view = new MainView(rpyscript === 'userscenario');
+    const view = new MainView(window['rpyscript'] === 'userscenario');
     view.init(parser,
-        new PathResolver('/resources/es/'),
+        new PathResolver(resourcesDir),
         new MapPlacesES(),
         new CharactersES());
     parser.setView(view);
@@ -20,13 +19,22 @@ function run(data: string): void {
 }
 
 document.addEventListener('DOMContentLoaded', function() {
-    run(`
+    if (typeof(window['rpyscript']) === 'undefined' || TextUtils.isEmpty(window['rpyscript'])) {
-        scene cg d6_un_evening_1 with dissolve
+        window['rpyscript'] = 'undefined';
-        play music music_list["lets_be_friends"]
+        run('play music music_list["everlasting_summer"]\n' +
-        "Scene 1"
+            'scene bg ext_square_day\n' +
-        scene bg int_house_of_un_day with dissolve
+            'show mz smile pioneer far at fright\n' +
-        "Scene 2"
+            'show us grin sport far at fleft\n' +
-        scene bg intro_xx with dspr
+            'show mt smile pioneer far at right\n' +
-        "Scene 3"
+            'show mi smile pioneer far at left\n' +
-    `);
+            'show dv smile pioneer2 at cright\n' +
+            'show sl smile pioneer at cleft\n' +
+            'show un smile2 pioneer at center\n' +
+            'all "Приглашаем тебя в Бесконечное Лето!"');
+    } else {
+        const scriptDir = (typeof window['userscenario'] !== 'undefined') ? "userscenarios" : "scripts";
+        fetch("/resources/es/" + scriptDir + "/" + window['rpyscript'] + ".rpy")
+            .then(res => res.text())
+            .then(run);
+    }
 });

src/view/MainView.ts

@@ -21,6 +21,7 @@ export class MainView implements ViewModel {
     private readonly elWindow = document.getElementById('window');
     private readonly elTextAuthor = document.getElementById('textAuthor');
     private readonly elTextContent = document.getElementById('textContent');
+    private readonly elBackground = document.getElementById('background');
     private readonly elBackground1 = document.getElementById('background1');
     private readonly elBackground2 = document.getElementById('background2');
     private readonly elMenu = document.getElementById('menu');
@@ -69,7 +70,7 @@ export class MainView implements ViewModel {
         characters.init();
         this.elMenu.style.display = 'none';
         document.getElementById('mainMenuButton').onclick = (e) => this.showMainMenu();
-        document.getElementById('background').onclick = (e) => this.onTouch(e);
+        this.elBackground.onclick = (e) => this.onTouch(e);
         this.nextCommandRunnable = () => {
             this.blockTap = false;
             if (!this.cancelNextStep) navigable.next();
@@ -180,7 +181,7 @@ export class MainView implements ViewModel {
         this.elBackground1.style.display = 'none';
         this.elBackground2.style.background = background;
         this.elBackground2.style.backgroundSize = 'cover';
-        this.elBackground1.style.display = 'block';
+        this.elBackground2.style.display = 'block';
         this.pause(animationTime, false);
     }
     
@@ -191,7 +192,7 @@ export class MainView implements ViewModel {
             img = this.spriteInContainer[key];
         } else {
             // TODO
-            const height = document.getElementById('background').getBoundingClientRect().height;
+            const height = this.elBackground.getBoundingClientRect().height;
             img = document.createElement('img');
             img.className = 'sprite';
             img.style.height = height + 'px';
@@ -246,7 +247,7 @@ export class MainView implements ViewModel {
     }
 
     private setSpritePosition(img: HTMLImageElement, position: string): void {
-        const width = document.getElementById('background').getBoundingClientRect().width;
+        const width = this.elBackground.getBoundingClientRect().width;
         const imgWidth = img.offsetWidth;
         if (TextUtils.isEmpty(position) || position === "center") {
             img.style.right = "auto";