Beacon scrolling news: technical overview

Read Time
4 min read
Published On
July 5, 2017

The Beacon Scrolling News App is built using the OpenFin Framework, with an HTML front-end and fully client-based JavaScript application. For the User Experience, we have considered speed, ease-of-use and a color scheme, typography and iconography that works consistently with other financial terminal applications. OpenFin is used as the container for the app. The framework allows the application to open and run in its own desktop application and windows, and pages launched from the main application are opened in their own child windows. OpenFin also controls the initial configuration for the application, including window size, the app icon on the dock, desktop, and window, and how the application behaves when opened.The application front-end is built on top of Bootstrap’s grid. This allows the application to easily resize to fit the user’s needs. The rest of the styling is done with custom css, and is designed to fit the needs of a user with a finance background. The majority of the javascript is written using jQuery. This allows the program to easily select elements from the DOM and manipulate them. Ajax calls are done using jQuery’s getJSON method. The application also makes use of fat arrows from ES6 to filter null values from the arrays when they are manipulated. The bookmark feature allows users to save articles for future reference. These bookmarked articles are stored in the Open Fin app’s HTML5 local storage. This allows the Beacon app to retain the data across browser sessions. Since the app is run on the OpenFin framework, the local storage is not affected by deleting the cache on the user’s actual browser. The only way the storage is wiped is if the user uninstalls the Beacon application. Local Storage is also used to store NewsAPI’s source list, which saves the application some AJAX calls when it is opened after the first load.The news articles seen on Beacon are provided by the NewsAPIservice. The Beacon App real-time model is currently based on a configurable polling mechanism, with a pub-sub mechanism under consideration. Since news is derived from different sources, some of which can only be sorted by top articles, some new articles will occasionally appear further down in the visible list of articles. However it is clear which articles are new by the ‘new article highlight’ that is applied to such articles, so they can be brought to a user’s attention.One of the limitations of the current app is the lack of direct relevance of content to financial news, as well as the ability to filter content more accurately for the financial professional audience. Accordingly, one of the next steps for Beacon is to integrate with CityFalcon’s API for financial news. CityFalcon will allow the app to display news about specific companies that a user chooses. It will also allow users to categorize news and rate it on importance. The user will be allowed to keep a watchlist of companies so that they are up to date on financial news for companies in their portfolio.Download the latest version of the Beacon application here.