From 50129d36a9af8c85b842afb2b1994cf5aa5e569c Mon Sep 17 00:00:00 2001 From: Val Erastov Date: Thu, 13 Dec 2018 20:59:51 -0800 Subject: [PATCH] color code points to accommodate OperationHistory view --- modules/renders/ColorDot.jsx | 8 +++++ modules/renders/index.js | 35 ++++++++++++++----- .../cad/craft/datum/DatumParamsRenderer.jsx | 9 +++++ .../datum/create/createDatumOperation.js | 6 ++-- .../craft/datum/move/moveDatumOperation.js | 6 ++-- web/app/cad/craft/ui/OperationHistory.jsx | 4 +-- web/app/cad/craft/ui/OperationHistory.less | 4 +++ 7 files changed, 58 insertions(+), 14 deletions(-) create mode 100644 modules/renders/ColorDot.jsx create mode 100644 web/app/cad/craft/datum/DatumParamsRenderer.jsx diff --git a/modules/renders/ColorDot.jsx b/modules/renders/ColorDot.jsx new file mode 100644 index 00000000..fd689f35 --- /dev/null +++ b/modules/renders/ColorDot.jsx @@ -0,0 +1,8 @@ +import React from 'react'; + +export default function ColorDot({color}) { + return ◉; +} \ No newline at end of file diff --git a/modules/renders/index.js b/modules/renders/index.js index 87251e9e..52f85e54 100644 --- a/modules/renders/index.js +++ b/modules/renders/index.js @@ -1,16 +1,35 @@ -const renderXZY = (x, y, z) => `[${x}, ${y}, ${z}]`; +const colorCode = (x, y, z) => '#' + hex(x) + hex(y) + hex(z); -export function renderPoint(point) { - if (arguments.length > 1) { - let [x, y, z] = arguments; - return renderXZY(x, y, z); - } else if (Array.isArray(point)) { +const renderText = (x, y, z) => `[${x}, ${y}, ${z}]`; + +export function pointAsColor(point) { + return renderPointImpl(point, colorCode); +} + +export function pointAsText(point) { + return renderPointImpl(point, renderText); +} + +export function renderPointImpl(point, renderer) { + if (Array.isArray(point)) { let [x, y, z] = point; - return renderXZY(x, y, z); + return renderer(x, y, z); } else { let {x, y, z} = point; - return renderXZY(x, y, z); + return renderer(x, y, z); } } +function toInt(num) { + return Math.round(parseFloat(num) || 0); +} + +const hex = v => { + let r = toInt(v) % 255; + let s = r.toString(16); + if (s.length === 1) { + s = '0' + s; + } + return s; +}; \ No newline at end of file diff --git a/web/app/cad/craft/datum/DatumParamsRenderer.jsx b/web/app/cad/craft/datum/DatumParamsRenderer.jsx new file mode 100644 index 00000000..daf7911a --- /dev/null +++ b/web/app/cad/craft/datum/DatumParamsRenderer.jsx @@ -0,0 +1,9 @@ +import React from 'react'; +import {pointAsColor} from 'renders'; +import ColorDot from 'renders/ColorDot'; + + +export function DatumParamsRenderer({params}) { + const color = pointAsColor(params); + return +} \ No newline at end of file diff --git a/web/app/cad/craft/datum/create/createDatumOperation.js b/web/app/cad/craft/datum/create/createDatumOperation.js index e851f614..dcd8ecc4 100644 --- a/web/app/cad/craft/datum/create/createDatumOperation.js +++ b/web/app/cad/craft/datum/create/createDatumOperation.js @@ -1,11 +1,12 @@ import DatumWizard from './CreateDatumWizard'; import schema from './createDatumOpSchema'; -import {renderPoint} from 'renders'; import DatumObject3D from '../datumObject'; import * as SceneGraph from 'scene/sceneGraph'; import CSys from '../../../../math/csys'; import {MDatum} from '../../../model/mdatum'; import {roundInteractiveInput} from '../../wizard/roundUtils'; +import {DatumParamsRenderer} from '../DatumParamsRenderer'; +import {pointAsText} from '../../../../../../modules/renders'; function updateCSys(csys, params, findFace) { csys.move(0, 0, 0); @@ -77,7 +78,8 @@ export default { label: 'Create Datum', icon: 'img/cad/plane', info: 'originates a new datum from origin or off of a selected face', - paramsInfo: renderPoint, + paramsInfoComponent: DatumParamsRenderer, + paramsInfo: pointAsText, previewer, run: create, form: DatumWizard, diff --git a/web/app/cad/craft/datum/move/moveDatumOperation.js b/web/app/cad/craft/datum/move/moveDatumOperation.js index 2ece2a54..145701ee 100644 --- a/web/app/cad/craft/datum/move/moveDatumOperation.js +++ b/web/app/cad/craft/datum/move/moveDatumOperation.js @@ -1,9 +1,10 @@ import schema from './moveDatumOpSchema'; -import {renderPoint} from 'renders'; import {MDatum} from '../../../model/mdatum'; import MoveDatumWizard from './MoveDatumWizard'; import {roundInteractiveInput} from '../../wizard/roundUtils'; import {EMPTY_ARRAY} from '../../../../../../modules/gems/iterables'; +import {pointAsText} from '../../../../../../modules/renders'; +import {DatumParamsRenderer} from '../DatumParamsRenderer'; function move(params, {cadRegistry}) { @@ -66,7 +67,8 @@ export default { label: 'Move Datum', icon: 'img/cad/plane', info: 'moves a datum', - paramsInfo: renderPoint, + paramsInfoComponent: DatumParamsRenderer, + paramsInfo: pointAsText, previewer, run: move, form: MoveDatumWizard, diff --git a/web/app/cad/craft/ui/OperationHistory.jsx b/web/app/cad/craft/ui/OperationHistory.jsx index 04458c3f..ff916563 100644 --- a/web/app/cad/craft/ui/OperationHistory.jsx +++ b/web/app/cad/craft/ui/OperationHistory.jsx @@ -18,11 +18,11 @@ function OperationHistory({history, pointer, setHistoryPointer, remove, getOpera {history.map(({type, params}, index) => { - let {appearance, paramsInfo} = getOperation(type)||EMPTY_OBJECT; + let {appearance, label, paramsInfo, paramsInfoComponent: PIComp} = getOperation(type)||EMPTY_OBJECT; return
setHistoryPointer(index - 1)} className={cx(ls.item, pointer + 1 === index && ls.selected)}> {appearance && } - {type} {paramsInfo && paramsInfo(params)} + {label} {PIComp ? : (paramsInfo && paramsInfo(params))} diff --git a/web/app/cad/craft/ui/OperationHistory.less b/web/app/cad/craft/ui/OperationHistory.less index 9644ff83..50419765 100644 --- a/web/app/cad/craft/ui/OperationHistory.less +++ b/web/app/cad/craft/ui/OperationHistory.less @@ -30,3 +30,7 @@ .buttons > i:hover { color: yellowgreen; } + +.opLabel { + text-transform: uppercase; +} \ No newline at end of file