Entries in SharePoint (11)

Monday
Dec162013

Resource for SharePoint farm upgrade with server name change

This was a question I had someone ask last week regarding how you might handle the situation where you want to change the host name of your SharePoint farm in an upgrade (or just the host name for any web app really) knowing that all embedded links will be broken.

 

The low hanging fruit is to set a DNS record so that the old and new point to your new server address, but if you want to alter some site names and/or alert users that they have an old, deprecated url instead of just forwarding them on, the solution below might work for you.

 

The following script is for the node.js platform and, if run on a server with your old host name's resolution, will intercept incoming http requests, map it to your new server, allowing for site renaming and provide the user with a message as well as the new 'best guess' url to what they were trying to reach.  It is pretty straightforward and should be relatively easy to modify as needed.

 

HTTPS (443): This is geared toward standard HTTP traffic, if you need a version to work with HTTPS on port 443, you can find some subtle changes that will be needed in the node.js information here http://nodejs.org/api/https.html.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
// Kevin Guyer - 2013
// Node.js script to handle server (SharePoint) name changes
//  This is designed to catch the use of old urls and present an infomational page with the new url to the resource
//  Test with this to see URL altering:  http://localhost:8080/hr/foosite/barsite/somelibrary/somedoc.pdf
 
// Intercept incoming port 80 or 443 (needs to operate on both) - set the port below for flavor you are running
var http = require('http');
var url = require("url");
var server = http.createServer();
 
server.on('request', function(request, response) {
    var hostname = request.headers.host;
    var newHostname = 'https://yournewfarmpath';  // no trailing slash, set to your new farm/server name and path
    var pathname = url.parse(request.url).pathname;
    var newPathname = pathname;
    var query = url.parse(request.url).query;  // optional, not used yet
     
    // Run match logic on array elements to determine what needs to be displayed
    var aResPath = pathname.split('/');
     
    // Modify path elements as needed with element matching:
    var wasAltered = false;
    if(aResPath.length >=1){
        try{
            if(aResPath[1].toLowerCase() == 'hr'){ aResPath[1] = 'HumanResources'; wasAltered = true; }
            if(aResPath[3].toLowerCase() == 'barsite'){ aResPath[3] = 'NewBarSite'; wasAltered = true; }
            // add others as needed, sites on root starting at index [1]...
        }
        catch(err) {
            // handle as desired...
        }
         
        if(wasAltered == true){
            console.log("Detected swap string in path, altering output.");
            newPathname = '';
            for(i = 1; i < aResPath.length; i++){
                newPathname = newPathname + '/' + aResPath[i];
            }
        }
    }
    // Build response message
    var payload = '<h2>Oops.</h2><p>The url you attempted to reach (<em>' + hostname +  pathname + '</em>) is no longer valid.</p>';
    // Optional: Build and supply a best bet url   
    payload += '<p>Our best guess for the new url for this resource is <a href="'+ newHostname + newPathname+'">'+ newHostname + newPathname+'</a>.</p>';
    payload += '<p>Please update your favorite or link source to reflect this new address.</p>';
 
    // Optional step to log the old url hit via a web API (REST) - todo...
 
    // Build and deliver response   
    response.writeHead(200, {"Content-Type": "text/html"});
    response.write(payload);
    response.end();
});
 
var port = 8080;  // change this to 80 or 443 as needed
server.listen(port);
server.once('listening', function() {
    console.log('Redirect server is now listening on port %d', port);
});
Monday
Jun242013

Banner with Quick Access to Search a SP2010 List

This is a quick piece of script and HTML that I threw together to help make it easier for our users to search a list or library in SharePoint when they were on a view page. Once added to your environment you can add this to the top of any view and it will both display the name of the list in the banner and dynamically set itself up to search the list/library that the hosting view lives on.

