Development of operator interface using Angularat the KEK e-/e+ injector linac

TUPDP047
M. Satoh 1,2, I. Satake1, T. Kudou3, S. Kusano3
1 High Energy Accelerator Organization (KEK), Accelerator Laboratory,
2 The Graduate University for Advanced Studies (SOKENDAI), Department of Accelerator Science,
3 Mitsubishi Electric System & Service Co., Ltd
Archiver viewer Web application

Introduction
The KEK electron/positron injector linac provides the beams of different
energies to five independent storage rings. The first electronic operation
logbook system was developed using a relational database in 1995. This logbooksystem has the capability to automatically record detailed operational statuschanges. In addition, operators can manually input de-tailed information about
operational problems, which is helpful for future troubleshooting. In 2010,
the logbook system was improved with the implementation of a redundant
database, an Adobe Flash based frontend, and an image file handling feature.
In 2011, the CSS archiver system with PostgreSQL and a new web-based archiverviewer utilizing Adobe Flash. However, with the discontinuation of Adobe Flashsupport at the end of 2020, it became necessary to develop a new frontend
without Flash for both the operation logbook and archiver viewer systems. For
this purpose, the authors adopted the Angu-lar framework, which is widely used
for building web applications using JavaScript. In this paper, we report thedevelopment of operator interfaces using Angular for the injector linac.

• Archiver
CSS Archiver, Archiver Appliance• User interface
Multiple PV plot

Pan and zoom control with mouse

Scattering plot

Relative and absolute time range setting

Transition from Adobe Flash to Angular

Togetherwith
auto
updatefunctionality,
latest values can beeasily monitored.

Many web applications developed with Adobe Flash in KEK e-/e+ injector linac
Pros.
・ Good operability and expressive power・ Available on multiple OS・ Easy redistribution because of Web application
Þ No installation is required. Simplicity of management is improved.

Up to 10 vertical axis

PV, axis setting value saving feature

Helpfulfor
streamlining
operations

Cons.
・ Security issue
Þ End of life in 2020

Angular is suitable for our purpose
Angular？
Angular is an open-source Web application framework led by theAngular Team at Google and by a community of individuals andcorporations.
Features・Helpful to develop Single Page Web Application (SPA)
Performance speed of SPA is comparable to native applications

Electric operational logbook system

Magnet information management Web application• Background
In KEK e-/e+ injector linac, around 600 magnets are in operation,
So far, the detailed information of magnets and power supplies has been managed byusing the database with the simple ascii files.
To improve the management efficiency, we developed a new Web application withrelational database in 2022.

• System configuration
Database: PostgreSQL
User interface: Angular• User interface functionality• System configuration

Access control

User interface ： AngularAccess control can be set for each user likeread only persmission, read/write permission.

Web server： Apache
Three server redundancy
Corosync + PaceMaker

User management can be managed with LDAP.

Database： PostgreSQL
Three server redundancy
PostgreSQL replication functionality
PostgreSQL middleware (pgpool-II)

Filtering• User interface functionality
Nine tabs in one page
Each tab shows shift member,trouble, operation outline,
and so on.
WithSinglePage
Application

Import and Export

Batch update of large
amounts of data.

Popup edit form
Image file, movie file, andURL can be embedded for thedetailed descriptions oftroubles or other events.

Change log
The update date,contents can berecorded.

PDF export

updater, andautomatically

PDF style file is created byusing tFPDF.

Summary
Trouble report

Trouble can be grouped intosome categories. (RF, Timingsystem, …)
Machine downtime, beam losttime can be automaticallycalculated.
PDF style file is created byusing tFPDF.

At the KEK Injector, the web applications with Adobe Flash were developed
for the operator interface including the electron operational logbook system andarchiver viewer system. However, because of the end of life of Adobe FlashPlayer, the transition to a new framework became urgent. Therefore, we
replaced and developed web applications using Angular, a web application
framework developed by a community led by Google. These applications arestrongly helpful for the stable linac machine operation.