Skip to content

Commit b22d2c2

Browse files
ardyespardyesp
committed
Added a sample for Web Browser
1 parent 9e09170 commit b22d2c2

2 files changed

Lines changed: 299 additions & 0 deletions

File tree

‎src/Browser/readme.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Using the Library in a Web Browser
2+
3+
LSEG provides a browser build for the LD Library which is available in the NodeJS package **@lsegroup/data**. The JavaScript *datalib.js* file for browser can be found at *@lsegroup\data\build\browser*. This module is not separately deployed on the CDN. A web page can reference this script and import all the provided modules, as shown in the accompanying sample.
4+
5+
6+
### Limitations
7+
Using the library within a web browser has following limitations:
8+
1. The Library can only be used with a *Desktop Session*, on a machine running *LSEG Workspace*. The CORS restrictions do not allow *Platform Session* connections.
9+
2. The browser does not have access to the local filesystem. Due to this, library is unable to read the API proxy port and tries to connect default port 9000 on the localhost. A workaround is to either manually provide the Proxy port or as the provided example shows, try a range of ports.

‎src/Browser/test.html‎

Lines changed: 290 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,290 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>LD Library for TypeScript</title>
5+
<script src="datalib.js"></script>
6+
<style>
7+
#log {
8+
padding-top: 5px;
9+
font-family: Lucida Console;
10+
font-size: small;
11+
height: 600px;
12+
overflow-y: auto;
13+
background-color: #EEEEEE;
14+
}
15+
16+
table, th, td {
17+
border: 1px solid black;
18+
border-collapse: collapse;
19+
padding: 2px;
20+
}
21+
</style>
22+
</head>
23+
<body>
24+
25+
<h1>LD Library for TypeScript</h1>
26+
<ul>
27+
<li>Copy the datalib.js from Node package into local directory</li>
28+
<li>Launch LSEG Workspace, type in your AppKey and click Connect</li>
29+
</ul>
30+
31+
<div>
32+
App Key: <input id="APPKEY" type="text" placeholder="App Key for Workspace" size="50"/>
33+
<input type="button" onclick="connect()" value="Connect"/>
34+
</div>
35+
<br/>
36+
<div>
37+
<p>Request Data:</p>
38+
<div>
39+
<input id="Sym_RT" type="text" placeholder="RIC Code" value="CAD=" />
40+
<input type="button" onclick="snapshot()" value="Get Snapshot" />
41+
</div>
42+
<div>
43+
<input id="Sym_ST" type="text" placeholder="RIC Code" value="EUR=" />
44+
<input type="button" onclick="streaming()" value="Start Streaming" />
45+
</div>
46+
<div>
47+
<input id="Sym_Fun" type="text" placeholder="RIC Code" value="GOOGL.O" />
48+
<input type="button" onclick="fundamental()" value="Get Fundamental" />
49+
</div>
50+
<div>
51+
<input id="Sym_His" type="text" placeholder="RIC Code" value="IBM.N" />
52+
<input type="button" onclick="historical()" value="Get History" />
53+
</div>
54+
</div>
55+
56+
57+
<div class="container">
58+
<hr/>
59+
<div id="log"></div>
60+
</div>
61+
62+
63+
<script>
64+
(function() {
65+
// Global Variables
66+
const $log = document.getElementById("log");
67+
const {Session} = datalib;
68+
const {config} = datalib;
69+
const {Pricing} = datalib;
70+
const {FundamentalAndReference} = datalib;
71+
const {HistoricalPricing} = datalib;
72+
73+
var session;
74+
75+
// enable debug messages from the LD Lib
76+
// config.set('logs.level', 'DEBUG');
77+
78+
var log = function(message) {
79+
var dispStr = message;
80+
if(typeof message !== "string") {
81+
// object, print all the fields of one item
82+
dispStr = '<table><tr><th>Field</th><th>Data</th></tr>'
83+
for(var p in message)
84+
dispStr += '<tr><td>' + p + '</td><td>' + message[p] + '</td></tr>';
85+
dispStr += '</table>';
86+
}
87+
88+
console.log(dispStr);
89+
$log.innerHTML += dispStr + "<br/>";
90+
// scroll to bottom
91+
$log.scrollTop = $log.scrollHeight;
92+
};
93+
94+
95+
96+
var connect = async function() {
97+
ak = document.getElementById("APPKEY").value;
98+
if(ak == "")
99+
log("No AppKey provided");
100+
101+
// create the session object
102+
session = Session.Desktop.Definition({
103+
appKey: ak,
104+
appName: 'MyApp',
105+
}).getSession();
106+
107+
log("Connecting to Workspace...");
108+
109+
for(var port = 9000; port < 9010; port++) {
110+
log(`Trying port ${port}`);
111+
112+
config.set('sessions.desktop.default-session.base-url', `http://127.0.0.1:${port}`)
113+
// scan a range of ports for Workspace proxy
114+
try {
115+
// open the session
116+
await session.open();
117+
log('Successfully connected!');
118+
break;
119+
}
120+
catch (exp) {
121+
if(exp.message)
122+
log(`&nbsp;&nbsp;&nbsp;${exp.message}`)
123+
124+
if(exp.data) {
125+
log('*** Error: Unable to connect to Workspace')
126+
log(`&nbsp;&nbsp;&nbsp;Code: ${exp.data.code}, Message: ${exp.data.message}`)
127+
break;
128+
}
129+
}
130+
}
131+
};
132+
133+
134+
135+
var checkSession = function() {
136+
if(session && session.state == "Opened" )
137+
return true;
138+
else {
139+
log("Session not open - Connect to Workspace first!");
140+
return false;
141+
}
142+
}
143+
144+
145+
146+
var snapshot = async function() {
147+
if(!checkSession())
148+
return;
149+
150+
sym = document.getElementById("Sym_RT").value;
151+
if(sym == "") {
152+
log("No RIC provided");
153+
return;
154+
}
155+
156+
log(`Getting pricing data for ${sym}`);
157+
158+
// specify a list of items and fields to retrieve a snapshot of prices
159+
const pricingDefinition = Pricing.Definition({
160+
universe: [sym],
161+
fields: ['DSPLY_NAME', 'BID', 'ASK', 'OPEN_PRC', 'PCTCHNG'],
162+
extendedParams: {
163+
QoS: {
164+
Rate: 'TimeConflated',
165+
RateInfo: 10000
166+
}
167+
}
168+
});
169+
170+
const stream = pricingDefinition.getStream(session);
171+
// open the stream in snapshot mode
172+
await stream.open({withUpdates: false});
173+
174+
log('');
175+
log(`Realtime data for ${sym}:`);
176+
log(stream.getFields(sym));
177+
}
178+
179+
180+
181+
var streaming = async function() {
182+
if(!checkSession())
183+
return;
184+
185+
sym = document.getElementById("Sym_ST").value;
186+
if(sym == "") {
187+
log("No RIC provided");
188+
return;
189+
}
190+
191+
log(`Opening pricing stream for ${sym}`);
192+
193+
// specify a list of items and fields to retrieve a snapshot of prices
194+
const pricingDefinition = Pricing.Definition({
195+
universe: [sym],
196+
fields: ['DSPLY_NAME', 'BID', 'ASK', 'OPEN_PRC', 'PCTCHNG'],
197+
extendedParams: {
198+
QoS: {
199+
Rate: 'TimeConflated',
200+
RateInfo: 10000
201+
}
202+
}
203+
});
204+
205+
const stream = pricingDefinition.getStream(session);
206+
207+
// attach event listeners to the stream
208+
stream.onRefresh((refresh, instrument) => log(`Refresh for: ${instrument}:`, refresh))
209+
.onUpdate((update, instrument) => log(instrument, update))
210+
.onStatus((status, instrument) => log(`Status for: ${instrument}:`, status))
211+
.onComplete(() => log('Stream refresh complete'))
212+
.onError(err => log(err));
213+
214+
// open the stream in streaming mode
215+
await stream.open();
216+
// run the example for 20 seconds
217+
await new Promise(res => setTimeout(res, 20000));
218+
// close the open stream
219+
log('Closing the open stream');
220+
await stream.close();
221+
}
222+
223+
224+
225+
var fundamental = async function() {
226+
if(!checkSession())
227+
return;
228+
229+
sym = document.getElementById("Sym_Fun").value;
230+
if(sym == "") {
231+
log("No RIC provided");
232+
return;
233+
}
234+
235+
log(`Getting fundamental data for ${sym}`);
236+
237+
const fund = FundamentalAndReference.Definition(sym, ['TR.PriceClose', 'TR.Volume', 'TR.PriceLow']);
238+
const resp = await fund.getData(session);
239+
240+
log('');
241+
log(`Fundamental data for ${sym}:`);
242+
log(resp.data.table[sym]);
243+
}
244+
245+
246+
247+
var historical = async function() {
248+
if(!checkSession())
249+
return;
250+
251+
sym = document.getElementById("Sym_His").value;
252+
if(sym == "") {
253+
log("No RIC provided");
254+
return;
255+
}
256+
257+
log(`Getting historical data for ${sym}`);
258+
259+
const request1 = HistoricalPricing.Events.Definition({
260+
universe: sym,
261+
eventTypes: ['trade'],
262+
fields: ['DATE_TIME', 'EVENT_TYPE', 'TRDPRC_1', 'TRDVOL_1']
263+
});
264+
265+
const resp = await request1.getData(session);
266+
267+
log('');
268+
if(resp.data.table) {
269+
log(`Historical data for ${sym}:`);
270+
for(var h in resp.data.table)
271+
log(resp.data.table[h]);
272+
}
273+
else
274+
log('No data received');
275+
}
276+
277+
278+
log("Launch the LSEG Workspace, type in the APPKey and click Connect");
279+
window.connect = connect;
280+
window.snapshot = snapshot;
281+
window.fundamental = fundamental;
282+
window.historical = historical;
283+
window.streaming = streaming;
284+
})();
285+
286+
287+
</script>
288+
289+
</body>
290+
</html>

0 commit comments

Comments
 (0)