Namespace RequireJS in JS API to avoid conflicts with 3rd party AMD libraries - requirejs

I want to include jquery and jquery UI along with requirejs( at top of the header ).
with WordPress starting to utillize dynamic module loading and React, primarily in its administrative dashboard and content editing experience, this became impossible. I am experiencing constant issues where dynamically loaded jQuery UI components are being picked up by RequireJS which attempts to load them within its own scope. Under this condition, RequireJS fails and jQuery UI does not load in the global scope as expected.
this is the exact issue check console on your local
Console screenshot
can anyone solve it? thanks in advance!..
<script src='http://requirejs.org/docs/release/2.1.18/minified/require.js'></script>
<script src='http://code.jquery.com/jquery-1.11.3.min.js'></script>
<script src='http://code.jquery.com/ui/1.11.4/jquery-ui.min.js'></script>

Related

Script files in index.html loads before the content

I am moving an existing html portfolio hosted in githubpages to Blazor, but when the
index.html loads it doesn't load the script libraries on time, but it loads them before the content is shown.
Do you know if there is Scripts section as in ASP.NET MVC, or do you know how I can tell to Blazor
to loads the content synchonously?
Example: The working website is here http://tanyo.takerman.net. The
non working is here http://tanyo-blazor.takerman.net The second one
don't loads the scripts on time, but too late after the html is
loaded.
Disclaimer: You are using a LOT of JS. Blazor keeps an internal render tree - a bit like a shadow dom, but not exactly that. If your JS changes the dom inside the <app> tag, you can expect errors as Blazor won't know about those changes.
To delay Blazor startup (I think that is what you are trying to do) until after your scripts have loaded, you can turn off autostart.
<script autostart="false" src="_framework/blazor.webassembly.js"></script>
And then in some other script that runs at the right time (I don't know how you are going to know what is the right time), you can call window.Blazor.start(); to start the Blazor app.

Does Kendo UI support chrome apps/extentions?

I tried to port my succesefuly worked my kendo-based site as chrome app. But app does not works. I found on chrome developer console exception message "extensions::platformApp:17 history.pushState is not available in packaged apps." on
<script src="kendo/js/kendo.mobile.min.js"></script> string
I found the same problem on angular with a solution, but did not found for the Kendo.
Any way to resolve it?
By default Kendo UI (and Mobile) doesn't use the History API, due to its rather limited support in the past. If you explicitly enabled it, you can delete this option, though you will probably have to update your navigation throughout the apps:
http://docs.telerik.com/kendo-ui/api/javascript/mobile/application#configuration-pushState

MathJax enabled on page interferes with Rocket Loader

I am using cloudflare as cdn service (Free). But when i use mathjax on any page it causes problem with rocket loader enabled.
Here is the link : http://www.e4exam.com/Questions/profit-and-loss
I am getting this when i enabled Rocket Loader
But when i disabled rocket loader it is ok.
So is there any way to use MathJax with Rocket Loader enabled.
The rocket.js file that Rocket Loader uses apparently replaces <script> tags in your page with its own object class, but this is not implemented in a way that is fully compatible with the native browser implementations. MathJax uses <script> tags to store the math internally in the page, and these differences in implementation trip up MathJax.
One solution apparently is to add data-cfasync="false" to the <script> that loads MathJax.js (see this MathJax issue tracker for details).

OpenLayers's CSS breaks after publishing to Azure Web Site

I've created a very simple ASP.NET 4.5 MVC4 web site which uses OpenLayers 2.12. It's got only one page that shows a map with a few points and lines on it. If I run it locally, it runs fine, but after publishing to my Azure Web Site, the OpenLayers' CSS files won't load. I have now added the OpenLayers CSS hard coded in my bundleConfig, and now it works fine. But of course, this is not what I want, because OpenLayers has specific CSS files for other platforms and browser versions etc.
Locally, I just have to include openlayers.js and OpenLayers then adds the right css files. Does anybody know why this doesn't work after publishing to Azure?
From the docs in openlayers.js:
Please remember that when your OpenLayers script is not named
"OpenLayers.js" you will have to make sure that the default theme is
loaded into the page by including an appropriate <link>-tag,
e.g.:
(code)
<link rel="stylesheet" href="/path/to/default/style.css" type="text/css">
(end code)
Because Azure changes the file names that are included, I indeed should be adding the reference to the default style myself. Also, I can just link to style.css, the other css files for e.g. IE6 or Mobile won't be uses automatically, these are just there for yourself to use it when appropriate.

Using jQuery-UI with BoilerPlateJS

How can I include JQuery-UI components with BoilerPlateJS? I have an web app that used jquery tabs, datepicker, etc.
Thanks
You can just add the jquery-ui script and css files on your application's index.html file, so all JQuery-UI components will be available globally.
as #guigouz mentioned, you need to initialize your jqueryui elements in the activate method in the component, after your ui panel is created.
I added a jqueryui sample here https://github.com/slayerjay/boilerplatejs/tree/master/src/modules/sampleModule2/jqueryui

Resources