load Jquery in designer page

[sgagn0]

Where is located the designer html page? i would like to add jquery in it without going through the custom directory. I would like to add it directly to the html page as otherwise we have timing issues.

[David]

The Designer is not a static HTML page that you can add to -- it's produced dynamically by a program. The /custom directory is the only way to link external files into it. Why does jQuery need to load into the Designer page, though? Did you plan to use it from the scripting 'hooks' in the DDS conversion theme?

[sgagn0]

It is for new development (no conversion).
We want to create a calendar widget (Full calendar), but do not want the JS to be loaded on all our pages as 99.9% of the time it would be useless.

We tried to load the calendar JS using $.getScript function of JQuery, but had issues with the timing of JS loading (order in which they are loaded and the time it takes for each to load)
I also had this timing issue for other pages we did, so I removed the JQuery JS from the custom directory and added it to the start.html (which we renamed). After that it worked as a charm. I was looking to do the same thing here.

[sgagn0]

Another thing is that we would like to load the JS from CDN instead of a file in the custom directory.
ex: //cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.min.js

I know we can do that at runtime with external JS, but we also need these JS at design time.
Is it something we can do in the designer?

[David]

Yes, when files are loaded from /custom, the ordering is not necessarily going to be what you want. They come in whatever order the system produces the directory listing. It is possible to load the files through scripting, though, and have them done in the right order. We have an API that can be used for this:

http://www.profoundlogic.com/docs/displ ... +config%29

I'd guess that jQuery might also have its own way of doing this sort of thing -- most JS frameworks do.

For what you're trying to do, though, I'm doubting the need to actually load the jQuery files into the Designer. I'd think that the scripts need to execute only at runtime? The widget property setters get a 'design' flag that could be used to avoid running the jQuery calls in the Designer.

See this widget, for example, in the Designer a preview image appears -- the more complex rendering happens only at runtime:

http://www.profoundlogic.com/docs/displ ... om+scratch

Would this approach help you?

[sgagn0]

pui.loadJS is exactly what I was looking for.
Now I have another issue. I would like to load the JS only in design mode. Looking at documentation I found inDesignMode() function... but it does not work.
How do I know that I am running in desgin mode?

[David]

What sort of problem are you having with 'inDesignMode()'? Can you explain what is going wrong?

For another way to determine design mode, see the custom widget programming example at the link in my post above. The parameter to the widget property setter functions has a 'design' property that you can use.

[David]

We had a look into this and found that the 'inDesignMode()' API is not defined due to an issue in our API export process. We've corrected the problem for the next release.

Meanwhile, does using the 'design' flag on the widget property setter parameter work for you?

[sgagn0]

Is the issue also affect the currentUser() (or any other profound api) usage?
We would use those API not just on the property setter but also on the page load to load different JS files based on the current user and designMode value.

[David]

Only 'inDesignMode()' is affected by that. 'currentUser()' is available, although I don't think it will do exactly what you are expecting. That API returns the current user of the Profound UI application session. When there is no Profound UI application session (such as in the designer), it returns a dummy value. There is no API that returns the user who is running the designer, although it is available in a global variable on the page. Also, I see that the 'design' flag in the widget property setter is not going to help you with your file loading.

Based on everything you are telling me here, I think you could approach it like this:

1. Define a global variable in your start.html page. This will indicate that you are in runtime mode. If that is not defined, you can assume that you are running in the designer. You can work around the 'inDesignMode()' API not being available like this. I'm still not understanding why you would need to load extra scripts like jQuery into the designer only, though. What would be the purpose of this? Maybe there is a simpler way to accomplish what you are looking for?

2. If running in the designer, there is a global variable IBM_USER that has the user profile name.

3. If not running in the designer, you can use the currentUser() API.

One problem I think that you'll run into with this is that you are not necessarily signed in when the page loads. For example, when the Profound UI sign on panel appears after the initial page load, you have not yet signed in with your user profile and are running as QTMHHTP1. After you sign in, it will switch to your user profile. Your file loading process would have to be aware of this and account for it.