public static void AddFooter(WidgetObject menu, int recordCount) { jQueryObject footer = menu.Next(); if (footer.Length == 0 || !footer.HasClass("sparkle-menu-footer")) { footer = jQuery.FromHtml("<div class='sparkle-menu-footer ui-front'></div>"); menu.Parent().Append(footer); } if (footer != null) { footer.Html(""); jQueryObject footerContent = jQuery.FromHtml("<span class='sparkle-menu-footer-content'></span>"); jQueryObject footerLeft = jQuery.FromHtml("<span class='sparkle-menu-footer-left'></span>"); jQueryObject footerRight = jQuery.FromHtml("<span class='sparkle-menu-footer-right'></span>"); footerContent.Append(footerLeft); footerContent.Append(footerRight); footerLeft.Append(String.Format(SparkleResourceStrings.LookupFooter, recordCount)); footer.Append(footerContent); } jQueryPosition pos = menu.Position(); int height = menu.GetHeight(); int width = menu.GetWidth(); if (footer != null && footer.Length > 0) { footer.Show(); footer.CSS("top", (pos.Top + height + 4).ToString() + "px"); footer.CSS("left", (pos.Left).ToString() + "px"); footer.Width(width); } }
public void HandleMouseEnter(EventData e, object item) { OnCellChangedEventData cell = (OnCellChangedEventData)(object)_grid.GetCellFromEvent(e); if (cell != null) { _mouseOut = false; Entity entityRow = (Entity)_grid.GetDataItem(cell.Row); if (entityRow != null) { Script.Literal("{0}.getGridPosition()", _grid); int viewPortRight = _grid.GetViewport().RightPx; int viewPortLeft = _grid.GetViewport().LeftPx; jQueryObject node = jQuery.Select((string)Script.Literal("{0}.getCellNode({1},{2})", _grid, cell.Row, cell.Cell)); int buttonsWidth = _hoverButtons.GetWidth(); int x = node.Parent().GetWidth(); if (viewPortRight < x + buttonsWidth) { x = viewPortRight - buttonsWidth; } int y = 0; node.Parent().Append(_hoverButtons); _hoverButtons.CSS("left", x.ToString() + "px"); _hoverButtons.CSS("top", y.ToString() + "px"); _hoverButtons.CSS("display", "block"); _hoverButtons.Attribute("rowId", entityRow.Id.ToString()); } } }
public static void InitFullHeightGridPage(jQueryObject gridDiv) { J("body") .AddClass("full-height-page"); jQueryEventHandler layout = delegate { if (gridDiv.Parent().HasClass("page-content")) { gridDiv.CSS("height", "1px") .CSS("overflow", "hidden"); } Q.LayoutFillHeight(gridDiv); gridDiv.TriggerHandler("layout"); }; if (Window.Instance.As <dynamic>().Metronic != null) { Window.Instance.As <dynamic>().Metronic.addResizeHandler(layout); } else { } //jQuery.Window.Resize(layout); layout(null); }
public static void LayoutFillHeight(jQueryObject element) { var h = LayoutFillHeightValue(element); string n = h + "px"; if (element.GetCSS("height") != n) element.CSS("height", n); }
public static void InitFullHeightGridPage(jQueryObject gridDiv) { J("body") .AddClass("full-height-page"); jQueryEventHandler layout = delegate { if (gridDiv.Parent().HasClass("page-content")) gridDiv.CSS("height", "1px") .CSS("overflow", "hidden"); Q.LayoutFillHeight(gridDiv); gridDiv.TriggerHandler("layout"); }; if (J("body").HasClass("has-layout-event")) { J("body").Bind("layout", layout); } else if (Window.Instance.As<dynamic>().Metronic != null) Window.Instance.As<dynamic>().Metronic.addResizeHandler(layout); else { jQuery.Window.Resize(layout); } layout(null); }
/// <summary>Constructor.</summary> /// <param name="divHost">The control host DIV.</param> /// <param name="control">The logical IView control (null if not available).</param> /// <param name="htmlElement">The control content (supplied by the test class. This is the control that is under test).</param> /// <param name="displayMode">The sizing strategy to use for the control.</param> /// <param name="allViews">The Collection of all controls.</param> public ControlWrapperView( jQueryObject divHost, IView control, jQueryObject htmlElement, ControlDisplayMode displayMode, IEnumerable allViews) : base(divHost) { // Setup initial conditions. this.control = control; this.htmlElement = htmlElement; this.displayMode = displayMode; this.allViews = allViews; index = divHost.Children().Length; // Store the order position of the control in the host. events = Common.Events; // Create the wrapper DIV. divRoot = Html.CreateDiv(); divRoot.CSS(Css.Position, Css.Absolute); divRoot.AppendTo(divHost); // Insert the content. htmlElement.CSS(Css.Position, Css.Absolute); htmlElement.AppendTo(divRoot); // Wire up events. events.ControlHostSizeChanged += OnHostResized; // Finish up. UpdateLayout(); }
public static void InitFullHeightGridPage(jQueryObject gridDiv) { J("body") .AddClass("full-height-page"); gridDiv.AddClass("responsive-height"); jQueryEventHandler layout = delegate { bool inPageContent = gridDiv.Parent().HasClass("page-content") || gridDiv.Parent().Is("section.content"); if (inPageContent) { gridDiv.CSS("height", "1px") .CSS("overflow", "hidden"); } Q.LayoutFillHeight(gridDiv); if (inPageContent) { gridDiv.CSS("overflow", ""); } gridDiv.TriggerHandler("layout"); }; if (J("body").HasClass("has-layout-event")) { J("body").Bind("layout", layout); } else if (Window.Instance.As <dynamic>().Metronic != null) { Window.Instance.As <dynamic>().Metronic.addResizeHandler(layout); } else { jQuery.Window.Resize(layout); } layout(null); }
public void SwingBack(FloatingWindowScope scope, jQueryObject element, Action callback) { Window.SetTimeout(() => { var js = new JsDictionary <string, object>(); js["left"] = scope.Left; js["top"] = scope.Top; element.CSS("display", "block"); element.Animate(js, EffectDuration.Fast, EffectEasing.Swing, callback); }, 1); }
public MyCssView(jQueryObject container, ControlDisplayMode controlDisplayMode) : base(container) { container.Append(string.Format("Control [sizeMode:{0}]", controlDisplayMode.ToString())); container.CSS(Css.Background, "#f0ebc5"); container.CSS(Css.Width, "300px"); container.CSS(Css.Height, "200px"); container.CSS("-webkit-border-radius", "10px"); container.CSS("-moz-border-radius", "10px"); container.CSS("border-radius", "10px"); }
/// <summary>Constructor.</summary> /// <param name="container">The root HTML element of the control (if null a <DIV></DIV> is generated).</param> /// <param name="fillPane">Flag indicating which pane is the filler pane (assumes the size not taken up by the other pane).</param> internal HorizontalSplitPanel(jQueryObject container, HorizontalEdge fillPane) : base(container) { // Store values. this.fillPane = fillPane; // Construct panes. divLeft = CreateDiv(); divRight = CreateDiv(); // Setup common panel CSS. divLeft.CSS(Css.Left, "0px"); divRight.CSS(Css.Right, "0px"); // Insert into DOM. Container.Empty(); divLeft.AppendTo(Container); divRight.AppendTo(Container); // Finish up. UpdateLayout(); }
/// <summary>Sets the size for the given dimension (Width or Height).</summary> /// <param name="element">The element to read.</param> /// <param name="dimension">The dimension.</param> /// <param name="value">The value to set.</param> public static void SetDimension(jQueryObject element, SizeDimension dimension, int value) { if (Script.IsNullOrUndefined(element)) return; if (value < 0) value = 0; element.CSS( dimension == SizeDimension.Width ? Width : Height, value + Px); }
private static void InitVerticalCss(jQueryObject child) { child.CSS(Css.Position, Css.Absolute); child.CSS(Css.Top, string.Empty); child.CSS(Css.Bottom, string.Empty); }
private static void InitHorizontalCss(jQueryObject child) { child.CSS(Css.Position, Css.Absolute); child.CSS(Css.Left, string.Empty); child.CSS(Css.Right, string.Empty); }
/// <summary>Sets the left position of an element so it is horizontally centered within another element.</summary> /// <param name="element">The element to horizontally center.</param> /// <param name="within">The element to center within.</param> /// <param name="offset">The offset to take into account when calculating position.</param> public static jQueryObject CenterHorizontally(jQueryObject element, jQueryObject within, Spacing offset) { int left = (within.GetWidth() / 2) - (element.GetWidth() / 2); if (!Script.IsNullOrUndefined(offset)) { left += offset.HorizontalOffset; } element.CSS(Left, left + "px"); return element; }
/// <summary>Sets the size of the element.</summary> /// <param name="element">The element to effect.</param> /// <param name="width">The pixel width of the element.</param> /// <param name="height">The pixel height of the element.</param> public static jQueryObject SetSize(jQueryObject element, int width, int height) { element.CSS(Width, width + Px); element.CSS(Height, height + Px); return element; }
/// <summary>Shows or hides the given element using the Display property (collapses when not visible).</summary> /// <param name="element">The element to effect.</param> /// <param name="isVisible">The desired visibility state.</param> public static jQueryObject SetDisplay(jQueryObject element, bool isVisible) { if (element != null) element.CSS(Display, isVisible ? Block : None); return element; }
/// <summary>Applies a drop shadow.</summary> /// <param name="element">The element to update.</param> /// <param name="opacity">Opacity of the drop-shadow (005, 010, 020, 030, 040, 050, 060).</param> public static jQueryObject ApplyDropshadow(jQueryObject element, string opacity) { element.CSS("background-image", string.Format("url(/Open.Core/Images/DropShadow.12.{0}.png)", opacity)); element.CSS("background-repeat", "repeat-x"); element.CSS("height", "12px"); return element; }
/// <summary>Sets the given element to absolute positioning and sets all edges to 0px.</summary> /// <param name="element">The element to update.</param> public static jQueryObject AbsoluteFill(jQueryObject element) { element.CSS(Position, Absolute); element.CSS(Left, "0px"); element.CSS(Top, "0px"); element.CSS(Right, "0px"); element.CSS(Bottom, "0px"); return element; }
private static void Arrange(jQueryObject element) { #if DEBUG if (!element.Is("." + CssClassNameAdvancedLayout)) { throw new Exception("Element not marked for advanced layout."); } #endif // does element have its al state parsed? AdvancedLayoutState elementState = (AdvancedLayoutState)element.GetDataValue(DataNameLayoutState); if (elementState == null) { element.Data(DataNameLayoutState, elementState = ParseAdvancedLayout(element)); } // grab parents jQueryObject parent = element.Parent(); jQueryObject offsetParent = element.OffsetParent(); if (offsetParent.Length == 0 || parent.Length == 0) { return; } bool parentIsOffsetParent = offsetParent[0] == parent[0]; #if DEBUG if (!parentIsOffsetParent && element.Is(":visible")) { throw new Exception("Parent must use position:absolute|fixed|relative;."); } #endif if (!parentIsOffsetParent) { return; } // gather parent padding and client dimensions DimensionsAndPadding parentDimensions = null; parentDimensions = GetDimensionsAndPadding(parent); // detect parent's coordinates in offset-parent frame. float contentStartInOffsetSpaceX, contentStartInOffsetSpaceY; { if (parentIsOffsetParent) { // parent is offset parent. we know our local frame. contentStartInOffsetSpaceX = 0; contentStartInOffsetSpaceY = 0; } else { // experimental support for staticly positioned parent. parent.Prepend(_frameDetector); jQueryPosition parentContentFrameInDocumentSpace = _frameDetector.GetOffset(); jQueryPosition offsetParentFrameInDocumentSpace = offsetParent.GetOffset(); if (parentContentFrameInDocumentSpace != null && offsetParentFrameInDocumentSpace != null) { contentStartInOffsetSpaceX = parentContentFrameInDocumentSpace.Left - offsetParentFrameInDocumentSpace.Left - parentDimensions.PaddingLeft; contentStartInOffsetSpaceY = parentContentFrameInDocumentSpace.Top - offsetParentFrameInDocumentSpace.Top - parentDimensions.PaddingTop; } else { jQueryPosition contentStartInOffsetSpace = _frameDetector.Position(); if (contentStartInOffsetSpace != null) { contentStartInOffsetSpaceX = contentStartInOffsetSpace.Left - parentDimensions.PaddingLeft; contentStartInOffsetSpaceY = contentStartInOffsetSpace.Top - parentDimensions.PaddingTop; } else { contentStartInOffsetSpaceX = 0; contentStartInOffsetSpaceY = 0; } } _frameDetector.Remove(); } } double topBoundary = contentStartInOffsetSpaceY + parentDimensions.PaddingTop + elementState.Margin.Top; double bottomBoundary = contentStartInOffsetSpaceY + parentDimensions.ClientHeight - parentDimensions.PaddingBottom - elementState.Margin.Bottom; double leftBoundary = contentStartInOffsetSpaceX + parentDimensions.PaddingLeft + elementState.Margin.Left; double rightBoundary = contentStartInOffsetSpaceX + parentDimensions.ClientWidth - parentDimensions.PaddingRight - elementState.Margin.Right; // determine where to position int top = 0; int left = 0; int width = 0; int height = 0; switch (elementState.VerticalAlignment) { case VerticalAlignment.Top: height = Math.Round(elementState.Height - elementState.Padding.Top - elementState.Padding.Bottom); top = Math.Round(topBoundary); break; case VerticalAlignment.Center: height = Math.Round(elementState.Height - elementState.Padding.Top - elementState.Padding.Bottom); top = Math.Round(topBoundary * 0.5 + bottomBoundary * 0.5 - height * 0.5); break; case VerticalAlignment.Bottom: height = Math.Round(elementState.Height - elementState.Padding.Top - elementState.Padding.Bottom); top = Math.Round(contentStartInOffsetSpaceY + parentDimensions.ClientHeight - parentDimensions.PaddingBottom - elementState.Margin.Bottom - elementState.Height); break; case VerticalAlignment.Stretch: height = Math.Round(bottomBoundary - topBoundary - elementState.Padding.Top - elementState.Padding.Bottom); top = Math.Round(topBoundary); break; } switch (elementState.HorizontalAlignment) { case HorizontalAlignment.Left: width = Math.Round(elementState.Width - elementState.Padding.Left - elementState.Padding.Right); left = Math.Round(leftBoundary); break; case HorizontalAlignment.Center: width = Math.Round(elementState.Width - elementState.Padding.Left - elementState.Padding.Right); left = Math.Round(leftBoundary * 0.5 + rightBoundary * 0.5 - width * 0.5); break; case HorizontalAlignment.Right: width = Math.Round(elementState.Width - elementState.Padding.Left - elementState.Padding.Right); left = Math.Round(contentStartInOffsetSpaceX + parentDimensions.ClientWidth - parentDimensions.PaddingRight - elementState.Margin.Right - elementState.Width); break; case HorizontalAlignment.Stretch: width = Math.Round(rightBoundary - leftBoundary - elementState.Padding.Left - elementState.Padding.Right); left = Math.Round(leftBoundary); break; } if (width <= 0) { width = 0; } if (height <= 0) { height = 0; } element.CSS( new Dictionary( "position", "absolute", "top", top, "left", left, "width", width, "height", height, "padding-top", elementState.Padding.Top, "padding-right", elementState.Padding.Right, "padding-bottom", elementState.Padding.Bottom, "padding-left", elementState.Padding.Left ) ); }
private static void InitLayoutEnforcement() { _frameDetector = jQuery.FromHtml("<span></span"); _frameDetector.CSS(new Dictionary("position", "absolute", "height", "0px", "width", "0px", "margin", "0px", "padding", "0px", "border", "none", "display", "block")); // are mutation events supported? if (Document.Implementation.HasFeature("MutationEvents", "2.0")) { MutationBindingEnable(true); } // no mutation events supported else { if (_layoutEnforcementTimerId == 0) { _layoutEnforcementTimerId = Window.SetInterval(OnIntervalEnforceLayout, LayoutEnforcementInterval); } } }
public static jQueryObject ScrollPagerPlugin(ScrollPagerPluginOptions customOptions) { ScrollPagerPluginOptions defaultOptions = new ScrollPagerPluginOptions(); defaultOptions.pageSize = 10; defaultOptions.currentPage = 1; defaultOptions.holder = ".listcontainer"; defaultOptions.viewport = ""; defaultOptions.pageHeight = 23; defaultOptions.onPageChanged = null; defaultOptions.container = "#listcontainerdiv"; ScrollPagerPluginOptions options = jQuery.ExtendObject <ScrollPagerPluginOptions>(new ScrollPagerPluginOptions(), defaultOptions, customOptions); return(jQuery.Current.Each(delegate(int i, Element element) { jQueryObject selector = jQuery.This; int pageCounter = 1; PositionInfo iPosition = new PositionInfo(); MouseInfo iMouse = new MouseInfo(); Number candidatePageIndex = 0; //this goes through every item in the selector .Children() .Each(delegate(int ic, Element elc) { if (ic < pageCounter * options.pageSize && ic >= (pageCounter - 1) * options.pageSize) { jQuery.This.AddClass("page" + pageCounter); } else { jQuery.This.AddClass("page" + (pageCounter + 1)); pageCounter++; } }); //set and default the slider item height int contHeight = jQuery.Select(options.container).GetHeight(); int sliderItemHeight = contHeight; //show/hide the appropriate regions selector.Children().Hide(); jQuery.Select(".page" + options.currentPage).Show(); //more than one page? if (pageCounter > 1) { //calculate the slider item height sliderItemHeight = (contHeight / pageCounter); //Build pager navigation string pageNav = "<UL class=scrollbar sizcache='4' sizset='13'>"; for (i = 1; i <= pageCounter; i++) { if (i == options.currentPage) { pageNav += "<LI class='currentPage pageItem' sizcache='4' sizset='13'><A class='sliderPage' href='#' rel='" + i + "'></A>"; } else { pageNav += "<LI class='pageNav" + i + " pageItem' sizcache='4' sizset='14'><A class='sliderPage' href='#' rel='" + i + "'></A>"; } } //Create slider item string sliderItem = "<LI class='thumb' sizcache='4' sizset='13' style='top:" + (options.currentPage - 1) * sliderItemHeight + "; height:" + (sliderItemHeight - 3) + "'><A class='sliderThumb' href='#' rel='" + i + "'></A>"; pageNav += sliderItem; pageNav += "</LI></UL>"; if (options.holder == "") { selector.After(pageNav); } else { jQuery.Select(options.holder).Append(pageNav); } //Apply the slider item height jQuery.Select(".pageItem").Height(sliderItemHeight); } jQueryObject oTrack = jQuery.Select(".scrollbar"); jQueryObject oThumb = jQuery.Select(".thumb"); //jQueryObject oViewPort = jQuery.Select(options.viewport); Number maxPos = (oTrack.GetHeight() - oThumb.GetHeight()); jQueryObject pageItemCollection = jQuery.Select(".pageItem a"); Action <jQueryObject> selectPageItem = delegate(jQueryObject pageItem) { string clickedLink = pageItem.GetAttribute("rel"); options.onPageChanged.Invoke(pageItem, new SelectedPageEventArgs(int.Parse(clickedLink))); options.currentPage = int.Parse(clickedLink); //remove current current (!) page jQuery.Select("li.currentPage").RemoveClass("currentPage"); //Add current page highlighting pageItem.Parent("li").AddClass("currentPage"); //hide and show relevant links selector.Children().Hide(); selector.Find(".page" + clickedLink).Show(); }; //Action<jQueryObject> selectPageItem = delegate(jQueryObject pageItem) jQueryEventHandler selectPageItemHandler = delegate(jQueryEvent pageItemClickedEvent) { //grab the REL attribute jQueryObject pageItem = jQuery.FromElement(pageItemClickedEvent.CurrentTarget); selectPageItem(pageItem); }; //pager navigation behaviour pageItemCollection.Live("click", selectPageItemHandler); jQueryEventHandler wheel = delegate(jQueryEvent oEvent) { }; jQueryEventHandler drag = delegate(jQueryEvent oEvent) { Number candidatePos = Math.Max(0, (iPosition.Start + ((oEvent.PageY) - iMouse.Start))); iPosition.Now = (candidatePos > maxPos) ? maxPos : candidatePos; candidatePageIndex = Math.Round(iPosition.Now / oThumb.GetHeight()); oThumb.CSS("top", iPosition.Now.ToString());; }; jQueryEventHandler end = null; end = delegate(jQueryEvent oEvent) { jQuery.Document.Unbind("mousemove", drag); jQuery.Document.Unbind("mouseup", end); oThumb.Die("mouseup", end); selectPageItem(jQuery.FromElement(pageItemCollection[candidatePageIndex])); }; jQueryEventHandler start = delegate(jQueryEvent oEvent) { iMouse.Start = oEvent.PageY; string oThumbDir = oThumb.GetCSS("top"); iPosition.Start = (oThumbDir == "auto") ? 0 : int.Parse(oThumbDir); jQuery.Document.Bind("mousemove", drag); jQuery.Document.Bind("mouseup", end); oThumb.Live("mouseup", end); }; Action setEvents = delegate() { oThumb.Live("mousedown", start); oTrack.Live("mouseup", drag); //if (options.scroll != null) //{ // oViewPort[0].AddEventListener("DOMMouseScroll", wheel, false); // oViewPort[0].AddEventListener("mousewheel", wheel, false); //} //else if (options.scroll != null) //{ // oViewPort[0].OnMouseWheel = wheel; //} }; setEvents.Invoke(); })); }
private void linkFn(DebugCardScope scope, jQueryObject element, object attrs) { var card = scope.Card.GameCard; scope.Classes = new List<string>(); element.Attribute("style", "width:71px; height:96px;"); var beforeStyle = new JsDictionary<string, string>() { }; var lastStyle = new JsDictionary<string, string>() { }; element.Draggable(new DraggableOptions() { OnStart = (@event, uiEvent) => { scope.Card.Dragging = true; scope.CardStyle.zIndex = 1000; rootScope.Broadcast("redrawCard"); scope.Apply(); }, OnDrag = (@event, uiEvent) => { scope.Card.Location.X = @event.ClientX ; scope.Card.Location.Y = @event.ClientY ; bool updated = false; foreach (var debugSpace in scope.GameModel.Spaces) { for (int index = debugSpace.Cards.Count - 1; index >= 0; index--) { if (debugSpace.Cards[index].PlaceHolder) { updated = true; debugSpace.Cards.RemoveAt(index); } } } foreach (var debugSpace in scope.GameModel.Spaces) { if (debugSpace.Location.Expand(30).Contains(scope.Card.Location)) { foreach (var debugSpaceCard in debugSpace.Cards) { Rectangle rectangle = debugSpaceCard.Location.Offset(debugSpace.Location.X, debugSpace.Location.Y); Console.WriteLine(string.Format("{0},{1} {2} {3}", debugSpace.Location.X, debugSpace.Location.Y, debugSpaceCard, rectangle.Expand(10).ToString(), scope.Card.Location.ToString())); if (rectangle.Expand(10).Contains(scope.Card.Location)) { debugSpace.Cards.Insert(debugSpace.Cards.IndexOf(debugSpaceCard), new DebugSpaceCard() { PlaceHolder = true, GameCard = null }); /* if (rectangle.X + rectangle.Width/2 < scope.Card.Location.X) { debugSpace.Cards.Insert(debugSpace.Cards.IndexOf(debugSpaceCard), new DebugSpaceCard() { PlaceHolder = true, GameCard = null }); } else { debugSpace.Cards.Insert(debugSpace.Cards.IndexOf(debugSpaceCard)+1, new DebugSpaceCard() { PlaceHolder = true, GameCard = null }); } */ Console.WriteLine("Took"); updated = true; break; } } } } if (updated) { rootScope.Broadcast("redrawCard"); scope.Apply(); } }, OnStop = (@event, uiEvent) => { foreach (var debugSpace in scope.GameModel.Spaces) { for (int index = debugSpace.Cards.Count - 1; index >= 0; index--) { if (debugSpace.Cards[index].PlaceHolder) { debugSpace.Cards.RemoveAt(index); scope.Space.Cards.Remove(scope.Card); foreach (var debugSpaceCard in scope.Space.Cards) { if (debugSpaceCard.Index > scope.Card.Index) { debugSpaceCard.Index--; } } scope.Card.Index = index; foreach (var debugSpaceCard in debugSpace.Cards) { if (debugSpaceCard.Index >= scope.Card.Index) { debugSpaceCard.Index++; } } debugSpace.Cards.Insert(index,scope.Card); break; } } } ExtensionMethods.Delete(scope.CardStyle.zIndex); scope.Card.Dragging = false; rootScope.Broadcast("redrawCard"); scope.Apply(); } }); Action redrawCard = () => { Console.WriteLine(string.Format("card{0}-{1} being called ", card.Type, card.Value)); if (scope.Card.Dragging) { return; } scope.CardStyle = new { }; card = scope.Card.GameCard; var scale = scope.GameModel.Scale; var goodCards = scope.Space.Cards.Where(a => !a.Dragging); int spaceCardLength = goodCards.Count - 1; var debugSpace = scope.Space.GameSpace; var spaceScale = new { width = debugSpace.Width / spaceCardLength, height = debugSpace.Height / spaceCardLength }; var vertical = debugSpace.Vertical; var cardIndex = goodCards.IndexOf(scope.Card); var xx = 0.0; var yy = 0.0; switch (debugSpace.ResizeType) { case TableSpaceResizeType.Static: if (vertical) yy = ((card.Value + 1) / 13.0) * debugSpace.Height * scale.Y; else xx = ((card.Value + 1) / 13.0) * debugSpace.Width * scale.X; break; case TableSpaceResizeType.Grow: xx = (!vertical ? (cardIndex * spaceScale.width * scale.X) : 0); yy = (vertical ? (cardIndex * spaceScale.height * scale.Y) : 0); break; default: xx = (!vertical ? (cardIndex * spaceScale.width * scale.X) : 0); yy = (vertical ? (cardIndex * spaceScale.height * scale.Y) : 0); break; } xx -= 71 / 2; yy -= 96 / 2; scope.CardStyle.position = "absolute"; scope.CardStyle.zIndex = cardIndex; scope.CardStyle.borderRadius = 5.ToPx(); xx = (xx + (vertical ? debugSpace.Width * scale.X / 2 : 0)); element.CSS("left", xx.ToPx()); yy = (yy + (!vertical ? debugSpace.Height * scale.Y / 2 : 0)); element.CSS("top", yy.ToPx()); scope.Card.Location = new Rectangle(xx, yy, 71, 96); // scope.CardStyle["-webkit-transform"] = "rotate(" + scope.Parent.Space.Appearance.InnerStyle.Rotate + "deg)"; // element.me().rotate(scope.Parent.Space.Appearance.InnerStyle.Rotate); scope.CardStyle.content = "\"\""; if (card == null) { scope.CardStyle.border = "solid 2px blue"; scope.CardStyle.width = "71px"; scope.CardStyle.height = "96px"; } else { beforeStyle = new JsDictionary<string, string>() { }; if (card.Value == -1 && card.Type == -1) { beforeStyle["content"] = string.Format("url('{1}assets/cards/{0}.gif')", 155, Constants.ContentAddress); } else { beforeStyle["content"] = string.Format("url('{1}assets/cards/{0}.gif')", (100 + (card.Value + 1) + (card.Type) * 13), Constants.ContentAddress); } foreach (var effectName in card.Effects) { var effect = scope.GameModel.MainArea.ClientGetEffectByName(effectName); switch (effect.Type) { case EffectType.Highlight: { var color = effect.GetString("color"); var radius = effect.GetNumber("radius"); var rotate = effect.GetNumber("rotate"); var offsetX = effect.GetNumber("offsetx"); var offsetY = effect.GetNumber("offsety"); var opacity = effect.GetNumber("opacity"); beforeStyle["display"] = "block"; beforeStyle["position"] = "relative"; beforeStyle["z-index"] = "-1"; beforeStyle["width"] = "100%"; beforeStyle["height"] = "100%"; beforeStyle["left"] = (-radius + offsetX) + "px"; beforeStyle["top"] = (-radius + offsetY) + "px"; beforeStyle["padding"] = (radius) + "px"; beforeStyle["border-radius"] = "5px"; beforeStyle["box-shadow"] = "rgb(44, 44, 44) 3px 3px 2px"; beforeStyle["content"] = string.Format("url('{1}assets/cards/{0}.gif')", (100 + (card.Value + 1) + (card.Type) * 13), Constants.ContentAddress); var hexcolor = ClientHelpers.HexToRGB(color); beforeStyle["background-color"] = string.Format("rgba({0}, {1}, {2}, {3})", hexcolor.R, hexcolor.G, hexcolor.B, opacity); beforeStyle["border"] = "2px solid black"; } break; case EffectType.Rotate: { var rotate = effect.GetNumber("degrees"); scope.CardStyle["-webkit-transform"] = "rotate(" + rotate + "deg)"; scope.CardStyle.transform = "rotate(" + rotate + "deg)"; } break; case EffectType.Bend: /* var bEffect = (new CardGameAppearanceEffectBend(new CardGameEffectBendOptions() { Degrees = grabbedEffect.GetPropertyByName<double>("degrees"), })); var rotate = element.GetCSS("transform").Replace(" scale(1, 1)", ""); element.me().rotate((((-bEffect.Degrees / 2 + bEffect.Degrees / (scope.Space.Pile.Cards.Count - 1) * cardIndex) + NoTransformRotate(rotate)))); */ break; case EffectType.StyleProperty: break; case EffectType.Animated: break; } } if (!lastStyle.SameAs(beforeStyle)) { Console.WriteLine(string.Format("card{0}-{1} being updated ", card.Type, card.Value)); ClientHelpers.PurgeCSS(string.Format("card{0}-{1}", card.Type, card.Value) + "::before"); ClientHelpers.ChangeCSS(string.Format("card{0}-{1}::before", card.Type, card.Value), beforeStyle); } lastStyle = beforeStyle; } /* foreach (var effect in scope.Card.Appearance.EffectNames) { GameEffectModel grabbedEffect = myEffectManager.GetEffectByName(effect); if (grabbedEffect == null) { continue; } switch (grabbedEffect.Type) { case EffectType.Highlight: var _effect = new CardGameAppearanceEffectHighlight(new CardGameEffectHighlightOptions() { Color = grabbedEffect.GetPropertyByName<string>("color"), Radius = grabbedEffect.GetPropertyByName<double>("radius"), Rotate = grabbedEffect.GetPropertyByName<double>("rotate"), OffsetX = grabbedEffect.GetPropertyByName<double>("offsetx"), OffsetY = grabbedEffect.GetPropertyByName<double>("offsety"), Opacity = grabbedEffect.GetPropertyByName<double>("opacity"), }); JsDictionary<string, string> beforeStyle = new JsDictionary<string, string>(); beforeStyle["display"] = "block"; beforeStyle["position"] = "relative"; beforeStyle["z-index"] = "-1"; beforeStyle["width"] = "100%"; beforeStyle["height"] = "100%"; beforeStyle["left"] = (-_effect.Radius + _effect.OffsetX) + "px"; beforeStyle["top"] = (-_effect.Radius + _effect.OffsetY) + "px"; beforeStyle["padding"] = (_effect.Radius) + "px"; beforeStyle["border-radius"] = "5px"; beforeStyle["box-shadow"] = "rgb(44, 44, 44) 3px 3px 2px"; var color = hextorgb(_effect.Color); beforeStyle["background-color"] = string.Format("rgba({0}, {1}, {2}, {3})", color.R, color.G, color.B, _effect.Opacity); beforeStyle["border"] = "2px solid black"; ChangeCSS("card" + scope.Card.Type + "-" + scope.Card.Value + "::before", beforeStyle); break; case EffectType.Rotate: break; case EffectType.Bend: var bEffect = (new CardGameAppearanceEffectBend(new CardGameEffectBendOptions() { Degrees = grabbedEffect.GetPropertyByName<double>("degrees"), })); var rotate = element.GetCSS("transform").Replace(" scale(1, 1)", ""); element.me().rotate((((-bEffect.Degrees / 2 + bEffect.Degrees / (scope.Space.Pile.Cards.Count - 1) * cardIndex) + NoTransformRotate(rotate))) ); break; case EffectType.StyleProperty: break; case EffectType.Animated: break; } } */ }; if (card != null) { if (card.Value == -1 && card.Type == -1) { beforeStyle["content"] = string.Format("url('{1}assets/cards/{0}.gif')", 155, Constants.ContentAddress); } else { beforeStyle["content"] = string.Format("url('{1}assets/cards/{0}.gif')", (100 + (card.Value + 1) + (card.Type) * 13), Constants.ContentAddress); } scope.Classes.Add(string.Format("card{0}-{1}", card.Type, card.Value)); ClientHelpers.ChangeCSS("card" + card.Type + "-" + card.Value + "::before", beforeStyle); } scope.On("redrawCard", redrawCard); // redrawCard(); /* scope.Watch("$parent.space", () => { Console.Log("ac"); redrawCard(); }, true); scope.Watch("card.appearance.effectNames.join()", () => { Console.Log("b"); redrawCard(); }, true);*/ /*scope.Watch<CardScope>((_scope) => { List<Effect> effects = new List<Effect>(); foreach (var ef in _scope.Card.Appearance.EffectNames) { var _ef = myEffectManager.GetEffectByName(ef); effects.Add(_ef); } return effects; }, () => { Console.Log("c"); redrawCard(); }, true); */ redrawCard(); }
/// <summary>Sets the overflow style on the given element.</summary> /// <param name="element">The element to update.</param> /// <param name="value">The overflow value.</param> public static jQueryObject SetOverflow(jQueryObject element, CssOverflow value) { element.CSS(Overflow, value.ToString()); return element; }
public void SwingBack(FloatingWindowScope scope, jQueryObject element, Action callback) { Window.SetTimeout(() => { var js = new JsDictionary<string, object>(); js["left"] = scope.Left; js["top"] = scope.Top; element.CSS("display", "block"); element.Animate(js, EffectDuration.Fast, EffectEasing.Swing, callback); }, 1); }
/// <summary>Applies rounded corners to the given element.</summary> /// <param name="element">The element to apply rounded corners to.</param> /// <param name="topLeft">The top-left pixel radius.</param> /// <param name="topRight">The top-right pixel radius.</param> /// <param name="bottomRight">The bottom-right pixel radius.</param> /// <param name="bottomLeft">The bottom-left pixel radius.</param> public static void RoundedCorners(jQueryObject element, int topLeft, int topRight, int bottomRight, int bottomLeft) { // Setup initial conditions. if (Script.IsUndefined(topRight)) topRight = topLeft; if (Script.IsUndefined(bottomRight)) bottomRight = topLeft; if (Script.IsUndefined(bottomLeft)) bottomLeft = topLeft; // Webkit. element.CSS("-webkit-border-top-left-radius", topLeft + "px"); element.CSS("-webkit-border-top-right-radius", topRight + "px"); element.CSS("-webkit-border-bottom-right-radius", bottomRight + "px"); element.CSS("-webkit-border-bottom-left-radius", bottomLeft + "px"); // Mozilla. element.CSS("-moz-border-radius-topleft", topLeft + "px"); element.CSS("-moz-border-radius-topright", topRight + "px"); element.CSS("-moz-border-radius-bottomright", bottomRight + "px"); element.CSS("-moz-border-radius-bottomleft", bottomLeft + "px"); // CSS3. element.CSS("border-top-left-radius", topLeft + "px"); element.CSS("border-top-right-radius", topRight + "px"); element.CSS("border-bottom-right-radius", bottomRight + "px"); element.CSS("border-bottom-left-radius", bottomLeft + "px"); }
public void SwingAway(SwingDirection direction, bool simulate, jQueryObject element, Action callback) { var js = new JsDictionary<string, object>(); string distance = "3000"; switch (direction) { case SwingDirection.TopLeft: js["left"] = "-" + distance + "px"; js["top"] = "-" + distance + "px"; break; case SwingDirection.Top: js["top"] = "-" + distance + "px"; break; case SwingDirection.TopRight: js["left"] = distance + "px"; js["top"] = "-" + distance + "px"; break; case SwingDirection.Right: js["left"] = distance + "px"; break; case SwingDirection.BottomRight: js["left"] = distance + "px"; js["top"] = distance + "px"; break; case SwingDirection.Bottom: js["top"] = distance + "px"; break; case SwingDirection.BottomLeft: js["left"] = "-" + distance + "px"; js["top"] = distance + "px"; break; case SwingDirection.Left: js["left"] = distance + "px"; break; } if (simulate) { element.CSS(js); element.CSS("display", "none"); if (callback != null) { callback(); } } else element.Animate(js, EffectDuration.Slow, EffectEasing.Swing, () => { element.CSS("display", "none"); if (callback != null) { callback(); } }); }
/// <summary>Shows or hides the given element using the Visibility property (retains space when not visible).</summary> /// <param name="element">The element to effect.</param> /// <param name="isVisible">The desired visibility state.</param> public static jQueryObject SetVisibility(jQueryObject element, bool isVisible) { if (element != null) element.CSS(Visibility, isVisible ? "visible" : "hidden"); return element; }
/// <summary> /// Creates a Spacing object that handles keeping an 'inner' object's size /// synced to its parent by settings it's making position:absolute and keeping it's /// - left /// - right /// - top /// - bottom /// CSS properties in sync with this Spacing object. /// </summary> /// <param name="inner">The inner object in the sync relationship.</param> /// <param name="onBeforeSync">Invoked before the inner element is updated (use to alter the spacing values).</param> public Spacing Sync(jQueryObject inner, SpacingSync onBeforeSync) { // Setup 'position' attributes on the elements. inner.CSS(Css.Position, Css.Absolute); // Store values. this.inner = inner; this.onBeforeSync = onBeforeSync; // Finish up. InitializeSyncing(); UpdateLayout(); return this; }
/// <summary>Applies opacity.</summary> /// <param name="element">The element to effect.</param> /// <param name="percent">The opacity percentage (0..1).</param> public static jQueryObject SetOpacity(jQueryObject element, double percent) { percent = Helper.NumberDouble.WithinBounds(percent, 0, 1); element.CSS(Opacity, percent.ToString()); return element; }
private void linkFn(dynamic scope, jQueryObject element, object attrs) { scope["$watch"]("showGrid", new Action(() => { if (scope.showGrid) { element.Show(EffectDuration.Fast); } else { element.Hide(EffectDuration.Fast); } })); scope["$watch"]("scale", new Action(() => { element.Empty(); var scale = (Point) scope.scale; var n = (CanvasElement) Document.CreateElement("canvas"); var w = scale.X; var h = scale.Y; n.Width = (int) w + 1; n.Height = (int) h + 1; var context = (CanvasContext2D) n.GetContext("2d"); context.StrokeStyle = "#EEEEEE"; context.LineWidth = 1; context.MoveTo(w, 0); context.LineTo(w, h); context.Stroke(); context.MoveTo(0, h); context.LineTo(w, h); context.Stroke(); var url = (string) ((dynamic) n).toDataURL("image/png"); element.CSS("background-image", string.Format("url({0})", url)); element.CSS("background-repeat", "repeat-x repeat-y"); element.CSS("width", "100%"); element.CSS("height", "100%"); element.CSS("margin-left", "auto"); element.CSS("margin-right", "auto"); element.CSS("margin-bottom", "auto"); element.CSS("margin-top", "auto"); element.ZIndex(-10000); }), true); /* scope["$watch"]("scale", new Action(() => { element.Empty(); var scale = (Point) scope.scale; var w = jQueryApi.jQuery.Window.GetWidth(); var h = jQueryApi.jQuery.Window.GetHeight(); for (int i = 0; i < (w/scale.X) + 2; i++) { for (int j = 0; j < (h/scale.Y) + 2; j++) { element.Append( string.Format( "<div style='border:solid 1px black;position:absolute;left:{0}px;top:{1}px;width:{2}px;height:{3}px;'></div>", i*scale.X, j*scale.Y, scale.X, scale.Y)); } } }), true); */ }
/// <summary>Sets the top position of an element so it is vertically centered within another element.</summary> /// <param name="element">The element to vertically center.</param> /// <param name="within">The element to center within.</param> /// <param name="offset">The offset to take into account when calculating position.</param> public static jQueryObject CenterVertically(jQueryObject element, jQueryObject within, Spacing offset) { int top = (within.GetHeight() / 2) - (element.GetHeight() / 2); if (!Script.IsNullOrUndefined(offset)) { top += offset.VerticalOffset; } element.CSS(Top, top + "px"); return element; }
public static void AutoFullHeight(this jQueryObject element) { element.CSS("height", "100%"); TriggerLayoutOnShow(element); }
public void SwingAway(SwingDirection direction, bool simulate, jQueryObject element, Action callback) { var js = new JsDictionary <string, object>(); string distance = "3000"; switch (direction) { case SwingDirection.TopLeft: js["left"] = "-" + distance + "px"; js["top"] = "-" + distance + "px"; break; case SwingDirection.Top: js["top"] = "-" + distance + "px"; break; case SwingDirection.TopRight: js["left"] = distance + "px"; js["top"] = "-" + distance + "px"; break; case SwingDirection.Right: js["left"] = distance + "px"; break; case SwingDirection.BottomRight: js["left"] = distance + "px"; js["top"] = distance + "px"; break; case SwingDirection.Bottom: js["top"] = distance + "px"; break; case SwingDirection.BottomLeft: js["left"] = "-" + distance + "px"; js["top"] = distance + "px"; break; case SwingDirection.Left: js["left"] = distance + "px"; break; } if (simulate) { element.CSS(js); element.CSS("display", "none"); if (callback != null) { callback(); } } else { element.Animate(js, EffectDuration.Slow, EffectEasing.Swing, () => { element.CSS("display", "none"); if (callback != null) { callback(); } }); } }
private static void InitializeChild(jQueryObject child) { child.CSS(Css.Position, Css.Absolute); }