Index: components/myCollection/css/myCollection.css
===================================================================
--- components/myCollection/css/myCollection.css	(revision 9443)
+++ components/myCollection/css/myCollection.css	(working copy)
@@ -20,5 +20,80 @@
 
 .fl-myCollection-emptyStatus {
     white-space: normal;
-    line-height: 400px;
+    padding-top: 100px;
+}
+
+.fl-myCollection-navigationList-link {
+    display: none;
+}
+
+.fl-myCollection-actionPanel {
+    width: 100%;
+    background: #F5F5F5;
+}
+
+.fl-myCollection-actionButtons {
+    height: 45px;       
+    padding-left: 5px;  
+    display: table-cell;
+    vertical-align: middle;
+}
+
+.fl-myCollection-actionButtons a.fl-myCollection-action-button {
+    color: #FFFFFF;
+    padding: 5px 10px 5px 30px;
+    border-style:solid;
+    border-width: 2px;
+    border-color: #000000;
+    -webkit-border-image: none;
+    text-align: center;
+    margin: auto;
+}
+
+.fl-myCollection-send {
+    background: url(../../../shared/images/send.png) no-repeat left,
+        -webkit-gradient(linear, left top, right bottom, from(#A6A6A6), to(#C8C8C8));
+}
+
+.fl-myCollection-dialocContainer {
+    background-color: rgba(62, 62, 62, 0.9);
+}
+
+.fl-myCollection-sendMailDialog {
+    display: none;
+    padding: 55px 10px 0 10px;
+    color: white;
+    width: 100%;
+    margin: auto;
+}
+
+.ui-dialog-buttonpane {
+    margin-bottom: 75px;
+    padding-right: 8px;
+    float:right
+}
+
+.ui-state-default {
+    color: #4D4D4D;
+    font-size: 14px;
+//    border-style: none;
+    background: #F5F5F5;
+    -webkit-border-bottom-left-radius: 10px 10px;
+    -webkit-border-bottom-right-radius: 10px 10px;
+    -webkit-border-top-left-radius: 10px 10px;
+    -webkit-border-top-right-radius: 10px 10px;
+    border-color: rgba(62, 62, 62, 0.9);
+    padding: 5px 5px 5px 5px;
+    text-decoration:none;
+    font-weight:bold;
+}
+
+.fl-myCollection-sendEmailInput {
+    width: 300px;
+    font-size: 16px;
+    padding: 8px 0 8px 5px;
+    -webkit-border-bottom-left-radius: 10px 10px;
+    -webkit-border-bottom-right-radius: 10px 10px;
+    -webkit-border-top-left-radius: 10px 10px;
+    -webkit-border-top-right-radius: 10px 10px;
 }
\ No newline at end of file
Index: components/myCollection/data/demoData.json
===================================================================
--- components/myCollection/data/demoData.json	(revision 9443)
+++ components/myCollection/data/demoData.json	(working copy)
@@ -1,53 +1,44 @@
-{
-    "data": [
-        {
-            "id": "e3cbe2c26799ed621576a271a0def978",
-            "museum": "mccord",
-            "target": "view.html?q=ME986.104.3.1-2&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
-            "image": "http://eich.wsg.mcgill.ca/ThumbView/ME986.104.3.jpg",
-            "title": "No Title",
-            "dated": "1910-1930, 20th century"
-        },
-        {
-            "id": "50016071055ed4973757b7ece1f63ced",
-            "museum": "mccord",
-            "target": "view.html?q=M956.5&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
-            "image": "http://eich.wsg.mcgill.ca/ThumbView/5090.jpg",
-            "title": "No Title",
-            "dated": "1865-1900, 19th century"
-        },
-        {
-            "id": "f32010cf5814a9963c6d9290610a7371",
-            "museum": "mccord",
-            "target": "view.html?q=M999.70.23&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
-            "image": "http://eich.wsg.mcgill.ca/ThumbView/M999.70.23.jpg",
-            "title": "Castor Oil, National Drug & Chemical Co.of Can.Ltd.",
-            "dated": "1900-1925, 20th century"
-        },
-        {
-            "id": "e5c9568bfc512e69dd94f8e25e932414",
-            "museum": "mccord",
-            "target": "view.html?q=ME892.10&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
-            "image": "http://eich.wsg.mcgill.ca/ThumbView/ME892.10-a.jpg",
-            "title": "No Title",
-            "dated": "1800-1850, 19th century"
-        },
-        {
-            "id": "df6052db54a07236c0305ad5270f1ae9",
-            "museum": "mccord",
-            "target": "view.html?q=M980.37.2&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
-            "image": "http://eich.wsg.mcgill.ca/ThumbView/M980.37.2.jpg",
-            "title": "No Title",
-            "dated": "1892, 19th century"
-        },
-        {
-            "id": "da4de044a34e150a328d1c42e96937e9",
-            "museum": "mccord",
-            "target": "view.html?q=M995.47.2.1-3&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
-            "image": "http://eich.wsg.mcgill.ca/ThumbView/M995.47.2.1-3.jpg",
-            "title": "No Title",
-            "dated": "1905-1910, 20th century"
-        }
-    ],
-    "collectionId": "c9949e514929699fd0991f46fd1e78f7"
-}
\ No newline at end of file
+[
+    {
+        "id": "e3cbe2c26799ed621576a271a0def978",
+        "target": "view.html?q=ME986.104.3.1-2&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
+        "image": "http://eich.wsg.mcgill.ca/ThumbView/ME986.104.3.jpg",
+        "title": "No Title",
+        "description": "1910-1930, 20th century"
+    },
+    {
+        "id": "50016071055ed4973757b7ece1f63ced",
+        "target": "view.html?q=M956.5&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
+        "image": "http://eich.wsg.mcgill.ca/ThumbView/5090.jpg",
+        "title": "No Title",
+        "description": "1865-1900, 19th century"
+    },
+    {
+        "id": "f32010cf5814a9963c6d9290610a7371",
+        "target": "view.html?q=M999.70.23&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
+        "image": "http://eich.wsg.mcgill.ca/ThumbView/M999.70.23.jpg",
+        "title": "Castor Oil, National Drug & Chemical Co.of Can.Ltd.",
+        "description": "1900-1925, 20th century"
+    },
+    {
+        "id": "e5c9568bfc512e69dd94f8e25e932414",
+        "target": "view.html?q=ME892.10&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
+        "image": "http://eich.wsg.mcgill.ca/ThumbView/ME892.10-a.jpg",
+        "title": "No Title",
+        "description": "1800-1850, 19th century"
+    },
+    {
+        "id": "df6052db54a07236c0305ad5270f1ae9",
+        "target": "view.html?q=M980.37.2&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
+        "image": "http://eich.wsg.mcgill.ca/ThumbView/M980.37.2.jpg",
+        "title": "No Title",
+        "description": "1892, 19th century"
+    },
+   {
+        "id": "da4de044a34e150a328d1c42e96937e9",
+        "target": "view.html?q=M995.47.2.1-3&db=mccord&uuid=c9949e514929699fd0991f46fd1e78f7",
+        "image": "http://eich.wsg.mcgill.ca/ThumbView/M995.47.2.1-3.jpg",
+        "title": "No Title",
+        "description": "1905-1910, 20th century"
+    }
+]
\ No newline at end of file
Index: components/myCollection/html/myCollection.html
===================================================================
--- components/myCollection/html/myCollection.html	(revision 9443)
+++ components/myCollection/html/myCollection.html	(working copy)
@@ -16,7 +16,10 @@
 		<link type="text/css" rel="stylesheet" href="../../../../fluid-engage-core/components/myCollection/css/myCollection.css" ></link>
 
 		<script type="text/javascript" src="../../../../fluid-infusion/src/webapp/lib/jquery/core/js/jquery.js"></script>
+		<script type="text/javascript" src="../../../../fluid-infusion/src/webapp/lib/jquery/ui/js/ui.core.js"></script>
+		<script type="text/javascript" src="../../../../fluid-infusion/src/webapp/lib/jquery/ui/js/ui.dialog.js"></script>
         <script type="text/javascript" src="../../../../fluid-infusion/src/webapp/framework/core/js/Fluid.js"></script>
+        <script type="text/javascript" src="../../../../fluid-engage-core/framework/js/iPhoneChromeless.js"></script>
         <script type="text/javascript" src="../../../../fluid-infusion/src/webapp/framework/renderer/js/fluidParser.js"></script>
         <script type="text/javascript" src="../../../../fluid-infusion/src/webapp/framework/renderer/js/fluidRenderer.js"></script>
         <script type="text/javascript" src="../../../../fluid-infusion/src/webapp/lib/fastXmlPull/js/fastXmlPull.js"></script>        
@@ -55,6 +58,11 @@
                 <!-- Page header -->
                 <h1 class="flc-myCollection-title fl-navbar-title fl-col-flex">My Collection</h1>
             </div>
+            <div class="fl-myCollection-actionPanel">
+                <div class="fl-myCollection-actionButtons">
+                    <a rsf:id="scr=null" class="flc-myCollection-sendEmailButton fl-myCollection-action-button fl-myCollection-send fl-button" href="#">Send</a>
+                </div>
+            </div>
 
             <div class="flc-myCollection-emptyStatus"></div>
 	
@@ -70,8 +78,13 @@
 			
 					
 			<!-- hidden link to the navigation list template -->
-			<a class="flc-myCollection-navigationList-link" href="../../../../fluid-engage-core/components/navigationList/html/NavigationList.html"/>
+			<a class="flc-myCollection-navigationList-link fl-myCollection-navigationList-link" href="../../../../fluid-engage-core/components/navigationList/html/NavigationList.html"/>
 		</div>
+		
+		<div class="flc-myCollection-sendMailDialog fl-myCollection-sendMailDialog" title="Dialog Title">
+            <div class="flc-myCollection-sendMailMessage">We'll send your collection to the email address below.</div>
+            <input class="flc-myCollection-sendEmailInput fl-myCollection-sendEmailInput fl-centered" type="text"/>
+        </div>
 
 		<script id="flc-initBlock" type="text/javascript">
 			fluid.engage.initComponentWithLocalData("fluid.engage.myCollection", ".flc-myCollection");
Index: components/myCollection/js/MyCollectionView.js
===================================================================
--- components/myCollection/js/MyCollectionView.js	(revision 9443)
+++ components/myCollection/js/MyCollectionView.js	(working copy)
@@ -13,8 +13,50 @@
 
 fluid = fluid || {};
 
-(function ($) {      
+(function ($) {
+    
+    var openSendEmailDialog = function (that) {
+        that.sendEmailDialog.dialog("open");
+        window.scroll(0, 0);
+    };
 
+    var getLanguage = function () {
+        var query = location.search;
+
+        var idx = query.indexOf("lang=");
+        if (idx < 0) {
+            return;
+        }
+        idx += "lang=".length;
+
+        var endIdx = query.indexOf("&", idx);
+
+        endIdx = endIdx > idx ? endIdx : query.length;
+
+        return query.substring(idx, endIdx);
+    };      
+
+    var modelToEmailData = function (that) {
+        var artifacts = fluid.transform(that.model, function (artifact) {
+            return artifact.artifactId;
+        });
+
+        return {
+            language: getLanguage(),
+            action: "add",
+            email: that.locate("sendEmailInput").attr("value"),
+            artifacts: artifacts.join()
+        };
+    };
+
+    var sendEmail = function (that) {
+        var url = that.options.sendEmailUrl + "?" + $.param(modelToEmailData(that));
+        $.ajax({
+            url: "../myCollection/submit.json" + "?" + $.param({url:url}),
+            type: "GET"        
+        });
+    };
+
     /**
      * Isolate the initialization of the navigation list here
      * @param that, the component
@@ -78,6 +120,51 @@
         myCollectionContainerEl.addClass(styles.collectionEmpty);
     };
     
+    var setupSendEmailDialog = function (that) {
+        var strings = that.options.strings;
+
+        var sendEmailMessage = that.locate("sendEmailMessage");
+        sendEmailMessage.text(strings.sendEmailDialogMessage);
+
+        var sendEmailInput = that.locate("sendEmailInput");
+//        sendEmailInput.attr("value", strings.defaultEmail);
+
+        var submit = strings.submitEmailButton;
+        var cancel = strings.cancelEmailButton;
+        var options = {
+            autoOpen: false,
+            modal: false,
+            position: ["center", "top"],
+            width: 320,
+            minHeight: 200,
+            dialogClass: "fl-myCollection-dialocContainer",
+            buttons: {},
+            closeText: "",
+            title: " "
+        };
+        options.buttons[submit] = function () {
+            sendEmail(that);
+            $(this).dialog("close");
+        };
+        options.buttons[cancel] = function () {
+            $(this).dialog("close");
+        };
+
+        that.sendEmailDialog = that.locate("sendEmailDialog");
+        that.sendEmailDialog.dialog(options);
+    };
+
+    var setupSendEmailButton = function (that) {
+        var sendEmailButton  = that.locate("sendEmailButton");
+        if (that.model.length === 0) {
+            sendEmailButton.hide();
+        }
+        sendEmailButton.click(function (evt) {
+            openSendEmailDialog(that);
+            evt.preventDefault();
+        });
+    };
+    
     /**
      * Initializes all elements of the collection view that have not been initialized.
      * 
@@ -92,8 +179,13 @@
                                that.options.strings, 
                                that.options.styles);
         }
+        // This needs to be done through the renderer.        
         // Init title
         that.locate("title").text(that.options.strings.header);
+        // Init send button
+        that.locate("sendEmailButton").text(that.options.strings.sendEmailButton);
+        setupSendEmailDialog(that);
+        setupSendEmailButton(that);
     };
 
     /**
@@ -104,8 +196,7 @@
      */
     fluid.engage.myCollection = function (container, options) {
         var that = fluid.initView("fluid.engage.myCollection", container, options);
-        that.model = that.options.model;
-        
+        that.model = that.options.model;        
         setupMyCollection(that);
         return that;
     };
@@ -129,7 +220,11 @@
                 navListContainer: ".flc-navigationList",
                 navListLink: ".flc-myCollection-navigationList-link",
                 collectionEmptyStatus: ".flc-myCollection-emptyStatus",
-                title: "flc-myCollection-title"
+                title: ".flc-myCollection-title",
+                sendEmailButton: ".flc-myCollection-sendEmailButton",
+                sendEmailDialog: ".flc-myCollection-sendMailDialog",
+                sendEmailMessage: ".flc-myCollection-sendMailMessage",
+                sendEmailInput: ".flc-myCollection-sendEmailInput"
             },
 
             styles: {
@@ -140,10 +235,16 @@
 
             strings: {
                 header: "My Collection",
-                emptyCollectionMessage:
-                    "Your collection is empty. Start adding artifacts to your " +
-                    "collection by using the \"Collect\" button you find on artifact screens."
-            }
+                emptyCollectionMessage: "Your collection is empty. Start adding artifacts to your " +
+                    "collection by using the \"Collect\" button you find on artifact screens.",
+                sendEmailButton: "Send",
+                sendEmailDialogMessage: "We'll send your collection to the email address below.",
+                submitEmailButton: "Submit",
+                cancelEmailButton: "Cancel",
+//                defaultEmail: "email address"
+            },
+//            sendEmailUrl: "http://localhost:12345",
+            sendEmailUrl: "http://www.mccord-museum.qc.ca/scripts/myCollectionHandler.php"
         }
     );
 })(jQuery);
Index: components/myCollection/messages/messages_fr.json
===================================================================
--- components/myCollection/messages/messages_fr.json	(revision 9443)
+++ components/myCollection/messages/messages_fr.json	(working copy)
@@ -1,4 +1,9 @@
 {
     "header": "Ma Collection",
-    "emptyCollectionMessage": "Votre collection est vide. Ajoutez des objets en utilisant la fonction \"Collectionner\" qui se trouve dans les pages d'objet."
+    "emptyCollectionMessage": "Votre collection est vide. Ajoutez des objets en utilisant la fonction \"Collectionner\" qui se trouve dans les pages d'objet.",
+    "sendEmailDialogMessage": "Nous enverrons le contenu de votre collection à l'adresse courriel indiquée.",
+    "sendEmailButton": "Envoyer",
+    "submitEmailButton": "Sauvegarder",
+    "cancelEmailButton": "Annuler",
+    "defaultEmail": "adresse courriel"    
 }
\ No newline at end of file
Index: tests/component-tests/myCollection/html/myCollectionView-test.html
===================================================================
--- tests/component-tests/myCollection/html/myCollectionView-test.html	(revision 9443)
+++ tests/component-tests/myCollection/html/myCollectionView-test.html	(working copy)
@@ -11,6 +11,8 @@
 		
 
 		<script type="text/javascript" src="../../../../../fluid-infusion/src/webapp/lib/jquery/core/js/jquery.js"></script>
+		<script type="text/javascript" src="../../../../../fluid-infusion/src/webapp/lib/jquery/ui/js/ui.core.js"></script>
+		<script type="text/javascript" src="../../../../../fluid-infusion/src/webapp/lib/jquery/ui/js/ui.dialog.js"></script>
         <script type="text/javascript" src="../../../../../fluid-infusion/src/webapp/lib/fastXmlPull/js/fastXmlPull.js"></script>
         <script type="text/javascript" src="../../../../../fluid-infusion/src/webapp/framework/core/js/Fluid.js"></script>
 		<script type="text/javascript" src="../../../../../fluid-infusion/src/webapp/framework/renderer/js/fluidRenderer.js"></script>
Index: tests/component-tests/myCollection/js/myCollectionTests.js
===================================================================
--- tests/component-tests/myCollection/js/myCollectionTests.js	(revision 9443)
+++ tests/component-tests/myCollection/js/myCollectionTests.js	(working copy)
@@ -84,11 +84,11 @@
                 expect(3);
                 
                 jqUnit.assertEquals("Model length matches data length.",
-                        model.data.length, component.model.data.length);
+                        model.length, component.model.length);
                 jqUnit.assertEquals("Model node artifact ID matches passed ID.",
-                        model.data[0].id, component.model.data[0].id);
+                        model[0].id, component.model[0].id);
                 jqUnit.assertEquals("Model node museum matches passed museum.",
-                        model.data[0].museum, component.model.data[0].museum);
+                        model[0].museum, component.model[0].museum);
             });
         };
 
