Lettuce Sell It

is created to allow charities and others interested in raising funds from their blog or managed website a free way to get their items up for sale. Here is the first real auction (going live on Monday)

Upload images to Sharepoint using Silverlight and SPAPI (a link to the code in a txt file for easier copying-silverlightImageUpload.txt (5.53 kb) )

This little piece of code is a Silverlight control that will place an image into a Sharepoint folder. After the upload, a thumbnail of that image is placed into the UI for feedback to the user. It uses the opensource Javascript to Sharepoint library, SPAPI, http://darrenjohnstone.net/2008/07/22/ a-cros....

In the Html that holds your Silverlight object definition, include the two SPAPI files Core and Imaging. The function sendImageToSharepoint will be used by your Silverlight object after it has been told what image to send to Sharepoint. I keep mine in another javascript file and it's also part of a larger object, I've placed just the piece used to upload here because the rest of that object doesn't apply here.

html------------------------------------------------

  <script src="scripts/SPAPI_Core.js" type="text/javascript"></script>
    <script src="scripts/SPAPI_Imaging.js" type="text/javascript"></script>
<script type="text/javascript">
    sendImageToSharepoint: function(strListName, strFolder, bytes, fileName) {
        var lists = new SPAPI_Imaging(labstools.sharepointUrl);
        var returned = lists.upload(strListName, strFolder, bytes, fileName, true);
        if (returned.status != 200) {

            alert("There was an error: " + returned.statusText);

        };

    }
</script>

In the Silverlight UserControl XAML file, place this StackPanel, it will be your user's point of interaction with the control. The second StackPanel, imagestorage, is used to place the thumbnail image.

Xaml--------------------------------------------------

<StackPanel Orientation="Horizontal" Margin="0,5,0,0">
    <TextBlock Text="Attach Images(s):" TextWrapping="Wrap" Width="100"/>
    <TextBox x:Name="ImageFile" TextWrapping="Wrap" Width="211"/>
    <Button x:Name="btnUploadImage" Width="75" OnClick="bOpenFileDialog" Content="Browse" Style="{StaticResource styleA}" Height="25" Margin="5,0,0,0"/>
</StackPanel>
<StackPanel x:Name=" imagestorage" />

In the Silverlight UserControl XAML code behind file, place this code, it is the Click event handler for btnUploadimage.. The Javascript function that is used to communicate with SPAPI is in a Namespace called labsSurveyQues, so you can see that being initialized in this code as well. One piece that isn't shown here, is where the EventHandler was added for CompositionTarget_Rendering, this piece of code syncronizes with the UI to place the thumbnail. I got this from Jeff Prosise's Blog, http://www.wintellect.com/CS/blogs/jprosise/archive/2008/10/24/cool-silverlight-trick-5.aspx

behind Xaml:------------------------------------------------

 Private Sub bOpenFileDialog(sender as Object, evt as EventArgs)
        ' Create an instance of the open file dialog box.
        Dim openFileDialog1 As OpenFileDialog = New OpenFileDialog
        Dim so As ScriptObject = TryCast(HtmlPage.Window.Eval("labsSurveyQues"), ScriptObject)

        ' Set filter options and filter index.
        openFileDialog1.Filter = "Image Files (*.png, *.jpg, *.jpeg)|*.png;*.jpg;*.jpeg"
        openFileDialog1.FilterIndex = 1

        openFileDialog1.Multiselect = True

        ' Call the ShowDialog method to show the dialogbox.
        Dim UserClickedOK As Boolean = openFileDialog1.ShowDialog

            ' Process input if the user clicked OK.
        If (UserClickedOK = True) Then
           
            _files.Clear()
            For Each file1 As FileInfo In openFileDialog1.Files

                    Dim tb As New TextBlock
                    tb.Text = openFileDialog1.File.Name
                    tb.Name = "image_" + imagestorage.Children.Count.ToString()

                    Dim testextension As String = tb.Text.ToLower()
                    If testextension.Contains("jpg") Or testextension.Contains("jpeg") Or testextension.Contains("png") Then
                        imagestorage.Children.Add(tb)

                    '' ''Open the selected file to read.
                    Dim fileStream As System.IO.Stream = openFileDialog1.File.OpenRead
                    Dim binary As BinaryReader = New BinaryReader(fileStream)
                    Dim imgB() As Byte = binary.ReadBytes(fileStream.Length)
                    fileStream.Close()

                    'send the binary stream to the script that will put it out to the server for me
                    so.Invoke("sendImageToSharepoint", "PictureLibrary", "", Convert.ToBase64String(imgB), file1.Name)

                    _files.Enqueue(file1) 'displays to the UI

                End If
            Next
        End If
    End Sub

    Private _files As New Queue(Of FileInfo)()
       Private Sub CompositionTarget_Rendering(ByVal sender As [Object], ByVal e As EventArgs)
        Dim imagestorage As StackPanel = DirectCast(FindControls.RecursiveFindControl(controlspanel.Children, "imagestorage"), StackPanel)
        If _files.Count <> 0 And imagestorage IsNot Nothing Then
            Dim fi As FileInfo = _files.Dequeue()
            Using stream As Stream = fi.OpenRead()
                Dim bi As New BitmapImage()
                bi.SetSource(stream)
                Dim Img As New Image
                Img.Source = bi
                imagestorage.Children.Add(Img)
            End Using
        End If
    End Sub

