Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
Srashti Mittal
purr-data
Commits
c64decd8
Commit
c64decd8
authored
Dec 29, 2020
by
Jonathan Wilkes
Browse files
use a simple svg lock image when snap-to-grid is disabled, encode SVGs per spec
parent
a81c9ef5
Changes
1
Hide whitespace changes
Inline
Side-by-side
pd/nw/pdgui.js
View file @
c64decd8
...
...
@@ -1437,12 +1437,42 @@ function get_grid_coords(cid, svg_elem) {
return
{
x
:
dx
,
y
:
dy
};
}
function
create_svg_lock
()
{
return
"
url('data:image/svg+xml;utf8,
"
+
encodeURIComponent
([
'
<svg xmlns="http://www.w3.org/2000/svg"
'
,
'
width="24px"
'
,
'
height="24px"
'
,
'
viewBox="0 0 486.866 486.866"
'
,
'
>
'
,
'
<path fill="#bbb" d="
'
,
'
M393.904,214.852h-8.891v-72.198c0-76.962-61.075-141.253
'
,
'
-137.411-142.625c-2.084-0.038-6.254-0.038-8.338,0
'
,
'
C162.927,1.4,101.853,65.691,101.853,142.653v1.603c0,16.182,
'
,
'
13.118,29.3,29.3,29.3c16.182,0,29.299-13.118,29.299-29.3
'
,
'
v-1.603
'
,
'
c0-45.845,37.257-83.752,82.98-83.752s82.981,37.907,82.981,
'
,
'
83.752v72.198H92.963c-13.702,0-24.878,14.139-24.878,
'
,
'
31.602v208.701
'
,
'
c0,17.44,11.176,31.712,24.878,31.712h300.941c13.703,0,
'
,
'
24.878-14.271,24.878-31.712V246.452
'
,
'
C418.783,228.989,407.607,214.852,393.904,214.852z M271.627,
'
,
'
350.591v63.062c0,7.222-6.046,13.332-13.273,13.332h-29.841
'
,
'
c-7.228,0-13.273-6.11-13.273-13.332v-63.062c-7.009-6.9-11.09
'
,
'
-16.44-11.09-26.993c0-19.999,15.459-37.185,35.115-37.977
'
,
'
c2.083-0.085,6.255-0.085,8.337,0c19.656,0.792,35.115,17.978,
'
,
'
35.115,37.977C282.717,334.149,278.637,343.69,271.627,350.591z
'
,
'
"/>
'
,
'
</svg>
'
,
"
')
"
,
].
join
(
"
"
));
}
// Background for edit mode. Currently, we use a grid if snap-to-grid
// functionality is turned on in the GUI preferences. If not, we just use
// the same grid with a lower opacity. That way the edit mode is always
// visually distinct from run mode.
var
create_editmode_bg
=
function
(
cid
,
svg_elem
)
{
var
head
,
body
,
tail
,
cell_data_str
,
opacity_str
,
grid
,
size
,
pos
;
var
data
,
cell_data_str
,
opacity_str
,
grid
,
size
,
pos
;
grid
=
showgrid
[
cid
];
size
=
gridsize
[
cid
];
pos
=
get_grid_coords
(
cid
,
svg_elem
);
...
...
@@ -1452,34 +1482,47 @@ var create_editmode_bg = function(cid, svg_elem) {
opacity_str
=
'
"
'
+
(
grid
?
1
:
0.4
)
+
'
"
'
;
cell_data_str
=
[
'
"
'
,
"
M
"
,
size
,
0
,
"
L
"
,
0
,
0
,
0
,
size
,
'
"
'
].
join
(
"
"
);
head
=
[
'
<svg xmlns="http://www.w3.org/2000/svg"
'
,
data
=
[
'
<svg xmlns="http://www.w3.org/2000/svg"
'
,
'
width="1000" height="1000"
'
,
'
opacity=
'
,
opacity_str
,
'
>
'
]
.
join
(
""
);
body
=
[
'
<defs>
'
,
'
<pattern id="cell" patternUnits="userSpaceOnUse"
'
,
'
width="
'
,
size
,
'
" height="
'
,
size
,
'
">
'
,
'
<path fill="none" stroke="#ddd" stroke-width="1"
'
,
'
d=
'
,
cell_data_str
,
'
/>
'
,
'
</pattern>
'
,
'
<pattern id="grid" patternUnits="userSpaceOnUse"
'
,
'
width="100" height="100" x="
'
,
pos
.
x
,
'
" y="
'
,
pos
.
y
,
'
">
'
,
'
<rect width="500" height="500" fill="url(#cell)" />
'
,
'
<path fill="none" stroke="#bbb" stroke-width="1"
'
,
'
d="M 500 0 L 0 0 0 500"/>
'
,
'
</pattern>
'
,
'
</defs>
'
,
'
<rect width="1000" height="1000" fill="url(#grid)" />
'
].
join
(
""
);
tail
=
'
</svg>
'
;
return
"
url('data:image/svg+xml;utf8,
"
+
head
+
body
+
tail
+
"
')
"
;
'
opacity=
'
,
opacity_str
,
'
>
'
,
'
<defs>
'
,
'
<pattern id="cell" patternUnits="userSpaceOnUse"
'
,
'
width="
'
,
size
,
'
" height="
'
,
size
,
'
">
'
,
'
<path fill="none" stroke="#ddd" stroke-width="1"
'
,
'
d=
'
,
cell_data_str
,
'
/>
'
,
'
</pattern>
'
,
'
<pattern id="grid" patternUnits="userSpaceOnUse"
'
,
'
width="100" height="100" x="
'
,
pos
.
x
,
'
" y="
'
,
pos
.
y
,
'
">
'
,
'
<rect width="500" height="500" fill="url(#cell)" />
'
,
'
<path fill="none" stroke="#bbb" stroke-width="1"
'
,
'
d="M 500 0 L 0 0 0 500"/>
'
,
'
</pattern>
'
,
'
</defs>
'
,
'
<rect width="1000" height="1000" fill="url(#grid)" />
'
,
'
</svg>
'
].
join
(
"
"
);
// make sure to encode the data so we obey all the rules with our data URL
return
"
url('data:image/svg+xml;utf8,
"
+
encodeURIComponent
(
data
)
+
"
')
"
;
}
function
set_bg
(
cid
,
data_url
,
bg_pos
,
repeat
)
{
var
style
=
patchwin
[
cid
].
window
.
document
.
body
.
style
;
style
.
setProperty
(
"
background-image
"
,
data_url
);
style
.
setProperty
(
"
background-position
"
,
bg_pos
);
style
.
setProperty
(
"
background-repeat
"
,
repeat
);
}
function
set_editmode_bg
(
cid
,
svg_elem
,
state
)
{
patchwin
[
cid
].
window
.
document
.
body
.
style
.
setProperty
(
"
background-image
"
,
state
?
create_editmode_bg
(
cid
,
svg_elem
)
:
"
none
"
);
if
(
!
state
)
{
set_bg
(
cid
,
"
none
"
,
"
0% 0%
"
,
"
repeat
"
);
}
else
if
(
showgrid
[
cid
])
{
// Show a grid in editmode if we're snapping to grid
set_bg
(
cid
,
create_editmode_bg
(
cid
,
svg_elem
),
"
0% 0%
"
,
"
repeat
"
);
}
else
{
// Otherwise show a little lock in the top right corner of the patch
set_bg
(
cid
,
create_svg_lock
(),
"
right 5px top 5px
"
,
"
no-repeat
"
);
}
}
function
update_svg_background
(
cid
,
svg_elem
)
{
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment