Connections widgets

Connections widgets are parts of Connections that can be integrated in any web-based system. The pre-requisite to have Connections widgets is:

jQuery 1.3.2+
jQuery fancyBox plugin 1.3.4

Single sign-on API described here.

To display widget contents:

chili.init() must be called in all pages having ChiliFresh content implemented
an active ChiliFresh session is required - meaning user has to be logged on to ChiliFresh (either Admin panel, Connections or for writing a review; or using single-signon) to be able to see widget output in the place-holder; and
widget name is the part after the “cf_widget_” prefix - e.g., for “cf_widget_myfollowing” the name which has to be specified as widgets parameter for init() is “myfollowing”
widget name has to be set in init() part - if no widget name set, all of the widgets will be loaded.
for including ChiliFresh content over SSL, the only change is that file http://chilifresh.com/connections/opac/chilifresh.js becomes https://secure.chilifresh.com/connections/opac/chilifresh.js. The user session can go back and forth between SSL and plain hosts, as long as successful user session is established

If need to show several widgets on the same page, their names can be comma-separated. There is an example call for widget on the page:

        <div id="cf_widget_myfollowing"></div>
        <div id="cf_widget_statistics"></div>

        <script type="text/javascript" src="http://chilifresh.com/connections/opac/chilifresh.js"></script>
        <script type="text/javascript">
        <!-- 
            $.chilifresh.init({
                'library_id': '12345',
                'opac_session': 'poi12j3oi12j3oi1j23oi',
                'widgets': 'myfollowing,statistics',
                'item_isbn': '0670031534'
            });
        //-->
        </script>

To parse the widgets the following code (parser script) most go on below the following widget codes:

<script type="text/javascript" src="http://chilifresh.com/connections/opac/chilifresh.js"></script>

        <script type="text/javascript">
        <!--
 
            $.chilifresh.init();
        //-->
        </script>

The $.chilifresh.init() call may contain additional parameters, e.g., to pass opac_session parameter value to user session after user opens OPAC screen after login or registration, the code would be:

<script type="text/javascript" src="http://chilifresh.com/connections/opac/chilifresh.js"></script>

        <script type="text/javascript">
        <!--
 
            $.chilifresh.init({
            'opac_session':'as90du0a9sud092wu020',
            'library':'1234'});
        //-->
        </script>

For usershavingitem and itemconnections widgets the item ID (such as ISBN, UPC, etc.) is required to be passed to init(), and it can be done this way: <script type=“text/javascript” src=“http://chilifresh.com/connections/opac/chilifresh.js”></script>

      <script type="text/javascript">
      <!-- $.chilifresh.init({'item_isbn':'0670031534'}); //-->
      </script>

</code>

The code necessary to add each of the widgets are available below with each of the widgets, the widget name is the part after the “cf_widget_” prefix. You may include several widget place-holders per page, the parser script needs to be included only once. So that the entire implementation needs following lines of code in following order to work:

<div id="cf_widget_XXX">

<script type="text/javascript" src="http://chilifresh.com/connections/opac/chilifresh.js"></script>


        <script type="text/javascript">
        <!--
 
            $.chilifresh.init({
            'widgets':'XXX',
            'item_isbn':'0670031534'
            });
        //-->
        </script>

The output will be HTML code of the widget without CSS styling - it must be added separately or the widget will use the styling of the page where it is implemented.

For widgets involving iFrame, a CSS file may be passed in as parameter like this:

<div id="cf_widget_XXX">

<script type="text/javascript" src="http://chilifresh.com/connections/opac/chilifresh.js"></script>
        <script type="text/javascript">
        <!--
 
            $.chilifresh.init({
            'widgets':'XXX',
            'item_isbn':'0670031534',
            'css':'http://www.opac.com/css/file.css'
            });
        //-->
        </script>

Also, the full Connections interface CSS can be adjusted by passing 'connections_css' parameter like this: <script type=“text/javascript”>

      <!--

