diff --git a/frontend/src/App.js b/frontend/src/App.js
index f42e38eb..ce387b3e 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -38,6 +38,7 @@ function App() {
const [pixelSelectedMode, setPixelSelectedMode] = useState(false);
const [selectedPositionX, setSelectedPositionX] = useState(null)
const [selectedPositionY, setSelectedPositionY] = useState(null)
+ const [pixelPlacedBy, setPixelPlacedBy] = useState("");
const clearPixelSelection = () => {
setSelectedPositionX(null);
@@ -57,13 +58,13 @@ function App() {
return (
-
+
{ !isDesktopOrLaptop && (
)}
{ (!isPortrait ? pixelSelectedMode : pixelSelectedMode && activeTab === tabs[0]) && (
-
+
)}
diff --git a/frontend/src/canvas/Canvas.js b/frontend/src/canvas/Canvas.js
index b30aab17..43302efb 100644
--- a/frontend/src/canvas/Canvas.js
+++ b/frontend/src/canvas/Canvas.js
@@ -88,7 +88,6 @@ const Canvas = props => {
}, [])
const [setup, setSetup] = useState(false)
- const [pixelPlacedBy, setPixelPlacedBy] = useState("")
const draw = useCallback((ctx, imageData) => {
ctx.canvas.width = width
@@ -191,7 +190,7 @@ const Canvas = props => {
}).then(data => {
// TODO: Cache pixel info & clear cache on update from websocket
// TODO: Dont query if hover select ( until 1s after hover? )
- setPixelPlacedBy(data)
+ props.setPixelPlacedBy(data)
}).catch(error => {
console.error(error)
});
diff --git a/frontend/src/canvas/SelectedPixelPanel.css b/frontend/src/canvas/SelectedPixelPanel.css
index cc1a5a76..b4b47e83 100644
--- a/frontend/src/canvas/SelectedPixelPanel.css
+++ b/frontend/src/canvas/SelectedPixelPanel.css
@@ -17,7 +17,7 @@
.SelectedPixelPanel__item {
font-size: 1.2rem;
- text-wrap: nowrap;
+ white-space: nowrap;
margin: 0.3rem;
}
diff --git a/frontend/src/canvas/SelectedPixelPanel.js b/frontend/src/canvas/SelectedPixelPanel.js
index 020cf5a7..9a07a46c 100644
--- a/frontend/src/canvas/SelectedPixelPanel.js
+++ b/frontend/src/canvas/SelectedPixelPanel.js
@@ -6,7 +6,7 @@ const SelectedPixelPanel = props => {
props.clearPixelSelection()}>X
Pos : ({props.selectedPositionX}, {props.selectedPositionY})
-
Owner : 0xplaced_by
+
Owner : 0x{props.pixelPlacedBy}
);
}