There is a search control included in SharePoint but this saved a few steps (clicks) we thought might be critical in getting people to use search more often and it makes for a nice custom banner to boot. With a little tweaking you can further change the banner text, the control's watermark and the banner image. With a few small changes this could also have the scope set to the site instead of a list.

All of the code, images and documentation for deployment is in the accompanying .zip file. Let me know in the comments if you have further suggestions.

DOWNLOAD SEARCH BANNER

//Kevin

Wednesday
Apr032013

Metro-Style Easy Tabs for SharePoint 2010

This is an item I flashed a development iteration of to the group in my Richmond SharePoint Saturday presentation and have since cooked up what is called 'V2' of the effort but is really the first version that I've made available. This approach just simplifies the initial version by making the tile's images all the same, though I did add a dynamic element to the colors. I'm not yet sure if that is a good idea, so I have instructions below to turn that off if you'd like. This is all based on the brilliant client-side Easy Tabs script that I just modified and simplified for the new visual style.

You can deploy these as you would 'normal' Easy Tabs for SP, my instructions for using the original script are here though you'll want the new code as it is not in that package:

Want to kill the random tile colors? Yeah, can't say I blame you...

Edit line #108 in the file from this:

var colorNumber = 1 + Math.floor(Math.random() * 9); // random start 1-9

to this (where the '1' can be any number from 1 to 9) :

var colorNumber = 1;


I may make more versions of this, including one allowing for a single color for the tiles.  Let me know if there is a feature that you might like that I should consider.  I'm not sure yet how to reliably incorporate custom images per tab (that make sense to the tab's context) without the end user editing the script and violating the plug and play goal here.

This version looks like the above screenshot with both a hover effect and a visualization for selected items.  Over-n-out.

Saturday
Mar232013

The Cheapskate's Guide: Extending SP 2010 Functionality

This is what I am presenting at SharePoint Saturday in Richmond VA and the accompanying file packages that go with that talk. There are 13 items total, each of them containing any scripts and resources needed (that I can provide) and a PDF breakdown of what it takes to deploy them. 5 of the 13 use Javascript controls I picked up for cheap from Codecanyon.net, you'll need to grab the control mentioned to get these to work, the others contain all that you need to get running. Drop me a line if you do something cool with one of these or modify them.

 


The Slides:

The Controls:

  1. Calendar Viewer (free)
  2. Foobar Alerts - $2 Coffees (foobar 2.1)
  3. Tabs – Original (free)
  4. Tabs – Metro (free) (Edit:Published here!)
  5. News Page Rotator - $4 Coffees (Royal Slider 9.4.8)
  6. FAQ (free)
  7. Tabbed Container - $4 Coffees (Zozo Tabs v2.2)
  8. I Want To (free)
  9. Image Rotator - $3 Coffees (jQuery Banner Rotator)
  10. Google RSS Static (free)
  11. Google RSS Scrolling (free)
  12. Snow - $1 Coffee (JSized Snow Effect)
  13. Google maps traffic widget (free)

Other links of note:

Tuesday
Jan152013

A Fresh Visualization for SharePoint Calendars with SPServices

This is a set of scripts that can be dropped into a SharePoint 2010 deployment to allow for an alternate view of calendar lists.

There was also a request to color cancelled items that the user had on the calendar so I've left that code in there. The widget display start and end times as well as alter the behavior for those events that span days. I also added CAML support so you can provide your own query to it if you want or just you the built-in default. There is a separate CSS file to do your own styling and a few images that I use. One is optional and controlled by the arguments to the script.

I chose to set this up to live in our farm's common repository and be called relatively easily from any page so you see 2 files here, one being the LoadCalendarWidget function and the other being the code we drop into a page to create the calendar control. Options/args you pass to the function are:

  1. Site's URL, no end '/' character
  2. List name
  3. Title to appear for the webpart
  4. GUID of your calendar list
  5. # of results to show
  6. Optional CAML query to use
  7. Indicator to show icon or use 'Add to Outlook' text instead

