Specifying a port location - jointjs

I have a diagramming solution I am working on, using custom elements based on devs.Model which are dynamically created at runtime. The elements might each have one or more inPorts and outPorts. I'm trying to specify the Y portion of the position for each port based on the contents.
Currently I loop through the objects I am diagramming and construct the markup for each element, and keep track of the inPort and outPorts I need to create. Once I have built the markup I need, I instantiate the element, specifying markup, size, position, and port group configurations (color and size so far).
Then I loop through the inPort and outPort collections I have built and add the port using el1.addOutPort(name) or el1.addInPort(name). In the documentation it refers to an [opts] object that can be passed, but there doesn't seem to be clear documentation of what it can contain, or at least, I don't see anything to specify where the port gets placed.
Here's a sample image of what i get now
I am trying to get it so that both ports on both sides (in this case) show up in the same box as the text 'process'.
I'm hoping this is something I've just been overlooking, thanks for any feedback.

While it might not be the best solution, here is what I came up with. I'm posting the answer in case someone in the future is trying to figure out the same issue.
I had been adding my ports using
el1.addOutPort(portName);
and was trying to find code I could add to that for the opts.
I went back to the jointjs site, and went through their tutorials until I saw one that was specifically positioning the ports and looked at the source code. Based on that, and after some experimentation, I came up with
el1.addPort({ group: 'out', id: portName, args: { y: yPosition+offset }});
And here's the result

Related

WxPython Feature Property Grid

I was wondering if a feature for WxPython existed or if I need to make it.
Here is a sample from a C# program I am trying to achieve with a property grid:
Sample Grid Image
I want this look with a checkbox in front of a PropertyCategory such as Group 0 or Message 0 in PropertyCategoryExample and can include the category. If you include the parent category I want the children categories to also be included.
Basically it acts as the expansion next to it but is a checkbox. I want to be able to still expand and shrink but just an extra checkbox when I go to save to see if the user wanted it included.
I have looked around in the docs and web but can’t find anything related to this. Do I need to make a custom property to do this?
I have asked on the discussion board but I haven't heard anything back
Thanks for your help in advance!!!

Search Algorithm for a web application that needs to look for a specific value

I'm developing a webapp that will need to download the html form a website and then iterate through the code and try to find a specific but ever changing value (in our case it will be the price for the product).
For this, I was thinking about asking the user (upon installation and setup) to provide the system with a few lines of html from the page (that has the price) and then from then on, every time we need to fetch the price we would try to search for those lines and find the price.
Now, I believe this is a horrible and slow way of doing this and since there are no rules and the html can be totally different from one website to another (even the same website might change) I couldn't find a better way.
One improvement that I thought about was to iterate through the first time and record the line at which we find the code. Once found, the subsequent times we would then start from a few lines before the expected location and start the search. Any Thoughts on how I can improve on this?
I posted this question on https://cstheory.stackexchange.com/ but they commented that it's not on topic and that I should post it here.
I have the code for the above and if needed I can post it, I'm simply thinking that there must be a better, faster way of doing this.
This is actually something I tried for a project recently (using BeautifulSoup and Python). The solution that worked for me was to workout CSS selectors (which can map to jQuery selectors) that targeted the elements that contained the values I was looking for. In my case I was able to narrow down the full document to just the elements that contained what I was looking for but if you couldn't get exactly what you where after you could combine this with some extra lactic like test to see if it looks like a price (via regex) or test what it is next to.

Understanding Orchard placement.info files

I'm new to orchard development and spent the last week studying it. I'm having a hard time in understanding some concepts, such as placement.info files.
I've read the article Understanding placement info from the project site and the section from the book "Orchard up and running" related to it.
What I understand:
Placement info files work on the content item level. It is used to reorder the rendering of the fields and content parts;
This file has three main tags: placement (basically a wrapper), match(which defines if the rules will be applied to the summary or detail display) and place (which effectively defines the placement rules);
What I don't understand:
How do I define the order of the tags? In the "place" tags I see "Content:Before", "Content:After.7", "Content:2.9" and some other rules. What does it mean to define "Place Parts_Tags_ShowTags="Header:after.7"/"? Is the placement file capable of moving parts to different zones?
I'm getting a bit frustrated using it. I don't know if I'm not using the right material (they seem very brief and/or outdated). If so, could someone suggest me some links?
I'd really appreciate some help, guys..
Thanks in advance
The name of the attribute is the shape name (usually as returned by a part driver), and the value is where to send that shape. It is a zone name, followed by a colon, and then ordering. The zone name can start with a slash if you want to target a top-level zone (those are defined in the Layout.cshtml file), like this: /AsideSecond:1. The ordering can be a special number, or a dotted sequence. For example, 1.1 comes after 1 but before 2. 1.1.1 would come after 1.1 and before 1.2, etc. after and before can also be used to send a shape after or before everything else.
I hope this helps.

