CoverFlow with media player instead of jpg

[herve]

hi,

does coverflow load only pictures or is it possible to chage .jpg files by media player playing vidéos.

the idea is to use coverflow for display a collection of videos, one per player.

If it s possible, do you have a sample code somewhere to share?

best regards

herve

[Miroslav Nedyalkov]

Hi herve,

At this time, the coverflow control supports only images (not only .jpg files, but any images supported by silverlight). If you want to create a coverflow of videos you may create a coverflow containing screenshots of the videos and a media player that appears or disappears. You can see an example of this approach at http://demos.telerik.com/silverlight/telerikmedia/.

Sincerely yours,
Miroslav Nedyalkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Ben Hayat]

Miroslav, what do you see the future of CoverFlow? For example, once I asked some question about the RADCube and based on the answer I got, I felt the RADCube will be staying in the place as it's now and it's original architucture was not designed to be expanded into something more complex control.

Do you think CoverFlow will have the same future (not that there is anything wrong with it), but do you guys see this just a component to show images or could this control be expanded that for example can show database records in a form shape or be able to use it as silde show and etc.

I just want to know where I should be a limit on my expectations for this control.

Thanks!
..Ben

[Miroslav Nedyalkov]

Hi ..Ben,

We are not planning to develop new functionality for the CoverFlow for now. We have plans to fix some bugs and to do small changes, but nothing bigger. We have plans to extend this control after Q2 when the perspective transformations will be available natively in Silverlight 3 and will let us remake the things better and extend the Coverflow control to show controls in its items.

About the slideshow - we didn't decide to make the slideshow part of the CoverFlow, because it is more part of a custom application logic than a part of a control. If you would like to send you a sample application with slideshow implemented in it, we could do it.

Best wishes,
Miroslav Nedyalkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Ben Hayat]

Note: The first time I responded, is not showing up, here my second try
----------------
Miroslav, thank you for straight up answer. Now that I know what the plan and time frame is, I will limit my expectations off of this control.

Although, I started working a slide show with DispatcherTimer, but I think it would be good to have a sample from you as well, to make sure we're doing it right. But as I noted in another post, it would be great to archive all these samples being made.

Thanks for great support!
..Ben

[Yaron]

Is it possible to obtain the source code for the media player / cover flow sample shown at http://demos.telerik.com/silverlight/telerikmedia/?

Cheers,

[Ben Hayat]

Yaron, if you go to your account and in the download section, you should see that sample project. They released it a while back!

Hope this helps!
..Ben

[Yaron]

Thanks Ben, I found it.

A small problem - I can't seem to get the media player to display in full screen.

I added the full screen icon to the media player and added the code used in the examples, but IE crashes.

Any ideas?

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Collections.ObjectModel;
using System.Xml.Linq;
using Telerik.Windows.Controls;
using System.Windows.Media.Imaging;
using System.ComponentModel;

namespace VideoCarouselPlayer
{
    public partial class Page : UserControl
    {
        private static string mediaPath = @"http://localhost/Test/SiteContent/tblMedia.xml";
        private TimeSpan currentMediaElementPosition;
        private Popup popUp = new Popup();
        private static ObservableCollection<MediaItem> mediaItems = new ObservableCollection<MediaItem>();

        public Page()
        {
            InitializeComponent();

            WebClient xmlClient = new WebClient();
            xmlClient.DownloadStringCompleted += new DownloadStringCompletedEventHandler(XMLFileLoaded);
            Uri uri = new Uri(mediaPath, UriKind.Absolute);
            xmlClient.DownloadStringAsync(uri);

            this.DataContext = mediaItems;

            Application.Current.Host.Content.FullScreenChanged += new EventHandler(this.Content_FullScreenChanged);
        }

        private static void XMLFileLoaded(object sender, DownloadStringCompletedEventArgs e)
        {

            if (e.Error == null)
            {
                XDocument library = XDocument.Parse(e.Result);

                foreach (XElement entry in library.Root.Elements("Item"))
                {
                    mediaItems.Add(new MediaItem()
                    {
                        MediaPath = entry.Attribute(XName.Get("MediaPath")).Value,
                        ImagePath = entry.Attribute(XName.Get("ImagePath")).Value,
                        Title = entry.Attribute(XName.Get("Title")).Value,
                        Description = entry.Attribute(XName.Get("Description")).Value,
                    });
                }
            }
        }