If you want to keep it simple and not place file directly on your farm's servers, the zipped package below has all of the files needed and is just about ready-to-use for a dirt-simple deployment.  There is a PDF included that contains instructions on use that are a little more detailed than in the posting that follows.

Download all code and images used here.

This is the code we call to create the control. I house this in a text file in a library and add to the page in a CEWP as the 'Content Link'.

1
2
3
4
5
6
7
8
9
10
11
12
<!-- jQuery -->
<script type="text/javascript" src="https://myfarm/_layouts/1033/jquery.SPServices-0.7.2.min.js"></script>
<script type="text/javascript" src="https://myfarm/_layouts/1033/jquery.dateFormat.js"></script>
<!-- Calendar Widget -->
<script type="text/javascript" src="https://myfarm/_layouts/1033/jquery.SPS.Calendar_Widget-1.0.js"></script>
<link href="/_layouts/1033/styles/Calendar_Widget.css" type="text/css" rel="stylesheet" />
<script language = "javascript">
    $(document).ready(function() {     
        LoadCalendarWidget("https://myfarm/hr/", "Upcoming HR Events Calendar", "Event Calendar", "{B7FE9372-9724-4504-9699-DEDD445B1BA3}", 8, ,true); 
    });
</script>
<div id="cw_TopContainer" style="margin-bottom:15px;"><div id="cw_HeaderContainer"><table style="width:100%;"><tr><td><span id="cw_HeaderTitle"></span></td><td style="text-align:right;"><a id="cw_HeaderLink" href="#" >Calendar View</a></td></tr></table></div><div id="cw_ItemsContainer" /></div>

And this is the function. I put it in our 14 hive for access across the farm, you put it where you want, just make sure the script source in the code above points to where you dropped this.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
// REQUIRES:
// - jquery-1.8.0.js or higher
// - jquery.SPServices-0.7.2.min.js or higher
// - jquery.dateFormat.js
 
