Discussion:
[lively-kernel] Connections tutorial, Morphic: Connections
blake
2012-02-01 19:02:09 UTC
Permalink
Hi, there--

On the page "Morphic: Connections" of the "Connections tutorial" it
has you drag a connection between Fahrenheit and Celsius text morphs,
using textString for both.

I do this, it works, in that a change in the (F) changes the (C).

Then it says, "To enter a converter function, right-click on the
connection arrow and click 'edit converter'."

So, assuming the connection arrow is that arrowhead-looking
rightward-pointing triangle, when I right click on it, there's no
"edit converter" option. There all all the usual morphic handles,
including the object menu, which doesn't have a "edit converter"
option.

And there's "open script editor," which seems promising but it's
empty, making: "In the editor window, change the text between { and }
to " problematic.

I can add a script, of course, but it won't be connected to--well,
whatever it's supposed to be connected to.

I can pull up the script editor for Fahrenheit, and I see
textString.AttributionConnect[might be something after here but I
can't read it because the connections pane doesn't want to resize] set
to:

connect(this, "textString", this.get("Celsius"), "textString", {});

But if I put "return (value - 32) * 5/9;" there, I get "unexpected
token" and lots of other red text. I can probably make this work but
I'm assuming there's something I'm missing, or a typo in the tutorial.

Thanks for any guidance!

===Blake===
Fabian Bornhofen
2012-02-01 19:39:40 UTC
Permalink
Hi Blake -

clicking on the arrow (actually the line, not the head) is a problem,
and I'm glad you're reminding us of this.

As the arrow's line is horizontal, you need to be very precise to hit
it. A workaround is to move one of the text boxes so the arrow is not
exactly horizontal any more. If you then click on or near the line,
you'll get the right menu.
It's definitely a UI thing we need to improve.

As for the script editor: you can do that, too, and it looks like
you've almost made it work!
Open the script editor on the Fahrenheit text input. Then go to the
connections and click +, which gives you some template text. In order
to work, this needs to read

connect(this, 'textString', this.get('Celsius'), 'textString',
{converter: function(value) {return (value - 32) * 5/9;}});

The last parameter needs to be an object with a method named converter.
(Am I the only one to think that this could be more intuitive?)

Don't hesitate to ask if you're running into more issues.

Best,
Fabian
Post by blake
Hi, there--
On the page "Morphic: Connections" of the "Connections tutorial" it
has you drag a connection between Fahrenheit and Celsius text morphs,
using textString for both.
I do this, it works, in that a change in the (F) changes the (C).
Then it says, "To enter a converter function, right-click on the
connection arrow and click 'edit converter'."
So, assuming the connection arrow is that arrowhead-looking
rightward-pointing triangle, when I right click on it, there's no
"edit converter" option. There all all the usual morphic handles,
including the object menu, which doesn't have a "edit converter"
option.
And there's "open script editor," which seems promising but it's
empty, making: "In the editor window, change the text between { and }
to " problematic.
I can add a script, of course, but it won't be connected to--well,
whatever it's supposed to be connected to.
I can pull up the script editor for Fahrenheit, and I see
textString.AttributionConnect[might be something after here but I
can't read it because the connections pane doesn't want to resize] set
connect(this, "textString", this.get("Celsius"), "textString", {});
But if I put "return (value - 32) * 5/9;" there, I get "unexpected
token" and lots of other red text. I can probably make this work but
I'm assuming there's something I'm missing, or a typo in the tutorial.
Thanks for any guidance!
===Blake===
_______________________________________________
lively-kernel mailing list
http://lists.hpi.uni-potsdam.de/listinfo/lively-kernel
blake
2012-02-01 20:17:01 UTC
Permalink
Fabian,

Thanks! Upon closer examination, I can guarantee that there is no
connecting line visible there. I've zoomed, I've moved the head
about, I've clicked all around where it should be and not been able to
grab it.