        private void Content_FullScreenChanged(object sender, EventArgs e)
        {
            if (Application.Current.Host.Content.IsFullScreen)
            {
                MediaPlayer.Width = Application.Current.Host.Content.ActualWidth;
                MediaPlayer.Height = Application.Current.Host.Content.ActualHeight;

                popUp.IsOpen = true;
                LayoutRoot.Children.Remove(MediaPlayer);
                popUp.Child = MediaPlayer;
            }
            else
            {
                MediaPlayer.Width = 500;
                MediaPlayer.Height = 300;
                popUp.Child = null;

                if (!LayoutRoot.Children.Contains(MediaPlayer))
                {
                    LayoutRoot.Children.Add(MediaPlayer);
                }

                MediaPlayer.IsFullScreen = false;
            }
        }

        private void MediaPlayer_FullScreenChanged(object sender, EventArgs e)
        {
            this.currentMediaElementPosition = MediaPlayer.MediaElement.Position;

            Application.Current.Host.Content.IsFullScreen = MediaPlayer.IsFullScreen;
        }

        private void MediaPlayer_MediaOpened(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
            MediaPlayer.MediaElement.Position = this.currentMediaElementPosition;
            MediaPlayer.MediaElement.Play();
        }

        private void HideMediaPlayer()
        {
            if (VisualStateManager.GoToState(this, "NormalState", true))
            {
                if (this.MediaPlayer != null)
                {
                    this.MediaPlayer.Stop();
                }
            }
        }

        private void ShowMediaPlayer()
        {
            if (VisualStateManager.GoToState(this, "MediaPlayerState", true))
            {
                MediaItem selectedItem = this.CoverFlow.SelectedItem as MediaItem;
                if (this.MediaPlayerGrid != null && selectedItem != null)
                {
                    RadMediaItem item = new RadMediaItem()
                    {
                        Source = new Uri(selectedItem.MediaPath, UriKind.Relative),
                        ImageSource = new BitmapImage(new Uri(selectedItem.ImagePath, UriKind.Relative)),
                        Title = selectedItem.Title,
                        Description = selectedItem.Description
                    };

                    this.MediaPlayer.Items.Clear();
                    this.MediaPlayer.Items.Add(item);

                    this.MediaPlayer.Dispatcher.BeginInvoke(() =>
                    {
                        this.MediaPlayer.CurrentItem = item;
                    });
                }
            }
        }

        private void CoverFlow_SelectedItemMouseUp(object sender, EventArgs e)
        {
            ShowMediaPlayer();
        }

        private void MediaPlayerGrid_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            HideMediaPlayer();
        }

        private void MediaPlayer_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            if (!(e.OriginalSource is MediaElement))
            {
                e.Handled = true;
            }
        }

        private void MediaPlayer_MediaEnded(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
            HideMediaPlayer();
        }

        private void MediaPlayer_CurrentStateChanged(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
            if (this.MediaPlayer.CurrentState == MediaElementState.Stopped)
            {
                HideMediaPlayer();
            }
        }
    }


    public class MediaItem : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        private string _mediaPath;
        private string _imagePath;
        private string _title;
        private string _desc;

        public string MediaPath
        {
            get { return this._mediaPath; }
            set
            {
                if (value != this._mediaPath)
                {
                    this._mediaPath = value;
                    this.FirePropertyChanged("MediaPath");
                }
            }
        }
        public string ImagePath
        {
            get { return this._imagePath; }
            set
            {
                if (value != this._imagePath)
                {
                    this._imagePath = value;
                    this.FirePropertyChanged("ImagePath");
                }
            }
        }
        public string Title
        {
            get { return this._title; }
            set
            {
                if (value != this._title)
                {
                    this._title = value;
                    this.FirePropertyChanged("ImagePath");
                }
            }
        }
        public string Description
        {
            get { return this._desc; }
            set
            {
                if (value != this._desc)
                {
                    this._desc = value;
                    this.FirePropertyChanged("Description");
                }
            }
        }
        private void FirePropertyChanged(string propertyName)
        {
            if (this.PropertyChanged != null)
            {
                this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }
}

[venu]

Hello
can any one please send me the attachment of coverflow with mediaplayer code it is urgent.
i am trying that but stuck with some problem.
if any one can help........thanks in advance.
my email id is [e-mail]
regards
venugopal