ScriptParts Background Information
ribbon. This script needed a check to see that it only rendered when the page was not in edit mode, otherwise the content accumulated each time
when saving the contents. One unpleasant side effect is, the position of the script functionality didn't show up in the content editor. As this page
didn't need further editing this wasn't a real issue, but still a bit annoying. This I could also resolve in a Q & D (Quick and Dirty) way by first clearing the contents of the div $("#myid").html(""); and
then adding the new elements.
For checking the edit mode I found the following
answer from Andrey Markeev on stackexchange.
Then only about a week later, I visited the Dutch SharePoint Saturday where among other interesting sessions there was a session
by Wouter van Vugt called 'Customizing the SharePoint 2013 Rich Text Editor', see sessions.
I really thought that I had a good scenario for using this, no, not ScriptParts jet. I wanted to create functionality for a simple image mapper.
I have created a script like that in the past (2003 not in SharePoint, but in our custom build content management system), that worked in the
then available Internet Explorer. The first thing that I did was to update this script for usage in multiple modern browsers contenteditable region.
I got there in the end, using the standard dom, but I was sick and tired of it, and who uses image maps anyway?
Then it came to dawn on me, I could use the idea's presented by Wouter, to also allow rendering of my earlier created script within
the content editor, without it being saved as content. After trying this out for myself, I came to think about how it would be really nice
to have this as a reusable feature. Starting to think about this, I thought wouldn't it be nice to create something that handles reusable scripts
as if they where webparts. This is what I started working on then, just as a challenge, and ScriptParts is a result of that.
Creating ScriptParts I used different sources on the internet, but I don't have a list of all of them. For adding the flyout on the ribbon button
I found CustomAction Static and Dynamic Flyout Anchor Ribbon Button with Dropdown
from Sonja Madsen that was quite useful. Also I used my own 'Smartloading' of jQuery that I used in Adding direct access to the ECB menu in SharePoint 2013.
Here I also use the info I found on The Effect of SharePoint 2013′s Minimal Download Strategy (MDS).
So what does the framework do?
The sandboxed solution activates a Site Collection feature that creates a Document Library called 'ScriptPart Library' on the rootweb. It also adds
the Booden.net.ScriptParts.js file to the Style Library, and adds this as a ScriptLink. It also adds the ribbon button.
On loading the script, it checks to see if jQuery is already included on the page, if so, this version will be used. If not, the script check if
there is a jQuery object that is set using the .noConflict method. If found it uses this version, if not it loads jQuery from 'ajax.aspnetcdn.com'
and when finished starts checking for ScriptParts.
After jQuery is available, the ScriptParts code checks if there are elements with a class called 'booden-scriptpart', if found, it reads the settings
ScriptPart. When in edit mode some extra content is added (title etc.).
In edit mode the script handles some editor events and adds the menu and settings popup, it also provides the action for populating the ribbon flyout.
When adding a new ScriptPart, the code checks if the script is available, if not the script is loaded. If available the default settings
are read and added to the ScriptPart.
The script also has some code to deal with a possibly used minimal download strategy.
Things to know
I have tested the script using modern versions of IE, Firefox and Chrome. As I use jQuery so I hope I'm covered with browser support. As there
could be many scenarios where ScriptParts can be used I am unable to test everything. For instance if a really old version of jQuery is used
on the site.
If you find an issue, and can give me a good description of how this can be reproduced, then you can send me an email
and I will see if I can fix it.