This is in Chrome "18.0.1025.1 dev-m". I can see it in Firefox. The
same object (a Path) is being created, so I'm guessing it's just some
kind of rendering issue.

But, yeah, I would say "click on the connecting line" in the tutorial.

Could you point me to any docs on local deployment, if I want to
publish to, say, the company intranet versus the Internet?

===Blake===

On Wed, Feb 1, 2012 at 11:39 AM, Fabian Bornhofen
Post by Fabian Bornhofen
Hi Blake -
clicking on the arrow (actually the line, not the head) is a problem,
and I'm glad you're reminding us of this.
As the arrow's line is horizontal, you need to be very precise to hit
it. A workaround is to move one of the text boxes so the arrow is not
exactly horizontal any more. If you then click on or near the line,
you'll get the right menu.
It's definitely a UI thing we need to improve.
As for the script editor: you can do that, too, and it looks like
you've almost made it work!
Open the script editor on the Fahrenheit text input. Then go to the
connections and click +, which gives you some template text. In order
to work, this needs to read
connect(this, 'textString', this.get('Celsius'), 'textString',
{converter: function(value) {return (value - 32) * 5/9;}});
The last parameter needs to be an object with a method named converter.
(Am I the only one to think that this could be more intuitive?)
Don't hesitate to ask if you're running into more issues.
Best,
Fabian
Post by blake
Hi, there--
On the page "Morphic: Connections" of the "Connections tutorial" it
has you drag a connection between Fahrenheit and Celsius text morphs,
using textString for both.
I do this, it works, in that a change in the (F) changes the (C).
Then it says, "To enter a converter function, right-click on the
connection arrow and click 'edit converter'."
So, assuming the connection arrow is that arrowhead-looking
rightward-pointing triangle, when I right click on it, there's no
"edit converter" option. There all all the usual morphic handles,
including the object menu, which doesn't have a "edit converter"
option.
And there's "open script editor," which seems promising but it's
empty, making: "In the editor window, change the text between { and }
to " problematic.
I can add a script, of course, but it won't be connected to--well,
whatever it's supposed to be connected to.
I can pull up the script editor for Fahrenheit, and I see
textString.AttributionConnect[might be something after here but I
can't read it because the connections pane doesn't want to resize] set
connect(this, "textString", this.get("Celsius"), "textString", {});
But if I put "return (value - 32) * 5/9;" there, I get "unexpected
token" and lots of other red text. I can probably make this work but
I'm assuming there's something I'm missing, or a typo in the tutorial.
Thanks for any guidance!
===Blake===
_______________________________________________
lively-kernel mailing list
http://lists.hpi.uni-potsdam.de/listinfo/lively-kernel
Fabian Bornhofen
2012-02-01 21:43:35 UTC
Permalink
Hi Blake -

just looked at it in Chromium 18 and YES that looks serious. Not sure
though if that's Lively's fault or a bug in Chrome. We'll need to look
into that.


As for local deployment, there are some scattered bits of documentation:

- Amazon EC2 by Marko: http://lively-kernel.org/other/aws/
- Mac & Ubuntu x86:
http://lively-kernel.org/repository/webwerkstatt/users/fbo/xamppInstaller.xhtml
- Windows is very experimental:
http://lively-kernel.org/repository/webwerkstatt/users/fbo/xamppInstallerWindows.xhtml
- Also we just deployed an instance on SUSE Linux, I will search for
and upload the Apache config for that ASAP if you need it.

The general problem here is that Apache config & default settings
differs a lot depending on the platform. That makes it almost
impossible to create a unified installer.

(And for what it's worth, there is a highly experimental way to deploy
LK with only Node.js: https://github.com/fbornhofen/lkcodesrv . We
don't recommend this, but it might be interesting for some to look at
it.)

