Commit ad600ed2 authored by Matěj Lang's avatar Matěj Lang
Browse files

Drag snow height marker.

parent 5fc2c005

src/components/image-dialog/ImageDetail.vue

+0 −3
Original line number Diff line number Diff line
@@ -14,9 +14,6 @@ 
      :showSnowMarker="showSnowMarkers"

      :showLabel="showLabels"

    />

    <g>

      <rect x="100" y="100" width="100" height="100" />

    </g>

  </svg>

</template>

src/components/image-dialog/StickDetail.vue

+31 −8
Original line number Diff line number Diff line
@@ -221,6 +221,24 @@ export default { 
        })

      }

    },

    snowHeight: {

      get() {

        return this.$store.getters.snowHeight(

          this.cameraID,

          this.stickID,

          this.imageName

        )

      },

      set(value) {

        this.$store.dispatch('setStickSnowHeight', {

          cameraID: this.cameraID,

          imageName: this.imageName,

          stickID: this.stickID,

          snowHeight: value,

          sendDataToServer: false

        })

      }

    },



    deltaX() {

      return this.pointBottom.x - this.pointTop.x
@@ -243,7 +261,7 @@ export default { 
        ((this.pointTop.y - this.pointBottom.y) * this.snowHeight) /

          this.stickLengthCm +

        this.pointBottom.y

      return { x: x, y: y }

      return { x, y }

    },



    // --- Vuex getters ---
@@ -260,13 +278,6 @@ export default { 
    stickLabel() {

      return this.$store.getters.stickViewLabel(this.stickID, this.cameraID)

    },

    snowHeight() {

      return this.$store.getters.snowHeight(

        this.cameraID,

        this.stickID,

        this.imageName

      )

    },

    stickLengthCm() {

      return this.$store.getters.stickLengthCm(this.stickID)

    }
@@ -323,6 +334,17 @@ export default { 
      this.pointBottom = { x: xBottom, y: yBottom }

      this.setLabelBBox()

    },

    dragMarker(event) {

      const newSnowHeight =

        this.snowHeight - (event.dy * this.stickLengthCm) / this.length

      if (newSnowHeight < 0) {

        this.snowHeight = 0

      } else if (newSnowHeight > this.stickLengthCm) {

        this.snowHeight = this.stickLengthCm

      } else {

        this.snowHeight = newSnowHeight

      }

    },



    setActiveStick() {

      this.$store.dispatch('setActivePoint', {
@@ -417,6 +439,7 @@ export default { 
      })



    this.$snowMarker

      .call(d3.drag().on('drag', this.dragMarker))

      .on('mouseover', () => {

        this.$snowMarker.classed('select-full', true)

      })