Exploring Proxy to achieve TypeScript type safety with element binding, two way data Binding, events, and more
An Alice in Wonderland journey into the nuances of using Proxy with HTML and TypeScript classes.
I despise two things about front-end development:
Oh wait. That's four things.
When I started writing the code for this article, I ended up experience what something that Theory U describes as "Leading From the Future As It Emerges." Riiiight. Sounds like BS, doesn't it? None-the-less, this was my experience:
So my "future" was discovering that the code I'm about to present here is, well, not what I would actually want to use, now that the future as arrived in the present and by the time I finished writing this article, I realized there's a lot of things I would do differently! Regardless, I have found it a useful exploration of how to leverage the Proxy type to bind class properties to models, achieve two way binding, subscribe to UI events, and so forth, all using actual "edit-time" types for type safety and Intellisense support - as in, no strings referencing DOM elements by their ID's. Thus "IX" is born, which is short for "Interacx", which was a WinForm suite of tools that I created a long time ago to automate data manipulation without using an ORM. I decided to repurpose the name since WinForm applications are, well, passť, and the reality is that the thing I despise, writing web apps, it where it's app, I mean, at. And for your endless amusement, I decided to use some Vue examples as comparison to the implementation I've developed here using proxies.
Working with the code I've developed here, I find several advantages:
I cannot reiterate enough how important, at least to me, point #6 is. With a large web application, I have pulled my hair out bouncing between code and markup to figure out what the conditions, loops, and rendering is, and it is a frustrating experience. To me, the idea of including declarative syntax at the UI level that is driven by effectively business data/rules is bad, no horrible, design. It's why I don't use Razor or similar rendering engines. I personally think that arcane custom tags in the HTML, "if" and "loop" tags, etc., to control UI rendering is one of the worst ideas to come out of so-called modern web development.
So let's be realistic:
And I really doubt anyone is going to say, "ooh, let's use IX to build a major website", except perhaps for me!
A Proxy
, at least in Javascript, is an object that replaces your object and
lets you intercept the "get" and "set" methods. Read
more about the Proxy
object
here.
I simple demonstration will suffice. First, a simple proxy stub that just does the get/set operations with console logging:
private myProxyHandler = { get: (obj, prop) => { console.log(`get ${prop}`); return obj[prop]; }, set: (obj, prop, val) => { console.log(`set ${prop} to ${val}`); obj[prop] = val; // Return true to accept change. return true; } }
And a simple test case:
let proxy = new Proxy({}, this.myProxyHandler); proxy.foo = 1; let foo = proxy.foo; console.log(`foo = ${foo}`);
and the output:
set foo to 1 get foo foo = 1
Ahh, feel the power! The world is now mine!
Now let's do something a little more interesting. We'll create a class with a property whose name matches a DOM element. The DOM element, with a label because input elements should have labels:

Name:

<input id="name"/>

Exciting!
Now the class:
class NameContainer { name: string; }
And the new proxy:
private valueProxy = { get: (obj, prop) => { console.log(`get ${prop}`); return obj[prop]; }, set: (obj, prop, val) => { console.log(`set ${prop} to ${val}`); let el = document.getElementById(prop) as HTMLInputElement; el.value = val; obj[prop] = val; // Return true to accept change. return true; } }
Notice the only thing I've added is this:
let el = document.getElementById(prop) as HTMLInputElement; el.value = val;
Here the assumption is that the property name is the element ID!
Now we can set the value and it proxies to setting both the object's name
property
and the DOM value
property:
let nc = new Proxy(new NameContainer(), this.valueProxy); nc.name = "Hello World!";
The result is:
What if I type something in and I want to see that value when I "get" the
name
property? Easy enough, the getter changes to this:
get: (obj, prop) => { console.log(`get ${prop}`); let el = document.getElementById(prop) as HTMLInputElement; let val = el.value; obj[prop] = val; return obj[prop]; },
We can test the code by simulating a change the user made:
let nc = new Proxy(new NameContainer(), this.valueProxy); nc.name = "Hello World!"; // Simulate the user having changed the input box: let el = document.getElementById("name") as HTMLInputElement; el.value = "fizbin"; let newName = nc.name; console.log(`The new name is: ${newName}`);
and in the console log, we see:
set name to Hello World! get name The new name is: fizbin
It's important to note that obj[prop] = val
makes the assignment on the non-proxy'd
object, therefore the proxy setter does not get called.
Snazzy! One small step for Marc, one giant leap for better front-end development! Unfortunately, getting to the moon requires a whole lot more effort, infrastructure, time, and a lot of disasters along the way (a pause here to recognize the lives that have been lost in space exploration, as I don't want to appear flippant about "disasters.")
So, let's start the journey down the slope of the U!
The code is TypeScript with simple HTML and CSS, implemented in VS2017 solution.
Let's start with simple data binding of the inner HTML associated with a DIV
.

 {{ message }}
 var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } })
What I don't like:
{{ }}
usage.#app
.data
object thing.

 let form = IX.CreateNullProxy(); // No associated view model. form.app = "Hello Interacx!";
That's it.
The next example is displaying some realtime computed value as part of a SPAN title.

  Hover your mouse over me for a few seconds to see my dynamically bound title!
 var app2 = new Vue({ el: '#app-2', data: { message: 'You loaded this page on ' + new Date().toLocaleString() } })
However your mouse over me for a few seconds to see the dynamically bound title! class HoverExample { mySpan = { attr: { title: "" } }; onMySpanHover = new IXEvent(); } let form = IX.CreateProxy(new HoverExample()); form .onMySpanHover .Add(() => hform.mySpan.attr.title = `You loaded this page on ${new Date().toLocaleString()}`);
More verbose but the benefit is that you're using a repeatable pattern of using a multicast event handler. I did have an implementation where I could just set the title as a function, but I didn't like the one-off implementation behind the scenes that this required.
I also really don't like to make a mess of the markup with declarative code elements.

 Now you see me
 var app3 = new Vue({ el: '#app-3', data: { seen: true } })
In IX, conditional behaviors are implemented through the event mechanism,
usually to manipulate element attributes. Diverging slightly from the Vue
example above, note the addition of two buttons to toggle the visibility of the SPAN
:
Now you see me...  <button id="show">Show</button> <input id="hide" type="button" value="Hide" /> class VisibilityExample { seen = { attr: { visible: true } }; onShowClicked = new IXEvent().Add((_, p) => p.seen.attr.visible = true); onHideClicked = new IXEvent().Add((_, p) => p.seen.attr.visible = false); } IX.CreateProxy(new VisibilityExample());
These are wired up to two buttons, hence the event handlers.
Here:

 {{ todo.text }}

 var app4 = new Vue({ el: '#app-4', data: { todos: [ { text: 'Learn JavaScript' }, { text: 'Learn Vue' }, { text: 'Build something awesome' } ] } })

 class ListExample { someList: string[] = ["Learn Javascript", "Learn IX", "Wear a mask!"]; } IX.CreateProxy(new ListExample());
Result:
Given that most lists come from a data source rather being hard coded:

 class ListExample { someList: string[] = []; } let listForm = IX.CreateProxy(new ListExample()); listForm.someList.push("Learn Javascript"); listForm.someList.push("Learn IX"); listForm.someList.push("Wear a mask!");
Or:
let listForm = IX.CreateProxy(new ListExample()); let items = ["Learn Javascript", "Learn IX", "Wear a mask!"]; listForm.someList = items;

{{ message }}
 <button v-on:click="reverseMessage">Reverse Message</button>
 var app5 = new Vue({ el: '#app-5', data: { message: 'Hello Vue.js!' }, methods: { reverseMessage: function () { this.message = this.message.split('').reverse().join('') } } })

 <button id="reverseMessage">Reverse Message</button>
 class ReverseExample { message = "Hello From Interacx!"; onReverseMessageClicked = new IXEvent() .Add((_, p: ReverseExample) => p.message = p.message.split('').reverse().join('')); } IX.CreateProxy(new ReverseExample());
Again, notice:
After clicking on the button:
The following example is similar to Vue's .number
attribute but the actual
implementation is much more general purpose.
Consider this UI:
And the markup (CSS and extraneous DIV's removed for readability):
X: <input id="x" class="fieldInputSmall" /> Y: <input id="y" class="fieldInputSmall" />
Here, we do not want the strings "1" and "2" to sum to "12", so we implement converters:
class InputForm { x: number; y: number; onXChanged = new IXEvent(); onYChanged = new IXEvent(); // Converters, so 1 + 2 != '12' onConvertX = x => Number(x); onConvertY = y => Number(y); Add = () => this.x + this.y; } class OutputForm { sum: number; }
And the events are wired up like this:
let inputForm = IX.CreateProxy(new InputForm()); let outputForm = IX.CreateProxy(new OutputForm()); inputForm.onXChanged.Add(() => outputForm.sum = inputForm.Add()); inputForm.onYChanged.Add(() => outputForm.sum = inputForm.Add());
Behind the scenes, the input box text is converted to a Number
with the
onConvertX
and onConvertY
converters, and the rest is handled by the standard
data binding of the properties for setting sum
to the values of x and y.
Also, notice how you can create classes as containers to sections of the HTML.
We could easily have put sum
in the InputForm
, but instead I wanted to
illustrate how to use a separate container object, OutputForm
, as a way of
compartmentalizing the properties into separate containers.
We've already seen in the examples above binding between the view and the model. One of Vue's examples is direct update of one element based on the realtime update of an input element. While I can't think of a real-life example where one would need this, real-time updating, say of a filter criteria, is definitely useful, so we'll start with the Vue example:

{{ message }}
 <input v-model="message">
 var app6 = new Vue({ el: '#app-6', data: { message: 'Hello Vue!' } })
This is already easily accomplished with events:
First Name:
/p> <input id="input2"/> class BidirectionalExample { message2: string = ""; input2: string = ""; onInput2KeyUp = new IXEvent().Add((v, p: BidirectionalExample) => p.message2 = v); } IX.CreateProxy(new BidirectionalExample());
However, to make this more "Vue-ish", we can do:
class BidirectionalExample { message2 = new IXBinder({ input2: null }); input2: string = "";
Here we are specifying the "from" element as the key and any "value" of the key. What displeases me about this is that the key cannot be implemented a way that leverages Intellisense and type checking. The best we can do is runtime checking that the "from" binder element exists. So at this point, specifying the "bind from" property as a string almost makes sense. Instead, I opted for this implementation:
class BidirectionalExample { input2: string = ""; message2 = new IXBinder({ bindFrom: IX.nameof(() => this.input2) }); onInput2KeyUp = new IXEvent().Add((v, p: BidirectionalExample) => p.message2 = v); }
Which is somewhat lame as well but has the advantage of supporting Intellisense, albeit the property your binding to must already be declared previously. Behind the scenes, we have a very simple implementation to extract the name, by converting the function into a string:
public static nameof<TResult>(name: () => TResult): string { let ret = IX.RightOf(name.toString(), "."); return ret; }
Sadly that's seems to be the best we can do with Javascript unless you want to use something like ts-nameof, which I do not because ts-nameof is a compile-time transformation, and I do not want the developer that uses this library to have to go through hoops to get this to work.
We can also bind the same source to different targets:

 <input id="input2" /> class BidirectionalExample { input2: string = ""; message2 = new IXBinder({ bindFrom: IX.nameof(() => this.input2) }); message3 = new IXBinder({ bindFrom: IX.nameof(() => this.input2) }); }
As well as different sources to the same target:

 <input id="input2" /> <input id="input3" /> class BidirectionalExample { input2: string = ""; input3: string = ""; message2 = new IXBinder({ bindFrom: IX.nameof(() => this.input2) }); message3 = new IXBinder({ bindFrom: IX.nameof(() => this.input2) }) .Add({ bindFrom: IX.nameof(() => this.input3) }); }
Here, typing in the left edit box sets messages 2 & 3:
Typing in the right edit box sets message 3:
But as I said earlier, doing this kind of binding really doesn't make much sense. Typically, a transformation does something "useful", so we have this contrived example:
class BidirectionalExample { input2: string = ""; input3: string = ""; message2 = new IXBinder({ bindFrom: IX.nameof(() => this.input2) }); message3 = new IXBinder({ bindFrom: IX.nameof(() => this.input2) }).Add({ bindFrom: IX.nameof(() => this.input3), op: v => v.split('').reverse().join('') }); // onInput2KeyUp = new IXEvent().Add((v, p: BidirectionalExample) => p.message2 = v); }
and thus we get:
Vue has an elegant demonstration of binding the checkbox state to the label:
<input type="checkbox" id="checkbox" v-model="checked"> {{ checked }}
Given:
<input id="checkbox" type="checkbox" />
We continue to follow the pattern of using TypeScript classes and properties:
class CheckboxExample { checkbox: boolean = false; ckLabel = new IXBinder({ bindFrom: IX.nameof(() => this.checkbox) }); } IX.CreateProxy(new CheckboxExample());
or, because the nameof syntax above is clumsy and we don't have a real "nameof" operator in Javascript by the time the code is transpiled, so we have to revert to string literals in this case:
class CheckboxExample { checkbox: boolean = false; ckLabel = new IXBinder({ bindFrom: "checkbox" }); } IX.CreateProxy(new CheckboxExample());
Or we can wire up the click event:
class CheckboxExample { checkbox: boolean = false; ckLabel: string = "Unchecked"; onCheckboxClicked = new IXEvent().Add( (_, p: CheckboxExample) => p.ckLabel = p.checkbox ? "Checked" : "Unchecked"); } IX.CreateProxy(new CheckboxExample());
<input type="checkbox" id="jack" value="Jack" v-model="checkedNames"> Jack <input type="checkbox" id="john" value="John" v-model="checkedNames"> John <input type="checkbox" id="mike" value="Mike" v-model="checkedNames"> Mike
 Checked names: {{ checkedNames }}
Note that the span text includes the array brackets:
Given:
<input id="jane" value="Jane" type="checkbox" /> Jane <input id="mary" value="Mary" type="checkbox" /> Mary <input id="grace" value="Grace" type="checkbox" /> Grace

We implement the container object with a special array binding (because the properties don't exist in the class, I can't use the "nameof" kludge, so the ID"s are, sadly, string literals.) Of course, in the next example, I do have properties for the checkboxes, but I still used the string literals!
class CheckboxListExample { ckNames = IXBinder.AsArray(items => items.join(", ")) .Add({ bindFrom: "jane", attribute: "value" }) .Add({ bindFrom: "mary", attribute: "value" }) .Add({ bindFrom: "grace", attribute: "value" }); } IX.CreateProxy(new CheckboxListExample());
And we get:
Notice that we did not initialize properties with the checkbox state! If we do this:
class CheckboxListExample { jane: boolean = false; mary: boolean = false; grace: boolean = false; ckNames = IXBinder.AsArray(items => items.join(", ")) .Add({ bindFrom: "jane", attribute: "value" }) .Add({ bindFrom: "mary", attribute: "value" }) .Add({ bindFrom: "grace", attribute: "value" }); } let ckListExample = IX.CreateProxy(new CheckboxListExample());
We can programmatically set the check state:
ckListExample.jane = true; ckListExample.mary = true;
and we see:
So one thing we note here is that the property referring to the HTML element is associated with the checked attribute of the element. That is an artifact of how IX is coded, and actually points out an interesting problem -- the object property maps to only one attribute of the DOM element, and IX is very opinionated as to what that DOM element should be, depending on what the element is!
This example binds the value of the radio button to the span:
<input type="radio" id="one" value="One" v-model="picked"> One
 <input type="radio" id="two" value="Two" v-model="picked"> Two
 Picked: {{ picked }}
Given:
<input id="marc" value="Marc" type="radio" name="group1" /> Marc <input id="chris" value="Chris" type="radio" name="group1" /> Chris

We add two binders, whichever one is clicked becomes the one whose binder event is fired. Again, note in this example I'm not using the "nameof" syntax because in this case the property doesn't exist!
class RadioExample { rbPicked = new IXBinder({ bindFrom: "marc", attribute: "value" }) .Add({ bindFrom: "chris", attribute: "value" }); } IX.CreateProxy(new RadioExample());
thus updating to the current radio button:
And if we want to programmatically set the radio button state, define the properties:
class RadioExample { marc: boolean = false; chris: boolean = false; rbPicked = new IXBinder({ bindFrom: "marc", attribute: "value" }) .Add({ bindFrom: "chris", attribute: "value" }); }
and after proxy initialization, set the state:
let rbExample = IX.CreateProxy(new RadioExample()); rbExample.chris = true;
<select v-model="selected"> <option disabled value="">Please select one</option> <option>A</option> <option>B</option> <option>C</option> </select> Selected: {{ selected }}
Given:
<select id="selector"> <option selected disabled>Please select one</option> <option value="1">A</option> <option value="2">B</option> <option value="3">C</option> </select>

and the container class:
class ComboboxExample { selector = new IXSelector(); selection: string = ""; onSelectorChanged = new IXEvent().Add((_, p) => p.selection = `Selected: ${p.selector.text} with value ${p.selector.value}`); } IX.CreateProxy(new ComboboxExample());
We then see:
and after selection:
Note that the selector property, implemented as an IXSelector
, contains two
properties, text
and value
, for the selected item.
We can also initialize the options programmatically. Given:
<select id="selector2"></select>

and:
class ComboboxInitializationExample { selector2 = new IXSelector().Add({ selected:true, disabled: true, text: "Please select one" }) .Add({ value: 12, text: "AAA" }) .Add({ value: 23, text: "BBB" }) .Add({ value: 34, text: "CCC" }); selection2: string = ""; onSelector2Changed = new IXEvent().Add((_, p) => p.selection2 = `Selected: ${p.selector2.text} with value ${p.selector2.value}`); } let cb = IX.CreateProxy(new ComboboxInitializationExample());
We see:
And programmatically set the selection with the option value:
cb.selector2.value = 34;
or with the option text:
cb.selector2.text = "AAA";
Or add to the list of options:
cb.selector2.options.push({ text: "DDD", value: 45 });
Or remove the option item:
cb.selector2.options.pop();
Or change an option's text and value:
cb.selector2.options[2] = { text: "bbb", value: 999 };
IX requires that class properties match the DOM element ID and that event handlers have specific signatures.
Notice:
The event name uses the property name with the first letter capitalized,
so firstName
becomes FirstName
.
on[Prop]KeyUp - realtime key up events.
on[Prop]Changed - element loses focus.
This event applies to text, radio and checkbox inputs and "select" (combobox) elements.
onConvert[Prop] - if defined, executes the function before the KeyUp and Changed events fire.
on[Prop]Hover - if defined and the property has the signature:
{ attr: { title: "" } };
This will set the element's title on mouse hover.
We can easily test the behavior of IX by directly inspecting DOM elements after model changes, and vice versa. And I prefer to use the phrase "integration test" rather than "unit test" because we're not testing low level functions in the IX library -- we are testing the integration of the DOM elements with object properties.
The HTML for the test cases is simple:

We have an ordered list for the test results, and a div
in which we place the
HTML required for each test.
The tests actually use IX to manipulate the test results, and direct DOM manipulation to simulate UI changes. The runner looks like this:
let testForm = IX.CreateProxy(new TestResults()); let idx = 0; tests.forEach(test => { // Get just the name of the test function. let testName = IX.LeftOf(test.testFnc.toString(), "("); // The ID will start with a lowercase letter let id = IX.LowerCaseFirstChar(testName); // Push a template to OL, where the template value is simply the test name, to the test results ordered list. testForm.tests.push(IXTemplate.Create({ value: testName, id: id })); // Create an object with the id and proxy it. This will match the id of the template we just created, so we can set its style. // This is a great example of not actually needing to create a class, which is really // just a dictionary. let obj = {}; // The classList here allows us to set the test LI element style class to indicate success/failure of the test. obj[id] = { classList: new IXClassList() }; let testProxy = IX.CreateProxy(obj); // Create the DOM needed for the test. this.CreateTestDom(testForm, test.dom); // Run the test and indicate the result. this.RunTest(testForm, idx, testProxy, test, id); // Remove the DOM needed for the test. this.RemoveTestDom(testForm); ++idx; });
And we have these three helper functions:
CreateTestDom(testForm: TestResults, testDom: string): void { testForm.testDom = testDom || ""; } RemoveTestDom(testForm: TestResults, ): void { testForm.testDom = ""; } RunTest(testForm: TestResults, idx:number, testProxy: object, test, id: string): void { let passFail = "pass"; try { test.testFnc(test.obj, id); } catch (err) { passFail = "fail"; let template = testForm.tests[idx]; template.SetValue(`${template.value} => ${err}`); } testProxy[id].classList.Add(passFail); }
A passing test is indicated in green, a failing test in red, along with the error message.
.pass { color: green; } .fail { color: red; }
So for example, we can test that failure are handled:
static ShouldFail(obj): void { throw "Failed!!!"; }
And we see:
The tests are defined as an array of objects the specify:
Like this:
let tests = [ // { testFnc: IntegrationTests.ShouldFail }, { testFnc: IntegrationTests.InputElementSetOnInitializationTest, obj: { inputTest: "Test" }, dom: "<input id='inputTest'/>" }, { testFnc: IntegrationTests.InputElementSetOnAssignmentTest, obj: { inputTest: "" }, dom: "<input id='inputTest'/>" }, { testFnc: IntegrationTests.InputSetsPropertyTest, obj: { inputTest: "" }, dom: "<input id='inputTest'/>" }, { testFnc: IntegrationTests.ListInitializedTest, obj: { list: ["A", "B", "C"] }, dom: "

" }, { testFnc: IntegrationTests.ReplaceInitializedTest, obj: { list: ["A", "B", "C"] }, dom: "

" }, { testFnc: IntegrationTests.ChangeListItemTest, obj: { list: ["A", "B", "C"] }, dom: "

" }, { testFnc: IntegrationTests.PushListItemTest, obj: { list: ["A", "B", "C"] }, dom: "

" }, { testFnc: IntegrationTests.PopListItemTest, obj: { list: ["A", "B", "C"] }, dom: "

" }, { testFnc: IntegrationTests.ButtonClickTest, obj: { clicked: false, onButtonClicked : new IXEvent().Add((_, p) => p.clicked = true)}, dom: "<button id='button'></button>" }, { testFnc: IntegrationTests.OnlyOneClickEventTest, obj: { clicked: 0, onButtonClicked: new IXEvent().Add((_, p) => p.clicked += 1) }, dom: "<button id='button'></button>" }, { testFnc: IntegrationTests.CheckboxClickTest, obj: { clicked: false, checkbox: false, onCheckboxClicked: new IXEvent().Add((_, p) => p.clicked = p.checkbox)}, dom: "<input id='checkbox' type='checkbox'/>" }, { testFnc: IntegrationTests.RadioButtonClickTest, obj: { clicked: false, checkbox: false, onRadioClicked: new IXEvent().Add((_, p) => p.clicked = p.radio) }, dom: "<input id='radio' type='radio'/>" }, { testFnc: IntegrationTests.ConvertTest, obj: { inputTest: "", onConvertInputTest: s => `${s} Converted!` }, dom: "<input id='inputTest'/>" }, { testFnc: IntegrationTests.VisibleAttributeTest, obj: { inputTest: { attr: { visible: true } } }, dom: "<input id='inputTest'/>" }, { testFnc: IntegrationTests.ControlBindingTest, obj: { input: "123", output: new IXBinder({ bindFrom: "input" }) }, dom: "<input id='input'>
" }, { testFnc: IntegrationTests.ControlBindingWithOperationTest, obj: { input: "123", output: new IXBinder({ bindFrom: "input", op: v => `${v} Operated!` }) }, dom: "<input id='input'>
" }, { testFnc: IntegrationTests.ControlBindingAssignmentTest, obj: { input: "", output: new IXBinder({ bindFrom: "input" }) }, dom: "<input id='input'>
" }, ];
I'm not going to bore you with the actual tests, but I'll point out that in some cases we have to simulate clicking and therefore the test must dispatch the appropriate event, for example:
static ButtonClickTest(obj): void { let test = IX.CreateProxy(obj); let el = document.getElementById("button") as HTMLButtonElement; el.dispatchEvent(new Event('click')); IXAssert.Equal(test.clicked, true); }
This class simply wraps the if
statement into a one-liner, as I rather
dislike if
statements for assertions.
export class IXAssert { public static Equal(got: any, expected: any): void { let b = got == expected; if (!b) { throw `Expected ${expected}, got ${got}`; } } public static IsTrue(b: boolean): void { if (!b) { throw "Not true"; } } }
You should realize from looking at how the tests are implemented that you
don't need actual TypeScript classes, you just need an object, like obj: { inputTest: "Test" }
- after all,
a TypeScript class is a purely development-side construct used for type checking
and Intellisense by the IDE. Even a JavaScript class is really just
"syntactical sugar of JavaScript's existing prototype-based inheritance." (JavaScript
classes)
TypeScript is fantastic for ensuring type safety when writing code. However, by the time the code has been transpiled to JavasScript, all that type information that the IDE is using is of course lost. This is unfortunate because there are times in the code that I really wish I had type information. There are some workarounds, such as for native types and classes:
let a = 1; let b = "foo"; let c = true; let d = []; let e = new SomeClass(); [a, b, c, d, e].forEach(q => console.log(q.constructor.name)); let listForm = IX.CreateProxy(new ListExample());
You get:
This is useful. However, given this class:
class SomeClass { a: number; b: string; }
What that gets transpiled to is simply an empty object {}
.
So, Object.keys(new SomeClass())
return an empty array []
.
To determine properties of the class, the properties must be initialized, and
they can even be initialized to null or undefined:
class SomeClass { a: number = null; b: string = undefined; }
Hence the constraint in IX that you must initialize properties, otherwise the wire-up cannot be made between the class property and the element with the ID of the property name.
public static CreateProxy<T>(container: T): T { let proxy = new Proxy(container, IX.uiHandler); IX.CreatePropertyHandlers(container, proxy); IX.CreateButtonHandlers(container, proxy); IX.CreateBinders(container, proxy); IX.Initialize(container, proxy); return proxy; }
Besides instantiating the proxy, we can see that several other steps are required:
This code is intended to handle attributes, class lists, and event wireups:
private static CreatePropertyHandlers<T>(container: T, proxy: T) { Object.keys(container).forEach(k => { let el = document.getElementById(k); let anonEl = el as any; // If element exists and we haven't assigned a proxy to the container's field, then wire up the events. if (el && !anonEl._proxy) { anonEl._proxy = this; if (container[k].attr) { // Proxy the attributes of the container so we can intercept the setter for attributes console.log(`Creating proxy for attr ${k}`); container[k].attr = IXAttributeProxy.Create(k, container[k].attr); } if (container[k].classList) { console.log(`Creating proxy for classList ${k}`); container[k].classList = IXClassListProxy.Create(k, container[k].classList); } let idName = IX.UpperCaseFirstChar(el.id); // TODO: create a dictionary to handle this. let changedEvent = `on${idName}Changed`; let hoverEvent = `on${idName}Hover`; let keyUpEvent = `on${idName}KeyUp`; if (container[hoverEvent]) { IX.WireUpEventHandler(el, container, proxy, null, "mouseover", hoverEvent); } // Change event is always wired up so we set the container's value when the UI element value changes. switch (el.nodeName) { case "SELECT": case "INPUT": // TODO: If this is a button type, then what? IX.WireUpEventHandler(el, container, proxy, "value", "change", changedEvent); break; } if (container[keyUpEvent]) { switch (el.nodeName) { case "INPUT": // TODO: If this is a button type, then what? IX.WireUpEventHandler(el, container, proxy, "value", "keyup", keyUpEvent); break; } } } }); }
It should be obvious that this a very incomplete implementation sufficient for the proof-of-concept.
private static WireUpEventHandler<T>(el: HTMLElement, container: T, proxy: T, propertyName: string, eventName: string, handlerName: string) { el.addEventListener(eventName, ev => { let el = ev.srcElement as HTMLElement; let oldVal = undefined; let newVal = undefined; let propName = undefined; let handler = container[handlerName]; switch (el.nodeName) { case "SELECT": let elSelector = el as HTMLSelectElement; let selector = container[el.id] as IXSelector; selector.value = elSelector.value; selector.text = elSelector.options[elSelector.selectedIndex].text; break; default: // buttons are click events, not change properties. if (propertyName) { oldVal = container[el.id]; newVal = el[propertyName]; propName = el.id; } let ucPropName = IX.UpperCaseFirstChar(propName ?? ""); if (propertyName) { newVal = IX.CustomConverter(proxy, ucPropName, newVal); container[propName] = newVal; } break; } if (handler) { (handler as IXEvent).Invoke(newVal, proxy, oldVal); } }); }
Again, enough to implement the proof-of-concept.
private static CustomConverter<T>(container: T, ucPropName: string, newVal: string): any { let converter = `onConvert${ucPropName}`; if (container[converter]) { newVal = container[converter](newVal); } return newVal; }
Buttons (and button-like things, like checkboxes and radio buttons) have their own unique requirements:
private static CreateButtonHandlers<T>(container: T, proxy: T) { Object.keys(container).forEach(k => { if (k.startsWith("on") && k.endsWith("Clicked")) { let elName = IX.LeftOf(IX.LowerCaseFirstChar(k.substring(2)), "Clicked"); let el = document.getElementById(elName); let anonEl = el as any; if (el) { if (!anonEl._proxy) { anonEl._proxy = this; } if (!anonEl._clickEventWiredUp) { anonEl._clickEventWiredUp = true; switch (el.nodeName) { case "BUTTON": IX.WireUpEventHandler(el, container, proxy, null, "click", k); break; case "INPUT": // sort of not necessary to test type but a good idea, especially for checkboxes and radio buttons. let typeAttr = el.getAttribute("type"); if (typeAttr == "checkbox" || typeAttr == "radio") { IX.WireUpEventHandler(el, container, proxy, "checked", "click", k); } else { IX.WireUpEventHandler(el, container, proxy, null, "click", k); } break; } } } } }); }
Binders handle real-time events such as keyup as well as when an input element loses focus. Adding to the complexity is the concept that a binder might be associated with multiple checkboxes or radio buttons and bind the list of currently selected items.
// We assume binders are created on input elements. Probably not a great assumption. private static CreateBinders<T>(container: T, proxy: T): void { Object.keys(container).forEach(k => { if (container[k].binders?.length ?? 0 > 0) { let binderContainer = container[k] as IXBinder; let binders = binderContainer.binders as IXBind[]; if (binderContainer.asArray) { binders.forEach(b => { let elName = b.bindFrom; let el = document.getElementById(elName); let typeAttr = el.getAttribute("type"); // Limited support at the moment. if (typeAttr == "checkbox" || typeAttr == "radio") { el.addEventListener("click", ev => { let values: string[] = []; // Get all the items currently checked binders.forEach(binderItem => { let boundElement = (document.getElementById(binderItem.bindFrom) as HTMLInputElement); let checked = boundElement.checked; if (checked) { values.push(boundElement[binderItem.attribute]); } }); let ret = binderContainer.arrayOp(values); proxy[k] = ret; }); } }); } else { binders.forEach(b => { let elName = b.bindFrom; let el = document.getElementById(elName); console.log(`Binding receiver ${k} to sender ${elName}`); let typeAttr = el.getAttribute("type"); if (typeAttr == "checkbox" || typeAttr == "radio") { el.addEventListener("click", ev => { let boundAttr = b.attribute ?? "checked"; let v = String((ev.currentTarget as HTMLInputElement)[boundAttr]); v = b.op === undefined ? v : b.op(v); proxy[k] = v; }); } else { // Realtime typing el.addEventListener("keyup", ev => { let v = (ev.currentTarget as HTMLInputElement).value; // proxy[elName] = v; --- why? v = b.op === undefined ? v : b.op(v); proxy[k] = v; }); // Lost focus, or called when value is set programmatically in the proxy setter. el.addEventListener("changed", ev => { let v = (ev.currentTarget as HTMLInputElement).value; v = b.op === undefined ? v : b.op(v); proxy[k] = v; }); } }); } } }); }
This last function started off simple and ended up being more complicated as it needs to handle not just native non-array types, but also arrays and DOM elements like "select":
private static Initialize<T>(container: T, proxy: T): void { Object.keys(container).forEach(k => { let name = container[k].constructor?.name; switch (name) { case "String": case "Number": case "Boolean": case "BigInt": proxy[k] = container[k]; // Force the proxy to handle the initial value. break; case "Array": // Special handling of arrays that have an initial set of elements so we don't duplicate the elements. // At this point, container[k] IS the proxy (IXArrayProxy) so we have the issue that the proxy is set to // the array but the UI elements haven't been created. If we just do: // proxy[k] = container[k]; // This will initialize the UI list but push duplicates of the into the array. // So, for arrays, we want to create the array proxy as an empty array during initialization instead, // then set the empty proxy to the container, then the container to the proxy. if (container[k]._id != k) { let newProxy = IXArrayProxy.Create(k, container); newProxy[k] = container[k]; container[k] = newProxy; } break; case "IXSelector": // Similar to "Array" above, except we are proxying the IXSelector.options array, not the container itself. if (container[k]._id != k) { // Set the element that this IXSelector manages so we know what to do when value and text are assigned. container[k]._element = document.getElementById(k); let selector = container[k] as IXSelector; // Proxy the options array so we can initialize it as well as push/pop. if (selector.options.length > 0) { let newProxy = IXArrayProxy.Create(k, container); newProxy[k] = selector.options; selector.options = newProxy; } } break; } }); }
Arrays are something of nightmare. Array functions, such as push
, pop
,
and length
, are actually vectored through the proxy's getter (as would any other
function on a proxy'd object):
static ArrayChangeHandler = { get: function (obj, prop, receiver) { // return true for this special property, so we know that we're dealing with a ProxyArray object. if (prop == "_isProxy") { return true; } // Setup for push and pop, preserve state when the setter is called. // Very kludgy but I don't know of any other way to do this. if (prop == "push") { receiver._push = true; } if (prop == "pop") { receiver._pop = true; } if (prop == "length") { return obj[receiver._id].length; } return obj[prop]; },
Notice that a flag is being set as to whether the operation about to be
performed, in the setter, is a push
or pop
! This
information is used to determine how the array should be adjusted in the setter
when the length is changed. Popping an array element, it turns out, merely
changes the length of the array:
set: function (obj, prop, val, receiver) { // we're looking for this pattern: // "setting 0 for someList with value Learn Javascript" let id = receiver._id; console.log('setting ' + prop + ' for ' + id + ' with value ' + val); if (prop == "length" && receiver._pop) { let el = document.getElementById(id); let len = obj[id].length; for (let i = val; i < len; i++) { el.childNodes[val].remove(); obj[id].pop(); } receiver._pop = false; } else {
If the setter is not a pop, then it is either updating an existing item in the array:
// We might be setting an array item, or we might be doing a push, in either case "prop" is the index value. if (!isNaN(prop)) { let el = document.getElementById(id); switch (el.nodeName) { // TODO: "UL"! case "OL": { let n = Number(prop); let ol = el as HTMLOListElement; if (n < ol.childNodes.length && !receiver._push) { // We are replacing a node // innerText or innerHTML? (ol.childNodes[n] as HTMLLIElement).innerText = val;
or we are adding an item to the array:
} else { let li = document.createElement("li") as HTMLLIElement; let v = val; if (val._isTemplate) { let t = val as IXTemplate; // innerText or innerHTML? li.innerText = t.value; li.id = t.id; v = t.value; } else { li.innerText = val; } (el as HTMLOListElement).append(li); obj[id].push(v); receiver._push = false; }
Lastly, the array property might be being set to a whole new array:
} else if (val.constructor.name == "Array") { let el = document.getElementById(id); // TODO: remove all child elements? switch (el.nodeName) { case "SELECT": (val as IXOption[]).forEach(v => { let opt = document.createElement("option") as HTMLOptionElement; opt.innerText = v.text; opt.value = String(v.value); opt.disabled = v.disabled; opt.selected = v.selected; (el as HTMLSelectElement).append(opt); }); break; case "OL": case "UL": (val as []).forEach(v => { let li = document.createElement("li") as HTMLLIElement; li.innerText = v; (el as HTMLOListElement).append(li); }); break; } }
IXEvent
(and it's helper, IXSubscriber
) are wrappers to implement multicast
events:
export class IXSubscriber { subscriber: (obj: any, oldVal: string, newVal: string) => void; constructor(subscriber: (obj: any, oldVal: string, newVal: string) => void) { this.subscriber = subscriber; } Invoke(obj: any, oldVal: string, newVal: string): void { this.subscriber(obj, oldVal, newVal); } } import { IXSubscriber } from "./IXSubscriber" export class IXEvent { subscribers: IXSubscriber[] = []; // We probably only usually want the new value, followed by the container, folloed by the old value. Add(subscriber: (newVal: string, obj: any, oldVal: string) => void) : IXEvent { this.subscribers.push(new IXSubscriber(subscriber)); return this; } Invoke(newVal: string, obj: any, oldVal: string): void { this.subscribers.forEach(s => s.Invoke(newVal, obj, oldVal)); } }
This class is my lame attempt to provide for templates.
export class IXTemplate { public _isTemplate: boolean = true; public value?: string; public id?: string; public static Create(t: any): IXTemplate { let template = new IXTemplate(); template.value = t.value; template.id = t.id; return template; } public SetValue(val: string): void { document.getElementById(this.id).innerText = val; } }
This is dubious at best because it sets innerText
rather than innerHtml
, and I'm
really not sure of the usefulness of it except that it's used in the integration
tests.
Having come to the top of the other end of the U, I'm now reconsidering the entire implementation.
By the time I was implementing an example of the comobox, and using this construct:
selector = new IXSelector();
It occurred to me, hmm, maybe all the class properties that map to DOM elements should be wrapped by an actual "helper." This would allow the wrapper to directly implement the DOM attributes and properties of an element which effectively eliminates the need for a Proxy! It would also eliminate the "make up my own syntax", like:
.Add({ bindFrom: "jane", attribute: "value" })
or:
mySpan = { attr: { title: "" } };
The "initialization" process would merely iterate over the class properties (they still have to exist) and initialize the property with the DOM ID, thus the specific implementation can manipulate the DOM directly rather than through a proxy. And I'd still have Intellisense because the wrapper implemention would have the DOM attributes and properties I'd be touching.
Of course, this involves a ton of work - ideally the DOM for each element would have to be re-implemented, and that's just for native HTML elements. What about third party UI libraries? One approach would be to do this a piece at a time, as needed in the web apps that I'd be writing with this framework. Furthermore, I could derive such wrapper classes from the HTML.... interfaces that already exist, for example, HTMLButtonElement. That would work, but I also really like the beauty of:
nc.name = "Hello World!";
There's no reason the implementation cannot support both by inspecting the constructor name, as I'm already doing in the initialization process. This would therefore leave it up to the developer:
This would also eliminate any arcane syntax that the developer would have to learn, as the wrapper would implement the HTML... interfaces that already exist and with which one would already be familiar.
Also, all that krufty code to handle array push, pop, and assignment would be a lot cleaner!
Therefore I can only conclude that after having gone through the U process, I now know what the future will look like, at least for the framework that I want to use!
------------------------------------
Vue has a fun SVG example that I thought would be a decent proof of concept of doing something a bit more challenging than working with basic DOM elements.


First name
Last name
Email
Requested delivery date
Wrapping paper color
How many bows on the package?


Landing Page
Special Projects
This story is part of a series of specially designed stories that represents some of the best journalism The Post has to offer. Check out the rest of the special projects here.
8/23/2018
The sounds of acoustic jazz guitar will fill the air in Athens Uncorked once again during welcome weekend.
John Horne, who has been playing guitar since the early ‘80s, will perform at the wine bar at 14 Station St. on Aug. 25 at 8 p.m.
Horne is an adjunct professor at Ohio University and teaches guitar methods classes, as well as multiple jazz courses. He also has his own private teaching practice and has taught at multiple schools.
Sarah Mitchell, an Athens resident, has seen Horne perform multiple times.
“Hearing him at Athens Uncorked is great,” Mitchell said. “We can listen to great music and carry on a conversation with friends at the same time.”
Emily Harger | FILE
Athens Uncorked co-owners and siblings Nate Hayes, left, and Kathy Blake, right, talk together in the dining area of Athens Uncorked, a wine bar located on Station Street.
Mitchell’s sons both took lessons with Horne when they were younger.
“(Horne) plays a lot of well-known, popular songs,” Mitchell said. “I always look forward to when he plays ‘The Girl from Ipanema.’ ”
Nate Hayes, owner of Athens Uncorked, said Horne was one of the first musicians he brought in to perform three years ago. Horne has played at the wine bar almost every month since Hayes approached him about performing.
“We weren’t sure if we wanted to have live music because it can be a little loud,” Hayes said.
 Horne’s style of mellow acoustic fit in well right off the bat, Hayes said.
“His music really seemed to fit into the atmosphere of a wine bar,” Hayes said. “It’s very laid-back, very comfortable without being bland.”
Horne describes his style as laid-back, with a warm and rich sound.
“His music is very atmospheric,” Mitchell said.
“It’s like a warm blanket of groovy songs, I want (my music) to be like the heat is on in the room in the winter time.”John Horne
Horne tends to choose popular songs that people know but sticks to the instrumental versions. He does sing at some venues, but he said it doesn’t happen often.
“If you play something that’s a little more laid-back people think, ‘Oh this is a more interesting groove,’ ” Horne said.
But he doesn’t want to take away from the dining experience; Horne wants to provide background music. Most of his performances are solo guitar, so people can still get food or something to drink without having music in their face, Horne said.
“I try to blend in and add to the surroundings,” Horne said. “Filling up some space in the room but not just with noise.”
Horne wants people to be pleasantly surprised if they come in to get food or wine and see him playing. He doesn’t want people to want to go somewhere else because the live music is too loud.
“(Athens Uncorked) does tend to attract more of the adult crowd in Athens, so I want the music to be kind of in the background,” Horne said.
When playing music, Horne doesn’t want to be at the center of attention like a lot of musicians do, he said. He wants to simply help provide an atmosphere.
“It’s like a warm blanket of groovy songs,” Horne said while laughing. “I want (my music) to be like the heat is on in the room in the winter time.”
Landing Page
This story is part of a series of specially designed stories that represents some of the best journalism The Post has to offer. Check out the rest of the special projects here.


This is part of the JWT tutorial from https://auth0.com/blog/authentication-in-golang/. I have formatted this app to give a simple demonstration for a blog post on JWT. There are a few URLs that you can visit:
If you want to see more JWT details, look through some of the commit history of this repo or build your own app!


|
gtsam
4.0.0
gtsam
|
Wrapper class to manage ISAM in a nonlinear context.
Public Member Functions | |
Standard Constructors | |
| NonlinearISAM (int reorderInterval=1, const GaussianFactorGraph::Eliminate &eliminationFunction=GaussianFactorGraph::EliminationTraitsType::DefaultEliminate) | |
| Periodically reorder and relinearize. More... | |
Standard Interface | |
| Values | estimate () const |
| Return the current solution estimate. | |
| Matrix | marginalCovariance (Key key) const |
| find the marginal covariance for a single variable | |
| const GaussianISAM & | bayesTree () const |
| access the underlying bayes tree | |
| const Values & | getLinearizationPoint () const |
| Return the current linearization point. | |
| const NonlinearFactorGraph & | getFactorsUnsafe () const |
| get underlying nonlinear graph | |
| int | reorderInterval () const |
| get counters More... | |
| int | reorderCounter () const |
| TODO: comment. | |
| void | print (const std::string &s="", const KeyFormatter &keyFormatter=DefaultKeyFormatter) const |
| prints out all contents of the system | |
| void | printStats () const |
| prints out clique statistics | |
| void | saveGraph (const std::string &s, const KeyFormatter &keyFormatter=DefaultKeyFormatter) const |
| saves the Tree to a text file in GraphViz format | |
Advanced Interface | |
| void | update (const NonlinearFactorGraph &newFactors, const Values &initialValues) |
| Add new factors along with their initial linearization points. | |
| void | reorder_relinearize () |
| Relinearization and reordering of variables. | |
Protected Attributes | |
| gtsam::GaussianISAM | isam_ |
| The internal iSAM object. | |
| Values | linPoint_ |
| The current linearization point. | |
| NonlinearFactorGraph | factors_ |
| The original factors, used when relinearizing. | |
| int | reorderInterval_ |
| The reordering interval and counter. | |
| int | reorderCounter_ |
| GaussianFactorGraph::Eliminate | eliminationFunction_ |
| The elimination function. | |
|
inline |
Periodically reorder and relinearize.
| reorderInterval | is the number of updates between reorderings, 0 never reorders (and is dangerous for memory consumption) 1 (default) reorders every time, in worse case is batch every update typical values are 50 or 100 |
|
inline |
get counters
TODO: comment


This is an example of using the Pie chart that's customised to such a degree that it appears as more a progress meter or a "percent complete" style meter.
The segmentation effect is achieved by using the draw
event. This
event is used by code that draws lines from outside the Donut chart back to
the center, drawing them every 10-15 degrees. In this custom code the RGraph
API function RGraph.degrees2Radians()
is used to do the necessary conversion
and the RGraph.path2()
function is used to handle the pathing of these lines.
The text in the center of the Donut chart is added by using the RGraph
drawing API - the Text
object. On each frame of the
roundRobin()
effect the object is updated with the new percentage and it then
gets redrawn. This gives you an effect of the text constantly changing.
<script src="RGraph.common.core.js"></script> <script src="RGraph.drawing.text.js"></script> <script src="RGraph.pie.js"></script>Put this where you want the chart to show up:
<canvas id="cvs" width="350" height="350"> [No canvas support] </canvas>This is the code that generates the chart:
<script> var pie = new RGraph.Pie({ id: 'cvs', data: [v = 70,100 - v], options: { variant: 'donut', variantDonutWidth: 50, colors: ['red', 'white'], colorsStroke: 'transparent', shadow: false } }).roundRobin({frames: 60}).on('draw', function (obj) { var width = 5; for (var i=0; i<360; i+=10) { RGraph.path2( obj.context, 'b a % % % % % false l % % c f black', obj.centerx, obj.centery, obj.radius + 2, RGraph.degrees2Radians(i - (width / 2)), RGraph.degrees2Radians(i + (width / 2)), obj.centerx, obj.centery ); } if (text) { text.text = parseInt(v * obj.get('effect.roundrobin.multiplier')) + '%'; } }); var text = new RGraph.Drawing.Text({ id: 'cvs', x: pie.centerx, y: pie.centery, text: pie.data[0] + '%', options: { font: 'Arial', size: 64, halign: 'center', 'valign': 'center', colors: ['#aaa'] } }).draw(); </script>


The Timeline has a function to add multiple custom time markers which can be dragged by the user.
In this example, you can add new markers by double-clicking the timeline below and delete the markers by double-clicking it.


Try out our Premium Member services: Virtual Legal Assistant, Query Alert Service and an ad-free experience. Free for one month and pay only if you like it.
IN THE HIGH COURT OF KERALA AT ERNAKULAM PRESENT: THE HONOURABLE MR.JUSTICE K.VINOD CHANDRAN THURSDAY, THE 15TH DAY OF JUNE 2017/25TH JYAISHTA, 1939 WP(C).No. 7822 of 2017 (C) --------------------------- PETITIONER: ----------- ABHILASH V. S/O VASUDEVAN, AGED 37 YEARS, VETTUVILA, PERINAD, KOLLAM-691601. BY ADV. SRI.R.KISHORE (KALLUMTHAZHAM) RESPONDENTS: ------------ 1. KERALA STATE POLLUTION CONTROL BOARD OFFICE OF THE STATE POLLUTION CONTROL BOARD, TRIVANDRUM-695001, REPRESENTED BY MEMBER SECRETARY. 2. CHIEF ENVIRONMENTAL ENGINEER KERALA STATE POLLUTION CONTROL BOARD, TRIVANDRUM-695001. 3. ENVIRONMENTAL ENGINEER KERALA POLLUTION CONTROL BOARD, DISTRICT OFFICE, KRISHNA LEELA TOWERS, KADAPPAKADA, KOLLAM-691008. 4. SECRETARY KOLLAM CORPORATION, KOLLAM, PIN:689001. R4 BY ADV. SRI.M.K.CHANDRA MOHAN DAS,SC,KOLLAM MPT R1 TO R3 BY SRI.  EXHIBIT P2: THE TRUE COPY OF THE CONSENT ISSUED BY THE 3RD RESPONDENT NUMBERED AS PCB/KO/ICO/G/713/2016 DATED 23.5.2016 IS PRODUCED. EXHIBIT P3: THE TRUE COPY OF THE LICENSE ISSUED BY THE 4TH RESPONDENT IS PRODUCED. EXHIBIT P4: THE TRUE COPY OF THE INTENTION TO REVOKE NOTICE ISSUED BY THE 3RD RESONDENT IS PRODUCED. EXHIBIT P5: THE TRUE COPY OF THE REVOCATION ORDER ISSUED BY THE 3RD RESPONDENT IS PRODUCED. EXHIBIT P6: THE TRUE COPY OF THE REPLY STATEMENT AND PHOTOGRAPH SUBMITTED BY THE PETITIONER DATED 11.1.2017 AND THE RECEIPT OF THE STATEMENT BY THE 3RD RESPONDENT IS PRODUCED.  EXHIBIT P8: THE TRUE COPY OF THE JUDGMENT IN WPC 25447/2016 DATED 26TH DAY OF SEPTEMBER 2016 IS PRODUCED. RESPONDENT(S)' EXHIBITS ----------------------- NIL //TRUE COPY// P.A. TO JUDGE JJJ K. VINOD CHANDRAN, J. ------------------------------------------ W.P.(C) No. 7822 of 2017 (C) ------------------------------------------ Dated: 15th June, 2017 J U D G M E N T
The petitioner is aggrieved with Exts.P5 and P7 orders passed by the Kerala State Pollution Control Board.
2. The petitioner carries on an Engineering work shop with a valid consent issued by the Pollution Control Board. Ext.P4 notice was issued to the petitioner threatening revocation of the consent, for reason of adequate enclosure not being provided for the work shed and the sign board not being provided near the main entrance of the unit. No reply was submitted by the petitioner, in which circumstance Ext.P5 order was passed revoking the consent. Ext.P7 is only a consequential order.
W.P.(C) No. 7822/2017 -2-
3. Ext.P5 order is an appeallable order before the Appellate Authority constituted under the Air (Prevention and Control of Pollution) Act, 1981. In such circumstance, the petitioner would have to avail such remedy before the Appellate Authority and the jurisdiction under Article 226 of the Constitution of India is declined.
The writ petition is closed, leaving open the liberty of the petitioner to approach the Appellate Authority. No Costs.
Sd/-
K.VINOD CHANDRAN, JUDGE jjj 15/6/17


Password Generator
new and copy
digits:
characters to include:
presets:
lower and capital alphabet, 0-9, symbols
lower and capital alphabet, 0-9
lower and capital alphabet
capital alphabet
lower alphabet


CREATE TEXT SEARCH TEMPLATE
Section: SQL Commands (7)Updated: 2012-08-14
Index Return to Main Contents
NAME
CREATE TEXT SEARCH TEMPLATE - define a new text search templateSYNOPSIS
CREATE TEXT SEARCH TEMPLATE name ( [ INIT = init_function , ] LEXIZE = lexize_function )
DESCRIPTION
CREATE TEXT SEARCH TEMPLATE creates a new text search template. Text search templates define the functions that implement text search dictionaries. A template is not useful by itself, but must be instantiated as a dictionary to be used. The dictionary typically specifies parameters to be given to the template functions.
If a schema name is given then the text search template is created in the specified schema. Otherwise it is created in the current schema.
You must be a superuser to use CREATE TEXT SEARCH TEMPLATE. This restriction is made because an erroneous text search template definition could confuse or even crash the server. The reason for separating templates from dictionaries is that a template encapsulates the ``unsafe'' aspects of defining a dictionary. The parameters that can be set when defining a dictionary are safe for unprivileged users to set, and so creating a dictionary need not be a privileged operation.
Refer to in the documentation for further information.
PARAMETERS
- name
- The name of the text search template to be created. The name can be schema-qualified.
- init_function
- The name of the init function for the template.
- lexize_function
- The name of the lexize function for the template.
The function names can be schema-qualified if necessary. Argument types are not given, since the argument list for each type of function is predetermined. The lexize function is required, but the init function is optional.
The arguments can appear in any order, not only the one shown above.
COMPATIBILITY
There is no CREATE TEXT SEARCH TEMPLATE statement in the SQL standard.
SEE ALSO
ALTER TEXT SEARCH TEMPLATE [alter_text_search_template(7)], DROP TEXT SEARCH TEMPLATE [drop_text_search_template(7)]
Index
This document was created by man2html, using the manual pages.
Time: 05:34:14 GMT, December 24, 2015


the and influenza :â€". are virus viral viruses that for can cells {background (). genetic Influenza margin have {border-style with The al.. human px;} this #ffffff;} from cell evolution evolutionary not other Virol. host different proteins MHC This also been cells. immune new their which Viral respiratory between bottlenecks cause infection response transmission antigenic due during immunity important more px; strains they through {font-family Immunol. diversity epithelial font-size humans population relationship severe since species strain these two usually viruses. will (â€"). Genetic T-cell cells, cytotoxic double; has high infect mechanisms mutation one pandemic patterns protein replication species. variability variants very :e. Host IFITM Nat Opin RNA Rev adaptation against border-color border-width both bottleneck epidemics genome genomes geographic humans. increase infected lower major may molecular mortality mutations potential receptor related solid; specific studies subtypes surface than upper well {font-style {font-weight ./j.coviro... Antigenic Curr Health Med. Microbiol. Mol Nature PLoS Sci. Trends about adaptive animal another antagonistic antibodies antiviral associated bold but change changes courier; defense dendritic drifts em; evolution. evolved help individuals initial inside its like many natural only prediction present production pt;} response. same some successful symptoms take though three tract type understanding vaccine was where


u-root embodies four different projects.
Go versions of many standard Linux tools, such as ls, cp, or shutdown. See cmds/core for most of these.
A way to compile many Go programs into a single binary with busybox mode.
A way to create initramfs (an archive of files) to use with Linux kernels.
Go bootloaders that use kexec
to boot Linux or multiboot kernels such as ESXi, Xen, or tboot. They are meant to be used with LinuxBoot. With that, parsers for GRUB config files or syslinux config files are to make transition to LinuxBoot easier.

More instructions can be found in the repo’s README.md.
We use GitHub Pull Requests for code review. Pull requests must receive one approval and pass CI before being merged.
It’s to reflect a universal root, you can mount on every local and get a userland portable (it’s a goal).
The Go gopher was designed by Renee French. The u-root logo design is licensed under the Creative Commons 3.0 Attributions license.
The logo is communicating several things:
u-root has several flavors: firmware and as a root file system
the gopher at the bottom is a firmware u-root; that gopher brings the machine up, hence the wrench. Its work is also done, so it is resting.
the other gophers can make more copies of u-root; hence the u-root logo on their chest.
the highest gopher is showing how u-root is a good root file system for a VM.
the U itself is a stylized tree, evocative of roots.


SD Card Capture
You can name and capture an image to the SD card. The file will be stored on the SD card until you manually delete it. Input a file name and submit the form.
You can name and capture an image to the SD card. The file will be stored on the SD card until you manually delete it. Input a file name and submit the form.


I have college computer science experience as well as self-taught concepts in web dev and computer science. I am expanding my knowledge with math and algorithms. I look forward to hearing from you.
ResumeKeyframe animations, transitions, etc. CSS is pretty cool.
Can't wait for version 4.
Started with ES5 and am starting to get the hang of ES6 and functional paradigms.
Beginner's understanding of Node and Express. Currently building apps with these technologies.
Currently learning React and will be rewriting the front-end of Check Yo Self in it and Material UI.
One of the oldest and most powerful web frameworks to date. Learning currently to catch up with the team.
The biggest community open source site on the web. Currently mastering its features.
Learning about environment variables and hosting web projects on the platform.
My favorite templating language. Excellent with Node and Mongo.
Learning the basics and adding a framework for working with Mongo, Mongoose.
Angular is still an important front-end framework. Currently learning it to take advantage of its MVC capabilities.
I am excited to learn and build innovative products. Expanding on my knowledge of working in a production environment currently and hoping to provide value to a front-end team.
Email for phone number.
© 2016


Timexe test page
Short term timer test:
Time expression syntax test cases:
Timer test cases
Test of deferred timer"
Not fired
List of active timers:


{{date}}
Exchange rate date
Name
Char code
Nominal
Value
{{currency.exchangeRateDate}}
{{currency.name}}
{{currency.charCode}}
{{currency.nominal}}
{{currency.value}}


Welcome to my Personal biography site
"Hard worker, Discipline, Humble person"
My self
Gallery
My Hobby
Contact me
My Personal some Photo gallery:


NIMBioS Workshop
RStudio In the Cloud
EC2 Launch Tutorial
Day 1
High Performance Computing with R
Phylogenetic clustering example from HPC R exercises
Day 2
A Hasty Overview of pbdR, with an Application to Matrix Exponentiation
Day 3
Introduction to Rcpp
Rcpp example scripts


Loved Project
People have loved some of my projects.The most two loved project is "Commerce FM" and "Flask & React Boilerplate". People have engaged in my codes in GITHUB by forking, giving starts, and creating an issue.
"Commerce FM" is an application which can be used to create single or multi-vendor e-commerce application. Backend was done using Python, Django, Django Rest Framework, and Flask. Similarly, frontend was done using ReactJS, Redux, and Webpack. For building, running, and managing all the networks and applications, this project has used Docker.
On the other hand, "Flask & React boilerplate" is a small application with the setup of Flask as a backend and ReactJS as a frontend library. We can clone the project and start coding directly as the structure has already been developed.


Police: Windows shattered at Crown Heights Yeshiva
by Lucy YangCROWN HEIGHTS, Brooklyn (WABC) -- Police are looking for the person who shattered the windows of a Yeshiva in Brooklyn.
Many people in the Jewish community say the vandalism is the latest in a string of incidents. Thankfully no one was injured, but many in Crown Heights are left upset over the broken windows.
Officials say the incident happened shortly after 8 p.m. Friday. They say someone smashed two ground-level windows at the Bais Rivkah Lefferts Yeshiva, located on the corner of Lefferts Ave and Brooklyn Ave.
The Yeshiva is a girls' school for the Hasidic community, and every day there are many students coming and going. No girls were inside the religious school at the time of the broken windows.
Devorah Halberstam's son, Ari was murdered on the Brooklyn Bridge in an act of terrorism in 1994. His mother told Eyewitness News that these crimes cannot be ignored.
Halberstam explained that while the pain of losing a child never goes away, it is important to understand why someone would do this in the first place.
Police are currently not treating this as a bias incident.


| Hits by Day |
|---|
| Day | Hits | Files | Cached | Pageviews | Sessions | KB sent | |||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| 1 | 1604 | 5.24% | 1387 | 5.04% | 126 | 12.73% | 946 | 5.04% | 189 | 10.22% | 20460 |
| 2 | 1614 | 5.27% | 1473 | 5.35% | 27 | 2.73% | 1023 | 5.45% | 144 | 7.79% | 20134 |
| 3 | 1608 | 5.25% | 1490 | 5.41% | 8 | 0.81% | 936 | 4.99% | 117 | 6.33% | 21062 |
| 4 | 1536 | 5.02% | 1421 | 5.16% | 27 | 2.73% | 1002 | 5.34% | 102 | 5.52% | 20495 |
| 5 | 1622 | 5.30% | 1494 | 5.43% | 33 | 3.33% | 984 | 5.24% | 76 | 4.11% | 21879 |
| 6 | 1603 | 5.24% | 1443 | 5.24% | 67 | 6.77% | 953 | 5.08% | 106 | 5.73% | 22180 |
| 7 | 1575 | 5.14% | 1449 | 5.26% | 49 | 4.95% | 966 | 5.15% | 101 | 5.46% | 19859 |
| 8 | 1621 | 5.29% | 1487 | 5.40% | 12 | 1.21% | 1186 | 6.32% | 85 | 4.60% | 25912 |
| 9 | 1824 | 5.96% | 1697 | 6.17% | 40 | 4.04% | 1037 | 5.53% | 102 | 5.52% | 28775 |
| 10 | 1574 | 5.14% | 1425 | 5.18% | 0 | 0.00% | 1106 | 5.89% | 82 | 4.43% | 31987 |
| 11 | 1757 | 5.74% | 1621 | 5.89% | 4 | 0.40% | 1241 | 6.61% | 116 | 6.27% | 28369 |
| 12 | 1941 | 6.34% | 1729 | 6.28% | 116 | 11.72% | 1053 | 5.61% | 117 | 6.33% | 24182 |
| 13 | 2809 | 9.18% | 2406 | 8.74% | 218 | 22.02% | 1503 | 8.01% | 102 | 5.52% | 40231 |
| 14 | 2170 | 7.09% | 1960 | 7.12% | 4 | 0.40% | 1563 | 8.33% | 94 | 5.08% | 30740 |
| 15 | 2699 | 8.82% | 2415 | 8.77% | 109 | 11.01% | 1576 | 8.40% | 157 | 8.49% | 42884 |
| 16 | 2724 | 8.90% | 2372 | 8.62% | 150 | 15.15% | 1488 | 7.93% | 140 | 7.57% | 45858 |
| 17 | 333 | 1.09% | 257 | 0.93% | 0 | 0.00% | 203 | 1.08% | 19 | 1.03% | 4454 |
| Total | 30614 | 100.00% | 27526 | 100.00% | 990 | 100.00% | 18766 | 100.00% | 1849 | 100.00% | 449437 |
| Average | 1800 | 5.88% | 1619 | 5.88% | 58 | 5.86% | 1103 | 5.88% | 108 | 5.84% | 26439 |
|


Our intimate, all-veranda ships offer a wide variety of staterooms for your selection. From Veranda Staterooms to the abundance of extra perks and amenities in our spacious Explorer Suites, there’s no finer way to travel. And whichever stateroom you choose, you will find it beautifully designed in the understated elegance for which Helios is known.
Beyond our renowned hospitality, it is the ships themselves that uniquely define the Helios Experience. Welcoming far fewer guests than ships of similar size, each hosts a variety of stunning public spaces from grand to intimate, and dedicated venues for fitness, enrichment, gaming and more.
An unmatched roster of inclusive amenities and services ensures your every want has already been considered, from fine wines, champagne and premium spirits to pre-paid gratuities, unlimited Wi-Fi and 24-hour room service.


The Winslow Boy **1/2
rated G Sony Pictures Classics starring Nigel Hawthorne, Jeremy Northam, Rebecca Pidgeon, Gemma Jones, Guy Edwards, Matthew Pidgeon, Colin Stinton based on the play by Terence Rattigan written and directed by David Mamet
Playwright/filmmaker David Mamet is truly a master of the literary arts. To call him accomplished would be an understatement, for Mamet, after scripting 23 movies(as well as numerous other plays), is beyond accomplishment. The man has brought us projects varying from "Glengarry Glen Ross" to "The Edge". Mamet also crafted last year's brilliant mystery "The Spanish Prisoner". But, as we all know, sometimes the masters have their disasters.
David Mamet's latest, "The Winslow Boy", is no disaster, but it is far from perfect. The G-rated period piece is based on Terence Rattigan's play about a court case involving a boy who is accused of stealing a five-shilling postal order. I am unfamiliar with the source material, but Mamet seems to have some trouble structuring the story into an engrossing film.
Ronnie Winslow(Guy Edwards), the film's title character, is a 14-year-old boy who arrives home from his school bearing an expulsion notice which tells of his theft. He lives in a large home in London with his father, Arthur(Nigel Hawthorne), his mother, Grace(Gemma Jones), his brother, Dickie(Matthew Pidgeon) and his sister(Rebecca Pidgeon, Mamet's wife) who is about to be married.
Ronnie is afraid to show the notice to his father, but eventually he is forced to. Arthur's reaction, however, is entirely unexpected. He asks Ronnie to swear to him that he did not commit this crime, and when Ronnie does, Arthur vows that he will "let right be done." He hires the distinguished Sir Robert Morton(Jeremy Northam) as an attorney, and they take their case as far as they can.
The case of "The Winslow Boy" is criticized by reporters from the start. They say that the Winslows are going overboard, fighting the legal system so viciously, but Arthur just proclaims that right must be done.
I have to admit that I love the message of the film; that in order to find justice, you must push the system. But it is here that the film stumbles messily. We never get inside the courtroom, and we view the case as outsiders. Instead of focusing on the trial itself, Mamet focuses on the emotions of the characters, as they ponder whether or not to drop the case altogether. While the characters are developed rather nicely, they are simply not as interesting as the trial itself. Therefore, "The Winslow Boy" is a meandering character drama instead of an exciting courtroom thriller.
There is still much to admire about "The Winslow Boy". The acting is top-notch, with Hawthorne, Northam, and R. Pidgeon standing out. David Mamet accomplishes an interesting feat by making a G-rated feature that has as much pizazz as many R-rated films. Mamet's previous film, "The Spanish Prisoner", was a PG-rated thriller that offered much more than any R-rated thriller of last year. David Mamet may very well be the antidote to all the unnecessary on-screen violence. "The Winslow Boy" is an intriguing project, but one that only a master can do wrong.
a review by Akiva Gottlieb, The Teenage Movie Critic<EMAIL_ADDRESS>http://www.angelfire.com/mo/film watch me on TBS' "Dinner And A Movie" May 21, 8:05pm EST
The review above was posted to the
rec.arts.movies.reviews newsgroup (de.rec.film.kritiken for German reviews).
The Internet Movie Database accepts no responsibility for the contents of the
review and has no editorial control. Unless stated otherwise, the copyright
belongs to the author.
Please direct comments/criticisms of the review to relevant newsgroups.
Broken URLs inthe reviews are the responsibility of the author.
The formatting of the review is likely to differ from the original due
to ASCII to HTML conversion.
Related links: index of all rec.arts.movies.reviews reviews


This is the beginning of my website home page.
It will eventually contain a list of links to all my blocks.


--- title: Visited Links category: Hidden order: 701 ---
The visited check mark shows next to results you've already visited. Your browser indicates which links you've already gone to so we're not tracking you!


Lamentations
1
1 Jerusalem was once full of people,
but now it is completely deserted.
Once it was a powerful nation,
but now it is alone, like a widow.
Once everyone in the world honored it like a king's daughter,
but now it is like a slave.
2 We in the city weep bitterly all during the nights,
with tears flowing down our cheeks.
We did not trust Yahweh to help us, and the people groups that we did trust failed to help us;
none of those people comfort us now.
All the people groups that were friends with us have betrayed us;
they are all now our enemies.
3 All of us, the people of Judah have become poor and have suffered greatly;
most of our people have gone to other lands as slaves.
They now live in other lands
and have no peace.
Our enemies captured us all;
there was no way for us to escape.
4 The roads to Mount Zion are empty
because no one comes here to celebrate the sacred festivals any longer.
No elders or leaders sit under the city gates to talk any more,
and Jerusalem's priests groan in sorrow.
The young women left in Jerusalem cry
because they are suffering greatly.
5 Our enemies are now masters of our city,
and they prosper.
Yahweh has punished us, the people of Jerusalem,
because of all the sins that we have committed.
Our enemies have taken all our children
and made them go to other countries.
6 Jerusalem was a beautiful city,
but it is not beautiful now.
The leaders of our city are like deer that are starving
because they can find no grass to eat.
They are very weak
and cannot run from our enemies.
7 We, the people of Jerusalem, are sad and have no more homes to live in;
we think about all the splendid things that once filled our city.
But now our enemies have captured the city,
and there is no one to help us.

Everyone who previously honored our city now despise it;
they are like people who strip a woman bare and then mock her.
Now we groan in the city;
we are like a woman without clothes who tries to cover herself with her hands.
9 It is as if our city has become filthy because we have sinned so greatly;
we did not think about how God would punish us.
We did not imagine how we would suffer;
there is no one to comfort us.
We all call out to God, "Yahweh, look at how we are suffering
because our enemies have defeated us!
10 Our enemies have taken away all our treasures,
all the valuable things that we owned.
We have seen soldiers from other nations, men who do not worship you, Yahweh, enter our sacred temple,
where you had said no foreigner must go."
11 We groan in the city
while we search for food;
we have given our most valuable things
to get food to eat to gain some strength.
We say, "Yahweh, look at us;
see how our enemies despise us!"
12 You people who pass by,
you do not seem to care at all about what has happened to us.
Look around and see
that there are no other people who are suffering as we are.
Yahweh has caused us to suffer
because he was extremely angry with us.
13 It is as though he sent a fire from heaven
that burned in our bones;
it is as though he has placed a trap to entangle our feet,
and has prevented us from walking any further.
He has abandoned us;
we are weak and alone every day, all during the day.
14 He turned the sins that we have committed into a heavy load for us to carry;
it is as though he tied them around our necks.
Previously we were strong,
but he has caused us to become weak.
He has allowed our enemies to capture us,
and we were not able to do anything to resist them.
15 The Lord looked at our mighty soldiers,
laughed at them, and threw them away.
He summoned a great army
to come and crush our strong young soldiers.
It is as though the Lord has trampled on us people of Judah
as people trample on grapes in a pit to make juice.
16 We weep because of all those things;
our eyes are filled with tears.
There is no one to comfort us;
those who could encourage us are far away.
Our enemies have conquered us,
so our children have nothing good to hope for.
17 We people of Jerusalem reach out our hands to get help,
but there is no one to comfort us.
Yahweh has decided concerning us descendants of Jacob
that the people in nearby nations will become our enemies;
so they consider that
Jerusalem has become disgusting to them.
18 But what Yahweh has done to us is fair,
because we have refused to obey what he told us to do.
You people everywhere, listen to us;
look and see that we are suffering greatly.
We had many sons and daughters,
but our enemies took them all and made them go to far off lands.
19 We pleaded with our allies, in whom we trusted, to help us,
but they all refused, like men refuse to help a prostitute they slept with.
Our priests and our leaders
have died from hunger in the city
while they were searching for food
to eat to remain alive.
20 Yahweh, see that we are suffering very much.
It is as though our inner organs are on fire.
We are sad in our inner beings
because we have rebelled against you.
Our enemies kill people in the streets with their swords;
at home it is like sheol, the world of the dead.
21 People heard us while we groaned,
but no one came to comfort us.
All our enemies know what happened to us;
they were all happy to hear about it.
Please do soon what you have promised,
when our enemies will suffer like we have suffered!
22 Yahweh, consent to look at all the evil deeds
that they have committed.
Punish them as you have punished us
for all the sins that we committed.
We say this to you because we suffer and groan very much,
and we faint in our inner beings.


"The Immutable Stack"--David Nolen Speaks at Gilt
The #gilttech team is super-excited to welcome David Nolen to 2 Park on August 27! David is one of ClojureScript’s main contributors, a developer at Cognitect, one of the developers behind the Brooklyn-based workshop Kitchen Table Coders, a musician, and a frequent speaker at conferences nationwide (he’ll be at GOTO Copenhagen and GOTO Aarhus). His topic for the night will be “The Immutable Stack”:
In the Clojure world, we have been quietly building an immutable stack. Immutablity not only eliminates incidentical complexity from client and server code, it also greatly simplifies reasoning about distributed state and thus coordination between the client and server. We’ll examine the various components of the immutable stack and see how these components can be adapted or constructed for other language runtimes.
You definitely want to attend this meetup!


Get in touch
Email
Phone
(000)000-0000
Address
123 Somewhere Rd. Over The Rainbow, Hawaii
(000)000-0000
123 Somewhere Rd. Over The Rainbow, Hawaii


|
|||||||||
| PREV CLASS NEXT CLASS | FRAMES NO FRAMES | ||||||||
| SUMMARY: NESTED | FIELD | CONSTR | METHOD | DETAIL: FIELD | CONSTR | METHOD |
java.lang.Object de.timroes.swipetodismiss.SwipeDismissList
public final class SwipeDismissList
A android.view.View.OnTouchListener
that makes the list items in a
ListView
dismissable. ListView
is given special treatment
because by default it handles touches for its list items... i.e. it's in
charge of drawing the pressed state (the list selector), handling list item
clicks, etc.
Read the README file for a detailed explanation on how to use this class.
| Nested Class Summary | |
|---|---|
static interface |
SwipeDismissList.OnDismissCallback
The callback interface used by SwipeDismissListViewTouchListener
to inform its client about a successful dismissal of one or more list
item positions. |
static class |
SwipeDismissList.SwipeDirection
Defines the direction in which the swipe to delete can be done. |
static class |
SwipeDismissList.Undoable
An implementation of this abstract class must be returned by the OnDismissCallback#onDismiss(android.widget.ListView, int) method,
if the user should be able to undo that dismiss. |
static class |
SwipeDismissList.UndoMode
Defines the mode a SwipeDismissList handles multiple undos. |
| Constructor Summary | |
|---|---|
SwipeDismissList(AbsListView listView,
SwipeDismissList.OnDismissCallback callback)
Constructs a new swipe-to-dismiss touch listener for the given list view. |
|
SwipeDismissList(AbsListView listView,
SwipeDismissList.OnDismissCallback callback,
SwipeDismissList.UndoMode mode)
Constructs a new swipe-to-dismiss touch listener for the given list view. |
| Method Summary | |
|---|---|
void |
discardUndo()
Discard all stored undos and hide the undo popup dialog. |
boolean |
onTouch(View view,
MotionEvent motionEvent)
|
void |
setAutoHideDelay(int delay)
Sets the time in milliseconds after which the undo popup automatically disappears. |
void |
setRequireTouchBeforeDismiss(boolean require)
Sets whether another touch on the view is required before the popup counts down to dismiss. |
void |
setSwipeDirection(SwipeDismissList.SwipeDirection direction)
Sets the directions in which a list item can be swiped to delete. |
void |
setSwipeDisabled(boolean disabled)
Enable/disable swipe. |
void |
setUndoMultipleString(java.lang.String msg)
Sets the string shown in the undo popup, when SwipeDismissList.UndoMode is set to
SwipeDismissList.UndoMode.MULTI_UNDO or SwipeDismissList.UndoMode.COLLAPSED_UNDO and
multiple deletions has been stored for undo. |
void |
setUndoString(java.lang.String msg)
Sets the string shown in the undo popup. |
| Methods inherited from class java.lang.Object |
|---|
equals, getClass, hashCode, notify, notifyAll, toString, wait, wait, wait |
| Constructor Detail |
|---|
public SwipeDismissList(AbsListView listView, SwipeDismissList.OnDismissCallback callback)
listView
- The list view whose items should be dismissable.callback
- The callback to trigger when the user has indicated that
she would like to dismiss one or more list items.public SwipeDismissList(AbsListView listView, SwipeDismissList.OnDismissCallback callback, SwipeDismissList.UndoMode mode)
listView
- The list view whose items should be dismissable.callback
- The callback to trigger when the user has indicated that
she would like to dismiss one or more list items.mode
- The mode this list handles multiple undos.| Method Detail |
|---|
public void setAutoHideDelay(int delay)
delay
- Delay in milliseconds.public void setSwipeDirection(SwipeDismissList.SwipeDirection direction)
SwipeDismissList.SwipeDirection.BOTH
so that an item
can be swiped into both directions.
direction
- The direction to limit the swipe to.public void setUndoString(java.lang.String msg)
SwipeDismissList.Undoable
returned by the SwipeDismissList.OnDismissCallback
returns
null
from its SwipeDismissList.Undoable.getTitle()
method.
msg
- The string shown in the undo popup.public void setUndoMultipleString(java.lang.String msg)
SwipeDismissList.UndoMode
is set to
SwipeDismissList.UndoMode.MULTI_UNDO
or SwipeDismissList.UndoMode.COLLAPSED_UNDO
and
multiple deletions has been stored for undo. If this string contains
one %d
inside, this will be filled by the numbers of stored undos.
msg
- The string shown in the undo popup for multiple undos.public void setRequireTouchBeforeDismiss(boolean require)
require
- Whether a touch is required before starting the auto-dismiss timer.public void discardUndo()
public boolean onTouch(View view, MotionEvent motionEvent)
public void setSwipeDisabled(boolean disabled)
|
|||||||||
| PREV CLASS NEXT CLASS | FRAMES NO FRAMES | ||||||||
| SUMMARY: NESTED | FIELD | CONSTR | METHOD | DETAIL: FIELD | CONSTR | METHOD |


--- layout: post title: Altering "varargs" (add|remove|retain)All methods in Jaggregate published: 1 category: - Programming ---
Jaggregate, my Java-5-only Smalltalk-ish collections library, has collections that support the Java collections' notions of addAll()
, removeAll()
, and retainAll()
. For usability's sake, there are three overloads of each:
void addAll( jaggregate.Collection<? extends E> others ); void addAll( E... others ); void addAll( java.lang.Iterable<? extends E> others ); boolean removeAll( jaggregate.Collection<? extends E> others ); boolean removeAll( E... others ); boolean removeAll( java.lang.Iterable<? extends E> others ); boolean retainAll( jaggregate.Collection<? extends E> others ); boolean retainAll( E... others ); boolean retainAll( java.lang.Iterable<? extends E> others );
The "varargs" forms allow specification of a real array argument, or of a variable-length argument list:
OrderedCollection<Integer> primes = new OrderedCollection<Integer>(); primes.addAll( new Integer[] { 2, 3, 5, 7 } ); primes.addAll( 11, 13, 17, 19 );
I made a mistake in the specification of the "varargs" overloads. As written, they allow a zero-length argument list. At best, addAll()
just looks goofy:
primes.addAll(); // add all what? to where?
And removeAll()
and retainAll()
get downright confusing:
primes.removeAll(); // removes nothing primes.retainAll(); // removes everything
So, I decided to change the "varargs" overloads to:
void addAll( E newElement, E... moreNewElements ); boolean removeAll( E oldElement, E... moreOldElements ); boolean retainAll( E keeper, E... moreKeepers );
Now, zero-arg calls to the *All()
methods won't compile (hopefully there weren't any out there to begin with), and if you really mean to hand the methods zero args, you can still do so with an array type rather than a varargs list.


Single Row TextArea with Exceeded Characters Value State Message
Information message. This is a Link. Extra long text used as an information message. Extra long text used as an information message - 2. Extra long text used as an information message - 3.
Simple TextArea
This msg will not be displayed as no value-state is set.
TextArea with valueDisabled TextAreaReadonly TextAreaRequired TextAreaText Area: GrowingText Area: Growing with 8 initial rowsText Area: Growing up to 4Text Area: Growing with initial rows 4 and growing up to 12Text Area: growing with max length 20 characters Text Area: max length 20 characters Text Area: showExceededText with maxlengthText Area: showExceededText with maxlength '0'Text Area: change eventText Area: input eventGrowing: growing-max-lines="1" Growing: growing-max-lines="4" Growing: growing-max-lines="1" (compact) Growing: growing-max-lines="4" (compact) info textReadonly textarea with value state This should be in aria-label property of the text areaThis should not be in aria-label property of the text area


{% extends 'base.html' %} {% load static %} {% load crispy_forms_tags %} {% block content %} Home / Signup Already have an account? There are advances being made in science and technology everyday, and a good example of this is the Login Here Welcome to FashionAlley ! Please create account {% csrf_token %} {{form|crispy}} Sign up {% for message in messages %} {{message}} {% endfor %} {{form.errors}} Login {% endblock %}
Home / Signup
There are advances being made in science and technology everyday, and a good example of this is the
{{message}}


EPL: Lacazette Salvages Draw For Arsenal As Emery Feel More Pressure
by Donatus AnichukwuezeArsenal needed an Alexandre Lacazette stoppage-time goal to get a 2-2 draw at the end of an unconvincing performance against struggling Southampton.
Southampton appeared to be coasting to a first Premier League victory in eight games through a James Ward-Prowse goal on his 250th appearance for Southampton.
This was after Lacazette had equalized to cancel Danny Ing’s effort in the 8th minute to make it one all.
The Frenchman again grabbed a last-gasp leveller (90+6) that was met by underwhelming celebrations in the home end after their team had been second best for large periods as the pressure intensifies on boss Unai Emery.
Relegation-threatened Saints, who registered 21 shots on goal, should have wrapped the points up in injury time but substitute Moussa Djenepo wasted two huge opportunities leaving Ralph Hasenhuttl’s men without a win in the Premier League in their last eight matches.


0">
Error with form submission:
-1">You're attempting to send to an invalid destination address, please double check you've entered the correct address.
-1">You're attempting to send to an invalid transfer amount, please double check you've entered a valid number.
-1">You're attempting to send too few coins. Changelly requires at least {{formData.minTransferAmount | number:'1.0-8' }} {{formData.originCoin | uppercase}}
-1">You're attempting to send too many coins at once, our current limit is {{MAX_NAV_PER_TRADE | number:'1.0-8' }} NAV per trade. You're attempting to send {{formData.estConvToNav | number:'1.0-8' }} NAV.
-1">You're attempting a NAV to NAV anonymous transfer, please use NavTech wallet's built in anon transaction feature for this.
-1">There was an error fetching an ETA.
You are sending:
{{transferAmount | number:'1.0-8'}} {{originCoin | uppercase}} to {{destAddr}} in {{destCoin | uppercase}}
Est. Received:
~{{estConvFromNav | number:'1.0-8'}} {{destCoin | uppercase}}
Est. Fees:
~{{estimatedFees | number:'1.0-8'}} {{originCoin | uppercase}}
Est. Arrival: {{etaMin}} mins ~ {{etaMax}} mins


{% extends "basic.html" %} {% block include %} {% endblock %} {% block content %} Map of all logged plants Enter plant names separated with spaces to filter. Leave blank for no filter. {% for plant in searched %}{{ plant }}{% endfor %} {% endblock %}


Workshop on Beginner to Advanced Computer Vision Based Sensing
A 14 Day workshop which started from 8th of July 2018. Covered the basics of image analysis, with due emphasis on both theory and practical
Basic Electronics Workshop
3 Day event on Basic Electronics conducted from 25th March 2018 to get you started on the world of Electronics. There are tutorial and DIY sessions to give you hands-on experience. We covered all things from Soldering to common ICs
Make-a-thon 2k18
The test of your understanding in field of electronics. We challenged participants for one complete day to yield upto the problem statements we presented. The contestants were exceptionally creative and innovative. It was lot of fun on 29th March 2018


TWO HANDS Cast: Heath Ledger, Rose Byrne, Bryan Brown, David Field, Susie Porter, Tom Long, Tony Forrow, Mariel McClorey, Evan Sheaves, Steven Vidler Director: Gregor Jordan Screenplay: Gregor Jordan Reviewed by Luke Buckmaster
On the Buckmaster scale of 0 stars (bomb), to 5 stars (a masterpiece): 4 stars
The mid-to-late 90's obsession with urban crime fables has resulted in some sensational efforts, most of which aspire to the success - artistically and commercially - of a Quentin Tarantino movie. I never expected that the Australian film industry, famous for its quirky and simple-minded films, would enter the realm of these violent and often darkly humorous pieces of in-your-face entertainment. The film in question is 'Two Hands,' an engaging and often intense picture that is fresh, lively and different to the norm. Debut writer/director Gregor Jordan finds a pulsating energy in his production elements - ranging from the cast's diverse appeal to the film's bright cinematography, it's clear that this one is out to impress. Impress it does, and in large abundance. 'Two Hands' is a breath of fresh air for the Australian film industry; a fun adrenaline rush that will probably linger in your memory for some time.
Rising Aussie star Heath Ledger plays Jimmy, who works in Kings Cross, Sydney, as a street promoter for a strip club. Hoping to improve his salary and his work, Jimmy accepts a job from neighborhood goon Pando (Bryan Brown). He is given $10,000 in an envelope and an address to deliver it to, but, as the plot unfolds, the job goes drastically wrong, and Jimmy is being chased all over town by Pando and his goons. Still, he makes sure that he has enough time to pursue love-interest Kate (Rose Byrne), a friendly art student who enjoys taking photos. Also involved in the story are two homeless kids, played by Mariel McClorey and Evan Sheaves, who have small but integral parts, and serve as tools in which to question audience morality.
It seems inevitable that titles like 'Pulp Fiction' and 'Lock, Stock and Two Smoking Barrels' will be mentioned in a review of this film, for their obvious familiarities in genre filmmaking. 'Two Hands,' like these films and many more, is distinctive in its own way. For starters, the film has an obvious Australian touch to it - the dialogue is laid back and relaxed, the settings are not glamorous or appealing. The screenplay doesn't delve into stories and debates like 'Pulp Fiction', and its editing doesn't produce the clockwork pacing that made 'Lock, Stock and Two Smoking Barrels' fast and furious. There is something different here, a kind of new texture to the genre. 'Two Hands' doesn't constantly try to win audiences over, it simply follows its narrative to the end without glancing back to notice whether we were still watching.
Chances are, you will be. 'Two Hands' is a bold drama wrapped around a comedic lesson of morals, wrapped around a simple, even slightly messy thriller. Gregor Jordan captivates his audience time and time again, reaching a good mixture of amusing gags and fast action. What he doesn't create is a film that is engaging as a whole, but rather one that has plenty of memorable and amusing scenes and subplots. It's bound to be a crowd pleasing movie, and contains enough jags and recurring plot elements to keep the viewers who don't find the central plot interesting still amused.
Heath Ledger struts his stuff so confidently as the title character that there is absolutely no doubt that we will be seeing him again in the future (in fact, in his next film, he plays Mel Gibson's son). I'm not sure whether he channeled that energy into a good performance, though it's certainly an entertaining one. Bryan Brown also fares very well as the married, and quite amusing tough guy Pando. Others are slightly less impressive, like Rose Byrne, who is solid but her part is considerably underdeveloped, probably as a result of the film's ninety-two minute running time. Come to think of it, that's an odd choice for a running time in a film of this nature - the story unfolds fairly slowly (although its never boring), and even then, there's some unnecessary bits like its narration by Jimmy's dead brother. 'Pulp Fiction,' which I've refused to mention too much in this review, was almost double its length. Perhaps 'Two Hands' could have benefited from a little more meat.
But there's still so much here to like. Jordan's direction is multi-layered with impressive production elements; the cinematography, the music, the camera shots and the editing all give the film a truly cinematic feel. The jokes - I wished there was more of them - are funny and memorable.  Sometimes you don't get everything, but sometimes, you just enjoy what you've got.
Read more of my reviews at In Film Australia http://infilmau.iah.net
The review above was posted to the
rec.arts.movies.reviews newsgroup (de.rec.film.kritiken for German reviews).
The Internet Movie Database accepts no responsibility for the contents of the
review and has no editorial control. Unless stated otherwise, the copyright
belongs to the author.
Please direct comments/criticisms of the review to relevant newsgroups.
Broken URLs inthe reviews are the responsibility of the author.
The formatting of the review is likely to differ from the original due
to ASCII to HTML conversion.
Related links: index of all rec.arts.movies.reviews reviews


Every September, my town throws a weekend-long festival celebrating the town's history. It's apparently one of the five largest gatherings in Minnesota, or something. Thousands of slightly overweight tourists descend upon the town, pretty much shutting everything down. This all takes place at the beginning of the school year, and it's always the first 'event' that high schoolers use as an excuse to drink. It was during this weekend that I got drunk for the first time.
Two friends of mine, who I will refer to as 'Nick' and 'Paul' had invited me to 'get fucked up' with them, and I enthusiastically said yes. Having heard of the evils of underage drinking for years, I was understandably curious about it. I told my parents that I would be staying the night at Paul's house, and took off.
After obtaining alcohol, we wandered through the crowds of people downtown for a while, and then made our way towards a friend's ('Tim') apartment. We threw an Aphex Twin album on the stereo and took out our alcohol.  I took a timid swig of Limon and quickly washed it down with some Sprite.
It didn't taste that awful! My friends congratulated me on my first sip of alcohol, and each had some too. They passed the bottle back to me, and I took several more shots. I would estimate that I had roughly four shots of the Limon.
I wasn't feeling any effects from the alcohol, asides from a pleasantly warm belly. We sat around talking for a few minutes, and Tim asked us if we wanted a beer. I took one, and drank it in a little under two minutes. Paul turned on a television and began playing Goldeneye. I walked over to join him, and sat down in an antique weelchair that served was used as a chair, I guess. At this exact moment, I began to feel the alcohol.
As I sank into the chair, I felt as though I was sinking or falling into it. I turned my head around, and was surprised to find that it felt incredibly heavy. My ears were filled with a buzzing sound, and I felt pleasantly happy. I talked with Paul for several minutes, and found that everything he said was unbelievably funny. After a few more minutes of Goldeneye, we decided to go outside and mingle with the crowds of revelers.
As I got out of the wheelchair, I felt really undsteady, and I was sure that I was about to fall over. We walked out of the apartment and down the two flights of stairs to the street. I was now feeling really excited, and I couldn't wait to see what the night had in store for us. I'm usually fairly quiet, but tonight I was keeping up a steady stream of wisecracks and conversation.
Paul and I spilled out onto the street, and realized that Nick and Tim had decided to bring the wheelchair with them. We laughed long and hard at this, and decided that it would be fun to trick tourists into thinking that Tim was a cripple. We took turns pushing him around, and then got bored. We walked a block to a coffee shop and decided to chill there for a while. By this point, I was feeling really euphoric, as well as slightly off balance. We walked into the coffeeshop and sat down at a table. A girl I knew from school waved at me, and I gave a confused wave back. I was sure that I knew her, but I couldn't remember her name. I began running threw a list of every girl's name that I could think of, and eventually remembered that she was named 'Anna'.
We spent around half an hour in the coffee shop, at which point we met up with a few other friends. Nick had decided that tonight he had to try to find some marijuana, and when we saw two notorious local stoners, he offered to trade some of our alcohol for some of his pot. they obliged, and handed us a bag of what turned out to be really shitty weed. We walked back to the apartment and staggered up the stairs. When we found the apartment door locked, we weren't exactly sure what to do. I had the brilliant idea to hoist one of the stoners up on our shoulders, and have him wiggle into an open window above the door. Paul and I stood facing the wall, and the stoner jumped up on our shoulders, disappearing into the apartment.
The Stoner's head appeared in the window, and he informed us that he couldn't find the door. He jumped out of the window, as Paul and I realized that we had lifted him into the wrong apartment. Fortunately no one was home. We walked down the hall and let ourselves into Tim's apartment. I helped myself to another shot of Bacardi, and we just sat around and chilled for a while.
It was now getting pretty late, and we decided that it was time to head over to Paul's house. He and I left the group, and walked the few blocks to his house. I found it difficult to walk in a straight line, and was overjoyed, as this meant I must be pretty damn drunk.
We let ourselves in, and snuck past his sleeping parents. I immedately fell asleep, and didn't wake up for around ten hours. When I woke up the next morning, I was pleased to find that I wasn't the least bit hungover. We talked about the night's events, and decided that we'd have to do it again soon. I went home, feeling incredibly proud of myself. It was though I had passed a major event in my life, like getting a driver's license or graduating from high school.
That was around a year and a half ago. Since than I have had enjoyable experiences with both alcohol and marijuana. I've also learned my limits after a couple of bad experiences. I'm proud to say that I haven't turned into a complete fiend, like my DARE officer told me I would. I was recently named a National Merit Scholarship semi-finalist, and am beginning to seriously look at colleges. I feel lucky to have had such an enjoyable first-time mind altering experience, and I look forward to having many more nights like the one I described.
Experience Reports are the writings and opinions of the individual authors who submit them.
Some of the activities described are dangerous and/or illegal and none are recommended by Erowid.