Hi all. During digging into different sharepoint *.debug.js files I also investigating into sp.ui.dialog.debug.js. Out of the box modal dialog framework has some number of methods for manipulating dialog window, but some methods (that might be useful) missed. For example programmatically maximize or restore dialog window. Here is a couple of extension methods that I’ve created:

• maximize -  maximizes modal dialog window
• restore -  restores modal dialog window
• toggleView – maximizes if modal dialog window is not maximized and vice versa
• setSize – set size for modal dialog window (height, width in pixels)

Here is the code:

ExecuteOrDelayUntilScriptLoaded(function(){
	SP.UI.ModalDialog.prototype.toggleView = function () {
		this.$z(null);
	};
	SP.UI.ModalDialog.prototype.maximize = function (){
		if(!this.$S_0){
			this.$z(null);
		}
	}
	SP.UI.ModalDialog.prototype.restore = function (){
		if(this.$S_0){
			this.$z(null);
		}
	}
	SP.UI.ModalDialog.prototype.setSize = function (width, height){
		if(typeof width == "number" && typeof height == "number") {
			this.$Q_0(width, height);
		}
	}
}, "sp.ui.dialog.js");

Example of use:

var dlg = SP.UI.ModalDialog.get_childDialog();
dlg.toggleView();

Enjoy and good luck in spdevelopment.

Hello to all. Recently I was playing with sharepoint toggle button (when answering one of the sharepoint.stackexchange questions). The question is how to react on user actions in the rich text area, when we click or select a text. Toggle button has additional attribute called QueryCommand. If you specify action for this command, this action will be fired every time when you click (or select a text) in the rich text area of wiki page or content editor web part. I’ve created simple page component (using information from this posts - Implementing Page Components in the SharePoint Ribbon and Sample code: Asynchronously checking if a Ribbon command is available). My solution contains two javascript files – one with custom page component and another is a loader. You may know, that almost javascript files in SharePoint 2010 loads dynamically, using on demand framework (I’ve posted about this), so this sample also is an example of using on demand javascripts.

Solution is rather simple, you can find it in downloadable section in the end of the post.When you select word “SharePoint” in the rich text area, button become active. The only trouble that I have is to make custom button smaller. I’ve tried different TemplateAlias (o2, bold, italic as in cmdui.xml), but button appear only if using o1, may be I missed something, but can’t figure out it. Now it looks like this:

Download solution here (10.05 kb) and good luck in spdevelopment.

Hi all!

If you are using Firefox, know about Firefox Greasemonkey add-on, love javascript and jQuery, and (sometimes) you love SharePoint then this post is directly for you. If you are not using Firefox, you just can see what can be done with Greasemonkey and SharePoint, and may be you immediately start using Firefox . Let’s start.

During SharePoint development I have to click a lot in SharePoint UI. And most actions or clicks used more frequently as others. For example Site Actions –> Site Settings –> Site Features, Site Actions –> Site Permissions, Site Actions –> More Options, All Site Content, Edit Page and so on… One day I decided that this is too many clicks for me per day. To reduce number of clicks I’ve wrote Greasemonkey script to automate and increase speed of some routine actions in SharePoint. Script you can download in the download section of the post.

Currently here is main highlights of script features:

   1. Site Actions drop down replaced with “actions” link:

when mouse hover the “actions” dialog window appear (jQuery UI Dialog, it is draggable), which contains list of most used links:

More...

Hi all!

You clicked ribbon buttons a lot in SharePoint 2010. Sometimes, you as developer are interested in what code is executed when particular button is clicked. I’m going to show how you can easily find particular js handler for any ribbon button. For example, imagine you want to find what code is fire when you click “Edit HTML Source” drop down button in a rich text editor. First of all inspect this element using firebug, or any favorite browser’s dev tool:

Consider id attribute - Ribbon.EditingTools.CPEditTab.Markup.Html.Menu.Html.EditSource-Menu16. Next go to 14 hive and under TEMPLATE\GLOBAL\XML\ find cmdui.xml file. This file contains definition for all ribbon buttons in SharePoint. Search in this file by word Ribbon.EditingTools.CPEditTab.Markup.Html.Menu.Html.EditSource, you’ll find this definition:

Hi all!

Sometimes during spdevelopment you may need to dig into OOB SharePoint javascript files and look how they work. As you may know, under layouts folder in 14 hive there are also debug versions of javascript files. When you are debugging you solution in visual studio by pressing F5 it might automatically replace standard js files with it debug versions, so you can set up breakpoint in OOB js files and try to debug. But what if you aren’t using F5 debugging, or want to force SharePoint to load debug versions in all site collections by default? You have two options here.

One option is to modify web.config for particular web application, so all sites under this web app will be automatically load debug versions of javascript files (and this is pretty cool for developer machine). You need to modify compilation tag and set attribute debug to true as on screenshot below:

so, before this action your scripts look like follows: