CHUVASH.eu

CHunky Universe of Vigourous Astonishing SHarepoint :)

javascript toolkit on text file

Referencing javascript libraries from Content Delivery Networks (CDN) like jQuery can have many benefits. The self-hosted javascript files are on the other hand give you more control. But in one situation it is much better with cdns: the development. Like Marc D Anderson pointed:

I didn’t realize it at the time, but this txt file has become a standard part of my toolkit already. I’ve added it to three client environments just since last week. It’s the A #1 fastest way to get something up and running, even if you know you’re going to host the files locally later.

This kind of toolkits is really useful in situations where you have to quickly try/test some ideas without uploading multiple files to your server. Here comes my version of this javascript toolkit file:

<!--Add this to the webpart-->
<!--Inspiration got from sympmarc
http://sympmarc.com/2012/04/20/referencing-jquery-jqueryui-and-spservices-from-cdns/?utm_source=rss&utm_medium=rss&utm_campaign=referencing-jquery-jqueryui-and-spservices-from-cdns
and Thorsten Hans:
https://www.nothingbutsharepoint.com/sites/devwiki/articles/Pages/SharePoint-Development-Using-HeadJS-KnockoutJS-And-SPServices.aspx
-->

<!-- Reference the jQueryUI theme's stylesheet on the Google CDN. Here we're using the "Start" theme -->
<link  type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/start/jquery-ui.css" />

<!-- Reference head.js on cdnjs (Cloudflare)-->
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/headjs/0.96/head.min.js"></script>

<!-- Load all other scripts async and run sync: -->
<script type="text/javascript">
	head.js("http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js",
		"http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js", 
		"http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js",
		"http://cdnjs.cloudflare.com/ajax/libs/knockout/2.0.0/knockout-min.js",
		"http://cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/0.7.1a/jquery.SPServices-0.7.1a.min.js",
		"my.js" );
</script>

In my file I even use head.js for loading multiple javascript files at the same time, like Thorsten Hans described in his blog post.

While using head.js you have to have your javascript code in a separate file and reference it in head.js as the last file. Otherwise your javascript code will be executed before jQuery is loaded and it will break the solution. If you want to have your code in the same file as your markup, you have to provide a callback function which will be run after all javascript files are loaded:

head.js("......", "....", myCallback);
function myCallback() {
  $("#div").text("hej");
}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Вула Чăвашла

VulaCV - Чăвашла вулаттаракан сайт

Discovering SharePoint

And going crazy doing it

Bram de Jager talking Office 365, SharePoint and Azure

My view and thoughts on Productivity and more.

My programming life

and everything in between

SharePoint Development Lab by @avishnyakov

It is a good place to share some SharePoint stories and development practices.

SharePoint Dragons

Nikander & Margriet on SharePoint

Paul J. Swider - RealActivity

RealActivity is a specialized healthcare services and solution advisory firm.

Mai Omar Desouki - Avid SharePointer

Egyptian & Vodafoner - Senior SharePoint Consultant

Cameron Dwyer | Office 365, SharePoint, Outlook, OnePlace Solutions

Office 365, SharePoint, OnePlace Solutions & Life's Other Little Wonders

paul.tavares

Me and My doings!

Share SharePoint Points!!

By Mohit Vashishtha

Jimmy Janlén "Den Scrummande Konsulten"

Erfarenheter, synpunkter och raljerande om Scrum från Jimmy Janlén

SPJoel

SharePoint for everyone

SharePointRyan

Ryan Dennis is a SharePoint Solution Architect with a passion for SharePoint and PowerShell

SharePoint 2020

The Vision for a Future of Clarity

Aharoni in Unicode

Treacle tarts for great justice

... And All That JS

JavaScript, Web Apps and SharePoint

%d bloggers like this: