Commit 08a3de2d authored by Jonathan Wilkes's avatar Jonathan Wilkes
Browse files

some code cleanup, and first attempt at array settings inside canvas dialog

parent cb07afb7
@font-face {
font-family: "DejaVu Sans Mono";
src: url("DejaVuSansMono.ttf");
}
body {
font-family:Verdana;
margin: 0px;
}
fieldset {
font-family:Georgia;
background-color:#eeeeee;
border-radius:3px;
border:2px solid black;
margin-left:auto;
margin-right:auto;
padding: 10px;
}
input[type="text"]{
width:3em;
}
input[type="number"]{
width:3em;
}
div.x-scale {
padding: 3px;
text-align: center;
}
div.gop-range {
}
div.y1 {
text-align: center;
padding: 3px;
}
div.x1 {
text-align: center;
padding: 3px;
}
div.y2 {
text-align: center;
padding: 3px;
}
.disabled {
color: #aaa;
}
.prop{
}
.hidden {
display: none;
}
.container{
display: none;
}
body {
}
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
text {
// fill: red;
cursor: default;
}
.selected_border {
stroke: blue;
stroke-dasharray: none;
stroke-width: 1;
}
label {
text-align: right;
// margin-right: auto;
// margin-left: auto;
}
.pair {
width: 75%;
text-align: left;
align: left;
}
.item1 {
width: 50%;
}
.item2 {
width: 50%;
}
input[name="x-offset"] {
width: 2em;
}
input[name="y-offset"] {
width: 2em;
}
input[name="send-symbol"] {
width: 8em;
}
input[name="receive-symbol"] {
width: 8em;
}
input[name="label"] {
width: 8em;
}
input[name="font-size"] {
width: 3em;
}
.submit_buttons {
text-align: center;
padding: 8px;
}
This diff is collapsed.
@font-face {
font-family: "DejaVu Sans Mono";
src: url("DejaVuSansMono.ttf");
}
body {
font-family:Verdana;
margin: 0px;
}
fieldset {
font-family:Georgia;
background-color:#eeeeee;
border-radius:3px;
border:2px solid black;
margin-left:auto;
margin-right:auto;
padding: 10px;
}
input[type="text"]{
width:3em;
}
input[type="number"]{
width:3em;
}
.prop{
}
.hidden {
display: none;
}
.container{
display: none;
}
body {
}
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
text {
// fill: red;
cursor: default;
}
.selected_border {
stroke: blue;
stroke-dasharray: none;
stroke-width: 1;
}
label {
text-align: right;
// margin-right: auto;
// margin-left: auto;
}
.pair {
width: 75%;
text-align: left;
align: left;
}
.item1 {
width: 50%;
}
.item2 {
width: 50%;
}
input[name="x-offset"] {
width: 2em;
}
input[name="y-offset"] {
width: 2em;
}
input[name="send-symbol"] {
width: 8em;
}
input[name="receive-symbol"] {
width: 8em;
}
input[name="label"] {
width: 8em;
}
input[name="font-size"] {
width: 3em;
}
.submit_buttons {
text-align: center;
padding: 8px;
}
This diff is collapsed.
......@@ -494,7 +494,8 @@ function nw_create_window(cid, type, width, height, xpos, ypos, menu_flag, resiz
canvas_string, dir, dirty_flag, cargs, attr_array) {
// todo: make a separate way to format the title for OSX
var my_title = pdgui.format_window_title(canvas_string, dirty_flag, cargs, dir);
var my_file = (type === 'pd-canvas' ? 'pdcanvas.html' : 'pdproperties.html');
var my_file =
type === 'pd_canvas' ? 'pd_canvas.html' : 'dialog_' + type + '.html';
var new_win = nw.Window.open(my_file, {
title: my_title,
......@@ -506,7 +507,8 @@ function nw_create_window(cid, type, width, height, xpos, ypos, menu_flag, resiz
x: xpos,
y: ypos
});
var eval_string = "register_canvas_id('" + cid + "', [" + attr_array + "]);";
pdgui.gui_post("attr_array is " + attr_array);
var eval_string = "register_canvas_id(" + JSON.stringify(cid) + ", " + JSON.stringify(attr_array) + ");";
pdgui.gui_post("eval string is " + eval_string);
if (attr_array !== null) {
pdgui.gui_post("attr_array is " + attr_array.toString());
......
......@@ -210,5 +210,64 @@
"forums_tt": "Open a link in a browser for the Pd Forum",
"irc": "IRC Chat",
"irc_tt": "Open a link in a browser for IRC Chat"
},
"canvas": {
"prop": {
"heading": {
"gop": "appearance on parent",
"data_scaling": "data scaling",
"size": "size",
"viewbox_offsets": "viewbox offsets",
"arrays": "array options"
},
"gop": "graph on parent",
"gop_tt": "show the inner contents of this canvas in a rectangle on the containing canvas",
"hide_name": "hide object name and arguments",
"hide_name_tt": "blah blah blah",
"gop_0": "Object",
"gop_1": "Window",
"gop_2": "Window (no text)",
"x_pix": "width",
"x_pix_tt": "width of the object",
"y_pix": "height",
"y_pix_tt": "height of the object",
"x_scale": "x scale",
"x_scale_tt": "horizontal scaling factor",
"y_scale": "y scale",
"y_scale_tt": "vertical scaling factor",
"x_margin": "x offset",
"x_margin_tt": "horizontal offset into the subpatch for the view area",
"y_margin": "y offset",
"y_margin_tt": "vertical offset into the subpatch for the view area",
"x1": "left",
"x1_tt": "lowest x value (left edge)",
"x2": "right",
"x2_tt": "highest x value (right edge)",
"y1": "top",
"y1_tt": "highest y value (top)",
"y2": "bottom",
"array_name": "name",
"array_name_tt": "receiver name for the array",
"array_size": "size",
"array_size_tt": "number of elements in the array",
"array_polygon": "polygon",
"array_polygon_tt": "the array trace is drawn as a polygon",
"array_points": "points",
"array_points_tt": "the array trace is drawn as horizontal line segments",
"array_bezier": "Bezier curve",
"array_bezier_tt": "the array trace is drawn as a Bezier curve",
"array_bars": "bar graph",
"array_bars_tt": "each element of the array is drawn as a bar in a bar graph",
"array_save": "save contents",
"array_save_tt": "save array contents with this patch",
"array_jump": "jump on click",
"array_jump_tt": "update the element to the position of the click",
"array_style": "draw as:",
"array_outline": "outline color",
"array_outline_tt": "color for outline around the bars",
"array_fill": "fill color",
"array_fill_tt": "inner color of the bars"
}
}
}
@font-face {
font-family: "DejaVu Sans Mono";
src: url("DejaVuSansMono.ttf");
}
body {
margin: 0px;
font-family: "DejaVu Sans Mono";
}
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
text {
// fill: red;
cursor: default;
}
.selected_border {
stroke: blue;
stroke-dasharray: none;
stroke-width: 1;
}
/* a message when it flashes on a mouse-click */
.msg.flashed .border {
stroke-width: 4;
}
/* Border color for selected objects
In plain English:
Any element with a class 'border' that is contained inside
a parent element that is not in class 'gop' but is
in class 'selected' (whew!)
*/
:not(.gop).selected .border {
stroke: blue;
}
.selected_line {
stroke: blue;
}
.broken_border {
fill: #f7f7f7;
stroke: red;
stroke-dasharray: 3 2;
}
.xlet_control {
stroke: red;
fill: gray;
// stroke-width: 1;
}
.xlet_signal {
stroke: green;
fill: green;
stroke-width: 1;
}
.xlet_iemgui {
stroke: black;
fill: black;
stroke-width: 1;
}
.iemgui_label_selected {
fill: blue;
}
@-webkit-keyframes fizzle {
0% {
stroke-width: 1;
stroke-opacity: 1;
x: 0;
rx: 1;
ry: 1;
}
100% {
stroke-width: 20;
stroke-opacity: 0.2;
x: 100;
rx: 50;
ry: 50;
}
}
.xlet_selected {
stroke: purple !important;
-webkit-animation: fizzle 0.5s linear 1;
}
//.xlet:hover {
// stroke: red;
//}
This diff is collapsed.
......@@ -993,7 +993,7 @@ function gui_canvas_new(cid, width, height, geometry, editable, name, dir, dirty
}
last_loaded = cid;
// Not sure why resize and topmost are here-- but we'll pass them on for the time being...
patchwin[cid] = nw_create_window(cid, 'pd-canvas', width, height, xpos, ypos, menu_flag,
patchwin[cid] = nw_create_window(cid, 'pd_canvas', width, height, xpos, ypos, menu_flag,
resize[cid], topmost[cid], my_canvas_color, name, dir, dirty_flag, cargs, null);
// initialize variable to reflect that this window has been opened
......@@ -1006,6 +1006,14 @@ function canvas_map(name) {
pdsend(name + " map 1");
}
function gui_canvas_erase_all_gobjs(cid) {
var top = get_item(cid, 'patchsvg');
var elem;
while (elem = top.firstChild) {
top.removeChild(elem);
}
}
exports.canvas_map = canvas_map;
/*
......@@ -1709,16 +1717,29 @@ exports.connect = connect;
// can be removed.
var plums = require('string_decoder').StringDecoder;
var rufus = new plums('utf8');
var nextCmd = ""; // Build up a command across lines (or buffers)
var cmdHeader = 0;
function init_socket_events () {
client.on('data', function(data) {
// console.log('DATA: ' + data);
var dataStr = data.toString('utf-8');
var mumps = rufus.write(data);
if (rufus.end() !== "") {
console.log("fuckkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk, we got hitchikers... " + rufus.end());
}
// console.log("The whole buffer is " + dataStr);
// if (nextCmd !== "") {
// console.log("fuckkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk nextCmd is " + nextCmd);
// }
var arr = dataStr.split("\n");
var arrLen = arr.length;
var cmdHeader = 0;
for (var i = 0; i < arrLen; i++) {
var prefix = arr[i].substring(0, 2);
if (prefix == 'nw' || prefix == 'nn') {
......@@ -1733,12 +1754,12 @@ function init_socket_events () {
}
// check if we end with a semicolon followed by a newline
if (nextCmd.slice(-1) === ";" && nextCmd.slice(-2) !== '\\') {
// console.log("raw cmd is: " + nextCmd);
nextCmd = nextCmd.replace(/\n/g, "\\n");
//console.log("raw cmd is: " + nextCmd);
// nextCmd = nextCmd.replace(/\n/g, "\\n");
// nextCmd = nextCmd.replace(/'/g, "\\\'");
var selector = nextCmd.slice(0, nextCmd.indexOf(" "));
var args = nextCmd.slice(selector.length + 1, -1);
// console.log(selector + '(' + args + ');');
// console.log("About to eval: " + selector + '(' + args + ');');
eval(selector + '(' + args + ');');
nextCmd = "";
cmdHeader = 0;
......@@ -1837,22 +1858,25 @@ function gui_configure_item(cid, tag, attributes) {
}
// Most of these map either to pd.tk procs, or in some cases Tk canvas subcommands
function gui_text_create_gobj(cid, tag, xpos, ypos) {
function gui_text_create_gobj(cid, tag, type, xpos, ypos, is_toplevel) {
var svg = get_item(cid, "patchsvg"); // "patchsvg" is id for the svg in the DOM
// Put objects on half-pixels to make them crisp (look in to the difference between
// this and the object-rendering 'crispEdges' attribute)
xpos += 0.5;
ypos += 0.5;
var transform_string = 'translate(' + xpos + ',' + ypos + ')';
var transform_string = 'matrix(1,0,0,1,' + xpos + ',' + ypos + ')';
var g = create_item(cid, 'g', {
id: tag + 'gobj',
transform: transform_string
transform: transform_string,
class: type + (is_toplevel !== 0 ? '' : ' gop')
});
svg.appendChild(g);
// hm... why returning g and not the return value of appendChild?
// console.log("create gobj tag is " + tag + " and ret is " + g);
return g;
}
function gui_text_drawborder(cid, tag, isbroken, x1, y1, x2, y2) {
function gui_text_drawborder(cid, tag, bgcolor, isbroken, x1, y1, x2, y2) {
var g = get_gobj(cid, tag);
// isbroken means either
// a) the object couldn't create or
......@@ -1863,9 +1887,11 @@ function gui_text_drawborder(cid, tag, isbroken, x1, y1, x2, y2) {
stroke: 'black',
fill: 'none',
'shape-rendering': 'optimizeSpeed',
id: tag + 'border',
class: (isbroken ? 'broken_border' : '')
class: 'border'
});
if (isbroken === 1) {
rect.classList.add('broken_border');
}
g.appendChild(rect);
}
......@@ -1898,6 +1924,11 @@ function gui_canvas_drawio(cid, parenttag, tag, x1, y1, x2, y2, basex, basey, ty
gui_post("the tag for this XLET is " + tag);
}
function gui_canvas_redraw_io(cid, parenttag, tag, x, type, i, basex) {
var xlet = get_item(cid, tag + type + i);
configure_item(xlet, { x: x - basex});
}
function gui_eraseio(cid, tag) {
gui_post("the tag for this bout-to-ba-leted XLET is " + tag);
var xlet = get_item(cid, tag);
......@@ -1943,21 +1974,29 @@ function gui_message_drawborder(cid,tag,width,height) {
points: p_array.join(),
fill: 'none',
stroke: 'black',
'stroke-width': 1,
id: tag + 'border'
// 'stroke-width': 1,
class: 'border'
// id: tag + 'border'
});
g.appendChild(polygon);
}
function gui_message_flash(cid, tag, state) {
var b = get_item(cid, tag + 'border');
var w;
if (state != 0) { w = 4; } else { w = 1; }
configure_item(b, { 'stroke-width': w });
var g = get_gobj(cid, tag);
if (state !== 0) {
g.classList.add('flashed');
} else {
g.classList.remove('flashed');
}
// var b = get_item(cid, tag + 'border');
// var w;
// if (state != 0) { w = 4; } else { w = 1; }
// configure_item(b, { 'stroke-width': w });
}
function gui_message_redraw_border(cid,tag,p1,p2,p3,p4,p5,p6,p7,p8,p9,p10,p11,p12,p13,p14) {
var b = get_item(cid, tag + 'border');
var g = get_gobj(cid, tag);
var b = g.querySelector('.border');
var p_array = [p1, p2, p3, p4, p5, p6, p7, p8, p9, p10, p11, p12, p13, p14];
configure_item(b, {
points: p_array.join(" "),
......@@ -2035,7 +2074,8 @@ function gui_canvas_updateline(cid,tag,x1,y1,x2,y2,yoff) {
configure_item(cord, { d: d_array.join(" ") });
}
function gui_text_new(canvasname, myname, type, isselected, x, y, text, font) {
function gui_text_new(canvasname, myname, type, isselected, left_margin, top_margin,
bottom_margin, pix_high, text, font) {
// gui_post("font is " + font);
var g = get_gobj(canvasname, myname);
......@@ -2044,8 +2084,8 @@ function gui_text_new(canvasname, myname, type, isselected, x, y, text, font) {
// at the top-right corner of the text's bbox. SVG uses the baseline.
// There's probably a programmatic way to do this, but for now-- fudge factors
// based on the DejaVu Sans Mono font. :)