Skip to content

Commit 7aa9dad

Browse files
c2d13pc2d13p
committed
add rectangle format to room labels
1 parent 118b342 commit 7aa9dad

File tree

3 files changed

+45
-27
lines changed

3 files changed

+45
-27
lines changed

‎src/pages/RoomLabelsPage.js

+22-13
Original file line numberDiff line numberDiff line change
@@ -11,22 +11,27 @@ function Display({roomLabel, onSave}) {
1111
const printRef = useRef(null)
1212
const blue = "#08467b"
1313
const [size, setSize] = useState(roomLabel?.size || 0)
14-
const [lastId,setLastId] = useState(null)
14+
const [format, setFormat] = useState('square')
15+
const [lastId, setLastId] = useState(null)
1516

1617
if (lastId !== roomLabel._id) {
1718
setLastId(roomLabel._id)
1819
setSize(roomLabel?.size || 0)
1920
}
2021

22+
const dimensions = format === 'square'
23+
? { width: "15cm", height: "15cm" }
24+
: { width: "16cm", height: "9cm" }
25+
2126
function sanitize(str) {
2227
return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;')
2328
}
2429

2530
return <>
2631
<div ref={printRef}
2732
style={{
28-
height: "15cm",
29-
width: "15cm",
33+
height: dimensions.height,
34+
width: dimensions.width,
3035
borderStyle: "solid",
3136
borderColor: "#eee",
3237
borderWidth: "1px",
@@ -35,30 +40,30 @@ function Display({roomLabel, onSave}) {
3540
printColorAdjust: "exact"
3641
}}>
3742
<img alt="" style={{
38-
height: "3cm",
43+
height: format === 'square' ? "3cm" : "2.5cm",
3944
opacity: "0.8",
4045
marginTop: "0.2cm",
4146
marginLeft: "0.2cm",
4247
marginBottom: "-0.2cm"
4348
}} src="/img/matematica_dx.svg" />
4449
<div style={{
45-
height:"13cm",
46-
marginTop:"-2cm"
50+
height: format === 'square' ? "13cm" : "7cm",
51+
marginTop: "-2cm"
4752
}}>
4853
<div ref={namesRef}
4954
contentEditable="true" style={{
5055
color: blue,
5156
textAlign: "center",
5257
fontSize: `${Math.round(100*Math.pow(2,size/2))/100}cm`,
5358
position: "relative",
54-
top: "50%",
59+
top: format === 'square' ? "50%" : "55%",
5560
transform: "translateY(-50%)",
5661
}}
5762
dangerouslySetInnerHTML={{__html: roomLabel.names.map(
5863
name=>`<div>${sanitize(name)}</div>`).join('')}} />
5964
</div>
6065
<div style={{
61-
marginTop: "-4cm",
66+
marginTop: format === 'square' ? "-4cm" : "-3cm",
6267
marginRight: "0.5cm"
6368
}}>
6469
<div ref={numberRef}
@@ -72,17 +77,17 @@ function Display({roomLabel, onSave}) {
7277
textAlign: "right",
7378
paddingTop: ".5cm",
7479
paddingRight: "0.1cm",
75-
marginTop: "2cm",
80+
marginTop: format === 'square' ? "2cm" : "1.5cm",
7681
float: "left"
7782
}}
7883
dangerouslySetInnerHTML={{__html: sanitize(roomLabel.number)}}
7984
/>
8085
<img alt="" style={{
81-
height: "8cm",
86+
height: format === 'square' ? "8cm" : "6cm",
8287
position: "relative",
8388
float: "right",
8489
opacity: "0.12",
85-
marginTop: "-3.2cm",
90+
marginTop: format === 'square' ? "-3.2cm" : "-1.7cm",
8691
marginRight: "-0.4cm",
8792
pointerEvents: "none"
8893
}} src="/img/cherubino_pant541.png" />
@@ -97,15 +102,19 @@ function Display({roomLabel, onSave}) {
97102
<Button onClick={() => {
98103
const names = [...namesRef.current.children].map(child => child.textContent)
99104
const number = numberRef.current.textContent
100-
onSave({names, number, size})
105+
onSave({names, number, size, format})
101106
}}>aggiungi ai cartellini da fare</Button> }
102-
<select value={ size } onChange={e => setSize(e.target.value)}>
107+
<select value={size} onChange={e => setSize(e.target.value)}>
103108
<option value="2">scritta molto grande</option>
104109
<option value="1">scritta grande</option>
105110
<option value="0">scritta di dimensione normale</option>
106111
<option value="-1">scritta piccola</option>
107112
<option value="-2">scritta molto piccola</option>
108113
</select>
114+
<select value={format} onChange={e => setFormat(e.target.value)}>
115+
<option value="square">formato quadrato</option>
116+
<option value="rectangular">formato rettangolare</option>
117+
</select>
109118
</ButtonGroup>
110119
</>
111120
}

