X-Git-Url: https://osm.etsi.org/gitweb/?p=osm%2FUI.git;a=blobdiff_plain;f=skyquake%2Fplugins%2Fcomposer%2Fsrc%2Fsrc%2Fcomponents%2FCanvasPanelTray.js;h=5fde578af7f8404ca1959d18f33daa37f1244773;hp=57f29a05e12c87cf395c6ff6fc619e7143e63784;hb=refs%2Ftags%2Fv3.0.0rc2;hpb=f2dc2462571800e62cba969964de621dca09299c

diff --git a/skyquake/plugins/composer/src/src/components/CanvasPanelTray.js b/skyquake/plugins/composer/src/src/components/CanvasPanelTray.js
index 57f29a05e..5fde578af 100644
--- a/skyquake/plugins/composer/src/src/components/CanvasPanelTray.js
+++ b/skyquake/plugins/composer/src/src/components/CanvasPanelTray.js
@@ -16,13 +16,17 @@ export default function (props) {
 		right: props.layout.right,
 		display: props.show ? false : 'none'
 	};
+    const PANEL = {
+        FORWARD: 'forwarding',
+        PARAMETER: 'parameter'
+    }
 	const classNames = ClassNames('CanvasPanelTray', {'-with-transitions': !document.body.classList.contains('resizing')});
 	function onClickToggleOpenClose(event) {
 		if (event.defaultPrevented) return;
 		event.preventDefault();
 		// don't toggle if the user was resizing
 		if (!uiTransient.isResizing) {
-			CanvasPanelTrayActions.toggleOpenClose();
+			CanvasPanelTrayActions.toggleOpenClose(event);
 		}
 		event.target.removeEventListener('mousemove', onMouseMove, true);
 	}
@@ -37,10 +41,29 @@ export default function (props) {
 	const isOpen = style.height > 25;
 	return (
 		<div className={classNames} data-resizable="top" data-resizable-handle-offset="4" style={style}>
-			<h1 data-open-close-icon={isOpen ? 'open' : 'closed'} onMouseDownCapture={onMouseDown} onClick={onClickToggleOpenClose}>Forwarding Graphs</h1>
+            <div  className="CanvasPanelTray-buttons" onClick={onClickToggleOpenClose}>
+                <button
+                    style={{flex: '1 1 auto'}}
+                    className={ClassNames({'-selected': props.displayedPanel === PANEL.FORWARD})}
+                    onMouseDownCapture={onMouseDown}
+                    data-event={PANEL.FORWARD}>
+                    Forwarding Graphs
+                </button>
+
+                <button
+                    style={{flex: '1 1 auto', borderLeft: '1px solid white'}}
+                    className={ClassNames({'-selected': props.displayedPanel === PANEL.PARAMETER})}
+                    onMouseDownCapture={onMouseDown}
+                    data-event={PANEL.PARAMETER}>
+                        Config Parameter Map
+                </button>
+                <div  data-open-close-icon={isOpen ? 'open' : 'closed'}  style={{flex: '0 1', width: '40px', height: '25px', cursor: 'pointer'}} data-event='arrow'>
+
+                </div>
+            </div>
 			<div className="tray-body">
 				{props.children}
 			</div>
 		</div>
 	);
-}
\ No newline at end of file
+}