function LoadCalendarWidget(cw_SiteUrl, cw_ListName, cw_ListNameForHeader, cw_EncodedListGuid, cw_ReturnRowCount, cw_CAML , cw_ShowIcon)
{
    // USAGE: --------------
    // cw_SiteUrl = "https://myfarm/hr/"; // Site's URL, no end '/' character
    // cw_ListName = "HR Events Calendar"; // List name
    // cw_ListNameForHeader = "Upcoming HR Events";  // what will appear in webpart
    // cw_EncodedListGuid = "{B7FE9372-9724-4504-9699-DEDD445B1BA3}";  // GUID of your calendar list
    // cw_ReturnRowCount = 15;  // # of results
    // cw_CAML = Your optional CAML query
    // cw_ShowIcon = true;  // false will use 'Add to Outlook'
 
    var cw_ListUrlForHeader = cw_SiteUrl + '/lists/' + cw_ListName;
    var cw_IcsEventPath = cw_SiteUrl + "/_vti_bin/owssvr.dll?CS=109&Cmd=Display&List=" + cw_EncodedListGuid + "&CacheControl=1&Using=event.ics&ID=";
    var cw_ListItemDetailPath = cw_SiteUrl + "/Lists/" + cw_ListName + "/DispForm.aspx?ID=";
    var cw_CamlQuery = "";
    if (cw_CAML.length < 2) {
        cw_CamlQuery = "<Query><Where><Geq><FieldRef Name='EventDate' /><Value IncludeTimeValue='TRUE' Type='DateTime'><Today/></Value></Geq></Where></Query>";}
    else { cw_CamlQuery = cw_CAML; }
 
    // format header info
    $('#cw_HeaderTitle').html(cw_ListNameForHeader);  // title
    $('#cw_HeaderLink').attr('href',cw_ListUrlForHeader); // link
     
   $().SPServices({
        operation: "GetListItems",
        webURL: cw_SiteUrl,
        listName: cw_ListName,
        async: false,
        CAMLRowLimit: cw_ReturnRowCount,
        CAMLQuery: cw_CamlQuery,    
      
        completefunc: function (xData, Status) {                           
           $(xData.responseXML).SPFilterNode("z:row").each(function() {            
                var cw_id = ($(this).attr("ows_ID"));
                var cw_title = ($(this).attr("ows_Title"));
                    if(cw_title.length == 0) {cw_title = 'No event title.';}
                     
                // By request, if an item is canceled, make that fact stand out.
                cw_title = cw_title.replace("Deleted:","<span class='cw_canceled'>DELETED:</span> ");
                cw_title = cw_title.replace("DELETED:","<span class='cw_canceled'>DELETED:</span> ");
                cw_title = cw_title.replace("Cancelled:","<span class='cw_canceled'>CANCELLED:</span> ");
                cw_title = cw_title.replace("CANCELLED:","<span class='cw_canceled'>CANCELLED:</span> ");
                 
                // Clean up date formats               
                var cw_startdateday =       $.format.date(($(this).attr("ows_EventDate")), "M/d/yyyy");
                var cw_startdatetime =      $.format.date(($(this).attr("ows_EventDate")), "h:mm a");
                var cw_startdate =          cw_startdateday + ' - ' + cw_startdatetime;
                var cw_enddateday =         $.format.date(($(this).attr("ows_EndDate")), "M/d/yyyy");
                var cw_enddatedaytime =     $.format.date(($(this).attr("ows_EndDate")), "h:mm a");
                var cw_enddate =            cw_enddateday + ' - ' + cw_enddatedaytime
                 
                var cw_CX = '<div class="cw_item">';
                if(cw_startdateday == cw_enddateday)  // single day event
                {
                    cw_CX += '<table width="100%" cellpadding="0">';
                    cw_CX += '<tr><td colspan="2"><a href="' + cw_ListItemDetailPath + cw_id + '" target="_new" class="cw_title">' + cw_title + '</a></td></tr>';                  
                    cw_CX += '<tr><td><span class="cw_time">' + cw_startdateday + ' ' + cw_startdatetime + ' to ' + cw_enddatedaytime +'</span></td>';
                    cw_CX += '<td align="right" valign="top"><a href="' + cw_IcsEventPath + cw_id + '" target="_new">';                
                    if(cw_ShowIcon) {
                        cw_CX += '<img src="FARM/Images/add_item.png" class="cw_addIcon" title="Add to Outlook Calendar" /></a></td></tr>';
                    }
                    else { cw_CX += '[Add to Outlook]</a></td></tr>'; }                      
                    cw_CX += '</table>';
                }
                else // multi day event
                {
                    cw_CX += '<table width="100%" cellpadding="0">';
                    cw_CX += '<tr><td colspan="2"><a href="' + cw_ListItemDetailPath + cw_id + '" target="_new" class="cw_title">' + cw_title + '</a></td></tr>';                  
                    cw_CX += '<tr><td><span class="cw_time">Start:' + cw_startdate + '</span></td><td align="right" rowspan="2" valign="top"><a href="' + cw_IcsEventPath + cw_id + '" target="_new">';
                     
                    if(cw_ShowIcon) {
                        cw_CX += '<img src="https://cbhq.cbh.com/_layouts/images/myelite2/cal/add_item.png" class="cw_addIcon" title="Add to Outlook Calendar" /></a></td></tr>';
                    }
                    else { cw_CX += '[<a href="' + cw_IcsEventPath + cw_id + '" target="_new">Add to Outlook]</a></td></tr>'; }                    
                    cw_CX += '<tr><td><span class="cw_time">End:' + cw_enddate + '</span></td></tr>';
                    cw_CX += '</table>';             
                }              
                cw_CX += '</div>';
                $("#cw_ItemsContainer").append(cw_CX); // insert into DOM                      
           }); // -- $(xData.responseXML).find  
        } // -- completefunc
   }); // -- $().SPServices({
} // -- LoadCalendarWidget()