public SubSquareControl()
// : base(e)
{
Control.AttachToDocument();
Native.Document.body.style.background = "#6591cd url(assets/SubSquare/editorBg.gif) repeat-x";
Native.Document.body.style.overflow = IStyle.OverflowEnum.hidden;
Control.appendChild(new IHTMLElement(IHTMLElement.HTMLElementEnum.h1,
"This project demostrates interactive division of squares into subsquares."));
Control.appendChild("Hold your mouse over a section. It will take some time to be divided.");
CreateDisposableButton("Show SubSquares",
delegate {
var r = Rectangle.Of(
0,
0,
Native.window.Width,
Native.window.Height
);
Console.WriteLine("bounds: " + r);
new SubSquare(
r, "assets/SubSquare/Follow.jpg"
);
}
);
}
public SubSquare(Rectangle size, string bg)
{
this._bg = bg;
Location = size;
Base.style.SetLocation(size);
Base.style.backgroundImage = "url(" + bg + ")";
Base.style.backgroundPosition = (-size.Left) + "px " + (-size.Top) + "px";
timer.Tick += timer_Tick;
Base.onmouseover += delegate { if (value > step)
{
timer.StartInterval(40);
}
};
Base.onmouseout += delegate { timer.Stop();
//Base.style.backgroundColor = Color.FromGray(value);
};
Base.AttachToDocument();
}
public XRectangle()
{
var aelement = new IHTMLDiv();
// WPF: Rectangle, Image or Label
var acontent = new IHTMLDiv();
acontent.style.backgroundColor = "#ff0000";
this.Rotor = new IHTMLDiv();
//this.Rotor.style.backgroundColor = "#ffd0d0";
this.Rotor.style.border = "1px solid black";
//this.Rotor.style.paddingRight = "10px";
this.Rotor.AttachTo(aelement);
acontent.AttachTo(this.Rotor);
aelement.AttachToDocument();
Element = aelement;
Content = acontent;
}
public UltraApplication(IHTMLElement e)
{
var Title = new IHTMLDiv
{
};
new Browsers
{
}.Container.AttachTo(Title);
new HTML.Images.FromBase64.twitter_small().AttachToDocument();
new HTML.Images.FromBase64._troll__by_GirlFlash().AttachToDocument();
var TitleLogo = new IHTMLImage("assets/ScriptCoreLib/jsc.png");
var TitleText = new IHTMLSpan("UltraApplication");
TitleText.style.fontFamily = ScriptCoreLib.JavaScript.DOM.IStyle.FontFamilyEnum.Verdana;
TitleText.style.paddingLeft = "2em";
TitleText.style.fontSize = "xx-large";
TitleLogo.style.verticalAlign = "middle";
Title.appendChild(TitleLogo);
Title.appendChild(TitleText);
Title.style.height = "128px";
Title.AttachToDocument();
Title.FadeIn(2500, 1000,
delegate
{
1500.AtDelay(ContinueBuildingApplication);
}
);
}
public static IHTMLDiv AttachToDocument(this string e)
{
var r = new IHTMLDiv(e);
r.AttachToDocument();
return(r);
}
public ColorPicker()
{
Control.AttachToDocument();
System.Console.WriteLine("colors...");
IHTMLImage palette = new palette();
Control.style.position = IStyle.PositionEnum.relative;
Control.style.backgroundColor = Color.Gray;
Control.style.SetSize(277, 262);
var layer = new IHTMLDiv();
layer.style.SetLocation(1, 1, 275, 260);
palette.ToBackground(layer);
Control.appendChild(layer);
layer.onmousemove +=
delegate(IEvent ev)
{
System.Console.WriteLine("" + ev.OffsetPosition + ", x " + layer.Bounds);
// jscolor will be merged with color sometime in the future
if (ev.OffsetX > 260)
{
var lum = (byte)System.Math.Round((double)(240 - ev.OffsetY / 260.0 * 240));
System.Console.WriteLine("lum: " + lum);
Native.Document.body.style.backgroundColor = JSColor.FromHLS(0, lum, 0);
}
else
{
var hue = (byte)System.Math.Round((double)(ev.OffsetX / 260.0 * 240));
var lum = (byte)System.Math.Round((double)(240 - ev.OffsetY / 260.0 * 240));
var backgroundColor = JSColor.FromHLS(hue, lum, 240);
Console.WriteLine(new { hue, lum, backgroundColor });
Native.body.style.backgroundColor = backgroundColor;
}
};
}
public OrcasAvalonApplicationDocument(IHTMLElement e)
{
// wpf here
var clip = new IHTMLDiv();
clip.style.position = ScriptCoreLib.JavaScript.DOM.IStyle.PositionEnum.relative;
clip.style.SetSize(TargetCanvas.DefaultWidth, TargetCanvas.DefaultHeight);
clip.style.overflow = ScriptCoreLib.JavaScript.DOM.IStyle.OverflowEnum.hidden;
if (e == null)
clip.AttachToDocument();
else
e.insertPreviousSibling(clip);
AvalonExtensions.AttachToContainer(new TargetCanvas(), clip);
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefaultPage page)
{
var caption_foreground = new IHTMLDiv();
caption_foreground.style.backgroundColor = JSColor.Red;
caption_foreground.style.SetLocation(100, 100, 100, 100);
caption_foreground.AttachToDocument();
var drag = new ScriptCoreLib.JavaScript.Controls.DragHelper(caption_foreground);
drag.Position = new Point(100, 100);
// http://forum.mootools.net/topic.php?id=534
// disable text selection
// look at http://forkjavascript.com/
drag.Enabled = true;
drag.DragStart +=
delegate
{
caption_foreground.style.backgroundColor = JSColor.Yellow;
};
drag.DragMove +=
delegate
{
caption_foreground.style.backgroundColor = JSColor.Green;
caption_foreground.style.SetLocation(drag.Position.X, drag.Position.Y);
};
drag.DragStop +=
delegate
{
caption_foreground.style.backgroundColor = JSColor.Blue;
};
@"Hello world".ToDocumentTitle();
// Send data from JavaScript to the server tier
service.WebMethod2(
@"A string from JavaScript.",
value => value.ToDocumentTitle()
);
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefault page)
{
IHTMLDiv Control = new IHTMLDiv();
Control.AttachToDocument();
Control.appendChild(new IHTMLElement(IHTMLElement.HTMLElementEnum.h1, "This page will ask you to confirm in order to unload the page"));
var check = new IHTMLInput(HTMLInputTypeEnum.checkbox).AttachToDocument();
var label = new IHTMLLabel("Bypass check", check).AttachToDocument();
Native.window.onbeforeunload +=
delegate(IWindow.Confirmation ev)
{
Timer.DoAsync(
delegate
{
Native.document.body.style.backgroundColor = JSColor.Red;
new Timer((t) => Native.document.body.style.backgroundColor = JSColor.White, 500, 0);
}
);
if (check.@checked)
{
return;
}
ev.Text = "This is a secure website, do you want to leave?";
};
var anchor = new IHTMLAnchor("http://example.com", "example.com");
anchor.target = "_self";
Control.appendChild(anchor);
}
public TextEditorDemo()
{
Control.AttachToDocument();
var text = new TextEditor(Control);
text.InnerHTML = "<p>jsc:javascript <b>TextEditor</b></p>";
text.IsFadeEnabled = false;
var cookie = new Cookie("TextData");
var save = new IHTMLButton("save to cookie");
var load = new IHTMLButton("load from cookie");
save.onclick += delegate { cookie.Value = text.InnerHTML; };
load.onclick += delegate { text.InnerHTML = cookie.Value; };
this.Control.appendChild(save, load);
}
public UltraApplication(IHTMLElement e)
{
var Title = new IHTMLDiv
{
innerHTML = @"
<img border='0' src='http://www.w3schools.com/images/compatible_ie.gif' width='31' height='30' alt='Internet Explorer' title='Internet Explorer' />
<img border='0' src='http://www.w3schools.com/images/compatible_firefox.gif' width='31' height='30' alt='Firefox' title='Firefox' />
<img border='0' src='http://www.w3schools.com/images/compatible_opera.gif' width='28' height='30' alt='Opera' title='Opera' />
<img border='0' src='http://www.w3schools.com/images/compatible_chrome.gif' width='31' height='30' alt='Google Chrome' title='Google Chrome' />
<img border='0' src='http://www.w3schools.com/images/compatible_safari.gif' width='28' height='30' alt='Safari' title='Safari' />
"
};
var TitleLogo = new IHTMLImage("assets/ScriptCoreLib/jsc.png");
var TitleText = new IHTMLSpan("UltraApplication");
TitleText.style.fontFamily = ScriptCoreLib.JavaScript.DOM.IStyle.FontFamilyEnum.Verdana;
TitleText.style.paddingLeft = "2em";
TitleText.style.fontSize = "xx-large";
TitleLogo.style.verticalAlign = "middle";
Title.appendChild(TitleLogo);
Title.appendChild(TitleText);
Title.style.height = "128px";
Title.AttachToDocument();
Title.FadeIn(2500, 1000,
delegate
{
1500.AtDelay(ContinueBuildingApplication);
}
);
}
public NumberGuessingGame()
{
Control.AttachToDocument();
Native.Document.body.style.background = "#6591cd";
//Native.Document.body.style.background = "#6591cd url(assets/NumberGuessingGame/editorBg.gif) repeat-x";
Native.Document.body.style.overflow = IStyle.OverflowEnum.hidden;
Control.appendChild(new IHTMLElement(IHTMLElement.HTMLElementEnum.h1,
"This project demostrates how to make a number guessing game."));
Control.appendChild("The computer will think of a number. Try finding out which numbers are in it. You will win if you guess the numbers before all buttons are gone.");
CreateDisposableButton("Show The GuessingGame",
delegate
{
var div = new IHTMLDiv();
div.AttachToDocument();
new GuessingGame(div);
}
);
}
// new three broke it?
// http://www.clicktorelease.com/code/perlin/explosion.html
// http://www.webgl.com/2013/01/webgl-tutorial-vertex-displacement-with-a-noise-function-aka-fiery-explosion/
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefault page = null)
{
// http://inear.se/fireshader/
// http://stackoverflow.com/questions/16765120/ashima-perlin-noise-shader-not-working-with-recent-versions-of-three-js
//var container, renderer, camera, mesh;
var start = IDate.Now;
var fov = 30;
#region container
Native.document.body.style.overflow = IStyle.OverflowEnum.hidden;
var container = new IHTMLDiv();
container.AttachToDocument();
container.style.backgroundColor = "#000000";
container.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
#endregion
var scene = new THREE.Scene();
var bkgScene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(fov, Native.window.aspect, 1, 10000);
camera.position.z = 100;
//camera.target = new THREE.Vector3(0, 0, 0);
scene.add(camera);
var bkgCamera = new THREE.OrthographicCamera(
Native.window.Width / -2,
Native.window.Width / 2,
Native.window.Height / 2,
Native.window.Height / -2,
-10000,
10000
);
bkgScene.add(bkgCamera);
var bkgShader = new THREE.ShaderMaterial(
new
{
uniforms = new
{
tDiffuse = new
{
type = "t",
value = THREE.ImageUtils.loadTexture(
new HTML.Images.FromAssets.bkg().src
)
},
resolution = new { type = "v2", value = new THREE.Vector2(Native.window.Width, Native.window.Height) }
},
vertexShader = new Shaders.ExplosionVertexShader().ToString(),
// fragmentShader: document.getElementById( 'fs_Gradient' ).textContent,
//fragmentShader = new Shaders.GradientFragmentShader().ToString(),
fragmentShader = new Shaders.ExplosionFragmentShader().ToString(),
depthWrite = false,
depthTest = false,
transparent = true
}
);
var quad = new THREE.Mesh(new THREE.PlaneGeometry(Native.window.Width, Native.window.Height), bkgShader);
quad.position.z = -100;
quad.rotation.x = (float)Math.PI / 2;
bkgScene.add(quad);
var material = new THREE.ShaderMaterial(
new
{
uniforms = new // material_uniforms
{
tExplosion = new //uniforms_item
{
type = "t",
value = THREE.ImageUtils.loadTexture(
new HTML.Images.FromAssets.explosion().src
)
},
time = new { type = "f", value = 0.0 },
weight = new { type = "f", value = 8.0 },
},
vertexShader = new Shaders.ExplosionVertexShader().ToString(),
fragmentShader = new Shaders.ExplosionFragmentShader().ToString(),
depthWrite = false,
depthTest = false,
transparent = true
}
);
var mesh = new THREE.Mesh(new THREE.SphereGeometry(20, 200, 200), material);
scene.add(mesh);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(Native.window.Width, Native.window.Height);
renderer.autoClear = false;
container.appendChild(renderer.domElement);
var lon = 0.0;
var phi = 0.0;
var theta = 0.0;
var lat = 15.0;
var isUserInteracting = false;
var scale = 0.0;
#region render
Native.window.onframe += delegate
{
((material_uniforms)material.uniforms).time.value = .00025 * (IDate.Now - start);
scale += .005;
scale %= 2;
lat = Math.Max(-85, Math.Min(85, lat));
phi = (90 - lat) * Math.PI / 180;
theta = lon * Math.PI / 180;
camera.position.x = (float)(100 * Math.Sin(phi) * Math.Cos(theta));
camera.position.y = (float)(100 * Math.Cos(phi));
camera.position.z = (float)(100 * Math.Sin(phi) * Math.Sin(theta));
//mesh.rotation.x += .012;
//mesh.rotation.y += .01;
camera.lookAt(scene.position);
// //renderer.render( bkgScene, bkgCamera );
renderer.render(scene, camera);
// stats.update();
};
#endregion
#region IsDisposed
Dispose = delegate
{
if (IsDisposed)
{
return;
}
IsDisposed = true;
container.Orphanize();
};
#endregion
#region AtResize
Action AtResize = delegate
{
container.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
renderer.setSize(Native.window.Width, Native.window.Height);
camera.projectionMatrix.makePerspective(fov, Native.window.aspect, 1, 1100);
//camera.aspect = Native.Window.Width / Native.Window.Height;
//camera.updateProjectionMatrix();
};
Native.window.onresize +=
delegate
{
AtResize();
};
AtResize();
#endregion
var ze = new ZeProperties();
ze.Show();
ze.treeView1.Nodes.Clear();
ze.Add(() => renderer);
//ze.Add(() => controls);
ze.Add(() => scene);
ze.Left = 0;
}
private static void Spawn()
{
// this ctor creates a new div which has a text and a button element
// on mouseover over the color text is changed
// on pressing the button the next message in text element is displayed
IStyleSheet.Default.AddRule("img.fx1",
r =>
{
r.style.position = IStyle.PositionEnum.absolute;
r.style.top = "0";
r.style.border = "0";
});
Native.css.style.cursorImage = new HTML.Images.FromAssets.cursor01();
//IStyleSheet.Default.AddRule("*", "cursor: url('" + new HTML.Images.FromAssets.cursor01().src + "'), auto;", 0);
var img = new HTML.Images.FromAssets._99851426_7f408a6cc3_o_gray {
className = "fx1"
};
var img_up = new HTML.Images.FromAssets.up {
className = "fx1"
};
var img_up_neg = new HTML.Images.FromAssets.up_neg {
className = "fx1"
};
var img_down = new HTML.Images.FromAssets.down {
className = "fx1"
};
img.AttachToDocument();
img_up.AttachToDocument();
img_up_neg.AttachToDocument();
var info_size = new XSize
{
width = 350,
height = 200
};
var info_bg = new IHTMLDiv();
info_bg.style.SetLocation(60, 60, info_size.width, info_size.height);
info_bg.style.Opacity = 0.2;
info_bg.style.zIndex = 1;
info_bg.AttachToDocument();
var info_borders = new IHTMLDiv();
info_borders.style.SetLocation(60 - 4, 60 - 4, info_size.width + 8, info_size.height + 8);
info_borders.style.Opacity = 0.2;
info_borders.style.zIndex = 4;
info_borders.AttachToDocument();
var info_drag_tween = new TweenDataDouble();
var info_bg_useimage_cookie = new Cookie("setting1");
var info_bg_useimage = new DynamicProperty <bool>(
p =>
{
info_bg_useimage_cookie.BooleanValue = p.Value;
if (p.Value)
{
new HTML.Images.FromAssets.up_neg().ToBackground(info_borders.style);
new HTML.Images.FromAssets.up_neg().ToBackground(info_bg.style);
}
else
{
info_borders.style.backgroundImage = "";
info_bg.style.backgroundImage = "";
}
info_drag_tween.Value = 0.5;
}
)
{
Value = info_bg_useimage_cookie.BooleanValue
};
var info_drag = new DragHelper(info_borders);
info_drag_tween.Value = 0;
info_drag_tween.ValueChanged +=
delegate
{
var i = ScriptCoreLib.JavaScript.Runtime.Convert.ToInteger(255 * info_drag_tween.Value);
if (!info_bg_useimage.Value)
{
info_bg.style.backgroundColor = Color.FromRGB(i, i, 0);
info_borders.style.backgroundColor = Color.FromRGB(i, i, 0);
}
else
{
if (i < 1)
{
i = 1;
}
info_bg.style.Opacity = i / 255;
info_borders.style.Opacity = i / 255 * 0.5;
}
};
info_borders.style.cursor = IStyle.CursorEnum.move;
info_borders.onmouseover +=
delegate
{
if (info_drag.IsDrag)
{
return;
}
info_drag_tween.Value = 1;
};
info_borders.onmouseout +=
delegate
{
if (info_drag.IsDrag)
{
return;
}
info_drag_tween.Value = 0;
};
var info = new IHTMLDiv();
info.onmouseover +=
delegate
{
if (info_drag.IsDrag)
{
return;
}
info_drag_tween.Value = 0.5;
};
info.onmouseout +=
delegate
{
if (info_drag.IsDrag)
{
return;
}
info_drag_tween.Value = 0;
};
info.style.color = Color.White;
info.style.fontFamily = IStyle.FontFamilyEnum.Tahoma;
Func <string, IHTMLElement> par = texty => new IHTMLElement(IHTMLElement.HTMLElementEnum.p, texty);
Native.Document.title = "HotPolygon";
info.innerHTML = @"<h1>HotPolygon</h1>";
//var preview = new IHTMLImage("assets/HotPolygon/Preview.png");
//preview.style.Float = IStyle.FloatEnum.right;
//preview.style.margin = "1em";
info.appendChild(
//preview,
par("This example demonstrates the use of custom cursors, map, area, timed animation, cookies and a custom dialog."),
par("You can change the background of this page by hovering above the tree or one of the clouds."),
par("And yes you can drag this dialog at the borders :)"),
new IHTMLDiv(
@"
<ul>
<li>visit <a href='http://jsc.sf.net/'>jsc homepage</a></li>
<li>visit <a href='http://zproxy.wordpress.com/'>blog</a></li>
</ul>
")
);
var info_option = new IHTMLInput(HTMLInputTypeEnum.checkbox);
var info_option_label = new IHTMLLabel("Alternative background", info_option);
info.appendChild(new IHTMLElement(IHTMLElement.HTMLElementEnum.p, info_option, info_option_label));
info_option.onclick += i => info_bg_useimage.Value = info_option.@checked;
info_option.@checked = info_bg_useimage.Value;
info.style.overflow = IStyle.OverflowEnum.auto;
info.style.SetLocation(70, 70, info_size.width - 20, info_size.height - 20);
info.style.zIndex = 5;
info.AttachToDocument();
info_drag.DragMove +=
delegate
{
if (info_bg_useimage.Value)
{
info_borders.style.backgroundPosition = (-(info_drag.Position.X - 4)) + "px " + (-(info_drag.Position.Y - 4)) + "px";
info_bg.style.backgroundPosition = (-info_drag.Position.X) + "px " + (-info_drag.Position.Y) + "px";
}
info_borders.style.SetLocation(info_drag.Position.X - 4, info_drag.Position.Y - 4);
info_bg.style.SetLocation(info_drag.Position.X, info_drag.Position.Y);
info.style.SetLocation(info_drag.Position.X + 10, info_drag.Position.Y + 10);
};
info_drag.Position = new Point(60, 60);
info_drag.Enabled = true;
// 416 x 100
var img_here_src_off =
new IHTMLImage[]
{
new HTML.Images.FromAssets.here0(),
new HTML.Images.FromAssets.here1(),
new HTML.Images.FromAssets.here2(),
new HTML.Images.FromAssets.here3(),
new HTML.Images.FromAssets.here4(),
new HTML.Images.FromAssets.here5(),
};
var img_here_src_on =
new IHTMLImage[]
{
new HTML.Images.FromAssets.here0(),
new HTML.Images.FromAssets.here1(),
new HTML.Images.FromAssets.here2(),
new HTML.Images.FromAssets.here3(),
new HTML.Images.FromAssets.here4(),
new HTML.Images.FromAssets.here5(),
}.Reverse().ToArray();
var img_here = new IHTMLDiv();
img_here.style.SetSize(416, 100);
Action <Action, int> Wait =
(done, time) =>
{
new Timer(t => done(), time, 0);
};
ActionParams <Action, Action> DelayFrames =
(done, h) =>
{
int i = 0;
var next = default(Action);
next = () =>
{
if (i < h.Length)
{
var v = h[i];
i++;
Wait(() => { if (v != null)
{
v();
}
next(); }, 1000 / 24);
}
else
{
Wait(done, 1000 / 24);
}
};
next();
};
var AnimationOn = default(Action);
var AnimationOff = default(Action);
var AnimationRandomOn = default(Action);
AnimationOff =
() =>
{
DelayFrames(
() =>
{
img_here.style.display = IStyle.DisplayEnum.none;
Wait(() =>
{
AnimationRandomOn();
}, 5000);
}
,
img_here_src_off.Select <IHTMLImage, Action>(i => () => i.ToBackground(img_here.style)).ToArray()
);
};
AnimationOn =
() =>
{
img_here.style.display = IStyle.DisplayEnum.block;
DelayFrames(
() => Wait(AnimationOff, 3000),
img_here_src_on.Select <IHTMLImage, Action>(i => () => i.ToBackground(img_here.style)).ToArray()
);
};
AnimationRandomOn =
() =>
{
try
{
if (new System.Random().NextDouble() > 0.5)
{
img_here.SetCenteredLocation(589, 509);
}
else
{
img_here.SetCenteredLocation(686, 141);
}
Wait(AnimationOn, new System.Random().Next() % 15000);
}
catch
{
}
};
img_here.style.SetLocation(100, 100);
img_here.style.zIndex = 1;
AnimationRandomOn();
img_here.AttachToDocument();
img_down.AttachToDocument();
img_up.style.Opacity = 0;
img_up_neg.style.Opacity = 0;
var tw_up = new TweenDataDouble();
tw_up.Value = 0;
tw_up.ValueChanged += delegate { img_up.style.Opacity = tw_up.Value; };
var tw_up_neg = new TweenDataDouble();
tw_up_neg.Value = 0;
tw_up_neg.ValueChanged += delegate { img_up_neg.style.Opacity = tw_up_neg.Value; };
var map = new IHTMLElement(IHTMLElement.HTMLElementEnum.map);
map.id = "map1";
map.name = "map1";
var area1 = new IHTMLArea
{
shape = ShapeEnum.polygon,
coords = "477, 178, 515, 144, 557, 160, 576, 194, 614, 181, 629, 206, 648, 209, 659, 163, 719, 154, 730, 103, 845, 118, 891, 168, 949, 213, 917, 246, 931, 266, 859, 300, 787, 302, 756, 274, 721, 294, 658, 282, 615, 257, 537, 239, 492, 230, 470, 195"
};
area1.onmouseover += i =>
{
System.Console.WriteLine("over");
tw_up_neg.Value = 1; /*tw_down.Value = 0.2;*/
};
area1.onmouseout += i =>
{
try
{
System.Console.WriteLine("out");
tw_up_neg.Value = 0; /* tw_down.Value = 1;*/
}
catch
{
}
};
var area2 = new IHTMLArea
{
shape = ShapeEnum.polygon,
coords = "677, 556, 718, 551, 747, 570, 758, 594, 756, 613, 729, 625, 688, 629, 663, 604, 657, 585"
};
area2.onmouseover += i =>
{
System.Console.WriteLine("over");
tw_up.Value = 1; /*tw_down.Value = 0.2;*/
};
area2.onmouseout += i =>
{
try
{
System.Console.WriteLine("out");
tw_up.Value = 0; /* tw_down.Value = 1;*/
}
catch
{
}
};
img_down.onclick += i => System.Console.WriteLine(i.CursorPosition);
//area1.href = "http://google.com";
//area1.target = "_blank";
map.appendChild(area1);
map.appendChild(area2);
map.AttachToDocument();
img_down.style.zIndex = 2;
img_down.setAttribute("useMap", "#map1");
//img_overlay.style.backgroundColor = Color.Red;
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefaultPage page)
{
@"Hello world".ToDocumentTitle();
// Send data from JavaScript to the server tier
service.WebMethod2(
@"A string from JavaScript.",
value => value.ToDocumentTitle()
);
var x = new IHTMLDiv();
var size = new
{
w = Native.Window.Width,
h = Native.Window.Height
};
x.style.SetLocation(0, 0, size.w, size.h);
x.style.backgroundColor = Color.Blue;
x.style.color = Color.Yellow;
x.style.overflow = ScriptCoreLib.JavaScript.DOM.IStyle.OverflowEnum.hidden;
x.AttachToDocument();
Action <string> Append =
e =>
{
x.appendChild(new IHTMLDiv(e));
if (x.childNodes.Length > 20)
{
x.removeChild(x.firstChild);
}
};
Append("size: " + size);
Native.Document.onkeydown +=
ev => Append("keydown: " + ev.KeyCode);
Native.Document.onkeyup +=
ev => Append("keyup: " + ev.KeyCode);
Native.Document.onkeypress +=
ev => Append("keypress: " + ev.KeyCode);
Native.Document.onclick +=
ev => Append("click: " + ev.OffsetPosition);
Native.Document.body.ontouchstart +=
ev =>
{
ev.PreventDefault();
Append("ontouchstart: " + ev.touches.length);
};
Native.Document.body.ontouchmove +=
ev =>
{
ev.PreventDefault();
Append("ontouchmove: " + ev.touches.length + new {
ev.touches[0].clientX, ev.touches[0].clientY
});
};
Native.Document.body.ontouchend +=
ev =>
{
ev.PreventDefault();
Append("ontouchend: " +
new {
touches = ev.touches.length,
changedTouches = ev.changedTouches.length,
targetTouches = ev.targetTouches.length
}
);
};
}
public HyperDesign()
{
Native.Document.body.style.overflow = IStyle.OverflowEnum.auto;
var g1 = new ThreeDGroup1();
//WriteAnimations();
g1.Images.ToGoogleThreeDWarehouseImages().Animate();
g1.Frame1.onload +=
e =>
{
g1.Go1.style.color = Color.Blue;
};
g1.Go1.onclick +=
delegate
{
g1.Go1.style.color = Color.Red;
g1.Frame1.src = "http://google.com";
};
g1.Container.AttachToDocument();
var n = new Application();
n.Container.AttachToDocument();
n.Read.onclick +=
delegate
{
n.FirstName.value = "John";
n.LastName.value = "Doe";
};
var Items = new IHTMLDiv();
Items.style.height = "300px";
Items.style.overflow = IStyle.OverflowEnum.auto;
Items.style.backgroundColor = Color.System.ButtonFace;
Items.style.borderWidth = "2px";
Items.style.borderStyle = "solid";
Items.style.borderColor = Color.System.ButtonShadow;
Items.AttachToDocument();
var List = new List <Employee>();
n.Add.onclick +=
delegate
{
var i = new Summary();
var j = new Employee
{
Number = List.Count + 1,
FirstName = n.FirstName.value,
LastName = n.LastName.value
};
List.Add(j);
Action Update =
delegate
{
i.Number.value = "#" + j.Number;
i.FirstName.value = j.FirstName;
i.LastName.value = j.LastName;
};
Update();
i.Delete.onclick +=
delegate
{
i.Container.Dispose();
};
i.Container.AttachTo(Items);
i.Edit.onclick +=
delegate
{
i.Edit.disabled = true;
var details = new Details();
details.FirstName.value = i.FirstName.value;
details.LastName.value = i.LastName.value;
details.Bio.value = j.Bio;
details.Container.AttachTo(i.Details);
details.Discard.onclick +=
delegate
{
details.Container.Dispose();
i.Edit.disabled = false;
};
details.Save.onclick +=
delegate
{
details.Container.Dispose();
i.Edit.disabled = false;
j.Bio = details.Bio.value;
j.FirstName = details.FirstName.value;
j.LastName = details.LastName.value;
Update();
};
};
};
}
void Spawn(DudeAnimationInfo LoadedCharacter, Scene.Document LoadedScene)
{
var ViewSize = new Size {
Width = 640, Height = 480
};
var Container = new IHTMLDiv();
Container.AttachToDocument();
Container.style.SetSize(ViewSize.Width, ViewSize.Height + 22);
Container.KeepInCenter();
//Container.MakeCSSShaderCrumple();
var Wallpaper = new IHTMLDiv().AttachTo(Container);
Wallpaper.style.SetSize(ViewSize.Width, ViewSize.Height + 22);
new power().ToBackground(Wallpaper.style);
Wallpaper.style.position = IStyle.PositionEnum.absolute;
Wallpaper.style.backgroundRepeat = "no-repeat";
Wallpaper.style.backgroundPosition = "center center";
var Margin = 48;
var MarginSafe = 72;
var CurrentFrame = LoadedScene.Frames.Randomize().First();
//var CurrentFrame = LoadedScene.Frames.Single(f => f.Name == "C");
var Room = new IHTMLDiv();
Room.style.border = "1px solid #00ff00";
Room.style.SetSize(ViewSize.Width, ViewSize.Height);
Room.style.position = IStyle.PositionEnum.absolute;
Room.style.overflow = IStyle.OverflowEnum.hidden;
Room.AttachTo(Container);
Room.style.SetLocation(0, 22);
//Room.AttachToDocument();
//Room.KeepInCenter();
var tween = Room.ToOpacityTween();
Action HideRoom = () => tween.Value = 1;
Action ShowRoom = () => tween.Value = 0;
HideRoom();
//var GroundOverlay2 = new IHTMLDiv();
//GroundOverlay2.style.backgroundColor = Color.Blue;
////GroundOverlay.style.Opacity = 0;
//GroundOverlay2.style.position = IStyle.PositionEnum.absolute;
//GroundOverlay2.style.SetLocation(0, 0, ViewSize.Width, ViewSize.Height);
//GroundOverlay2.AttachTo(Room);
var LostInTime_Images = new ImpAdventures.HTML.Pages.LostInTimeImages().Images;
var BackgroundImage = new IHTMLImage();
LostInTime_Images.FirstOrDefault(
k => k.src.SkipUntilLastIfAny("/") == CurrentFrame.Image.Source.SkipUntilLastIfAny("/")
).With(
ImageSource =>
{
Console.WriteLine(ImageSource.src);
BackgroundImage.src = ImageSource.src;
}
);
BackgroundImage.style.SetLocation(0, 0, ViewSize.Width, ViewSize.Height);
BackgroundImage.alt = "BackgroundImage";
BackgroundImage.AttachTo(Room);
//GroundOverlay2.style.backgroundImage = "url(" + CurrentFrame.Image.Source + ")";
//BackgroundImage.InvokeOnComplete(
// delegate
// {
// //BackgroundImage.style.backgroundColor = Color.Red;
// //BackgroundImage.style.SetLocation(0,0, ViewSize.Width, ViewSize.Height);
// BackgroundImage.AttachTo(GroundOverlay2);
// }
//);
var GroundOverlay = new IHTMLDiv();
GroundOverlay.style.backgroundColor = Color.Blue;
GroundOverlay.style.Opacity = 0;
GroundOverlay.style.SetLocation(0, 0, ViewSize.Width, ViewSize.Height);
GroundOverlay.AttachTo(Room);
var Ground = new IHTMLDiv();
Ground.style.SetLocation(0, 0, ViewSize.Width, ViewSize.Height);
Ground.AttachTo(Room);
var AnimateRoomChange = default(Action <Action>);
#region TryToChangeRooms
Func <TryToChangeRoomsArgs, bool> TryToChangeRooms =
e =>
{
if (e == null)
{
return(false);
}
if (e.NextRoomSelector == null)
{
throw new ArgumentNullException("NextRoomSelector");
}
var next = LoadedScene.Frames.SingleOrDefault(e.NextRoomSelector);
var r = next != null;
if (r)
{
AnimateRoomChange(
delegate
{
CurrentFrame = next;
Console.WriteLine("AnimateRoomChange");
LostInTime_Images.FirstOrDefault(
k => k.src.SkipUntilLastIfAny("/") == CurrentFrame.Image.Source.SkipUntilLastIfAny("/")
).With(
ImageSource =>
{
Console.WriteLine(ImageSource.src);
BackgroundImage.src = ImageSource.src;
}
);
//GroundOverlay2.style.backgroundImage = "url(" + CurrentFrame.Image.Source + ")";
//BackgroundImage.src = CurrentFrame.Image.Source;
e.ReadyToTeleport();
}
);
}
return(r);
};
#endregion
var dude = CreateDude(LoadedCharacter);
dude.Control.AttachTo(Ground);
#region Doors
var Doors = new[]
{
new TryToChangeRoomsArgs
{
Condition = () => dude.CurrentLocation.X > ViewSize.Width - Margin,
NextRoomSelector = f => f.Name == CurrentFrame.Right,
ReadyToTeleport = delegate
{
dude.TeleportTo(-MarginSafe, dude.CurrentLocation.Y);
dude.LookAt(new Point(MarginSafe, (int)dude.CurrentLocation.Y));
}
},
new TryToChangeRoomsArgs
{
Condition = () => dude.CurrentLocation.X < Margin,
NextRoomSelector = f => f.Name == CurrentFrame.Left,
ReadyToTeleport = delegate
{
dude.TeleportTo(ViewSize.Width + MarginSafe, dude.CurrentLocation.Y);
dude.LookAt(new Point(ViewSize.Width - MarginSafe, (int)dude.CurrentLocation.Y));
}
},
new TryToChangeRoomsArgs
{
Condition = () => dude.CurrentLocation.Y < Margin,
NextRoomSelector = f => f.Name == CurrentFrame.Top,
ReadyToTeleport = delegate
{
dude.TeleportTo(dude.CurrentLocation.X, ViewSize.Height + MarginSafe);
dude.LookAt(new Point((int)dude.CurrentLocation.X, ViewSize.Height - MarginSafe));
}
},
new TryToChangeRoomsArgs
{
Condition = () => dude.CurrentLocation.Y > ViewSize.Height - Margin,
NextRoomSelector = f => f.Name == CurrentFrame.Bottom,
ReadyToTeleport = delegate
{
dude.TeleportTo(dude.CurrentLocation.X, -Margin);
dude.LookAt(new Point((int)dude.CurrentLocation.X, MarginSafe));
}
}
};
#endregion
Console.WriteLine(new { Doors = Doors.Length });
Doors.WithEachIndex(
(x, index) =>
{
Console.WriteLine(new { index, x });
Console.WriteLine(new { index, x.Condition });
}
);
var ChangeRoom = new ChangeRoom {
autobuffer = true
};
var Talk = new Talk {
autobuffer = true
};
var Argh_RChannel = new Argh_RChannel {
autobuffer = true
};
var Argh_LChannel = new Argh_LChannel {
autobuffer = true
};
var Argh_Disabled = false;
var Argh_VolumeMultiplier = 1.0;
#region Argh_Stereo
Action <double, double> Argh_Stereo =
(volume, balance) =>
{
if (Argh_Disabled)
{
return;
}
Argh_RChannel.AttachToDocument();
Argh_LChannel.AttachToDocument();
Argh_RChannel.volume = Argh_VolumeMultiplier * volume * balance;
Argh_LChannel.volume = Argh_VolumeMultiplier * volume * (1 - balance);
Argh_RChannel.play();
Argh_LChannel.play();
Argh_RChannel = new Argh_RChannel {
autobuffer = true
};
Argh_LChannel = new Argh_LChannel {
autobuffer = true
};
Argh_Disabled = true;
Argh_VolumeMultiplier /= 2;
new Timer(t => Argh_Disabled = false).StartTimeout(800);
new Timer(t => Argh_VolumeMultiplier = 1).StartTimeout(5000);
};
#endregion
#region PrintText
Action <string, Action> PrintText =
(text, done) =>
{
Talk.AttachToDocument();
Talk.load();
Talk.volume = Math.Min(1, dude.Zoom.DynamicZoom / 4);
Talk.play();
Talk = new Talk {
autobuffer = true
};
text.Length.Range().AsyncForEach(
i =>
{
Wallpaper.innerText = text.Left(i + 1);
var c = text[i];
if (LoadedScene.SlowText.Contains("" + c))
{
return(100.Random());
}
return(50.Random());
}, done
);
};
#endregion
Action <string, Action> PrintRandomText =
(text, done) => PrintText(text.Split(LoadedScene.TextDelimiter).Randomize().First(), done);
dude.DoneWalking +=
delegate
{
// compiler bug: cannot invoke Action<func, action> delegate ?
System.Console.WriteLine("done walking in " + CurrentFrame.Name + " at " + dude.CurrentLocation);
var xFirstOrDefault = Doors.FirstOrDefault(d => d.Condition());
System.Console.WriteLine("done walking in " + new { xFirstOrDefault });
// Doors null?
if (TryToChangeRooms(xFirstOrDefault))
{
return;
}
if (CurrentFrame.Items != null)
{
var item = CurrentFrame.Items.Where(
i => new Point(i.X.ToInt32(), i.Y.ToInt32()).GetRange(dude.CurrentLocation) < i.R.ToInt32()
).FirstOrDefault();
if (item != null)
{
dude.IsSelected = false;
dude.LookDown();
PrintRandomText(item.Text,
delegate
{
dude.WalkingOnce +=
delegate
{
Wallpaper.innerText = "";
};
dude.IsSelected = true;
}
);
}
}
};
#region AnimateRoomChange
AnimateRoomChange =
ReadyToTeleport =>
{
var Step1 = default(System.Action);
var Step2 = default(System.Action);
var Step3 = default(Action);
Step1 =
delegate
{
tween.Done -= Step1;
ReadyToTeleport();
tween.Done += Step2;
ShowRoom();
};
Step2 =
delegate
{
tween.Done -= Step2;
dude.DoneWalking += Step3;
dude.IsWalking = true;
};
Step3 =
delegate
{
dude.DoneWalking -= Step3;
dude.IsSelected = true;
};
dude.IsSelected = false;
tween.Done += Step1;
// go left
HideRoom();
// http://stackoverflow.com/questions/3009888/autoplay-audio-files-on-an-ipad-with-html5
ChangeRoom.AttachToDocument();
ChangeRoom.load();
ChangeRoom.volume = 0.2;
ChangeRoom.play();
ChangeRoom = new ChangeRoom();
};
#endregion
var pointer_x = 0;
var pointer_y = 0;
#region onmousemove
Container.onmousemove +=
ev =>
{
if (Native.Document.pointerLockElement == Container)
{
if (dude.IsSelected)
{
var volume = Math.Min(1, dude.Zoom.DynamicZoom / 4);
var balance = dude.CurrentLocation.X / ViewSize.Width;
pointer_x += ev.movementX;
pointer_y += ev.movementY;
pointer_x = Math.Min(ViewSize.Width - 0, Math.Max(0, pointer_x));
pointer_y = Math.Min(ViewSize.Height - 0, Math.Max(0, pointer_y));
var OffsetPosition = new Point(pointer_x, pointer_y
);
Console.WriteLine(OffsetPosition);
Argh_Stereo(volume, balance);
dude.WalkTo(OffsetPosition);
}
}
};
#endregion
#region ontouchstart
Container.ontouchstart +=
ev =>
{
ev.PreventDefault();
System.Console.WriteLine(ev.CursorPosition);
if (dude.IsSelected)
{
var volume = Math.Min(1, dude.Zoom.DynamicZoom / 4);
var balance = dude.CurrentLocation.X / ViewSize.Width;
var ev_OffsetPosition = new Point(
ev.touches[0].clientX - Container.Bounds.Left,
ev.touches[0].clientY - Container.Bounds.Top
);
Argh_Stereo(volume, balance);
dude.WalkTo(ev_OffsetPosition);
}
};
#endregion
#region onclick
Container.onclick +=
ev =>
{
ev.PreventDefault();
if (ev.MouseButton == IEvent.MouseButtonEnum.Middle)
{
if (Native.Document.pointerLockElement == Container)
{
Native.Document.exitPointerLock();
return;
}
pointer_x = (int)dude.CurrentLocation.X;
pointer_y = (int)dude.CurrentLocation.Y;
//Container.requestFullscreen();
Container.requestPointerLock();
return;
}
if (ev.Element != Ground)
{
return;
}
System.Console.WriteLine(ev.CursorPosition);
if (dude.IsSelected)
{
var volume = Math.Min(1, dude.Zoom.DynamicZoom / 4);
var balance = dude.CurrentLocation.X / ViewSize.Width;
Argh_Stereo(volume, balance);
dude.WalkTo(ev.OffsetPosition);
}
};
#endregion
//GroundOverlay.onclick +=
// ev =>
// {
// if (ev.Element != GroundOverlay)
// return;
// System.Console.WriteLine(ev.CursorPosition);
// if (dude.IsSelected)
// {
// new Argh().play();
// dude.WalkTo(ev.OffsetPosition);
// }
// };
dude.TeleportTo(ViewSize.Width / 2, (ViewSize.Height - MarginSafe) / 2);
dude.LookDown();
ShowRoom();
dude.DoneWalkingOnce +=
delegate
{
PrintRandomText(
LoadedScene.IntroText,
delegate
{
dude.WalkingOnce +=
delegate
{
Wallpaper.innerText = "";
};
dude.IsSelected = true;
}
);
};
dude.WalkToArc(MarginSafe, dude.Direction);
}
/* Source: http://www.webspaceinvader.com/2011/09/21/first-try-at-webgl/
*/
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefault page = null)
{
var SCREEN_WIDTH = Native.window.Width;
var SCREEN_HEIGHT = Native.window.Height;
//var ,stats;
//var mesh, zmesh, geometry;
var mouseX = 0;
var mouseY = 0;
var windowHalfX = SCREEN_WIDTH / 2;
var windowHalfY = SCREEN_HEIGHT / 2;
var lastUpdate = new IDate().getTime();
Native.document.body.style.overflow = IStyle.OverflowEnum.hidden;
var container = new IHTMLDiv();
container.AttachToDocument();
container.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
var camera = new THREE.PerspectiveCamera(75, Native.window.aspect, 1, 100000);
camera.position.z = 50;
camera.updateMatrix();
var scene = new THREE.Scene();
// LIGHTS
var ambient = new THREE.AmbientLight(0x222222);
ambient.position.z = -300;
scene.add(ambient);
var directionalLight = new THREE.DirectionalLight(0xffeedd);
directionalLight.position.set(-1, 0, 1);
directionalLight.position.normalize();
scene.add(directionalLight);
var dLight = new THREE.DirectionalLight(0xffeedd);
dLight.position.set(1, 0, 1);
dLight.position.normalize();
scene.add(dLight);
// init the WebGL renderer and append it to the Dom
var renderer = new THREE.WebGLRenderer();
renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
renderer.autoClear = false;
renderer.domElement.AttachTo(container);
#region createScene
Action <object, f, f, f, f> createScene = (geometry, x, y, z, b) =>
{
//var zmesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial());
var zmesh = new THREE.Mesh(geometry);
zmesh.position.x = x;
zmesh.position.z = y;
zmesh.position.y = z;
zmesh.scale.x = 5f;
zmesh.scale.y = 5f;
zmesh.scale.z = 5f;
//zmesh.overdraw = true;
zmesh.updateMatrix();
scene.add(zmesh);
};
#endregion
// message: "Unexpected token /"
var loader = new THREE.JSONLoader();
Action <object> callbackMale = (geometry) => { createScene(geometry, 90, 50, 0, 105); };
loader.load(
url: new invade().Content.src,
callback: IFunction.OfDelegate(callbackMale)
);
// postprocessing
var composer = new THREE.EffectComposer(renderer);
var renderModel = new THREE.RenderPass(scene, camera);
composer.addPass(renderModel);
var effectFilm = new THREE.FilmPass(0.35, 0.50, 2048, false); //( 0.35, 0.75, 2048, false );
effectFilm.renderToScreen = true;
composer.addPass(effectFilm);
#region IsDisposed
var IsDisposed = false;
Dispose = delegate
{
if (IsDisposed)
{
return;
}
IsDisposed = true;
renderer.domElement.Orphanize();
};
#endregion
#region getFrametime
Func <long> getFrametime = () =>
{
var now = new IDate().getTime();
var tdiff = (now - lastUpdate) / 1000;
lastUpdate = now;
return(tdiff);
};
#endregion
#region render
Action render = delegate
{
var delta = getFrametime();
camera.position.x += (mouseX - camera.position.x) * .05f;
camera.position.y += (-mouseY - camera.position.y) * .05f;
camera.updateMatrix();
//renderer.render( scene, camera );
renderer.clear();
composer.render(delta);
};
#endregion
#region onmousemove
Native.document.onmousemove +=
e =>
{
mouseX = (e.CursorX - windowHalfX);
mouseY = (e.CursorY - windowHalfY);
};
#endregion
Native.window.onframe +=
delegate
{
if (IsDisposed)
{
return;
}
render();
};
#region AtResize
Action AtResize = delegate
{
container.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
camera.aspect = Native.window.aspect;
camera.updateProjectionMatrix();
renderer.setSize(Native.window.Width, Native.window.Height);
};
Native.window.onresize +=
delegate
{
AtResize();
};
AtResize();
#endregion
#region requestFullscreen
Native.document.body.ondblclick +=
delegate
{
if (IsDisposed)
{
return;
}
// http://tutorialzine.com/2012/02/enhance-your-website-fullscreen-api/
Native.document.body.requestFullscreen();
};
#endregion
}
public void InitializeContent(IApplication n)
{
//var n = new HyperDesignExample.HTML.Pages.Application();
//n.Container.AttachToDocument();
n.Read.onclick +=
delegate
{
n.FirstName.value = "John";
n.LastName.value = "Doe";
};
// more code...
// lets make some changes to the template code...
// nice huh? :D
var Items = new IHTMLDiv();
Items.style.height = "300px";
Items.style.overflow = IStyle.OverflowEnum.auto;
Items.style.backgroundColor = Color.System.ButtonFace;
Items.style.borderWidth = "2px";
Items.style.borderStyle = "solid";
Items.style.borderColor = Color.System.ButtonShadow;
Items.AttachToDocument();
var List = new List <Employee>();
n.Add.onclick +=
delegate
{
var i = new HyperDesignExample.HTML.Pages.Summary();
var j = new Employee
{
Number = List.Count + 1,
FirstName = n.FirstName.value,
LastName = n.LastName.value
};
List.Add(j);
Action Update =
delegate
{
i.Number.value = "#" + j.Number;
i.FirstName.value = j.FirstName;
i.LastName.value = j.LastName;
};
Update();
i.Delete.onclick +=
delegate
{
i.Container.Orphanize();
};
i.Container.AttachTo(Items);
i.Edit.onclick +=
delegate
{
i.Edit.disabled = true;
var details = new HyperDesignExample.HTML.Pages.Details();
details.FirstName.value = i.FirstName.value;
details.LastName.value = i.LastName.value;
details.Bio.value = j.Bio;
details.Location.value = j.Location;
details.Container.AttachTo(i.Details);
details.Discard.onclick +=
delegate
{
details.Container.Orphanize();
i.Edit.disabled = false;
};
details.Save.onclick +=
delegate
{
details.Container.Orphanize();
i.Edit.disabled = false;
j.Bio = details.Bio.value;
j.FirstName = details.FirstName.value;
j.LastName = details.LastName.value;
j.Location = details.Location.value;
Update();
};
};
};
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefaultPage page)
{
var SpiderModelContent = new SpiderModel.ApplicationContent();
page.program_13_turn_left.onclick += delegate { SpiderModelContent.po = 13; };
page.program_14_turn_right.onclick += delegate { SpiderModelContent.po = 14; };
page.program_15_go_backwards.onclick += delegate { SpiderModelContent.po = 15; };
page.program_16_go_forwards.onclick += delegate { SpiderModelContent.po = 16; };
page.program_53_mayday.onclick += delegate { SpiderModelContent.po = 53; };
page.program_43_high_five_calibration_stand.onclick += delegate { SpiderModelContent.po = 43; };
page.stop.onclick += delegate { SpiderModelContent.po = 0;; };
new Timer(
tttt =>
{
var pp = SpiderModelContent.pp;
if (tttt.Counter % 2 == 0)
{
pp = 0;
}
if (pp == 13)
{
page.program_13_turn_left.style.color = JSColor.Blue;
}
else
{
page.program_13_turn_left.style.color = JSColor.None;
}
if (pp == 14)
{
page.program_14_turn_right.style.color = JSColor.Blue;
}
else
{
page.program_14_turn_right.style.color = JSColor.None;
}
if (pp == 15)
{
page.program_15_go_backwards.style.color = JSColor.Blue;
}
else
{
page.program_15_go_backwards.style.color = JSColor.None;
}
if (pp == 16)
{
page.program_16_go_forwards.style.color = JSColor.Blue;
}
else
{
page.program_16_go_forwards.style.color = JSColor.None;
}
},
300,
150
);
#region program_60
page.program_60.onclick += delegate
{
#region po
Action <int> po =
v =>
{
page.program_60.innerText = "program_60: " + v;
SpiderModelContent.po = v;
};
#endregion
#region po_to_po
Action <int, int> po_to_po =
(from, to) =>
{
if (SpiderModelContent.po != from)
{
return;
}
po(to);
};
#endregion
#region po_to_po_at
Action <int, int, int> po_to_po_at =
(from, to, xdelay) =>
{
new Timer(delegate { po_to_po(from, to); }, xdelay * 1000, 0);
};
#endregion
// turn left until 3
po(13);
// wait 3 sec and go backwards until 6
po_to_po_at(13, 15, 3);
// wait 6 sec and turn right
po_to_po_at(15, 14, 3 + 6);
// wait 6 sec and go forwards until 6
po_to_po_at(14, 16, 3 + 6 + 6);
// wait 3 sec and stop
po_to_po_at(16, 0, 3 + 6 + 6 + 6);
};
#endregion
#region program_61
page.program_61.onclick += delegate
{
#region po
Action <int> po =
v =>
{
page.program_61.innerText = "program_61: " + v;
SpiderModelContent.po = v;
};
#endregion
#region po_to_po
Action <int, int> po_to_po =
(from, to) =>
{
if (SpiderModelContent.po != from)
{
return;
}
po(to);
};
#endregion
#region po_to_po_at
Action <int, int, int> po_to_po_at =
(from, to, xdelay) =>
{
new Timer(delegate { po_to_po(from, to); }, xdelay * 1000, 0);
};
#endregion
// turn left until 3
po(14);
// wait 3 sec and go backwards until 6
po_to_po_at(14, 15, 3);
// wait 6 sec and turn right
po_to_po_at(15, 13, 3 + 6);
// wait 6 sec and go forwards until 6
po_to_po_at(13, 16, 3 + 6 + 6);
// wait 3 sec and stop
po_to_po_at(16, 0, 3 + 6 + 6 + 6);
};
#endregion
@"Hello world".ToDocumentTitle();
#region sidebars
var LeftLR = new IHTMLDiv();
LeftLR.style.position = IStyle.PositionEnum.absolute;
LeftLR.style.left = "0";
LeftLR.style.top = "0";
LeftLR.style.bottom = "0";
LeftLR.style.width = "4em";
LeftLR.style.Opacity = 0.5;
LeftLR.AttachToDocument();
var LeftIR = new IHTMLDiv();
LeftIR.style.position = IStyle.PositionEnum.absolute;
LeftIR.style.left = "0";
LeftIR.style.top = "0";
LeftIR.style.height = "1em";
LeftIR.style.width = "4em";
LeftIR.style.Opacity = 0.8;
LeftIR.AttachToDocument();
LeftIR.style.backgroundColor = JSColor.FromRGB(0xB0, 0, 0);
var RightLR = new IHTMLDiv();
RightLR.style.position = IStyle.PositionEnum.absolute;
RightLR.style.right = "0";
RightLR.style.top = "0";
RightLR.style.bottom = "0";
RightLR.style.Opacity = 0.5;
RightLR.style.width = "4em";
RightLR.AttachToDocument();
var RightIR = new IHTMLDiv();
RightIR.style.position = IStyle.PositionEnum.absolute;
RightIR.style.right = "0";
RightIR.style.top = "0";
RightIR.style.height = "1em";
RightIR.style.width = "4em";
RightIR.style.Opacity = 0.8;
RightIR.AttachToDocument();
RightIR.style.backgroundColor = JSColor.FromRGB(0xB0, 0, 0);
LeftLR.style.backgroundColor = JSColor.FromRGB(0x80, 0, 0);
RightLR.style.backgroundColor = JSColor.FromRGB(0x80, 0, 0);
#endregion
page.PageContainer.AttachToDocument();
page.PageContainer.style.color = JSColor.White;
page.PageContainer.style.textShadow = "#000 0px 0px 3px";
page.ElShadow.style.textShadow = "#000 0px 0px 3px";
#region AtResize
Action AtResize = delegate
{
page.PageContainer.style.SetLocation(0, 0, Native.Window.Width, Native.Window.Height);
};
AtResize();
Native.Window.onresize += delegate { AtResize(); };
#endregion
var delay = new Timer(
delegate
{
Native.Document.body.style.cursor = IStyle.CursorEnum.wait;
}
);
var COM46_Line_value = "";
Func <double, double> sin = Math.Sin;
#region deviceorientation
var gamma = 0.0;
var beta = 0.0;
var alpha = 0.0;
Window.deviceorientation +=
e =>
{
gamma = e.gamma;
beta = e.beta;
alpha = e.alpha;
if (beta < 20)
{
SpiderModelContent.po = 16;
}
if (beta > 60)
{
SpiderModelContent.po = 15;
}
if (gamma > 30)
{
SpiderModelContent.po = 14;
}
if (gamma < -30)
{
SpiderModelContent.po = 13;
}
};
#endregion
#region COM46_Line_value_loop
Action COM46_Line_value_loop = null;
COM46_Line_value_loop = delegate
{
var t = SpiderModelContent.t;
page.Content2.innerText = COM46_Line_value;
page.Content.innerText = ""
//+ "\n: \t" +
+ "\nt: \t" + System.Convert.ToInt32((double)SpiderModelContent.t)
+ "\np: \t" + SpiderModelContent.p
+ "\npo: \t" + SpiderModelContent.po
+ "\ncamera_z: \t" + System.Convert.ToInt32((double)SpiderModelContent.camera_z)
//+ "\nalpha: \t" + alpha
//+ "\nbeta: \t" + beta
//+ "\ngamma: \t" + gamma
+ "\n"
+ "\nRED leg1down_vertical_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg1down_vertical_deg)
+ "\nGREEN leg2down_vertical_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg2down_vertical_deg)
+ "\nBLUE leg3down_vertical_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg3down_vertical_deg)
+ "\nWHITE leg4down_vertical_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg4down_vertical_deg)
+ "\n"
+ "\nRED leg1up_sideway_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg1up_sideway_deg)
+ "\nGREEN leg2up_sideway_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg2up_sideway_deg)
+ "\nBLUE leg3up_sideway_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg3up_sideway_deg)
+ "\nWHITE leg4up_sideway_deg: \t" + System.Convert.ToInt32((double)SpiderModelContent.leg4up_sideway_deg);
Native.Window.requestAnimationFrame += COM46_Line_value_loop;
};
Native.Window.requestAnimationFrame += COM46_Line_value_loop;
#endregion
#region Connect
page.Connect.onclick +=
delegate
{
SpiderModelContent.t_fix = 0;
"Connect".ToDocumentTitle();
SpiderModelContent.po = 0;;
service.AtFocus();
};
#endregion
#region Disconnect
page.Disconnect.onclick +=
delegate
{
"Disconnect".ToDocumentTitle();
SpiderModelContent.po = 0;;
service.AtBlur();
};
#endregion
Action poll = null;
poll = delegate
{
delay.StartTimeout(400);
// Send data from JavaScript to the server tier
service.WebMethod2(
"" + SpiderModelContent.po,
COM46_Line =>
{
Native.Document.body.style.cursor = IStyle.CursorEnum.@default;
delay.Stop();
COM46_Line_value = COM46_Line.Replace("\t", "\n");
// jsc: why string.split with each not working??
var a = COM46_Line.Split(';');
byte RightLR_value = 0;
byte LeftLR_value = 0;
var t = 0f;
#region parse RightLR, LeftLS, LeftIR, RightIR
for (int i = 0; i < a.Length; i++)
{
var u = a[i];
u.TakeUntilOrEmpty(":").Trim().With(
key =>
{
var _value = u.SkipUntilOrEmpty(":").Trim();
// 1024 is dark
#region RightLR
if (key == "RS")
{
var value_int32 = int.Parse(_value);
var value_1024 = (1024 - Math.Min(int.Parse(_value), 1024));
// jsc: please do the masking when casting to byte yyourself, thanks :)
RightLR_value = (byte)((255 * value_1024 / 1024) & 0xff);
RightLR_value = (byte)Math.Min(255, RightLR_value * 2);
if (RightLR_value == 255)
{
RightLR.style.backgroundColor = JSColor.Cyan;
}
else
{
RightLR.style.backgroundColor = JSColor.FromGray(RightLR_value);
}
}
#endregion
#region LeftLS
if (key == "LS")
{
var value_int32 = int.Parse(_value);
var value_1024 = (1024 - Math.Min(int.Parse(_value), 1024));
// jsc: please do the masking when casting to byte yyourself, thanks :)
LeftLR_value = (byte)((255 * value_1024 / 1024) & 0xff);
LeftLR_value = (byte)Math.Min(255, LeftLR_value * 2);
//LeftLR.innerText = "" + ivalue;
if (LeftLR_value == 255)
{
LeftLR.style.backgroundColor = JSColor.Cyan;
}
else
{
LeftLR.style.backgroundColor = JSColor.FromGray(LeftLR_value);
}
}
#endregion
#region LeftIR
if (key == "LI")
{
var value_int32 = int.Parse(_value);
if (value_int32 > 400)
{
LeftIR.style.backgroundColor = JSColor.Red;
}
else
if (value_int32 > 200)
{
LeftIR.style.backgroundColor = JSColor.Yellow;
}
else
{
LeftIR.style.backgroundColor = JSColor.Green;
}
LeftIR.style.height = value_int32 + "px";
SpiderModelContent.tween_red_obstacle_L_y((1 - value_int32 / 600) * 24);
}
#endregion
#region RightIR
if (key == "RI")
{
var value_int32 = int.Parse(_value);
if (value_int32 > 400)
{
RightIR.style.backgroundColor = JSColor.Red;
}
else
if (value_int32 > 200)
{
RightIR.style.backgroundColor = JSColor.Yellow;
}
else
{
RightIR.style.backgroundColor = JSColor.Green;
}
RightIR.style.height = value_int32 + "px";
SpiderModelContent.tween_red_obstacle_R_y((1 - value_int32 / 600) * 24);
}
#endregion
if (key == "t")
{
t = (float)double.Parse(_value);
}
if (key == "pp")
{
SpiderModelContent.p = int.Parse(_value);
}
}
);
}
#endregion
if (t != 0)
{
if (SpiderModelContent.t_local != 0)
{
if (SpiderModelContent.t_fix == 0)
{
SpiderModelContent.t_fix = t - SpiderModelContent.t_local;
}
}
}
// dark 70 .. 255 bright
SpiderModelContent.tween_white_arrow_y(
50 * (1 - ((Math.Max(LeftLR_value, RightLR_value) - 70) / (255 - 70)))
);
SpiderModelContent.tween_white_arrow_x(
(LeftLR_value - 60) * -20f / (255 - 60)
+ (RightLR_value - 60) * 20f / (255 - 60)
);
#region next
new Timer(
delegate
{
Native.Window.requestAnimationFrame += poll;
}
).StartTimeout(UpdateSpeed);
#endregion
}
);
page.FastUpdates.onclick += delegate
{
UpdateSpeed = 50;
};
page.SlowUpdates.onclick += delegate
{
UpdateSpeed = 500;
};
};
Native.Window.requestAnimationFrame += poll;
}
//async Task __buttryfly()
//{
// //Task.Factory.
//}
//async
void Spawn(IHTMLElement e)
{
Native.Document.body.style.margin = "0px";
Native.Document.body.style.padding = "0px";
Native.Document.body.style.overflow = IStyle.OverflowEnum.hidden;
e.style.position = IStyle.PositionEnum.absolute;
e.style.left = "0px";
e.style.top = "0px";
e.style.right = "0px";
e.style.bottom = "0px";
e.style.backgroundColor = Color.FromRGB(209, 245, 245);
IHTMLElement loading = new IHTMLElement(IHTMLElement.HTMLElementEnum.code, "loading...");
loading.style.SetLocation(64, 64, 200, 64);
e.appendChild(loading);
//await __buttryfly();
new global::ButterFlyWithInteractiveInt32Offset.HTML.Images.FromAssets.buttryfly().InvokeOnComplete(
img =>
{
loading.FadeOut();
try
{
//IStyleSheet.Default.AddRule("*", "cursor: none, url('" + new global::ButterFlyWithInteractiveInt32Offset.HTML.Images.FromAssets.nocursor().src + "'), auto;", 0);
//IStyleSheet.Default.AddRule("*", "cursor: none;", 0);
}
catch (Exception exc)
{
new IHTMLElement(IHTMLElement.HTMLElementEnum.pre, exc.Message).AttachToDocument();
}
e.style.backgroundImage = "url(" + img.src + ")";
e.style.backgroundRepeat = "no-repeat";
e.DisableContextMenu();
var x = 0;
var y = 0;
var overlay = new IHTMLDiv();
overlay.style.border = "1px solid red";
overlay.style.SetSize(64, 64);
overlay.AttachToDocument();
Native.window.onframe +=
delegate
{
e.style.backgroundPosition = x + "px " + y + "px";
overlay.style.SetLocation(
// how does this work with the background compiler?
// once browser clicks save, visual studio asks if
// to accept, and bacground compiler
// starts a new compilation
// so, the running app could first be able
// to inspect, whats new?
// and if only the same constant was changed,
// it can be discarded. same with comments.
x + 67.ToInteractiveInt32Form(),
y + 2.ToInteractiveInt32Form()
);
};
e.onmousemove +=
delegate(IEvent i)
{
#region where is the cursor?
if (Native.Document.pointerLockElement == e)
{
x += i.movementX;
y += i.movementY;
}
else
{
x = i.CursorX;
y = i.CursorY;
}
if (x < -img.width / 2)
{
x += Native.window.Width;
}
if (y < -img.height / 2)
{
y += Native.window.Height;
}
x = x % Native.window.Width;
y = y % Native.window.Height;
#endregion
};
e.onclick +=
delegate
{
e.requestPointerLock();
};
});
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefault page = null)
{
// used by
// X:\jsc.svn\examples\javascript\WebGL\WebGLGoldDropletTransactions\WebGLGoldDropletTransactions\Application.cs
if (DisableBackground)
{
// nop
}
else
{
//page.body.style.backgroundColor = "#4584b4";
container.style.backgroundColor = "#4584b4";
}
// Bg gradient
//var canvas = new IHTMLCanvas();
//canvas.width = 32;
//canvas.height = Native.Window.Height;
//var context = (CanvasRenderingContext2D)canvas.getContext("2d");
//var gradient = context.createLinearGradient(0, 0, 0, canvas.height);
//gradient.addColorStop(0f, "#1e4877");
//gradient.addColorStop(0.5f, "#4584b4");
//context.fillStyle = gradient;
//context.fillRect(0, 0, canvas.width, canvas.height);
// Clouds
//var , , renderer, sky, mesh, , material,
//, h, color, colors = [], sprite, size, x, y, z;
var mouseX = 0f;
var start_time = new IDate().getTime();
Console.WriteLine(new { Native.window.Width, Native.window.Height });
var windowHalfX = Native.window.Width / 2;
var windowHalfY = Native.window.Height / 2;
Console.WriteLine(new { DefaultMouseY });
var mouseY = (float)((Native.window.Height * DefaultMouseY - windowHalfY) * 0.15);
//Native.document.body.style.overflow = IStyle.OverflowEnum.hidden;
if (page == null)
{
container.AttachToDocument();
}
else
{
container.AttachTo(page.body);
}
container.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
//container.style.background = "url(" + canvas.toDataURL("image/png") + ")";
#region Dispose
var IsDisposed = false;
Dispose = delegate
{
if (IsDisposed)
{
return;
}
IsDisposed = true;
container.Orphanize();
};
#endregion
var camera = new THREE.PerspectiveCamera(30, Native.window.aspect, 1, 3000);
camera.position.z = 6000;
var scene = new THREE.Scene();
var geometry = new THREE.Geometry();
//var texture = THREE.ImageUtils.loadTexture(new HTML.Images.FromAssets.cloud10().src);
var texture = THREE.ImageUtils.loadTexture(CloudTexture);
texture.magFilter = THREE.LinearMipMapLinearFilter;
texture.minFilter = THREE.LinearMipMapLinearFilter;
// FogColor
//var fog = new THREE.Fog(0x4584b4, -100, 3000);
var fog = new THREE.Fog(FogColor, -100, 3000);
// what about sprites?
var material = new THREE.ShaderMaterial(
new
{
uniforms = new
{
map = new { type = "t", value = texture },
fogColor = new { type = "c", value = fog.color },
fogNear = new { type = "f", value = fog.near },
fogFar = new { type = "f", value = fog.far },
},
vertexShader = new GeometryVertexShader().ToString(),
fragmentShader = new GeometryFragmentShader().ToString(),
depthWrite = false,
depthTest = false,
transparent = true
}
);
var r = new Random();
Func <float> Math_random = () => (float)r.NextDouble();
var plane = new THREE.Mesh(new THREE.PlaneGeometry(64, 64));
for (var i = 0; i < 8000; i++)
{
plane.position.x = Math_random() * 1000 - 500;
plane.position.y = -Math_random() * Math_random() * 200 - 15;
plane.position.z = i;
plane.rotation.z = (f)(Math_random() * Math.PI);
plane.scale.x = Math_random() * Math_random() * 1.5f + 0.5f;
plane.scale.y = plane.scale.x;
THREE.GeometryUtils.merge(geometry, plane);
}
var mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
mesh = new THREE.Mesh(geometry, material);
mesh.position.z = -8000;
scene.add(mesh);
var renderer = new THREE.WebGLRenderer(new { antialias = false });
renderer.setSize(Native.window.Width, Native.window.Height);
container.appendChild(renderer.domElement);
container.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
#region onresize
Native.window.onresize +=
delegate
{
container.style.SetSize(Native.window.Width, Native.window.Height);
camera.aspect = Native.window.aspect;
camera.updateProjectionMatrix();
renderer.setSize(Native.window.Width, Native.window.Height);
};
#endregion
#region animate
Native.window.onframe += delegate
{
if (IsDisposed)
{
return;
}
var position = ((new IDate().getTime() - start_time) * 0.03) % 8000;
camera.position.x += (float)((mouseX - camera.position.x) * 0.01);
camera.position.y += (float)((-mouseY - camera.position.y) * 0.01);
camera.position.z = (f)(-position + 8000);
renderer.render(scene, camera);
};
#endregion
Native.document.onmousemove +=
e =>
{
mouseX = (float)((e.CursorX - windowHalfX) * 0.25);
mouseY = (float)((e.CursorY - windowHalfY) * 0.15);
};
//var ze = new ZeProperties();
//ze.Show();
//ze.Add(() => renderer);
////ze.Add(() => controls);
//ze.Add(() => scene);
}
// vNext should be semi 3D - http://www.freeworldgroup.com/games/3dworm/index.html
public Game()
{
//typeof(ConsoleWorm).ToWindowText();
var canvas = new IHTMLDiv();
canvas.style.overflow = IStyle.OverflowEnum.hidden;
canvas.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
canvas.style.backgroundColor = Color.Black;
canvas.AttachToDocument();
//canvas.style.position = IStyle.PositionEnum.relative;
new HTML.Images.FromAssets.avatar14683_21().InvokeOnComplete(
scull =>
{
new global::ConsoleWorm.HTML.Audio.FromAssets.applause().play();
var zoom = 24;
Func <int> RoomWidth = () => (Native.window.Width / zoom).ToInt32();
Func <int> RoomHeight = () => ((Native.window.Height /*- scull.height - 16*/) / zoom).ToInt32();
var score = 0;
var status = new IHTMLDiv("0$");
var isdead = false;
var paused = true;
status.style.color = Color.Green;
status.style.fontFamily = IStyle.FontFamilyEnum.Consolas;
scull.AttachTo(canvas);
scull.style.SetLocation(
8,
Native.window.Height - scull.height - 8);
status.AttachTo(canvas);
status.style.SetLocation(
8 + scull.width + 8,
Native.window.Height - scull.height
);
Native.window.onresize +=
delegate
{
canvas.style.SetLocation(0, 0, Native.window.Width, Native.window.Height);
scull.style.SetLocation(
8,
Native.window.Height - scull.height - 8);
status.style.SetLocation(
8 + scull.width + 8,
Native.window.Height - scull.height
);
};
Func <Point> GetRandomLocation =
() => new Point(
(RoomWidth() - 1).Random(),
(RoomHeight() - 1).Random()
);
var game_colors = new
{
worm = new
{
active = Color.FromRGB(0, 0xff, 0),
inactive = Color.FromRGB(0, 0x7F, 0),
excited = Color.FromRGB(0xff, 0xff, 0),
}
};
Func <Point, Point> Wrapper =
p => new Point((p.X + RoomWidth()) % RoomWidth(), (p.Y + RoomHeight()) % RoomHeight());
Func <Apple> CreateApple =
() => new Apple
{
GetRandomLocation = GetRandomLocation,
GetZoom = () => zoom,
Wrapper = Wrapper
}.MoveToRandomLocation();
var apples = new List <Apple>
{
};
10.Times(() =>
apples.Add(
CreateApple()
)
);
apples.ForEach(a => a.AttachTo(canvas));
var worm = new Worm
{
Wrapper = Wrapper,
Location = new Point(4, 8),
GetZoom = () => zoom,
Canvas = canvas,
Vector = new Point(0, 1),
Color = game_colors.worm.active
}
.Grow()
.GrowToVector()
.GrowToVector();
Action <int> AddScore = x =>
{
score += x;
if (isdead)
{
status.innerText = score + "$ - Game Over - Enter to continue";
}
else if (paused)
{
status.innerText = score + "$ - Paused - Zoom: " + zoom;
}
else
{
status.innerText = score + "$";
}
worm.Color = game_colors.worm.excited;
status.style.color = JSColor.Yellow;
};
100.AtInterval(
t =>
{
if (paused)
{
// slowdown
if (t.Counter % 4 == 0)
{
if (worm.Color == game_colors.worm.active)
{
worm.Color = game_colors.worm.inactive;
status.style.color = game_colors.worm.inactive;
}
else
{
worm.Color = game_colors.worm.active;
status.style.color = game_colors.worm.active;
}
}
return;
}
if (worm.Parts.Any(i => i.Location.IsEqual(worm.NextLocation)))
{
paused = true;
isdead = true;
AddScore(0);
new global::ConsoleWorm.HTML.Audio.FromAssets.buzzer().play();
return;
}
worm.Color = game_colors.worm.active;
status.style.color = Color.Green;
worm.GrowToVector();
// did we find an apple?
var a = apples.Where(i => i.Location.IsEqual(worm.Location)).ToArray();
if (a.Length > 0)
{
foreach (var v in a)
{
v.MoveToRandomLocation();
}
new global::ConsoleWorm.HTML.Audio.FromAssets.tick().play();
AddScore(1);
}
else
{
worm.Shrink();
}
}
);
var map = new[]
{
new { KeyCode = 38, Point = new Point(0, -1) }, // up
new { KeyCode = 37, Point = new Point(-1, 0) }, // left
new { KeyCode = 39, Point = new Point(1, 0) }, // right
new { KeyCode = 40, Point = new Point(0, 1) }, // down,
new { KeyCode = (int)System.Windows.Forms.Keys.W, Point = new Point(0, -1) }, // up
new { KeyCode = (int)System.Windows.Forms.Keys.A, Point = new Point(-1, 0) }, // left
new { KeyCode = (int)System.Windows.Forms.Keys.D, Point = new Point(1, 0) }, // right
new { KeyCode = (int)System.Windows.Forms.Keys.S, Point = new Point(0, 1) }, // down
};
Func <IEvent, bool> IsPauseKey =
ev => ev.IsKeyCode("pP") || ev.KeyCode == 8504;
var PreviousKeyCode = 40;
Native.Document.body.onselectstart +=
ev =>
{
ev.PreventDefault();
ev.StopPropagation();
};
Action <IEvent> AtClick =
ev =>
{
ev.PreventDefault();
ev.StopPropagation();
var KeyCode = PreviousKeyCode;
if (ev.CursorX < Native.window.Width / 2)
{
if (KeyCode == 38)
{
KeyCode = 37;
}
else if (KeyCode == 37)
{
KeyCode = 40;
}
else if (KeyCode == 40)
{
KeyCode = 39;
}
else if (KeyCode == 39)
{
KeyCode = 38;
}
// turn left
}
else
{
if (KeyCode == 38)
{
KeyCode = 39;
}
else if (KeyCode == 37)
{
KeyCode = 38;
}
else if (KeyCode == 40)
{
KeyCode = 37;
}
else if (KeyCode == 39)
{
KeyCode = 40;
}
// turn right
}
if (isdead)
{
while (worm.Parts.Count > 2)
{
worm.Shrink();
}
paused = false;
isdead = false;
AddScore(-score);
new global::ConsoleWorm.HTML.Audio.FromAssets.reveal().play();
return;
}
if (paused)
{
paused = !paused;
if (!paused)
{
worm.Color = game_colors.worm.active;
status.style.color = game_colors.worm.active;
}
canvas.requestFullscreen();
AddScore(0);
new global::ConsoleWorm.HTML.Audio.FromAssets.reveal().play();
return;
}
if (!paused)
{
var v = map.SingleOrDefault(i => i.KeyCode == KeyCode);
if (v != null)
{
ev.PreventDefault();
if ((worm.Vector + v.Point).IsZero())
{
return;
}
PreviousKeyCode = v.KeyCode;
worm.Vector = v.Point;
}
}
};
Native.Document.body.onclick += AtClick;
#region onkeyup
Native.Document.onkeyup +=
ev =>
{
if (isdead)
{
if (ev.IsReturn)
{
while (worm.Parts.Count > 2)
{
worm.Shrink();
}
paused = false;
isdead = false;
AddScore(-score);
new global::ConsoleWorm.HTML.Audio.FromAssets.reveal().play();
}
}
if (!paused)
{
var v = map.SingleOrDefault(i => i.KeyCode == ev.KeyCode);
if (v != null)
{
ev.PreventDefault();
if ((worm.Vector + v.Point).IsZero())
{
return;
}
worm.Vector = v.Point;
}
if (ev.IsReturn)
{
apples.Add(
CreateApple().AttachTo(canvas)
);
}
else
if (ev.KeyCode == 33)
{
zoom--;
zoom = zoom.Max(8);
apples.ForEach(a => a.MoveToLocation());
worm.Parts.ForEach(p => p.MoveToLocation());
}
else if (ev.KeyCode == 34)
{
zoom++;
zoom = zoom.Min(64);
apples.ForEach(a => a.MoveToLocation());
worm.Parts.ForEach(p => p.MoveToLocation());
}
}
if (!isdead)
{
if (IsPauseKey(ev))
{
paused = !paused;
if (!paused)
{
worm.Color = game_colors.worm.active;
status.style.color = game_colors.worm.active;
}
AddScore(0);
}
}
};
#endregion
}
);
}
/// <summary>
/// Creates a new control
/// </summary>
/// <param name="DataElement">The hidden data element</param>
public SimpleFilmstrip()
{
IHTMLDiv Control = new IHTMLDiv();
Control.style.position = IStyle.PositionEnum.absolute;
new filmstrip().ToBackground(Control, false);
//Control.style.background = "url(assets/SimpleFilmstrip/filmstrip.png) no-repeat";
Control.style.height = "600px";
Control.style.width = "326px";
var index = 0;
var t_icount = default(int);
var t_interval = default(int);
var t_iwidth = default(int);
var t_iheight = default(int);
var t_feed = default(string);
var Restart = default(Action);
var feed = new IHTMLInput(HTMLInputTypeEnum.text,
new veh_cy().src
);
var iwidth = new IHTMLInput(HTMLInputTypeEnum.text, "48");
var iheight = new IHTMLInput(HTMLInputTypeEnum.text, "48");
var icount = new IHTMLInput(HTMLInputTypeEnum.text, "32");
var interval = new IHTMLInput(HTMLInputTypeEnum.text, "50");
var fps = new IHTMLInput(HTMLInputTypeEnum.text, "24");
feed.onchange += delegate { Restart(); };
iwidth.onchange += delegate { Restart(); };
iheight.onchange += delegate { Restart(); };
interval.onchange += delegate
{
int v = int.Parse(interval.value);
if (v == 0)
{
return;
}
fps.value = "" + (1000 / v);
Restart();
};
icount.onchange += delegate { Restart(); };
fps.onchange += delegate
{
int v = int.Parse(fps.value);
if (v == 0)
{
return;
}
interval.value = "" + (1000 / v);
Restart();
};
var fieldset = new IHTMLElement(IHTMLElement.HTMLElementEnum.fieldset);
fieldset.style.width = "30em";
fieldset.appendChild(new IHTMLElement(IHTMLElement.HTMLElementEnum.legend, "Properties"));
Func <string, IHTMLElement, IHTMLDiv> AsLabel =
(string text, IHTMLElement control) =>
{
var label = new IHTMLLabel(text, control);
control.style.position = IStyle.PositionEnum.absolute;
control.style.left = "8em";
return(new IHTMLDiv(label, control));
};
fieldset.appendChild(AsLabel("feed:", feed));
fieldset.appendChild(AsLabel("width:", iwidth));
fieldset.appendChild(AsLabel("height:", iheight));
fieldset.appendChild(AsLabel("count:", icount));
fieldset.appendChild(AsLabel("interval:", interval));
fieldset.appendChild(AsLabel("fps:", fps));
fieldset.style.position = IStyle.PositionEnum.absolute;
fieldset.style.top = "320px";
var image = new IHTMLDiv();
image.style.position = IStyle.PositionEnum.absolute;
image.style.top = "52px";
image.style.left = "32px";
var t = new Timer();
t.Tick += delegate
{
image.style.backgroundPosition = "-" + (index * t_iwidth) + "px 0px";
index = (index + 1) % t_icount;
};
Restart =
delegate
{
t_icount = int.Parse(icount.value);
t_interval = int.Parse(interval.value);
t_iwidth = int.Parse(iwidth.value);
t_iheight = int.Parse(iheight.value);
t_feed = feed.value;
image.style.background = "url(" + t_feed + ") no-repeat";
image.style.width = t_iwidth + "px";
image.style.height = t_iheight + "px";
t.StartInterval(t_interval);
};
Restart();
Control.appendChild(image, fieldset);
Control.AttachToDocument();
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IDefault page)
{
@"Hello world".ToDocumentTitle();
// Send data from JavaScript to the server tier
service.WebMethod2(
@"A string from JavaScript.",
value => value.ToDocumentTitle()
);
string[] Links =
{
"http://www.aminocom.com/products/ipstb/aminet110.html",
"http://www.vario.tv/espace-clients/aide/variotv_AmiNET110_UserGuide_Book2.pdf"
};
var img = new HTML.Images.FromAssets.Amino_remote();
//var img_bg = new IHTMLImage(Assets.Path + "/Amino-remote-bg.png");
var reddot_array = Extensions.ToArray(0, 1, 3, 6);
var reddot = new[]
{
new { index = 0, image = (IHTMLImage) new HTML.Images.FromAssets.reddot_0() },
new { index = 1, image = (IHTMLImage) new HTML.Images.FromAssets.reddot_1() },
new { index = 3, image = (IHTMLImage) new HTML.Images.FromAssets.reddot_3() },
new { index = 6, image = (IHTMLImage) new HTML.Images.FromAssets.reddot_6() }
};
100.AtInterval(
t1 =>
{
if (reddot.Any(i => !i.image.complete))
{
return;
}
//if (!img_bg.complete)
// return;
t1.Stop();
//Native.Document.body.style.background = "url(" + img_bg.src + ") repeat-x";
img.InvokeOnComplete(
delegate
{
var div = new IHTMLDiv();
div.style.SetLocation(0, 0, img.width, img.height);
div.style.SetBackground(img.src, false);
div.AttachToDocument();
Action <Point> SpawnDot =
pos =>
{
var c = reddot.Last();
var x = new IHTMLImage(c.image.src); // c.image.cloneNode();
x.AttachTo(div);
x.SetCenteredLocation(pos);
(1000 / 16).AtInterval(
t =>
{
c = reddot.Previous(y => y.index == c.index);
x.src = c.image.src;
},
() => c.index == reddot.First().index,
() => 400.AtTimeout(
t2 =>
{
x.Orphanize();
}
)
);
};
div.onclick +=
ev =>
{
var pos = ev.CursorPosition;
Console.WriteLine(pos);
SpawnDot(pos);
};
div.ontouchmove +=
ev =>
{
ev.preventDefault();
for (uint i = 0; i < ev.touches.length; i++)
{
var pos = new Point(ev.touches[i].clientX, ev.touches[i].clientY);
SpawnDot(pos);
}
};
var map = new[]
{
new { KeyCode = 13, Point = new Point(173, 331) }, // enter
new { KeyCode = 13, Point = new Point(206, 216) }, // enter
new { KeyCode = 38, Point = new Point(173, 304) }, // up
new { KeyCode = 37, Point = new Point(148, 327) }, // left
new { KeyCode = 39, Point = new Point(201, 331) }, // right
new { KeyCode = 40, Point = new Point(174, 357) }, // down
new { KeyCode = 33, Point = new Point(164, 431) }, // page up
new { KeyCode = 34, Point = new Point(187, 435) }, // page down
new { KeyCode = 48, Point = new Point(172, 207) }, // 0
new { KeyCode = 49, Point = new Point(141, 121) }, // 1
new { KeyCode = 50, Point = new Point(171, 120) }, // 2
new { KeyCode = 51, Point = new Point(206, 131) },
new { KeyCode = 52, Point = new Point(143, 152) },
new { KeyCode = 53, Point = new Point(175, 149) },
new { KeyCode = 54, Point = new Point(207, 158) },
new { KeyCode = 55, Point = new Point(141, 178) },
new { KeyCode = 56, Point = new Point(174, 177) }, // 8
new { KeyCode = 57, Point = new Point(209, 185) }, // 9
new { KeyCode = 8, Point = new Point(140, 204) }, // backspace
new { KeyCode = 8492, Point = new Point(209, 252) }, // prog up
new { KeyCode = 8494, Point = new Point(205, 290) }, // prog down
new { KeyCode = 8512, Point = new Point(147, 380) }, // red
new { KeyCode = 8513, Point = new Point(167, 386) }, // green
new { KeyCode = 8514, Point = new Point(184, 389) }, // yellow
new { KeyCode = 8515, Point = new Point(206, 385) }, // blue
new { KeyCode = 8516, Point = new Point(175, 267) }, // menu
new { KeyCode = 8502, Point = new Point(144, 403) }, // rewind
new { KeyCode = 8499, Point = new Point(164, 406) }, // play
new { KeyCode = 8504, Point = new Point(188, 414) }, // pause
new { KeyCode = 8500, Point = new Point(208, 413) }, // pause
};
ActionParam <int, int> AddKeyCodes =
(_old, _new) =>
{
var _2 = map.Where(i => i.KeyCode == _old).First();
map = map.Concat(_new.Select(KeyCode => new { KeyCode, _2.Point })).ToArray();
};
Action <int, string> AddKeyCodesString =
(_old, _new) =>
{
var _U = _new.ToUpper();
var _L = _new.ToLower();
for (int i = 0; i < _U.Length; i++)
{
Console.WriteLine(_old + " -> " + _U[i] + " , " + _L[i]);
AddKeyCodes(_old, _U[i], _L[i]);
}
};
var alpha = new Dictionary <char, string>
{
{ '2', "abc" },
{ '3', "def" },
{ '4', "ghi" },
{ '5', "jkl" },
{ '6', "mno" },
{ '7', "pqrs" },
{ '8', "tuv" },
{ '9', "wxyz" },
};
alpha.ForEach(i => AddKeyCodesString(i.Key, i.Value));
Native.document.onkeyup +=
ev =>
{
ev.preventDefault();
var z = map.Where(i => i.KeyCode == ev.KeyCode).ToArray();
if (z.Length > 0)
{
z.ForEach(i => SpawnDot(i.Point));
}
Console.WriteLine(new { ev.KeyCode });
};
map.ForEach(
(i, next) =>
{
SpawnDot(i.Point);
25.AtTimeout(
delegate
{
next();
}
);
}
);
}
);
}
);
}
//public const string Alias = "Class1";
//public const string DefaultData = "Class1Data";
/// <summary>
/// Creates a new control
/// </summary>
/// <param name="DataElement">The hidden data element</param>
public SimpleRollover()
{
// wallpapers at http://labnol.blogspot.com/2006/11/download-windows-vista-wallpapers.html
// * broken at the moment
#region AnimateCharacterColors
System.Func <string, INode> AnimateCharacterColors =
(text) =>
{
var s = new IHTMLSpan();
var l = new global::System.Collections.Generic.List <IHTMLSpan>();
foreach (char c in text)
{
var y = new string(c, 1);
var x = new IHTMLSpan(y);
if (y == " ")
{
s.appendChild(" ");
}
else
{
l.Add(x);
s.appendChild(x);
}
}
new Timer(
t =>
{
var len = l.Count + 40;
if (t.Counter % len < l.Count)
{
if (t.Counter % (len * 2) < l.Count)
{
l[t.Counter % len].style.visibility = IStyle.VisibilityEnum.hidden;
}
else
{
l[t.Counter % len].style.visibility = IStyle.VisibilityEnum.visible;
}
}
}, 6000, 200);
return(s);
};
#endregion
// */
var u = new IHTMLDiv();
//u.style.backgroundColor = Color.Green;
u.style.position = IStyle.PositionEnum.absolute;
u.style.left = "0";
u.style.top = "0";
u.style.height = "100%";
u.style.width = "100%";
u.style.overflow = IStyle.OverflowEnum.auto;
var styles = new XStyles
{
dark = new IStyleSheet(),
light = new IStyleSheet(),
switchbutton = new IHTMLAnchor("", "day/night"),
counter = 0
};
styles.switchbutton.onclick +=
ev =>
{
ev.PreventDefault();
styles.counter++;
if (styles.counter % 2 == 1)
{
styles.dark.disabled = false;
styles.light.disabled = true;
}
else
{
styles.dark.disabled = true;
styles.light.disabled = false;
}
};
var ad = new IHTMLDiv(
new IHTMLSpan(
AnimateCharacterColors(
"this application was written in c# and then translated to javascript by jsc to run in your browser"
)
),
new IHTMLAnchor("http://zproxy.wordpress.com", "visit blog"),
new IHTMLAnchor("http://jsc.sf.net", "get more examples"),
styles.switchbutton
)
{
className = "ad1"
};
u.appendChild(ad);
var sheet = new IStyleSheet();
sheet.AddRule(".ad1",
r =>
{
r.style.marginTop = "1em";
r.style.color = Color.White;
r.style.fontFamily = IStyle.FontFamilyEnum.Verdana;
}
);
sheet.AddRule(".ad1 > *",
r =>
{
r.style.padding = "1em";
r.style.marginTop = "1em";
}
);
sheet.AddRule(".ad1 > span",
r =>
{
r.style.Float = IStyle.FloatEnum.right;
}
);
sheet.AddRule(".ad1 > a",
r =>
{
r.style.Float = IStyle.FloatEnum.left;
r.style.color = Color.White;
r.style.textDecoration = "none";
}
);
sheet.AddRule(".ad1 a:hover",
r =>
{
r.style.color = Color.Yellow;
}
);
sheet.AddRule("html",
r =>
{
r.style.overflow = IStyle.OverflowEnum.hidden;
}
);
sheet.AddRule("body",
r =>
{
r.style.overflow = IStyle.OverflowEnum.hidden;
r.style.padding = "0";
r.style.margin = "0";
//r.style.backgroundImage = "url(assets/vista.jpg)";
}
);
styles.dark.AddRule("body").style.backgroundColor = JSColor.Black;
styles.dark.AddRule("body").style.backgroundPosition = "center top";
styles.light.AddRule("body").style.backgroundColor = JSColor.Black;
styles.light.AddRule("body").style.backgroundPosition = "center top";
new global::SimpleRollover.HTML.Images.FromAssets.vistax().ToBackground(
styles.dark.AddRule("body").style, false
);
new global::SimpleRollover.HTML.Images.FromAssets.vista().ToBackground(
styles.dark.AddRule(".effect1").style
);
styles.dark.AddRule(".moon1").style.backgroundColor = Color.Yellow;
new global::SimpleRollover.HTML.Images.FromAssets.vista().ToBackground(
styles.light.AddRule("body").style, false
);
new global::SimpleRollover.HTML.Images.FromAssets.vistax().ToBackground(
styles.light.AddRule(".effect1").style
);
styles.light.AddRule(".moon1").style.backgroundColor = Color.Red;
sheet.AddRule(".special1",
r =>
{
r.style.background = "none";
r.style.border = "0";
r.style.width = "100%";
r.style.marginTop = "4em";
}
);
sheet.AddRule(".content1",
r =>
{
r.style.backgroundColor = Color.White;
r.style.padding = "1em";
r.style.marginLeft = "4em";
r.style.marginRight = "4em";
r.style.Opacity = 0.5;
r.style.border = "1px solid gray";
}
);
sheet.AddRule(".special1 img", "border: 0", 0);
sheet.AddRule(".special1:hover", "background: url(" + new global::SimpleRollover.HTML.Images.FromAssets.Untitled_3().src + ") repeat-x", 1);
sheet.AddRule(".special1 .hot").style.display = IStyle.DisplayEnum.none;
sheet.AddRule(".special1:hover .hot").style.display = IStyle.DisplayEnum.inline;
sheet.AddRule(".special1 .cold", "display: inline;", 1);
sheet.AddRule(".special1:hover .cold", "display: none;", 1);
var states = new XState[] { }.AsEnumerable();
// new XState {
// Show = default(System.Action),
// Hide = default(System.Action),
// Selected = false }
//}.Where(p => false);
Action <IHTMLImage, IHTMLImage, string> Spawn =
async(icold, ihot, i2) =>
{
var cold = await icold;
var hot = await ihot;
//((IHTMLImage)i[0]).InvokeOnComplete(cold =>
//((IHTMLImage)i[1]).InvokeOnComplete(hot =>
// {
cold.className = "cold";
hot.className = "hot";
var btn = new IHTMLButton()
{
className = "special1"
};
btn.appendChild(cold, hot);
var content = new IHTMLElement(IHTMLElement.HTMLElementEnum.pre);
content.innerHTML = "...";
content.className = "content1";
var tween = new TweenDataDouble();
var tween_max = 16;
tween.ValueChanged +=
delegate
{
content.style.Opacity = tween.Value / tween_max;
content.style.height = tween.Value + "em";
content.style.overflow = IStyle.OverflowEnum.hidden;
};
tween.Done += delegate
{
if (tween.Value > 0)
{
content.style.overflow = IStyle.OverflowEnum.auto;
}
};
tween.Value = 0;
var state = new XState
{
Show = (System.Action)(() =>
{
tween.Value = tween_max;
}
),
Hide = (System.Action)(() => tween.Value = 0),
Selected = false
};
//try
//{
// new IXMLHttpRequest(HTTPMethodEnum.GET, i[2],
// request => content.innerHTML = request.responseText
// );
//}
//catch
//{
content.innerText = i2;
//}
states = states.Concat(new[] { state });
btn.onclick +=
delegate
{
foreach (var v in states)
{
if (v == state)
{
v.Selected = !v.Selected;
if (v.Selected)
{
v.Show();
}
else
{
v.Hide();
}
}
else
{
v.Selected = false;
v.Hide();
}
}
};
u.appendChild(btn, content);
};
SpawnCursor();
u.AttachToDocument();
Spawn(
new global::SimpleRollover.HTML.Images.FromAssets.Untitled_1_03(),
new global::SimpleRollover.HTML.Images.FromAssets.Untitled_2_03(),
"This application was written in C#."
);
Spawn(
new global::SimpleRollover.HTML.Images.FromAssets.Untitled_1_07(),
new global::SimpleRollover.HTML.Images.FromAssets.Untitled_2_07(),
"This application was cross compiled into JavaScript."
);
}
public MatrixTransformBExample()
{
var x = 400;
var y = 200;
var w = 200;
var h = 200;
var ro_matrix = new IHTMLDiv();
ro_matrix.style.backgroundColor = "#8080ff";
ro_matrix.style.SetLocation(x, y);
ro_matrix.AttachToDocument();
//ro_matrix.style.paddingLeft = w + "px";
//ro_matrix.style.paddingTop = h + "px";
var ro_matric_content = new IHTMLDiv();
ro_matric_content.style.backgroundColor = "#0000ff";
ro_matric_content.style.SetSize(w, h);
ro_matric_content.AttachTo(ro_matrix);
var r_matrix = new IHTMLDiv();
r_matrix.style.backgroundColor = "#80ff80";
r_matrix.style.SetLocation(x, y);
r_matrix.AttachToDocument();
//r_matrix.style.paddingLeft = w + "px";
//r_matrix.style.paddingTop = h + "px";
var r_matric_content = new IHTMLDiv();
r_matric_content.style.backgroundColor = "#00ff00";
r_matric_content.style.SetSize(w, h);
r_matric_content.AttachTo(r_matrix);
#region blue rotation
var jo = new IHTMLDiv();
jo.style.background = "blue";
jo.style.SetLocation(x - w / 2 - 4, y - h / 2 - 1, 8, 2);
jo.AttachToDocument();
var joh = new IHTMLDiv();
joh.style.background = "blue";
joh.style.SetLocation(x - w / 2 - 1, y - h / 2 - 4, 2, 8);
joh.AttachToDocument();
jo.BlinkAt(400);
joh.BlinkAt(400);
#endregion
#region black origin
var zo = new IHTMLDiv();
zo.style.background = "black";
zo.style.SetLocation(x - 4, y - 1, 8, 2);
zo.AttachToDocument();
var zoh = new IHTMLDiv();
zoh.style.background = "black";
zoh.style.SetLocation(x - 1, y - 4, 2, 8);
zoh.AttachToDocument();
#endregion
var ro = new IHTMLDiv();
ro.style.background = "red";
ro.style.SetLocation(x, y, w, h);
ro.style.Opacity = 0.3;
ro.AttachToDocument();
var info = new IHTMLSpan {
innerText = "MatrixTransform"
};
info.style.SetLocation(x, y + h, w, h);
info.AttachToDocument();
var at = new IHTMLDiv();
at.style.background = "yellow";
at.style.SetLocation(x - w / 2, y - h / 2, w * 2, h * 2);
at.style.Opacity = 0.5;
at.AttachToDocument();
var r = new IHTMLDiv();
r.style.background = "black";
r.style.SetLocation(x, y, w, h);
r.style.Opacity = 0.3;
r.AttachToDocument();
r.style.cursor = IStyle.CursorEnum.pointer;
#region blue origin
var o = new IHTMLDiv();
o.style.background = "blue";
o.style.SetLocation(x + w / 2 - 4, y + h / 2 - 1, 8, 2);
o.AttachToDocument();
var oh = new IHTMLDiv();
oh.style.background = "blue";
oh.style.SetLocation(x + w / 2 - 1, y + h / 2 - 4, 2, 8);
oh.AttachToDocument();
#endregion
#region black rotation
var jzo = new IHTMLDiv();
jzo.style.background = "black";
jzo.style.SetLocation(x - w / 2 - 4, y - h / 2 - 1, 8, 2);
jzo.AttachToDocument();
var jzoh = new IHTMLDiv();
jzoh.style.background = "black";
jzoh.style.SetLocation(x - w / 2 - 1, y - h / 2 - 4, 2, 8);
jzoh.AttachToDocument();
jzo.BlinkAt(400);
jzoh.BlinkAt(400);
#endregion
var m = new MatrixModifiers();
var InteractiveSetOrigin_x = 0;
var InteractiveSetOrigin_y = 0;
var InteractiveSetRotation_x = 0;
var InteractiveSetRotation_y = 0;
Action <int, int> InteractiveSetRotation = null;
Action <int, int> SetPadding =
(ox, oy) =>
{
// -0 ... -w
ox += w / 2;
oy += h / 2;
info.innerText = "padding x: " + ox + " y:" + oy;
if (ox > 0)
{
ro_matrix.style.paddingLeft = ox * 2 + "px";
ro_matrix.style.paddingRight = 0 + "px";
}
else
{
ro_matrix.style.paddingLeft = 0 + "px";
ro_matrix.style.paddingRight = ox * -2 + "px";
}
if (oy > 0)
{
ro_matrix.style.paddingTop = oy * 2 + "px";
ro_matrix.style.paddingBottom = 0 + "px";
}
else
{
ro_matrix.style.paddingTop = 0 + "px";
ro_matrix.style.paddingBottom = oy * -2 + "px";
}
if (ox > 0)
{
r_matrix.style.paddingLeft = ox * 2 + "px";
r_matrix.style.paddingRight = 0 + "px";
}
else
{
r_matrix.style.paddingLeft = 0 + "px";
r_matrix.style.paddingRight = ox * -2 + "px";
}
if (oy > 0)
{
r_matrix.style.paddingTop = oy * 2 + "px";
r_matrix.style.paddingBottom = 0 + "px";
}
else
{
r_matrix.style.paddingTop = 0 + "px";
r_matrix.style.paddingBottom = oy * -2 + "px";
}
};
m.Visual1.CheckedChanged +=
delegate
{
r_matrix.Show(m.Visual1.Checked);
};
m.Visual2.CheckedChanged +=
delegate
{
ro_matrix.Show(m.Visual2.Checked);
};
m.Debug1.CheckedChanged +=
delegate
{
if (m.Debug1.Checked)
{
ro_matrix.style.backgroundColor = "#8080ff";
r_matrix.style.backgroundColor = "#80ff80";
return;
}
ro_matrix.style.backgroundColor = "";
r_matrix.style.backgroundColor = "";
};
Action <int, int> InteractiveSetOrigin =
(ox, oy) =>
{
var dx = InteractiveSetOrigin_x - ox;
var dy = InteractiveSetOrigin_y - oy;
InteractiveSetOrigin_x = ox;
InteractiveSetOrigin_y = oy;
SetPadding(ox, oy);
m.TranslateX.Text = "" + ox;
m.TranslateY.Text = "" + oy;
ro.style.SetLocation(x + ox, y + oy, w, h);
ro_matrix.style.SetLocation(x + ox, y + oy /*, w, h*/);
o.style.SetLocation(x - ox - 4, y - oy - 1, 8, 2);
oh.style.SetLocation(x - ox - 1, y - oy - 4, 2, 8);
InteractiveSetRotation(InteractiveSetRotation_x + dx, InteractiveSetRotation_y + dy);
};
InteractiveSetRotation =
(ox, oy) =>
{
InteractiveSetRotation_x = ox;
InteractiveSetRotation_y = oy;
var ax = x - w / 2 + ox;
var ay = y - h / 2 + oy;
var bx = x - InteractiveSetOrigin_x;
var by = y - InteractiveSetOrigin_y;
var dx = ax - bx;
var dy = ay - by;
var rotation = Extensions.GetRotation(dx, dy);
var rotation_degrees = rotation.RadiansToDegrees();
var costheta = Math.Cos(rotation);
var sintheta = Math.Sin(rotation);
var M11 = costheta;
var M12 = -sintheta;
var M21 = sintheta;
var M22 = costheta;
m.M11.Text = "" + M11;
m.M12.Text = "" + M12;
m.M21.Text = "" + M21;
m.M22.Text = "" + M22;
info.innerText = "rotation: " + rotation_degrees + "° x: " + InteractiveSetOrigin_x + " y:" + InteractiveSetOrigin_y;
//Native.Document.title = new { ax, bx, dx, rotation_degrees }.ToString();
joh.style.SetLocation(ax - 1, y - h / 2 + oy - 4, 2, 8);
jo.style.SetLocation(x - w / 2 + ox - 4, ay - 1, 8, 2);
jzoh.style.SetLocation(x + InteractiveSetOrigin_x - w / 2 + ox - 1, y + InteractiveSetOrigin_y - h / 2 + oy - 4, 2, 8);
jzo.style.SetLocation(x + InteractiveSetOrigin_x - w / 2 + ox - 4, y + InteractiveSetOrigin_y - h / 2 + oy - 1, 8, 2);
var mm = new[]
{
M11, M21,
M12, M22,
0, 0
//0.838670551776886,0.5446390509605408,-0.5446390509605408,0.838670551776886,0,0
};
var code = @"
q.style.filter = ""progid:DXImageTransform.Microsoft.Matrix(M11='"" + m[0] + ""',M12='"" + m[2] + ""',M21='"" + m[1] + ""', M22='"" + m[3] + ""', sizingmethod='auto expand');"";
q.style.MozTransform = ""matrix("" + m[0] + "","" + m[1] + "","" + m[2] + "","" + m[3] + "","" + m[4] + "","" + m[5] + "")"";
q.style.WebkitTransform = ""matrix("" + m[0] + "","" + m[1] + "","" + m[2] + "","" + m[3] + "","" + m[4] + "","" + m[5] + "")"";
" ;
new IFunction("q", "m", code).apply(null, r_matrix, mm);
new IFunction("q", "m", code).apply(null, ro_matrix, mm);
var r_matrix_adj_x = (r_matrix.clientWidth - r_matrix.offsetWidth) / 2;
var r_matrix_adj_y = (r_matrix.clientHeight - r_matrix.offsetHeight) / 2;
var ro_matrix_adj_x = (ro_matrix.clientWidth - ro_matrix.offsetWidth) / 2;
var ro_matrix_adj_y = (ro_matrix.clientHeight - ro_matrix.offsetHeight) / 2;
r_matrix.style.SetLocation(x + r_matrix_adj_x, y + r_matrix_adj_y /*, w, h*/);
ro_matrix.style.SetLocation(x + InteractiveSetOrigin_x + ro_matrix_adj_x, y + InteractiveSetOrigin_y + ro_matrix_adj_y /*, w, h*/);
};
#region bind InteractiveSetRotation
at.onclick +=
e =>
{
InteractiveSetRotation(e.OffsetX, e.OffsetY);
};
at.onmousemove +=
e =>
{
InteractiveSetRotation(e.OffsetX, e.OffsetY);
};
at.onmouseover +=
delegate
{
info.innerText = "Click to set rotation";
};
InteractiveSetRotation(0, 0);
#endregion
#region bind InteractiveSetOrigin
m.ButtonClear.Click +=
delegate
{
InteractiveSetOrigin(0, 0);
};
r.onclick +=
e =>
{
// 0 0 is top left
InteractiveSetOrigin(-e.OffsetX, -e.OffsetY);
};
r.onmouseover +=
delegate
{
if (m.Debug1.Checked)
{
info.innerText = "Click to set padding";
return;
}
info.innerText = "Click to set origin";
};
#endregion
//InteractiveSetOrigin(0, 0);
InteractiveSetOrigin(-w / 2, -h / 2);
var f = new Form {
Text = "MatrixModifier"
};
m.BackColor = System.Drawing.Color.White;
f.Controls.Add(m);
f.ClientSize = m.Size;
f.GetHTMLTarget().AttachToDocument();
}
//public const string Alias = "Class1";
//public const string DefaultData = "Class1Data";
/// <summary>
/// Creates a new control
/// </summary>
/// <param name="DataElement">The hidden data element</param>
public GoogleGearsSimple()
{
// this ctor creates a new div which has a text and a button element
// on mouseover over the color text is changed
// on pressing the button the next message in text element is displayed
IHTMLDiv Control = new IHTMLDiv();
Control.AttachToDocument();
Func <string, string, IHTMLElement> link = (href, text) => new IHTMLDiv(new IHTMLAnchor(href, text));
Control.appendChild(link("http://gears.google.com/", "Google Gears"));
Control.appendChild(link("http://code.google.com/apis/gears/samples/hello_world_database.html", "Google Example # 1"));
Control.appendChild(new IHTMLElement(IHTMLElement.HTMLElementEnum.h3, "This page uses Google Gears to record your entries on the local disk. If you navigate away and revisit this page, all your data will still be here. Try it!"));
// http://code.google.com/apis/gears/samples/hello_world_database.html
GoogleGearsFactory.Database db = null;
try
{
db = new GoogleGearsFactory.Database();
}
catch (Exception exc)
{
var err = new IHTMLCode(exc.Message);
err.style.color = Color.Red;
Control.appendChild(err);
}
IStyleSheet.Default.AddRule(".odd").style.backgroundColor = Color.FromGray(0xa0);
IStyleSheet.Default.AddRule(".even").style.backgroundColor = Color.FromGray(0xef);
if (db != null)
{
db.open("demo1");
db.execute(@"
create table if not exists Demo
(Phrase varchar(255), Timestamp int)
");
var textfield = new IHTMLInput(HTMLInputTypeEnum.text, "text1", "");
var btnadd = new IHTMLButton("Add new entry");
var btnrefresh = new IHTMLButton("Refresh");
var btnclear = new IHTMLButton("Clear");
Control.appendChild(textfield, btnadd, btnclear, btnrefresh,
new IHTMLCode(GoogleGearsFactory.Default.getBuildInfo())
);
var list = new IHTMLElement(IHTMLElement.HTMLElementEnum.ol);
Control.appendChild(list);
var read = default(Action);
read = delegate
{
//from i in Demo
//select new { Phrase, Timestamp }
//order by Timestamp desc
list.removeChildren();
Func <string, IHTMLElement> AddItem =
text => new IHTMLElement(IHTMLElement.HTMLElementEnum.li, text).Aggregate(v => list.appendChild(v));
// this could be rewritten as an expression once they are supported by jsc
int counter = 0;
var query = from Data in db.AsEnumerable <DemoDataEntity>(
"select * from Demo order by Timestamp desc",
typeof(DemoDataEntity)
)
// let ListItem = AddItem(Data.Timestamp + " - " + Data.Phrase)
select new __Type2 {
ListItem = AddItem(Data.Timestamp + " - " + Data.Phrase), Data = Data
};
foreach (var v in query)
{
counter++;
var vx = v;
if (counter % 2 == 0)
{
v.ListItem.className = "odd";
}
else
{
v.ListItem.className = "even";
}
#region -
var btndel = new IHTMLButton("-");
btndel.style.color = Color.Red;
btndel.onclick +=
delegate
{
db.execute("delete from Demo where Timestamp = ?", vx.Data.Timestamp);
read();
};
#endregion
#region +
var btnclone = new IHTMLButton("+");
btnclone.style.color = Color.Blue;
btnclone.onclick +=
delegate
{
db.Insert("Demo", vx.Data);
read();
};
#endregion
v.ListItem.insertBefore(btnclone, v.ListItem.firstChild);
v.ListItem.insertBefore(btndel, v.ListItem.firstChild);
}
#region raw
//var rs = db.execute("select * from Demo order by Timestamp desc");
//while (rs.isValidRow())
//{
// var xt = typeof(DemoDataEntity);
// var xx = (DemoDataEntity)Activator.CreateInstance(xt);
// for (int i = 0; i < rs.fieldCount(); i++)
// {
// xt.GetField(rs.fieldName(i)).SetValue(xx, rs.field(i));
// }
// AddItem(xx.Timestamp + " - " + xx.Phrase);
// rs.next();
//}
//rs.close();
#endregion
};
btnclear.onclick +=
delegate
{
db.execute("delete from Demo");
read();
};
btnadd.onclick +=
delegate
{
db.Insert("Demo",
new DemoDataEntity
{
Phrase = textfield.value,
Timestamp = IDate.Now.getTime()
}
);
//db.execute("insert into Demo (Phrase, Timestamp) values (?, ?)", textfield.value, IDate.Now.getTime());
textfield.value = "";
read();
};
btnrefresh.onclick +=
delegate
{
read();
};
read();
}
// not array
// is object
// no prototype
}
public MatrixTransformExample()
{
// see: http://webfx.eae.net/tools/filtertool.html
Native.Document.body.style.backgroundColor = "yellow";
var timer = new Timer(
delegate
{
}
, 0, 1000 / 30);
new IHTMLDiv
{
innerText =
@"The rotating element needs to adjust its
location in IE. IE can also handle only inline elements. In WPF
this would mean we need to know our actual location. It seems IE wont allow
clip also.
We could however support WPF FlowDocument for inline elemnts.
Example: left = (a.clientWidth - a.offsetWidth) / 2"
}.AttachToDocument();
new IHTMLImage("assets/MatrixTransformExample/bg.png").AttachToDocument();;
{
var content = new IHTMLDiv();
content.style.position = IStyle.PositionEnum.absolute;
content.style.left = "500px";
content.style.top = "200px";
//content.style.Opacity = 0.3;
content.AttachToDocument();
CreateRotor(45, content);
CreateRotor2(45, content, new IHTMLImage("assets/MatrixTransformExample/gtataxi.png"), timer);
//CreateRotor(33);
}
{
var content = new IHTMLDiv();
content.style.position = IStyle.PositionEnum.absolute;
content.style.left = "208px";
content.style.top = "108px";
//content.style.Opacity = 0.3;
content.AttachToDocument();
CreateRotor2(45, content, new IHTMLImage("assets/MatrixTransformExample/gtataxi_big_shadow.png"), timer);
//CreateRotor(33);
}
{
var content = new IHTMLDiv();
content.style.position = IStyle.PositionEnum.absolute;
content.style.left = "200px";
content.style.top = "100px";
//content.style.Opacity = 0.3;
content.AttachToDocument();
CreateRotor2(45, content, new IHTMLImage("assets/MatrixTransformExample/gtataxi_big.png"), timer);
//CreateRotor(33);
}
{
var content = new IHTMLDiv();
content.style.position = IStyle.PositionEnum.absolute;
content.style.left = "204px";
content.style.top = "204px";
//content.style.Opacity = 0.3;
content.AttachToDocument();
CreateRotor2(45, content, new IHTMLImage("assets/MatrixTransformExample/gtataxi_big_mask.png"), timer);
//CreateRotor(33);
}
{
var content = new IHTMLDiv();
content.style.position = IStyle.PositionEnum.absolute;
content.style.left = "200px";
content.style.top = "200px";
//content.style.Opacity = 0.3;
content.AttachToDocument();
CreateRotor2(45, content, new IHTMLImage("assets/MatrixTransformExample/gtataxi_big.png"), timer);
//CreateRotor(33);
}
}
public ExposedFunctions()
{
// this variable is static
// if this application would be initiated multiple times
// the last initiation will simply overwrite that variable
instructions = new IHTMLDiv(
@"
<p>
This C# to JavaScript project has exposed a method for scripting.
You can either click on the link or copy it's href to the adressbar.
</p>
<h3>Method exposed statically</h3>
<ul>
"
// we will let the browser to parse this html snippet
// as it contains a javascript href
+ "<li>" + ExposedFunctions_AddData1_Example1.ToLink() + "</li>"
+ "<li>" + ExposedFunctions_AddData1_Example2.ToLink() + "</li>"
+ "<li>" + ExposedFunctions_AddData1_Example3.ToLink() + "</li>"
+ @"
</ul>
"
);
instructions.style.padding = "2em";
// previously we defined a static method to be exposed
// lets define one dynamically
var MethodName = "ExposedFunctions_Dynamic1";
var DynamicExample1 = "javascript:" + MethodName + "({text: 'hello', index: 1});";
var DynamicExample2 = "javascript:" + MethodName + "({text: 'world', index: 2});";
Action <Data1> DynamicEntry =
data =>
{
// to prove the dynamic behaviour we shall modify the values
// passed to us and we will in turn pass them to the static
// entry method
ExposedFunctions_AddData1(
new Data1
{
index = data.index + 1,
text = "dynamic: " + data.text
}
);
};
// In c# there will be dynamic object support which could
// help with more magic.
// Future code would look like this:
// Expando.window[MethodName] = DynamicEntry
// until then we must use more verbose code...
Expando.Of(Native.Window).SetMember(MethodName, IFunction.OfDelegate(DynamicEntry));
// lets also advertise this dynamic method
// modifing innerHTML directly will invalidate any references we
// have to any of its childre, which we do not have at this time...
instructions.innerHTML +=
@"
<h3>Method exposed dynamically</h3>
<ul>
"
// we will let the browser to parse this html snippet
// as it contains a javascript href
+ "<li>" + DynamicExample1.ToLink() + "</li>"
+ "<li>" + DynamicExample2.ToLink() + "</li>"
+ @"
</ul>";
new IHTMLImage(Assets.Path + "/Preview.png").AttachTo(instructions);
instructions.AttachToDocument();
}