$.chilifresh.init({

          'widgets':'XXX',
          'item_isbn':'0670031534',
          'connections_css':'http://www.opac.com/css/file.css'
          });
      //-->
      </script>

</code>

Linking back from Connections widgets to catalog

For widgets with item, user deep-linking or specific widget linking back to catalog, the deep-link structure must be defined in source code such as in the example below. Here is explanation of each of URLs:

item_url - deep-link URL structure to item details on catalog based on item's call number
isbn_url - deep-link URL structure to item details on catalog based on item's ISBN
title_url - deep-link URL structure to item details on catalog based on item's title & author
user_url - link to ChiliFresh-specific user profile page on catalog containing Connections widgets
logon_url - link to user logon screen in catalog (to initiate user session both - with catalog and for catalog to get user session from ChiliFresh)
register_url - link to user registration form in catalog
record_url - link to catalog user's profile/record page
search_url - link to search screen of the catalog
related_users_url - link to ChiliFresh-specific “Related users” page on catalog containing ChiliFresh “Related users” widget
connected_items_url - link to ChiliFresh-specific “Connected items” page on catalog containing ChiliFresh “Connected items” widget
tags_url - link to ChiliFresh-specific “Tags” page on catalog containing ChiliFresh “Tags” widget
css - URL to CSS file that applies to ChiliFresh content so that it can be applied to content in iFrames
connections_css - CSS file for ChiliFresh content that gets opened in overlay lightbox window
after_fb_close - a JavaScript function name to call after fancyBox overlay window is closed

<div id="cf_widget_XXX">

<script type="text/javascript" src="http://chilifresh.com/connections/opac/chilifresh.js"></script>
        <script type="text/javascript">
        <!--
 
            $.chilifresh.init({
            'item_url' : 'http://example-catalog.com/view.aspx?location=example_location&cn={CONTROL_NUMBER}',
	    'user_url' : 'http://example-catalog.com/social/profile.aspx?location=example_location&cfc={USER_ID}',
	    'isbn_url' : 'http://example-catalog.com/view.aspx?location=example_location&isbn={ISBN}',
	    'title_url' : 'http://example-catalog.com/view.aspx?location=example_location&title={TITLE}&author={AUTHOR}',
	    'logon_url' : 'http://example-catalog.com/logon.aspx?location=example_location&cfc=1&modal=1&close=1',
	    'register_url' : 'http://example-catalog.com/patronaccount/selfregister.aspx?location=example_location',
	    'record_url' : 'http://example-catalog.com/patronaccount/default.aspx?location=example_location',
	    'search_url' : 'http://example-catalog.com/search/default.aspx?location=example_location',
	    'related_users_url': 'http://example-catalog.com/social/cfc.aspx?location=example_location&isbn={ISBN}&mode=relatedusers',
	    'connected_items_url': 'http://example-catalog.com/social/cfc.aspx?location=example_location&isbn={ISBN}&mode=relateditems',
	    'tags_url': 'http://example-catalog.com/social/cfc.aspx?location=example_location&isbn={ISBN}&mode=itemtags',
	    'css' : 'http://example-catalog.com/themes/shared/styles.css',
	    'connections_css' : 'http://example-catalog.com/shared/chilifresh.css',
            'after_fb_close' : 'execute_this()'
            });
            
        //-->
        </script>

PLEASE NOTE: must use {CONTROL_NUMBER}, {USER_ID} and {ISBN} tokens in corresponding places to mark where the appropriate ID should go

User profile

Code:

<div id="cf_widget_profile"></div>

Bookshelf

Code:

<div id="cf_widget_bookshelf"></div>

Corkboard

Code:

<div id="cf_widget_corkboard"></div>

Interests

Code:

<div id="cf_widget_interests"></div>

My library

Code:

<div id="cf_widget_mylibrary"></div>

My friends

Code:

<div id="cf_widget_myfriends"></div>

My interests

Code:

<div id="cf_widget_interests"></div>

Statistics

Code:

<div id="cf_widget_statistics"></div>

My following

Code:

<div id="cf_widget_myfollowing"></div>

Communities

Code:

<div id="cf_widget_communities"></div>

Bookclubs

Code:

<div id="cf_widget_bookclubs"></div>

Chat rooms

Code:

<div id="cf_widget_chatrooms"></div>

Discussion groups

Code:

<div id="cf_widget_discussions"></div>

Item connections widget

Code:

<div id="cf_widget_itemconnections"></div>

However, it requires having item ID specified in the init() part like this:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'itemconnections',
    'item_isbn': '0670031534'
            });
        //-->
</script>

Item users widget

Code:

<div id="cf_widget_usershavingitem"></div>

However, it requires having item ID specified in the init() part like this:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'usershavingitem',
    'item_isbn': '0670031534'
            });
        //-->
        </script>

New widgets

Edit profile

Code:

<div id="cf_widget_editprofile"></div>

Show public profile

Code:

<div id="cf_widget_publicprofile"></div>

However, it requires having user ID specified in the init() part like this or uses user's own ID:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'publicprofile',
    'userid': '1234'
            });
        //-->
        </script>

My reviewed items

Code:

<div id="cf_widget_revieweditems"></div>

However, it requires having user ID specified in the init() part like this or uses user's own ID:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'revieweditems',
    'userid': '1234'
            });
        //-->
        </script>

My reviews

Code:

<div id="cf_widget_reviews"></div>

However, it requires having user ID specified in the init() part like this or uses user's own ID:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'reviews',
    'userid': '1234'
            });
        //-->
        </script>

Following settings

Code:

<div id="cf_followingcfg"></div>

Widget ID: widget_followingcfg

Users following me

Code:

<div id="cf_widget_userfollowers"></div>

However, it requires having user ID specified in the init() part like this or uses user's own ID:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'userfollowers',
    'userid': '1234'
            });
        //-->
        </script>

Users I am following

Code:

<div id="cf_widget_userfollowing"></div>

However, it requires having user ID specified in the init() part like this or uses user's own ID:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'userfollowing',
    'userid': '1234'
            });
        //-->
        </script>

Search users in my library

Code:

<div id="cf_widget_findusers"></div>

User bookshelves

Code:

<div id="cf_widget_userbookshelves"></div>

However, it requires having user ID specified in the init() part like this or uses user's own ID:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'userbookshelves',
    'userid': '1234'
            });
        //-->
        </script>

User friends

Code:

<div id="cf_widget_userfriends"></div>

However, it requires having user ID specified in the init() part like this or uses user's own ID:

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'userfriends',
    'userid': '1234'
            });
        //-->
        </script>

User messages

Code:

<div id="cf_widget_messaging"></div>

Related users

Code:

<div id="cf_widget_relatedusers"></div>
<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'relatedusers',
    'item_isbn': '0670031534'
            });
        //-->
        </script>

Connected items

Code:

<div id="cf_widget_relateditems"></div>
<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'relateditems',
    'item_isbn': '0670031534'
            });
        //-->
        </script>

Item tags

Code:

<div id="cf_widget_itemtags"></div>

<script type="text/javascript">
<!-- 
    $.chilifresh.init({
    'widgets': 'itemtags',
    'item_isbn': '0670031534'
            });
        //-->
        </script>

Table of Contents

Connections widgets

Linking back from Connections widgets to catalog

User profile

Bookshelf

Corkboard

Interests

My library

My friends

My interests

Statistics

My following

Tags

Communities

Bookclubs

Chat rooms

Discussion groups

Item connections widget

Item users widget

New widgets

Edit profile

Show public profile

My reviewed items

My reviews

Following settings

Users following me

Users I am following

Search users in my library

User bookshelves

User friends

User messages

Related users

Connected items

Item tags