‎src/processes/RoomAssignmentsList.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ function AssignmentsList() {
9393
<input
9494
type="text"
9595
className="form-control"
96-
placeholder="Cerca per nome, stanza, piano..."
96+
placeholder="Cerca per nome, stanza, affiliazione..."
9797
value={filter.filter._search}
9898
onChange={updateFilter}
9999
/>

‎src/processes/RoomLabels.js

+22-13
Original file line numberDiff line numberDiff line change
@@ -13,22 +13,27 @@ function Display({roomLabel, onSave}) {
1313
const printRef = useRef(null)
1414
const blue = "#08467b"
1515
const [size, setSize] = useState(roomLabel?.size || 0)
16-
const [lastId,setLastId] = useState(null)
16+
const [format, setFormat] = useState('square')
17+
const [lastId, setLastId] = useState(null)
1718

1819
if (lastId !== roomLabel._id) {
1920
setLastId(roomLabel._id)
2021
setSize(roomLabel?.size || 0)
2122
}
2223

24+
const dimensions = format === 'square'
25+
? { width: "15cm", height: "15cm" }
26+
: { width: "16cm", height: "9cm" }
27+
2328
function sanitize(str) {
2429
return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;')
2530
}
2631

2732
return <>
2833
<div ref={printRef}
2934
style={{
30-
height: "15cm",
31-
width: "15cm",
35+
height: dimensions.height,
36+
width: dimensions.width,
3237
borderStyle: "solid",
3338
borderColor: "#eee",
3439
borderWidth: "1px",
@@ -37,30 +42,30 @@ function Display({roomLabel, onSave}) {
3742
printColorAdjust: "exact"
3843
}}>
3944
<img alt="" style={{
40-
height: "3cm",
45+
height: format === 'square' ? "3cm" : "2.5cm",
4146
opacity: "0.8",
4247
marginTop: "0.2cm",
4348
marginLeft: "0.2cm",
4449
marginBottom: "-0.2cm"
4550
}} src="/img/matematica_dx.svg" />
4651
<div style={{
47-
height:"13cm",
48-
marginTop:"-2cm"
52+
height: format === 'square' ? "13cm" : "7cm",
53+
marginTop: "-2cm"
4954
}}>
5055
<div ref={namesRef}
5156
contentEditable="true" style={{
5257
color: blue,
5358
textAlign: "center",
5459
fontSize: `${Math.round(100*Math.pow(2,size/2))/100}cm`,
5560
position: "relative",
56-
top: "50%",
61+
top: format === 'square' ? "50%" : "55%",
5762
transform: "translateY(-50%)",
5863
}}
5964
dangerouslySetInnerHTML={{__html: roomLabel.names.map(
6065
name=>`<div>${sanitize(name)}</div>`).join('')}} />
6166
</div>
6267
<div style={{
63-
marginTop: "-4cm",
68+
marginTop: format === 'square' ? "-4cm" : "-3cm",
6469
marginRight: "0.5cm"
6570
}}>
6671
<div ref={numberRef}
@@ -74,17 +79,17 @@ function Display({roomLabel, onSave}) {
7479
textAlign: "right",
7580
paddingTop: ".5cm",
7681
paddingRight: "0.1cm",
77-
marginTop: "2cm",
82+
marginTop: format === 'square' ? "2cm" : "1.5cm",
7883
float: "left"
7984
}}
8085
dangerouslySetInnerHTML={{__html: sanitize(roomLabel.number)}}
8186
/>
8287
<img alt="" style={{
83-
height: "8cm",
88+
height: format === 'square' ? "8cm" : "6cm",
8489
position: "relative",
8590
float: "right",
8691
opacity: "0.12",
87-
marginTop: "-3.2cm",
92+
marginTop: format === 'square' ? "-3.2cm" : "-1.7cm",
8893
marginRight: "-0.4cm",
8994
pointerEvents: "none"
9095
}} src="/img/cherubino_pant541.png" />
@@ -99,15 +104,19 @@ function Display({roomLabel, onSave}) {
99104
<Button onClick={() => {
100105
const names = [...namesRef.current.children].map(child => child.textContent)
101106
const number = numberRef.current.textContent
102-
onSave({names, number, size})
107+
onSave({names, number, size, format})
103108
}}>aggiungi ai cartellini da fare</Button> }
104-
<select value={ size } onChange={e => setSize(e.target.value)}>
109+
<select value={size} onChange={e => setSize(e.target.value)}>
105110
<option value="2">scritta molto grande</option>
106111
<option value="1">scritta grande</option>
107112
<option value="0">scritta di dimensione normale</option>
108113
<option value="-1">scritta piccola</option>
109114
<option value="-2">scritta molto piccola</option>
110115
</select>
116+
<select value={format} onChange={e => setFormat(e.target.value)}>
117+
<option value="square">formato quadrato</option>
118+
<option value="rectangular">formato rettangolare</option>
119+
</select>
111120
</ButtonGroup>
112121
</>
113122
}

0 commit comments

Comments
 (0)