public override void Update(System.Html.Element element, Func <object> valueAccessor, Func <System.Collections.Dictionary> allBindingsAccessor, object viewModel, object context)
{
// Whenever the value subsequently changes, slowly fade the element in or out
Observable <bool> observable = (Observable <bool>)valueAccessor();
string effectIn = (string)((object)allBindingsAccessor()["effectIn"]);
string effectOut = (string)((object)allBindingsAccessor()["effectOut"]);
jQueryObject item = jQuery.FromElement(element);
string effect = KnockoutUtils.UnwrapObservable(observable) ? effectIn : effectOut;
switch (effect)
{
case "fadeIn":
item.FadeIn();
break;
case "fadeOut":
item.FadeOut();
break;
case "slideUp":
item.SlideUp();
break;
case "slideDown":
item.SlideDown();
break;
}
}
public void HandleMouseLeave(EventData e, object item)
{
_mouseOut = true;
Window.SetTimeout(delegate()
{
if (_mouseOut)
{
_hoverButtons.FadeOut();
}
}, 500);
}
public static jQueryObject Gallery(GalleryPluginOptions customOptions)
{
GalleryPluginOptions defaultOptions =
new GalleryPluginOptions("count", 10,
"photoService", new FlickrService());
GalleryPluginOptions options =
(GalleryPluginOptions)jQuery.Extend(new Dictionary <string, object>(), defaultOptions, customOptions);
return(jQuery.Current.Each(delegate(int i, Element element) {
jQueryObject thumbnailList = jQuery.Select("#" + options.thumbsListID);
jQueryObject photoPanel = jQuery.Select("#" + options.photoPanelID);
options.photoService.SearchPhotos(options.tags, options.count, delegate(List <PhotoResult> photos) {
if ((photos == null) || (photos.Count == 0))
{
return;
}
thumbnailList.Empty();
jQuery.Select("#" + options.thumbnailTemplateID).Plugin <jQueryTemplateObject>().
RenderTemplate(photos).
CSS("opacity", "0.5").
AppendTo(thumbnailList).
MouseEnter(delegate(jQueryEvent e) {
jQuery.FromElement(e.CurrentTarget).FadeTo(250, 1.0f, delegate() {
jQuery.This.CSS("opacity", "1");
});
})
.MouseLeave(delegate(jQueryEvent e) {
jQuery.FromElement(e.CurrentTarget).FadeTo(250, 0.5f, delegate() {
jQuery.This.CSS("opacity", "0.5");
});
})
.Click(delegate(jQueryEvent e) {
PhotoResult photo = (PhotoResult)jQueryTemplating.GetTemplateInstance(e.CurrentTarget).Data;
jQueryTemplate photoTemplate = jQueryTemplating.CreateTemplate(jQuery.Select("#" + options.photoTemplateID));
photoPanel.FadeOut(EffectDuration.Slow, delegate() {
jQuery.This.Empty().CSS("display", "").
Append(jQueryTemplating.RenderTemplate(photoTemplate, photo)).
FadeIn(EffectDuration.Slow);
});
}).
Eq(0).Click();
});
return false;
}));
}
/// <summary>
/// Updats the HTML element with new HTML
/// Also, loads the new JS object (module) to handle the behavior
/// </summary>
/// <param name="content">The element to be updated</param>
/// <param name="value">The HTML with which to update it</param>
private static void UpdateModule(jQueryObject content, string value)
{
Module module = null;
// Find elements which have data-type attribute with any value
// The attribute is applied to elements that can be updated
jQueryObject dataTypes = content.Children("*[data-type]");
// If updatable elements exist,
if (dataTypes.Length > 0)
{
// Get the first element found
Element element = dataTypes.First().GetElement(0);
// Find the corresponding module
module = Module.GetModule(element);
// Now we have the module which should be unloaded and then updated
}
// Fade the element out and update with the new HTML
content.FadeOut(250, delegate()
{
// Unload the module
// BUGBUG: when can this be NULL
if (null != module)
{
module.Unload();
}
// Update the content
content.Html(value);
content.FadeIn(250);
// Check if it has any child modules to be loaded
dataTypes = content.Children("*[data-type]");
if (dataTypes.Length > 0)
{
// Load only the first
LoadModule(dataTypes.First().GetElement(0));
// BUGBUG: do we care about the rest?
}
});
}
// image recycle function
static void RecycleImage(jQueryObject item)
{
string trash_icon = "<a href='link/to/trash/script/when/we/have/js/off' title='Delete this image' class='ui-icon ui-icon-trash'>Delete image</a>";
item.FadeOut(EffectDuration.Slow, delegate()
{
item.Find("a.ui-icon-refresh")
.Remove()
.End()
.CSS("width", "96px")
.Append(trash_icon)
.Find("img")
.CSS("height", "72px")
.End()
.AppendTo("#gallery")
.FadeIn();
});
}
// image deletion function
static void DeleteImage(jQueryObject item)
{
string recycle_icon = "<a href='link/to/recycle/script/when/we/have/js/off' title='Recycle this image' class='ui-icon ui-icon-refresh'>Recycle image</a>";
item.FadeOut(EffectDuration.Slow, delegate()
{
jQueryObject list = jQuery.Select("ul", jQuery.Select("#trash")).Length > 0 ?
jQuery.Select("ul", jQuery.Select("#trash")) :
jQuery.Select("<ul class='gallery ui-helper-reset'/>").AppendTo("#trash");
item.Find("a.ui-icon-trash").Remove();
item.Append(recycle_icon).AppendTo(list).FadeIn(EffectDuration.Slow, delegate()
{
item.Animate(new Dictionary("width", "48px"))
.Find("img")
.Animate(new Dictionary("height", "36px"));
});
});
}
// image deletion function
static void DeleteImage(jQueryObject item)
{
string recycle_icon = "<a href='link/to/recycle/script/when/we/have/js/off' title='Recycle this image' class='ui-icon ui-icon-refresh'>Recycle image</a>";
item.FadeOut(EffectDuration.Slow, delegate()
{
jQueryObject list = jQuery.Select("ul", jQuery.Select("#trash")).Length > 0 ?
jQuery.Select("ul", jQuery.Select("#trash")) :
jQuery.Select("<ul class='gallery ui-helper-reset'/>").AppendTo("#trash");
item.Find("a.ui-icon-trash").Remove();
item.Append(recycle_icon).AppendTo(list).FadeIn(EffectDuration.Slow, delegate()
{
item.Animate(new Dictionary("width", "48px"))
.Find("img")
.Animate(new Dictionary("height", "36px"));
});
});
}
// image recycle function
static void RecycleImage(jQueryObject item)
{
string trash_icon = "<a href='link/to/trash/script/when/we/have/js/off' title='Delete this image' class='ui-icon ui-icon-trash'>Delete image</a>";
item.FadeOut(EffectDuration.Slow, delegate()
{
item.Find("a.ui-icon-refresh")
.Remove()
.End()
.CSS("width", "96px")
.Append(trash_icon)
.Find("img")
.CSS("height", "72px")
.End()
.AppendTo("#gallery")
.FadeIn();
});
}
