npm - @operato/scene-compass - Versions diffs - 8.0.0-beta.1 → 8.0.0 - Mend

@operato/scene-compass 8.0.0-beta.1 → 8.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/package.json +5 -5
package/CHANGELOG.md +0 -816
package/demo/index.html +0 -91
package/demo/things-scene-compass.html +0 -5
package/src/compass.ts +0 -139
package/src/index.ts +0 -4
package/test/basic-test.html +0 -67
package/test/index.html +0 -22
package/tsconfig.json +0 -23
package/tsconfig.tsbuildinfo +0 -1

package/demo/index.html DELETED Viewed

@@ -1,91 +0,0 @@
-<!doctype html>
-<!--
-@license
-Copyright © HatioLab Inc. All rights reserved.
--->
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-    <title>things-scene-compass Demo</title>
-    <script src="../../webcomponentsjs/webcomponents-lite.min.js"></script>
-    <link rel="import" href="../../things-scene-viewer/things-scene-viewer.html">
-    <link rel="import" href="../../things-scene-viewer/things-scene-layer.html">
-    <link rel="import" href="../../things-scene-viewer/things-scene-handler.html">
-    <link rel="import" href="../../things-designer-elements/things-editor-color.html">
-    <link rel="import" href="../../things-designer-elements/things-editor-color-stops.html">
-    <link rel="import" href="../../things-scene-modeler/things-scene-properties.html">
-    <link rel="import" href="./things-scene-compass.html">
-    <style is="custom-style">
-    @font-face {
-      font-family: "Bitstream Vera Serif Bold";
-      src: url("fonts/VeraSeBd.ttf");
-    }
-    things-scene-viewer {
-      display: block;
-      width: 640px;
-      height: 480px;
-    }
-    </style>
-  </head>
-  <body unresolved>
-    <template is="dom-bind" id="app">
-      <p>An example of <code>&lt;things-scene-compass&gt;</code>:</p>
-      <things-scene-viewer id='scene'
-                           scene='{{scene}}'
-                           selected='{{selected}}'
-                           model='[[model]]'
-                           mode="1">
-        <things-scene-layer type="selection-layer"></things-scene-layer>
-        <things-scene-layer type="modeling-layer"></things-scene-layer>
-        <things-scene-handler type="text-editor"></things-scene-handler>
-        <things-scene-handler type="move-handler"></things-scene-handler>
-      </things-scene-viewer>
-      <things-scene-properties scene="[[scene]]"
-                               selected="[[selected]]"
-                               model="{{target}}"
-                               bounds="{{bounds}}">
-        <fieldset>
-          <legend>compass style</legend>
-          <label>value</label>
-          <input type="number" value-as-number="{{target.value::change}}" min="0" max="100" step="1"/>
-        </fieldset>
-      </things-scene-properties>
-    </template>
-    <script>
-      window.addEventListener('WebComponentsReady', function(e) {
-        var app = document.querySelector('#app')
-        app.model = {
-          fillStyle: '#0EB22A',
-          width: 1500,
-          height: 1000,
-          components: [{
-            type: 'compass',
-            cx: 600,
-            cy: 400,
-            rx: 300,
-            ry: 300,
-            value: 0,
-            fontSize: 80,
-            fillStyle: '#F2F2F2',
-            strokeStyle: '#AAAAAA',
-            lineWidth: 10,
-            fontColor: '#ff0000',
-          }]
-        }
-      });
-    </script>
-  </body>
-</html>

package/demo/things-scene-compass.html DELETED Viewed

@@ -1,5 +0,0 @@
-<!--
-@license
-Copyright © HatioLab Inc. All rights reserved.
--->
-<script src="../things-scene-compass.js"></script>

package/src/compass.ts DELETED Viewed

