Javascript Flowchart designer in style of CKeditor - javascript

I've learned here, on stack overflow, that what I need is called "flow-chart". I need to allow user to draw in a browser (using his mouse) a flow-chart that would represent a flow of a process or an algorithm. This flow-chart should contain decisions (yes/no diamonds), tasks (rectangles), arrows, labels etc.
Flow-chart editor should be a part of a Form on a web page, should be written in JavaScript and important is, that it must produce a text output (XML?) that will be storable in DB and when this page is opened again, chart will be rendered based on the previously save text.
No other outputs wil be necessary. Essentially, what I need is just a graphical XML editor/creator.
It would be perfect if it worked as same as CkEditor:
http://ckeditor.com/demo
This CkEditor is a JS Html editor that covers a textarea (in a form) and when you write something in this editor, it is (on the background) converted into HTML and written into the textarea. When you send the whole form using a button, the content of textarea can be processed and saved.
I read following thread, but nothing was suitable for my purposes
stackoverflow.com/questions/363592/javascript-library-for-hierarchical-flowchart
Very close to my idea was this project, but it is a Java program that is run outside of browser and output can not be stored in DB.
www.jgraph.com/jgraph.html
Did anyone use something like I just described?
Update 1: This could be what i was loking for. Does anybody know something similar and/or free?
origramy.com/origramy.html

You will find this thread useful. It talks about generating flowchart from BPMN which is in XML.

Related

Research for a visual html editor which can export the changes or Finding a method for reapplying the user changes in initial html

I am looking for a visual HTML editor script that works in browser basically. Its initial content will be generated from an existing URL and all the changes which will be done by the user, should be exportable in some kind of format. The aim here is reaching the final look later by applying this exported data.
The user here will be non-technical end user. The editor can be similar to WYSIWYG so user can switch between preview and code. The editor should not rely on some kind of special CSS/JS frameworks, it should be able to read from CSS and JS files directly from URL while generating the page.
There are lots of visual editors out there with lots of cool stuff. Some are using drag-and-drop UI elements, some are meant to work just with Bootstrap etc. But so far I could not find something I can use.
So if existing tools are not enough, I need to find a way of generate same result by comparing the outputs.
Beside taking diff of the contents, is there any method for generating the exportable changes for reapplying to initial HTML later?
using diff may actually work but it may generate lots of bugs while working with js frameworks
If you are looking for what I think then.. https://ckeditor.com/ Check this one. I have used this HTML editor in a website. It changes the initial HTML and works like the way wordpress HTML editor works.

Are there any script libraries that let me display MathML?

My website lets people paste html into a textbox, which gets displayed later to other users. It occurred to me that they might want to display math formulas, and to do that in a browser, I would think the simplest method is MathML.
Is there a JavaScript library I can include in my pages that will make MathML render as formulas?
Thanks.

VBA Internet Explorer Download

