javascript - How to create two-way interactive web UI elements? -

i don't seem know right keywords search for, i'll describe i'm trying do, simple example, , hope possible techniques/technologies/libraries/tutorials.

one or more people can view web page containing color chooser (eg: jqueryui's color picker, 3 sliders , changing color box). when first access page see selected color (global , shared among users). if user changes color moving slider, (1) new value passed server (which control physical light), , (2) color pickers other viewers of web page changed well.

so 2 key dynamics are: 1 - browser sends new values server whenever user changes them on screen (eg: moves slider) in order update global value common users. , 2 - whenever global values changes send browsers of current viewers. (if 2 users try change same control @ same time, not care 1 "wins", system remains stable).

i suspect involves connecting javascript ui library jqueryui ajax or web socket functionality, i'm not yet finding references or tutorials or libraries this.

if matters, initial target raspberry pi server being accessed on wifi phone browsers, , controlling patterns displayed on "pixel" led lights through multiple interactive ui elements; color picker described above simplified example.

and without immediate interaction having conventional form , submit button sends values server, , refresh button redraws page server's current values. want users able see physical lights change move slider (albeit inherent small delay). , i'd other viewers able start making changes current color (pattern/params) without needing manually refresh page first.

i attended microsoft web dev camp , talking signal r sounds alot trying do. if want can make demo lab had signal r available through dropbox