HTH
Fabian
Post by blake
Fabian,
Thanks! Upon closer examination, I can guarantee that there is no
connecting line  visible there. I've zoomed, I've moved the head
about, I've clicked all around where it should be and not been able to
grab it.
This is in Chrome "18.0.1025.1 dev-m". I can see it in Firefox. The
same object (a Path) is being created, so I'm guessing it's just some
kind of rendering issue.
But, yeah, I would say "click on the connecting line" in the tutorial.
Could you point me to any docs on local deployment, if I want to
publish to, say, the company intranet versus the Internet?
===Blake===
On Wed, Feb 1, 2012 at 11:39 AM, Fabian Bornhofen
Post by Fabian Bornhofen
Hi Blake -
clicking on the arrow (actually the line, not the head) is a problem,
and I'm glad you're reminding us of this.
As the arrow's line is horizontal, you need to be very precise to hit
it. A workaround is to move one of the text boxes so the arrow is not
exactly horizontal any more. If you then click on or near the line,
you'll get the right menu.
It's definitely a UI thing we need to improve.
As for the script editor: you can do that, too, and it looks like
you've almost made it work!
Open the script editor on the Fahrenheit text input. Then go to the
connections and click +, which gives you some template text. In order
to work, this needs to read
connect(this, 'textString', this.get('Celsius'), 'textString',
{converter: function(value) {return (value - 32) * 5/9;}});
The last parameter needs to be an object with a method named converter.
(Am I the only one to think that this could be more intuitive?)
Don't hesitate to ask if you're running into more issues.
Best,
Fabian
Post by blake
Hi, there--
On the page "Morphic: Connections" of the "Connections tutorial" it
has you drag a connection between Fahrenheit and Celsius text morphs,
using textString for both.
I do this, it works, in that a change in the (F) changes the (C).
Then it says, "To enter a converter function, right-click on the
connection arrow and click 'edit converter'."
So, assuming the connection arrow is that arrowhead-looking
rightward-pointing triangle, when I right click on it, there's no
"edit converter" option. There all all the usual morphic handles,
including the object menu, which doesn't have a "edit converter"
option.
And there's "open script editor," which seems promising but it's
empty, making: "In the editor window, change the text between { and }
to " problematic.
I can add a script, of course, but it won't be connected to--well,
whatever it's supposed to be connected to.
I can pull up the script editor for Fahrenheit, and I see
textString.AttributionConnect[might be something after here but I
can't read it because the connections pane doesn't want to resize] set
connect(this, "textString", this.get("Celsius"), "textString", {});
But if I put "return (value - 32) * 5/9;" there, I get "unexpected
token" and lots of other red text. I can probably make this work but
I'm assuming there's something I'm missing, or a typo in the tutorial.
Thanks for any guidance!
===Blake===
_______________________________________________
lively-kernel mailing list
http://lists.hpi.uni-potsdam.de/listinfo/lively-kernel
_______________________________________________
lively-kernel mailing list
http://lists.hpi.uni-potsdam.de/listinfo/lively-kernel
ccrosetti
2014-04-19 16:38:31 UTC
Permalink
Where is the Morphic Connections turorial?



--
View this message in context: http://forum.world.st/Connections-tutorial-Morphic-Connections-tp4348992p4755455.html
Sent from the Lively Kernel mailing list archive at Nabble.com.
Marko Röder
2014-04-22 12:42:44 UTC
Permalink
Hi Carlos -

This is where you can find some documentation on connections:

http://www.lively-kernel.org/repository/webwerkstatt/documentation/HowConnectWorks.xhtml
http://lively-web.org/documentation/profesores.html (click on Connections on the left)
http://lively-web.org/users/robertkrahn/lively-cheat-sheet.html (click on Data bindings at the bottom).

Best,

- Marko
Post by ccrosetti
Where is the Morphic Connections turorial?
--
View this message in context: http://forum.world.st/Connections-tutorial-Morphic-Connections-tp4348992p4755455.html
Sent from the Lively Kernel mailing list archive at Nabble.com.
_______________________________________________
lively-kernel mailing list
http://lists.hpi.uni-potsdam.de/listinfo/lively-kernel
Loading...