Plugin v2.0 (#30)

.github/workflows/release.yml

@@ -1,21 +1,26 @@
 name: Release mapgl-gltf
 
 on:
-  release:
-    types: [created]
+    release:
+        types: [created]
 
 jobs:
-
-  release-mapgl-gltf:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
-        with:
-          node-version: 16
-          registry-url: https://registry.npmjs.org/
-      - run: npm ci
-      - run: npm run build
-      - run: npm publish --access public
-        env:
-          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
+    release-mapgl-gltf:
+        runs-on: ubuntu-latest
+        steps:
+            - uses: actions/checkout@v3
+            - uses: actions/setup-node@v3
+              with:
+                  node-version: 16
+                  registry-url: https://registry.npmjs.org/
+            - run: npm ci
+            - run: npm run build
+            - run: echo $GITHUB_REF_NAME
+            - run: |
+                  if [[ $GITHUB_REF_NAME == v1.* ]]; then
+                    npm publish --access public --tag ver.1
+                  else
+                    npm publish --access public
+                  fi
+              env:
+                  NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}

README.md

@@ -35,18 +35,6 @@ plugin.addModels([{
 }]);
 ```
 
-## Release
-
-1. Update the package version by running `npm version patch|minor|major`. This command returns a new package version. Let assume it's 1.2.3
-1. Push changes to github and merge them to the «master» branch
-1. Go to https://github.com/2gis/mapgl-gltf/releases/new
-1. Click the «Choose tag» button and create a new tag according to the version in package.json, for example v1.2.3
-1. Make sure the release target is the «master» branch
-1. Paste the release tag into the «Release title» field, for example v1.2.3
-1. Add a release description
-1. Click the «Publish release» button
-1. Go to https://github.com/2gis/mapgl-gltf/actions and wait for completing the release workflow
-
 ## Testing
 
 If you write screenshot tests, you will need run `npm run docker:test` after coding.
@@ -55,4 +43,4 @@ This guarantees the authenticity of the screenshots used.
 
 ## Documentation
 
-You can find the more information in the official [documentation](https://docs.2gis.com/en/mapgl/immersive/gltf-plugin).
+You can find the more information in the official [documentation](https://docs.2gis.com/en/mapgl/immersive/gltf2-plugin).

RELEASE.md

@@ -0,0 +1,28 @@
+## Release v2
+
+**All changes have to be made on «master» branch.**
+
+1. Update the package version by running `npm version patch|minor`. This command returns a new package version. Let assume it's 2.3.4
+1. Push changes to github and merge them to the «master» branch
+1. Go to https://github.com/2gis/mapgl-gltf/releases/new
+1. Click the «Choose tag» button and create a new tag according to the version in package.json, for example v2.3.4
+1. Make sure the release target is the «master» branch
+1. Paste the release tag into the «Release title» field, for example v2.3.4
+1. Add a release description
+1. Click the «Publish release» button
+1. Go to https://github.com/2gis/mapgl-gltf/actions and wait for completing the release workflow
+
+## Release v1
+
+**All changes have to be made on «plugin-v1» branch.**
+
+1. Update the package version by running `npm version patch|minor`. This command returns a new package version. Let assume it's 1.2.3
+1. Push changes to github and merge them to the «plugin-v1» branch
+1. Go to https://github.com/2gis/mapgl-gltf/releases/new
+1. Click the «Choose tag» button and create a new tag according to the version in package.json, for example v1.2.3
+1. Make sure the release target is the «plugin-v1» branch
+1. Paste the release tag into the «Release title» field, for example v1.2.3
+1. Add a release description
+1. Unset the «Set as the latest release» checkbox because version 1 release can't be the latest
+1. Click the «Publish release» button
+1. Go to https://github.com/2gis/mapgl-gltf/actions and wait for completing the release workflow

demo/index.html

@@ -6,31 +6,16 @@
         <link rel="icon" href="data:;base64,iVBORw0KGgo=" />
         <style>
             html,
-            body {
-                height: 100%;
-                margin: 0;
-                padding: 0;
-            }
-
-            body {
-                padding: 12px;
-            }
-
+            body,
             #container {
-                height: 400px;
-                width: 800px;
-            }
-
-            #stats {
-                background-color: rgba(255, 255, 255, 0.8);
-                max-width: 100%;
-                overflow-y: auto;
+                margin: 0;
+                width: 100%;
+                height: 100%;
+                overflow: hidden;
             }
         </style>
     </head>
     <body>
         <div id="container"></div>
-        <h2>Stats</h2>
-        <div id="stats"></div>
     </body>
 </html>

demo/index.ts

@@ -10,7 +10,7 @@ async function start() {
 
     const map = new mapglAPI.Map('container', {
         center: [47.245286302641034, 56.134743473834099],
-        zoom: 17.9,
+        zoom: 18.9,
         key: 'cb20c5bf-34d3-4f0e-9b2b-33e9b8edb57f',
         pitch: 45,
         rotation: 330,
@@ -22,20 +22,11 @@ async function start() {
     const plugin = new GltfPlugin(map, {
         modelsLoadStrategy: 'dontWaitAll',
         modelsBaseUrl: 'https://disk.2gis.com/digital-twin/models_s3/realty_ads/zgktechnology/',
-        dracoScriptsUrl: 'libs/draco/',
         floorsControl: { position: 'centerRight' },
-        poiConfig: {
-            primary: {
-                fontSize: 14,
-            },
-            secondary: {
-                fontSize: 14,
-            },
+        hoverOptions: {
+            color: '#FFF3F3',
         },
-        hoverHighlight: {
-            intencity: 0.1,
-        },
-        groundCoveringColor: 'rgba(233, 232, 220, 0.8)',
+        groundCoveringColor: 'rgba(0, 0, 0, 0.8)',
     });
 
     (window as any).gltfPlugin = plugin;
@@ -46,8 +37,7 @@ async function start() {
     })
         .getContainer()
         .addEventListener('click', () => {
-            plugin.removeRealtyScene();
-            plugin.addRealtyScene(REALTY_SCENE, { modelId: '03a234cb', floorId: '235034' });
+            plugin.addRealtyScene(REALTY_SCENE);
         });
 
     new mapglAPI.Control(map, '<button>Remove Scene</button>', {
@@ -63,8 +53,9 @@ async function start() {
     })
         .getContainer()
         .addEventListener('click', () => {
-            plugin.removeRealtyScene();
-            plugin.addRealtyScene(REALTY_SCENE_1, { modelId: 'ds321ba234cb' });
+            plugin.addRealtyScene(REALTY_SCENE_1, {
+                buildingId: 'ds321ba234cb',
+            });
         });
 
     new mapglAPI.Control(map, '<button>Remove Scene 1</button>', {
@@ -75,6 +66,22 @@ async function start() {
             plugin.removeRealtyScene();
         });
 
+    new mapglAPI.Control(map, '<button>Hide Any Scene</button>', {
+        position: 'topLeft',
+    })
+        .getContainer()
+        .addEventListener('click', () => {
+            plugin.hideRealtyScene();
+        });
+
+    new mapglAPI.Control(map, '<button>Show Any Scene</button>', {
+        position: 'topLeft',
+    })
+        .getContainer()
+        .addEventListener('click', () => {
+            plugin.showRealtyScene();
+        });
+
     new mapglAPI.Control(map, '<button>Add Model</button>', {
         position: 'topLeft',
     })
@@ -125,22 +132,6 @@ async function start() {
             console.log(e);
         });
     });
-
-    const statsTable = document.getElementById('stats');
-
-    const printStats = () => {
-        if (!statsTable) {
-            return;
-        }
-        statsTable.innerHTML = `<pre>${JSON.stringify(
-            plugin.getModelRendererInfo(),
-            null,
-            2,
-        )}</pre>`;
-
-        requestAnimationFrame(printStats);
-    };
-    requestAnimationFrame(printStats);
 }
 
 start();