First of all, I want to say that stackoverflow has helped me a GREAT deal with my current project, so thanks! But I have hit a point where I can no longer find help by skimming through previous questions. First, a little overview of what I'm doing.
At my job we have this extremely tedious process that we perform regularly, and I really want to automate it. The process is very basic, we go to a website, log-in, navigate to the appropriate page, copy and paste 6 values from excel into a form on the website, submit the form and download a specific output report. We repeat the process 60 times so this seemed like a prime candidate for Excel-Internet Explorer automation.
I built a pretty basic Excel Macro that can open up a new window with the appropriate URL, log-in, navigate to the correct page, fill in the form and submit the form, but I cannot figure out how to download the report. There is some added complexity to this, and I am just not familiar enough with Javascript, PHP ect. to figure out what is going on.
Problem: when I choose the correct report to generate, a new window pops-up with the generated report. This page is essentially empty when I click "View Source Document." There is a link to a Javascript page in the header, there is a little bit of CSS directly in the page, and like two tiny snippets of HTML. There is a download button on this page, but it doesn't look like it's being created in HTML.
QUESTION 1: Is this a Javascript application? Is there a way for me to simulate pressing the download button?
From what I understand, the complexity of my macro will increase substantially if I have to navigate between two IE windows, (not to mention there isn't an HTML link for me to click to download the spreadsheet) so I started to try and figure out a different way to do this. I looked at the URL of the new window with the generated report, and tried to analyze what was happening with Firefox's Developer tools (specifically Web Console). Here's where I get even more lost...
There are a series of "POSTS". These POSTS show up when the output is being created within the website:
POST https://www.website.com/somethingdb/quickframe/prod/#####/single_frame_results/correct_output.asp?THIS_KEY=370120c59da884dbdc375b1582a2142c1363533393a313335363032353737363a3646314a313937334a32353030303&bEmbedded=1
POST https://www.website.com/somethingdb/javascriptsource/prod/#####/website/forms/datagrid/DataGrid.html
POST https://www.website.com/qc?function=QuickFrameRmi
Then when I click the Download button, One POST and one GET show up:
POST https://www.website.com/qc?function=CorrectReport.generateExportFile
GET
GET https://www.website.com/somethingdb/quickframe/prod/#####/dlf/x6::370120c59da884dbdc375b1582a2142c1363533393a313335363032353737363a3646314a313937334a323530303031356026339.xls/sfn/RIGHTPAGE_scen_1_deal_cf.xls
The referrer for the GET looks like this:
https://www.website.com/somethingdb/quickframe/prod/#####/single_frame_results/correct_output.asp?THIS_KEY=370120c59da884dbdc375b1582a2142c1363533393a313335363032353737363a3646314a313937334a32353030303&sPagename=RIGHTPAGE&nScenarios=1&bShowExtendedFields=1&bShowAllCollats=0&ShowUnderlyingPage=0&sUnderlyingPage=&WebsitewrapDb=websitewrap&iSettleId=&bScrollbars=true&time=1356025839577
Like I said, my knowledge of these things is very limited but I do know that once I click on the download button, the GET from above is an actual file name that is stored on the website’s server. I can go into Excel, click on “Open” and put that file path in and it will download EXACTLY what I need.
So here is what I am thinking. If I could tell the website to simulate the download process, and log what that GET is, then I could just store that away, and when the Macro finishes generating all of the reports I need, it can just navigate back into Excel and set up a simple Loop to download all of them?? I have identified the portions of the GET that change:
x6::370120c59da884dbdc375b1582a2142c
63032353737363a3646314
6026339
This is my first post, so I apologize if I was too long winded in my back-story. Just wanted to be as clear as possible from the get go. I am wondering what is truly happening inside the website? Is what I am suggesting making sense? Is it possible? Is there a better way. Thanks in advance for any help.

Develop custom Javascript html editor

I want to develop a custom javascript html editor. My starting point was:
http://hypertextarea.sourceforge.net/
I understood how the mechanism works but the problem is that I cannot find the point where if I focus the iframe I have the cursor displayed.
Then if I press a key I see the letter entered there. Can you please explain me how this javascript shows the editor cursor and how it write in the iframe the characters that I write?
All javascript used by this editor is at
http://hypertextarea.sourceforge.net/javascript/HyperTextArea.js
It is handled by the function enableDesignMode (line 755), which tries to turn on designMode for the <iframe>.
In other words, this is a browser feature and you can make an HTML page editable with nothing more than a single line of JS (or a single HTML attribute), but the library provides other niceties like the ability to format text and insert tables.
Depending on exactly what you want: onKeyPress and onFocus

hide html page source

Is there is any way to hide asp.net page view source?
If you mean, can you hide your ASP.NET code: it's not visible in View Source.
If you mean can you hide your HTML: you can discourage casual peeking by creating your HTML on the fly via Javascript or AJAX, but a developer will always be able to see what you are doing, using simple tools like Firebug and Fiddler.
Edited to add:
I wasn't thinking of obfuscation (though that also discourages casual peeking), I was thinking of using javascript to pull down HTML. Doing a View Source will only show a bunch of <SCRIPT> tags.
But it appears his question has been revised to go in a different direction anyway, to can I keep people from downloading my images, and the answer to that is a simple no. Making money from small numbers of images is not a viable business model. (If you have thousands of images, that's another story.)
Edited to add:
The conventional way of making a catalog of photographs is to [a] show low-resolution previews, [b] put a watermark on each image (here's an example), or both.
Are you talking about ASP.NET or the result? Since ASP.NET is server-sided, it simply returns HTML. Basically, your ASP.NET file is processed by the server and variables and functions are converted into HTML. Your users can view the HTML but not the ASP.NET as it resides on server.
No, there is no way to hide the html source of a page. It's just not possible. There are tools that will promise the ability to do this, but don't believe them. Consider that it might not even be a traditional web browser that downloads the html.
What you can do is obfuscate it a bit, but even that is trivial to reverse.
No, you can't hide HTML, and there's no point either. There's nothing of value in the HTML. It would take maybe a couple hours for a skilled developer to replicate the look and feel of a website without even glancing at the HTML. In fact, it would probably be easier for him to do it his way.
The ASP/code-behind, however, already isn't visible. It's processed on the server and outputs HTML. Only the HTML (and CSS etc.) makes it to the client.
Reading the comments, it appears you want to prevent users from downloading your images. You can't really do that either. You can make it a lot more difficult for users to download them by embedding the images in Flash, or a Java applet, or something like that, but a determined thief could still decompile it and nab your image. Easier yet, he could just take a screenshot and save it out.
The best you can do is restrict access to the image to only certain users by making the image source point to a script instead that runs some validation before outputting the image.
This is not true you can hide source code. One way would be to write a loop that puts a 100k /n in the source code at the top. So it will push it so far down with white space that you can see it :-)
Where there is a problem there is a way.
And for all those who dont like this. Amazon used to hide there code somehow until sometime back.

Categories