@@ -1,139 +0,0 @@
-/*
- * Copyright © HatioLab Inc. All rights reserved.
- */
-import { Component, ComponentNature, Ellipse, Properties } from '@hatiolab/things-scene'
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [
-    {
-      type: 'number',
-      label: 'value',
-      name: 'value',
-      property: 'value'
-    }
-  ],
-  help: 'scene/component/compass'
-}
-export default class Compass extends Ellipse {
-  private _anim_alpha: number = 0
-  is3dish() {
-    return false
-  }
-  render(context: CanvasRenderingContext2D) {
-    var { value = 0, fillStyle, cx, cy, rx, ry } = this.state
-    context.translate(cx, cy)
-    ////  메인 원 그리기  ////
-    context.beginPath()
-    context.ellipse(0, 0, Math.abs(rx), Math.abs(ry), 0, 0, 2 * Math.PI)
-    context.ellipse(0, 0, Math.abs(rx * 0.75), Math.abs(ry * 0.75), 0, 2 * Math.PI, 0, true) // 반대로 그리며 원을 지움.
-    this.drawStroke(context)
-    this.drawFill(context)
-    context.closePath()
-    ////  무늬 그리기  ////
-    context.beginPath()
-    context.moveTo(rx * 0.65, 0)
-    context.lineTo(0, ry * 0.09)
-    context.lineTo(-rx * 0.65, 0)
-    context.lineTo(0, -ry * 0.09)
-    context.moveTo(0, ry * 0.65)
-    context.lineTo(rx * 0.09, 0)
-    context.lineTo(0, -ry * 0.65)
-    context.lineTo(-rx * 0.09, 0)
-    context.fillStyle = fillStyle
-    context.fill()
-    context.closePath()
-    ////  텍스트 그리기  ////
-    context.beginPath()
-    context.fillStyle = 'black'
-    context.font = (rx + ry) / 13 + 'px arial'
-    context.textBaseline = 'middle'
-    context.textAlign = 'center'
-    context.fillText('N', 0, -ry + ry * 0.125)
-    context.fillText('S', 0, ry - ry * 0.125)
-    context.fillText('W', -rx + rx * 0.125, 0)
-    context.fillText('E', rx - rx * 0.125, 0)
-    ////  바늘 그리기  ////
-    context.beginPath()
-    var ang = ((value + (this._anim_alpha || 0)) / 50) * Math.PI
-    context.rotate(ang)
-    context.moveTo(0, -ry * 0.65)
-    context.lineTo(rx * 0.13, 0)
-    context.lineTo(-rx * 0.13, 0)
-    context.fillStyle = '#F53B3B'
-    context.fill()
-    context.beginPath()
-    context.moveTo(0, ry * 0.65)
-    context.lineTo(rx * 0.13, 0)
-    context.lineTo(-rx * 0.13, 0)
-    context.fillStyle = '#3DC0E8'
-    context.fill()
-    context.rotate(-ang)
-    ////  중앙 원 그리기  ////
-    context.beginPath()
-    context.ellipse(0, 0, Math.abs(rx * 0.15), Math.abs(ry * 0.15), 0, 0, 2 * Math.PI)
-    context.lineWidth = (rx + ry) * 0.013
-    context.strokeStyle = '#FFFFFF'
-    context.fillStyle = '#3DC0E8'
-    context.fill()
-    context.stroke()
-    context.beginPath()
-    context.ellipse(0, 0, Math.abs(rx * 0.06), Math.abs(ry * 0.06), 0, 0, 2 * Math.PI)
-    context.fillStyle = '#FFFFFF'
-    context.fill()
-    context.closePath()
-    context.translate(-cx, -cy)
-  }
-  postrender(context: CanvasRenderingContext2D) {
-    this.drawText(context)
-  }
-  onchange(after: Properties, before: Properties) {
-    if (!after.hasOwnProperty('value')) return
-    var self = this
-    var diff = after.value - before.value
-    this._anim_alpha = -diff
-    this.animate({
-      step: function (delta: number) {
-        self._anim_alpha = diff * (delta - 1)
-        self.invalidate()
-      },
-      duration: 1000,
-      delta: 'elastic',
-      options: {
-        x: 2
-      },
-      ease: 'out'
-    }).start()
-  }
-  get nature() {
-    return NATURE
-  }
-}
-Component.register('compass', Compass)

package/src/index.ts DELETED Viewed

@@ -1,4 +0,0 @@
-/*
- * Copyright © HatioLab Inc. All rights reserved.
- */
- export { default as Compass } from './compass'

package/test/basic-test.html DELETED Viewed

@@ -1,67 +0,0 @@
-<!doctype html>
-<!--
-@license
-Copyright © HatioLab Inc. All rights reserved.
--->
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-    <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
-    <script src="../../web-component-tester/browser.js"></script>
-    <!-- Step 1: import the element to test -->
-    <link rel="import" href="../things-scene-gauge.html">
-  </head>
-  <body>
-    <!-- You can use the document as a place to set up your fixtures. -->
-    <test-fixture id="things-scene-gauge-fixture">
-      <template>
-        <things-scene-gauge>
-          <h2>things-scene-gauge</h2>
-        </things-scene-gauge>
-      </template>
-    </test-fixture>
-    <script>
-      suite('<things-scene-gauge>', function() {
-        var myEl;
-        setup(function() {
-          myEl = fixture('things-scene-gauge-fixture');
-        });
-        test('defines the "author" property', function() {
-          assert.equal(myEl.author.name, 'Dimitri Glazkov');
-          assert.equal(myEl.author.image, 'http://addyosmani.com/blog/wp-content/uploads/2013/04/unicorn.jpg');
-        });
-        test('says hello', function() {
-          assert.equal(myEl.sayHello(), 'things-scene-gauge says, Hello World!');
-          var greetings = myEl.sayHello('greetings Earthlings');
-          assert.equal(greetings, 'things-scene-gauge says, greetings Earthlings');
-        });
-        test('fires lasers', function(done) {
-          myEl.addEventListener('things-scene-gauge-lasers', function(event) {
-            assert.equal(event.detail.sound, 'Pew pew!');
-            done();
-          });
-          myEl.fireLasers();
-        });
-        test('distributed children', function() {
-          var els = myEl.getContentChildren();
-          assert.equal(els.length, 1, 'one distributed node');
-          assert.equal(els[0], myEl.querySelector('h2'), 'content distributed correctly');
-        });
-      });
-    </script>
-  </body>
-</html>

package/test/index.html DELETED Viewed

@@ -1,22 +0,0 @@
-<!doctype html>
-<!--
-@license
-Copyright © HatioLab Inc. All rights reserved.
--->
-<html><head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-    <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
-    <script src="../../web-component-tester/browser.js"></script>
-  </head>
-  <body>
-    <script>
-      // Load and run all tests (.html, .js):
-      WCT.loadSuites([
-        'basic-test.html',
-        'basic-test.html?dom=shadow'
-      ]);
-    </script>
-</body></html>

package/tsconfig.json DELETED Viewed

@@ -1,23 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es2018",
-    "module": "esnext",
-    "moduleResolution": "node",
-    "noEmitOnError": true,
-    "lib": ["es2019", "dom"],
-    "strict": true,
-    "esModuleInterop": false,
-    "allowJs": true,
-    "allowSyntheticDefaultImports": true,
-    "experimentalDecorators": true,
-    "importHelpers": true,
-    "outDir": "dist",
-    "sourceMap": true,
-    "inlineSources": true,
-    "rootDir": "src",
-    "declaration": true,
-    "incremental": true,
-    "skipLibCheck": true
-  },
-  "include": ["**/*.ts", "*.d.ts"]
-}