Convert remaining require() to import in static/js - batch 8

- pad_automatic_reconnect.ts: export const showCountDownTimerToReconnectOnModal
- pad_cookie.ts: convert to named export with const class instance
- pad_impexp.ts: export {padimpexp}
- pad_savedrevs.ts: export const saveNow, export const init
- skin_variants.ts: export multiple functions
- changesettracker.ts: export {makeChangesetTracker}
- broadcast_revisions.ts: export {loadBroadcastRevisionsJS}
- AttributeManager.ts: add .js extensions to imports, export default AttributeManager

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

src/node/handler/PadMessageHandler.ts

@@ -52,7 +52,7 @@ import * as webaccess from '../hooks/express/webaccess.js';
 import { checkValidRev } from '../utils/checkValidRev.js';
 
 let rateLimiter:any;
-let socketio: any = null;
+let socketioServer: any = null;
 
 hooks.deprecationNotices.clientReady = 'use the userJoin hook instead';
 
@@ -93,7 +93,7 @@ export const socketio = () => {
 export const sessioninfos:MapArrayType<any> = {};
 
 export function getTotalActiveUsers() {
-  return socketio ? (socketio as any).engine.clientsCount : 0;
+  return socketioServer ? (socketioServer as any).engine.clientsCount : 0;
 }
 
 export function getActivePadCountFromSessionInfos() {
@@ -184,7 +184,7 @@ const padChannels = new Channels((ch, {socket, message}) => handleUserChanges(so
  * @param socket_io The Socket
  */
 export const setSocketIO = (socket_io:any) => {
-  socketio = socket_io;
+  socketioServer = socket_io;
 };
 
 /**
@@ -203,13 +203,13 @@ export const handleConnect = (socket:any) => {
  */
 export const kickSessionsFromPad = (padID: string) => {
 
-  if(socketio.sockets == null) return;
+  if(socketioServer.sockets == null) return;
 
   // skip if there is nobody on this pad
   if (_getRoomSockets(padID).length === 0) return;
 
   // disconnect everyone from this pad
-  socketio.in(padID).emit('message', {disconnect: 'deleted'});
+  socketioServer.in(padID).emit('message', {disconnect: 'deleted'});
 };
 
 /**
@@ -521,10 +521,10 @@ export const handleCustomObjectMessage = (msg: CustomMessage, sessionID: string)
   if (msg.data.type === 'CUSTOM') {
     if (sessionID) {
       // a sessionID is targeted: directly to this sessionID
-      socketio.sockets.socket(sessionID).emit('message', msg);
+      socketioServer.sockets.socket(sessionID).emit('message', msg);
     } else {
       // broadcast to all clients on this pad
-      socketio.sockets.in(msg.data.payload.padId).emit('message', msg);
+      socketioServer.sockets.in(msg.data.payload.padId).emit('message', msg);
     }
   }
 };
@@ -544,7 +544,7 @@ export const handleCustomMessage = (padID: string, msgString:string) => {
       time,
     },
   };
-  socketio.sockets.in(padID).emit('message', msg);
+  socketioServer.sockets.in(padID).emit('message', msg);
 };
 
 /**
@@ -581,7 +581,7 @@ export const sendChatMessageToPadClients = async (mt: ChatMessage|number, puId:
   // authorManager.getAuthorName() to resolve before saving the message to the database.
   const promise = pad.appendChatMessage(message);
   message.displayName = await authorManager.getAuthorName(message.authorId);
-  socketio.sockets.in(padId).emit('message', {
+  socketioServer.sockets.in(padId).emit('message', {
     type: 'COLLABROOM',
     data: {type: 'CHAT_MESSAGE', message},
   });
@@ -1426,7 +1426,7 @@ export const composePadChangesets = async (pad: PadType, startNum: number, endNu
 };
 
 const _getRoomSockets = (padID: string) => {
-  const ns = socketio.sockets; // Default namespace.
+  const ns = socketioServer.sockets; // Default namespace.
   // We could call adapter.clients(), but that method is unnecessarily asynchronous. Replicate what
   // it does here, but synchronously to avoid a race condition. This code will have to change when
   // we update to socket.io v3.

src/static/js/AttributeManager.ts

@@ -1,9 +1,9 @@
 // @ts-nocheck
-import AttributeMap from './AttributeMap';
-import {compose, deserializeOps, isIdentity} from './Changeset';
-import {Builder} from "./Builder";
-import {buildKeepRange, buildKeepToStartOfRange, buildRemoveRange} from './ChangesetUtils';
-import attributes from './attributes';
+import AttributeMap from './AttributeMap.js';
+import {compose, deserializeOps, isIdentity} from './Changeset.js';
+import {Builder} from "./Builder.js";
+import {buildKeepRange, buildKeepToStartOfRange, buildRemoveRange} from './ChangesetUtils.js';
+import attributes from './attributes.js';
 import underscore from "underscore";
 
 const lineMarkerAttribute = 'lmkr';
@@ -379,4 +379,4 @@ AttributeManager.prototype = underscore.default(AttributeManager.prototype).exte
   },
 });
 
-module.exports = AttributeManager;
+export default AttributeManager;

src/static/js/ace.ts

@@ -25,13 +25,13 @@
 // requires: top
 // requires: undefined
 
-const hooks = require('./pluginfw/hooks');
-const makeCSSManager = require('./cssmanager').makeCSSManager;
-const pluginUtils = require('./pluginfw/shared');
-const ace2_inner = require('ep_etherpad-lite/static/js/ace2_inner')
+import hooks from './pluginfw/hooks.js';
+import {makeCSSManager} from './cssmanager.js';
+import pluginUtils from './pluginfw/shared.js';
+import ace2_inner from 'ep_etherpad-lite/static/js/ace2_inner.js';
 const debugLog = (...args) => {};
-const cl_plugins = require('ep_etherpad-lite/static/js/pluginfw/client_plugins')
-const rJQuery = require('ep_etherpad-lite/static/js/rjquery')
+import cl_plugins from 'ep_etherpad-lite/static/js/pluginfw/client_plugins.js';
+import rJQuery from 'ep_etherpad-lite/static/js/rjquery.js';
 // The inner and outer iframe's locations are about:blank, so relative URLs are relative to that.
 // Firefox and Chrome seem to do what the developer intends if given a relative URL, but Safari
 // errors out unless given an absolute URL for a JavaScript-created element.
@@ -335,4 +335,4 @@ const Ace2Editor = function () {
   };
 };
 
-exports.Ace2Editor = Ace2Editor;
+export {Ace2Editor};

src/static/js/ace2_inner.ts

@@ -1,5 +1,5 @@
 // @ts-nocheck
-import {Builder} from "./Builder";
+import {Builder} from "./Builder.js";
 
 /**
  * Copyright 2009 Google Inc.
@@ -19,34 +19,35 @@ import {Builder} from "./Builder";
  */
 let documentAttributeManager;
 
-import AttributeMap from './AttributeMap';
-const browser = require('./vendors/browser');
-import padutils from './pad_utils'
-const Ace2Common = require('./ace2_common');
-const $ = require('./rjquery').$;
-import {characterRangeFollow, checkRep, cloneAText, compose, deserializeOps, filterAttribNumbers, inverse, isIdentity, makeAText, makeAttribution, mapAttribNumbers, moveOpsToNewPool, mutateAttributionLines, mutateTextLines, oldLen, opsFromAText, pack, splitAttributionLines} from './Changeset'
+import AttributeMap from './AttributeMap.js';
+import browser from './vendors/browser.js';
+import padutils from './pad_utils.js';
+import Ace2Common from './ace2_common.js';
+import {$} from './rjquery.js';
+import {characterRangeFollow, checkRep, cloneAText, compose, deserializeOps, filterAttribNumbers, inverse, isIdentity, makeAText, makeAttribution, mapAttribNumbers, moveOpsToNewPool, mutateAttributionLines, mutateTextLines, oldLen, opsFromAText, pack, splitAttributionLines} from './Changeset.js';
 
 
 const isNodeText = Ace2Common.isNodeText;
 const getAssoc = Ace2Common.getAssoc;
 const setAssoc = Ace2Common.setAssoc;
 const noop = Ace2Common.noop;
-const hooks = require('./pluginfw/hooks');
-import SkipList from "./skiplist";
-import Scroll from './scroll'
-import AttribPool from './AttributePool'
-import {SmartOpAssembler} from "./SmartOpAssembler";
-import Op from "./Op";
-import {buildKeepRange, buildKeepToStartOfRange, buildRemoveRange} from './ChangesetUtils'
+import hooks from './pluginfw/hooks.js';
+import SkipList from "./skiplist.js";
+import Scroll from './scroll.js';
+import AttribPool from './AttributePool.js';
+import {SmartOpAssembler} from "./SmartOpAssembler.js";
+import Op from "./Op.js";
+import {buildKeepRange, buildKeepToStartOfRange, buildRemoveRange} from './ChangesetUtils.js';
+
+import {makeChangesetTracker} from './changesettracker.js';
+import {colorutils} from './colorutils.js';
+import {makeContentCollector} from './contentcollector.js';
+import {domline} from './domline.js';
+import {linestylefilter} from './linestylefilter.js';
+import {undoModule} from './undomodule.js';
+import AttributeManager from './AttributeManager.js';
 
 function Ace2Inner(editorInfo, cssManagers) {
-  const makeChangesetTracker = require('./changesettracker').makeChangesetTracker;
-  const colorutils = require('./colorutils').colorutils;
-  const makeContentCollector = require('./contentcollector').makeContentCollector;
-  const domline = require('./domline').domline;
-  const linestylefilter = require('./linestylefilter').linestylefilter;
-  const undoModule = require('./undomodule').undoModule;
-  const AttributeManager = require('./AttributeManager');
   const DEBUG = false;
 
   const THE_TAB = '    '; // 4
@@ -3731,7 +3732,7 @@ function Ace2Inner(editorInfo, cssManagers) {
   };
 }
 
-exports.init = async (editorInfo, cssManagers) => {
+export const init = async (editorInfo, cssManagers) => {
   const editor = new Ace2Inner(editorInfo, cssManagers);
   await editor.init();
 };

src/static/js/broadcast_revisions.ts

@@ -113,4 +113,4 @@ const loadBroadcastRevisionsJS = () => {
   window.revisionInfo = revisionInfo;
 };
 
-exports.loadBroadcastRevisionsJS = loadBroadcastRevisionsJS;
+export {loadBroadcastRevisionsJS};

src/static/js/changesettracker.ts

@@ -202,4 +202,4 @@ const makeChangesetTracker = (scheduler, apool, aceCallbacksProvider) => {
   };
 };
 
-exports.makeChangesetTracker = makeChangesetTracker;
+export {makeChangesetTracker};

src/static/js/colorutils.ts

@@ -119,4 +119,4 @@ colorutils.textColorFromBackgroundColor = (bgcolor, skinName) => {
   return colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5 ? white : black;
 };
 
-exports.colorutils = colorutils;
+export {colorutils};

src/static/js/contentcollector.ts

@@ -10,7 +10,7 @@
 // THIS FILE IS ALSO AN APPJET MODULE: etherpad.collab.ace.contentcollector
 // %APPJET%: import("etherpad.collab.ace.easysync2.Changeset");
 // %APPJET%: import("etherpad.admin.plugins");
-import Op from "./Op";
+import Op from "./Op.js";
 
 /**
  * Copyright 2009 Google Inc.
@@ -30,11 +30,11 @@ import Op from "./Op";
 
 const _MAX_LIST_LEVEL = 16;
 
-import AttributeMap from './AttributeMap';
+import AttributeMap from './AttributeMap.js';
 import UNorm from 'unorm';
-import {subattribution} from './Changeset';
-import {SmartOpAssembler} from "./SmartOpAssembler";
-const hooks = require('./pluginfw/hooks');
+import {subattribution} from './Changeset.js';
+import {SmartOpAssembler} from "./SmartOpAssembler.js";
+import hooks from './pluginfw/hooks.js';
 
 const sanitizeUnicode = (s) => UNorm.nfc(s);
 const tagName = (n) => n.tagName && n.tagName.toLowerCase();
@@ -744,6 +744,4 @@ const makeContentCollector = (collectStyles, abrowser, apool, className2Author)
   return cc;
 };
 
-exports.sanitizeUnicode = sanitizeUnicode;
-exports.makeContentCollector = makeContentCollector;
-exports.supportedElems = supportedElems;
+export {sanitizeUnicode, makeContentCollector, supportedElems};

src/static/js/cssmanager.ts

@@ -23,7 +23,7 @@
  * limitations under the License.
  */
 
-exports.makeCSSManager = (browserSheet) => {
+export const makeCSSManager = (browserSheet) => {
   const browserRules = () => (browserSheet.cssRules || browserSheet.rules);
 
   const browserDeleteRule = (i) => {

src/static/js/pad_automatic_reconnect.ts

@@ -1,8 +1,8 @@
 // @ts-nocheck
 'use strict';
-import html10n from './vendors/html10n';
+import html10n from './vendors/html10n.js';
 
-exports.showCountDownTimerToReconnectOnModal = ($modal, pad) => {
+export const showCountDownTimerToReconnectOnModal = ($modal, pad) => {
   if (clientVars.automaticReconnectionTimeout && $modal.is('.with_reconnect_timer')) {
     createCountDownElementsIfNecessary($modal);
 

src/static/js/pad_cookie.ts

@@ -17,9 +17,9 @@
  * limitations under the License.
  */
 
-import {Cookies} from "./pad_utils";
+import {Cookies} from "./pad_utils.js";
 
-exports.padcookie = new class {
+const padcookie = new class {
   constructor() {
     const prefix = (window as any).clientVars?.cookiePrefix || '';
     this.cookieName_ = prefix + (window.location.protocol === 'https:' ? 'prefs' : 'prefsHttp');
@@ -75,3 +75,5 @@ exports.padcookie = new class {
     this.writePrefs_({});
   }
 }();
+
+export {padcookie};

src/static/js/pad_impexp.ts

@@ -184,4 +184,4 @@ const padimpexp = (() => {
   return self;
 })();
 
-exports.padimpexp = padimpexp;
+export {padimpexp};

src/static/js/pad_savedrevs.ts

@@ -19,7 +19,7 @@
 
 let pad;
 
-exports.saveNow = () => {
+export const saveNow = () => {
   pad.collabClient.sendMessage({type: 'SAVE_REVISION'});
   window.$.gritter.add({
     // (string | mandatory) the heading of the notification
@@ -34,6 +34,6 @@ exports.saveNow = () => {
   });
 };
 
-exports.init = (_pad) => {
+export const init = (_pad) => {
   pad = _pad;
 };

src/static/js/security.ts

@@ -17,4 +17,6 @@
  * limitations under the License.
  */
 
-module.exports = require('security');
+import Security from 'security';
+
+export default Security;

src/static/js/skin_variants.ts

@@ -78,8 +78,4 @@ if (window.location.hash.toLowerCase() === '#skinvariantsbuilder') {
   updateSkinVariantsClasses(getNewClasses());
 }
 
-exports.isDarkMode = isDarkMode;
-exports.setDarkModeInLocalStorage = setDarkModeInLocalStorage
-exports.isWhiteModeEnabledInLocalStorage = isWhiteModeEnabledInLocalStorage
-exports.isDarkModeEnabledInLocalStorage = isDarkModeEnabledInLocalStorage
-exports.updateSkinVariantsClasses = updateSkinVariantsClasses;
+export {isDarkMode, setDarkModeInLocalStorage, isWhiteModeEnabledInLocalStorage, isDarkModeEnabledInLocalStorage, updateSkinVariantsClasses};