Here’s a blog about being homeless in the Twin Cities, but this problem is everywhere.

http:\\www.twincitieswhitecollarhomeless

Diary of a Twin Cities White Collar Homeless Man Walking

I'm a 54 white collar professional with over 27 years of mkt. experience, but am now two plus years jobless, now homeless and living out of my car. I am not using this platform to blame others for my misfortune or to seek help for myself, but rather to spread awareness about homelessness. ...

OK,  I wrote this post when I was working on a project to integrate notes made on a blog feed that was imported into Facebook, with the blog the feed originated from.

http://faxt.com/blog/post/2010/01/23/Facebook-and-BlogEngineNET-Facebook-app.aspx

I made some progress, I have the little Facebook app to the point where it will bring any Facebook notes comments over to the blog.  The blog will bring Facebook comments in when a post is accessed.  So this will join all the comments together at the blog page.

The part I’m not so sure I want to implement is the part that sends comments added to your blog over to Facebook.  Spam is the reason why.  If a person isn’t moderating their comments, I don’t want them automatically going into their Facebook notes blog feed. 

As far as it is, it’s useful for keeping the conversation going and maybe it’ll just stay at this point now.  We’ll see how my customers use it and what else they need.   The updated source code is linked here in case you’re interested.   (see note below on FBApp setup, this extension uses .NET 3.5)  And, since this plugin requires recompilation and all that jazz – I did this integration and stuck the whole shebang here for download - http://faxt.com/code/BlogEngine.NET.1.6.zip

The rest of this post is setup instructions.  It’s complicated to setup because there needs to be a corresponding application registered with Facebook.  These are the steps required to integrate a BlogEngine.NET blog running the FBApp plugin:

1. Step 1: Setup a new, blank Facebook application.
2. Step 2:  Enter your Facebook application identification details into the FBApp extension Admin page.
3. Step 3:  Get Offline Access permissions for your blog to access your Facebook application.
4. Step 4:  Reset your blog to complete the installation.

Step 1: Setup a new, blank Facebook application

Setting up a Facebook application, this section is not my work, but came from here:
http://devtacular.com/articles/bkonrad/how-to-use-the-facebook-developer-toolkit-20/

The process is actually quite simple. First we need to install the "Developer" application, provided by Facebook.
Here is a link - Facebook Developer Application
Launch the Developer application and click "Set Up New Application" in the top right hand corner.
You will see the following screen. I have filled in the necessary fields, but here is a quick rundown.
1. Application Name - You must pick one.
2. Callback URL - This is the address of your hosted facebook application.
3. Canvas Page URL - Give your application a nice, memorable address on Facebook.

After you click "Submit" you will be taken to the following screen which will show you details about your newly created application.

Take note of these below key fields we will reuse later: API Key, Secret.

After app setup, go to the developer test page to get your userid.  It will look like this: 1485908111

Developer’s Test Page:    http://developers.facebook.com/tools.php

Step 2:  Setup BE with the FBApp code

Here’s a sticky wicket – this extension is written with some Linq code – and BE as it comes from Codeplex is compiled targeting V2.0 of the .NET framework.  Therefore, in order to use this extension, you must download the source and re-target for V3.5.  and add a reference to System.Data.Linq and another reference to System.Xml.Linq.  Add references to FacebookToolKit dlls Facebook.dll and factbook.Web.dll – This project is here:  http://facebooktoolkit.codeplex.com/Wikipage

Unzip the FBApp.zip file into a folder at the root of your blog, the folder will be called FBApp too.

Unzip the FBAppCode folder to this folder in your BlogEngine.Web project:  App_Code\Extensions. 

Test it, then publish it.

Step 3:  Enter your Facebook application identification details into the FBApp extension Admin page

Login to your blog, go to the extensions tab in admin area.  Edit the FBApp, this is  where all this is entered for the blog so it can be used there.  Put in the information from your Facebook application (above) and Save your changes.

Step 3:  Get Offline Access permissions for your blog to access your Facebook application.  (Infinite Session Key)

Little tricky here….    Now, you need to follow the instructions to get your offline access permission from the blog admin link.  These instructions are included in the admin page of FBApp and you will see them when you are logged into your blog after installing the FBApp folder to your blog root.

When you come back to this form after saving, the link at the bottom to m.facebook.com will have proper API_Key parameter.

Now click that link to get your offline-access setup. – you will be at Facebook.  Click the button to allow offline access.

This should send you back to the admin page. – you just need to retrieve your infinite session key from the Facebook request.  Do it this way:  Go to http://www.facebook.com.  Click to go to Your Application – when you see your blog in the Facebook frame, right-click to view the source.  Look for a Meta tag in the header, <meta name="fb_session_key" content="19461b572f12c8cb8fc1fb36-1485911113" />

Content is your value to fill in on the admin page, this is your infinite session key which has been placed into the Meta tag by the FBApp extension.

Step 4:  Reset your blog to complete the installation.

Make sure after these changes are completed, that you reset your blog – this will reload the new values. – do this by saving your web.config to update the file time stamp.