Any way in Expression Engine to simulate Wordpress' shortcode functionality?

I'm relatively new to Expression Engine, and as I'm learning it I am seeing some stuff missing that WordPress has had for a while. A big one for me is shortcodes, since I will use these to allow CMS users to place more complex content in place with their other content.
I'm not seeing any real equivalent to this in EE, apart from a forthcoming plugin that's in private beta.
As an initial test I'm attempting to fake shortcodes by using delimited strings (e.g. #foo#) in the content field, then using a regex to pull those out and pass them to a function that can retrieve the content out of EE's database.
This brings me to a second question, which is that in looking at EE's API docs, there doesn't appear to be a simple means of retrieving the channel entries programmatically (thinking of something akin to WP's built-in get_posts function).
So my questions are:
a) Can this be done?
b) If so, is my method of approaching it reasonable? Or is there something stupidly obvious I'm missing in my approach?
To reiterate, my main objective here is to have some means of allowing people managing content to drop a code in place in their content that will be replaced with channel content.
Thanks for any advice or help you can give me.
Here's a simple example of the functionality you're looking for.
1) Start by installing Low Replace.
2) Create two Global Variables called gv_hello and gv_goodbye with the values "Hello" and "Goodbye" respectively.
3) Put this text into the body of an entry:
[say_hello]
Nice to see you.
[say_goodbye]
4) Put this into your template, wrapping the Low Replace tag around your body field.
{exp:low_replace
find="[say_hello]|[say_goodbye]"
replace="{gv_hello}|{gv_goodbye}"
multiple="yes"
}
{body}
{/exp:low_replace}
5) It should output this into your browser:
Hello
Nice to see you.
Goodbye
Obviously, this is a really simple example. You can put full blown HTML into your global variable. For example, we've used that to render a complex, interactive graphic that isn't editable but can be easily dropped into a page by any editor.
Unfortunately, due to parse order issues, EE tags won't work inside Global Variables. If you need EE tags in your short code output, you'll need to use Low Variables addon instead of Global Variables.
Continued from the comment:
Do you have examples of the kind of shortcodes you want to support/include? Because i have doubts if controlling the page-layout from a text-field or wysiwyg-field is the way to go.
If you want editors to be able to adjust layout or show/hide extra parts on the page, giving them access to some extra fields in the channel, is (imo) much more manageable and future-proof. For instance some selectfields, a relationship (or playa) field, or a matrix, to let them choose which parts to include/exclude on a page, or which entry from another channel to pull content from.
As said in the comment: i totally understand if you want to replace some #foo# tags with images or data from another field (see other answers: nsm-transplant, low_replace). But, giving an editor access to shortcodes and picking them out, is like writing a template-engine to generate ee-template code for the ee-template-engine.
Using some custom fields to let editors pick and choose parts to embed is, i think, much more manageable.
That being said, you could make a plugin to parse the shortcodes from a textareas content, and then program a lot, to fetch data from other modules you want to support. For channel entries you could build out of the channel data library by objectiveHTML. https://github.com/objectivehtml/Channel-Data
I hear you, I too miss shortcodes from WP -- though the reason they work so easily there is the ubiquity of the_content(). With the great flexibility of EE comes fewer blanket solutions.
I'd suggest looking at NSM Transplant. It should fit the bill for you.
There is also a plugin called Shortcode, which you can find here at
Devot-ee
A quote from the page:
Shortcode aims to allow for more dynamic use of content by authors and
editors, allowing for injection of reusable bits of content or even
whole pieces of functionality into any field in EE

Is the Cross Domain Fragment Identifier hack no longer working?

I see this referenced a lot: http://ajaxify.com/run/crossframe/
And I noticed now it's no longer working for the IFRAME (child) to change the parents hash.
I've been spending a few hours trying various things wondering why this isn't working anymore -- then I finally realized that the example I originally based it on was down too.
Can anybody confirm?
-
-
I need to use a cross domain iframe to take care of an order upload form that our shopping cart doesn't support, and I need the form to return an order ID to the parent, so that I can associate the data between the two servers.
Any recommendations or directions to head in would be appreciated.
I'm not looking for a shortcut or somebody to do my work. I've been reading all day... I just need a nudge in the right direction.
Thanks!
It is partly browser-specific. For instance, some browsers don't allow a nested child frame (iframe within an iframe) to change its parent's fragment. See this blog entry. But the basic functionality still works in recent browsers. This demo, which has an iframe change its parent, and vice versa (single level) works fine in Firefox 3.5.9 and Chrome 5.0.375.99.
The demo you gave also works both ways in that version of Firefox. It doesn't allow the child to change the parent in Chrome. The main difference seems to be that the working one uses parent.location, while the broken one uses parent.window.location.hash.
The best solution for recent browsers is postMessage. If necessary, you can also use a server proxy.

Resources