A digital textbook layout dynamic reconstruction and structured processing method

Abstract

The application discloses a kind of digital teaching material format dynamic reconstruction and structured processing method, it is related to data processing technical field, the method of the present application includes: response mouse movement, constructs translation transformation matrix and renders interactive handle to source node side;Click handle locks source node, extracts identifier and attribute and is encapsulated as lock state data packet;Drag start from abstract syntax tree and extract structured slice data packet;Drag calculates longitudinal space ratio to judge insertion drop point in middle, calls interface and verifies structure legality and dynamically displays auxiliary line;Response placement event creates atomic transaction, executes position mapping and format dynamic recalculation, completes business data lossless insertion;Finally, outline directory tree in side bar is synchronized, and smooth scrolling viewport is to final target drop point.The present application effectively prevents data loss and typesetting collapse when complex nested document is dragged and reorganized, realizes multi-column component adaptive isometric width scaling, and precise linkage of global view interface.

Description

Technical Field

[0001] This invention relates to the field of data processing technology, and in particular to a method for dynamic reconstruction and structured processing of digital textbook layouts. Background Technology

[0002] With the continuous advancement of educational informatization, digital textbooks have gradually evolved from traditional static documents into dynamic web pages or rich text applications with highly interactive and complex layout structures. Digital textbooks not only contain massive amounts of plain text, but also embed rich structured components such as images, video containers, and after-class exercises. In the process of editing, proofreading, typesetting, and user-customized learning of digital textbooks, it is often necessary to dynamically reconstruct the existing document layout. For example, paragraphs and multimedia components can be repositioned and restructured by dragging and dropping with the mouse. This requires the editor to not only accurately capture the user's interactive intent, but also to maintain the integrity of the underlying data and the standardization of the layout of the digital textbook within a deeply nested document object model tree environment. Existing technologies for handling drag-and-drop reconstruction in web pages or rich text editors typically rely on the browser's native drag-and-drop application interface or basic mouse event listeners to achieve physical content displacement. They usually directly map the user's physical mouse screen coordinates to surface DOM elements. In deeply nested logical structures, this mapping often lacks a precise anchoring mechanism, making it difficult to effectively isolate the physical starting point of the drag from the cursor editing state of the internal text. Due to the lack of deep locking and encapsulation of underlying node data, when physical transfers occur across complex structures, core business data bound to nodes is easily lost or damaged. Conventional drag-and-drop methods lack semantic awareness of the document's global abstract syntax tree. During content movement, they cannot determine in real time whether the target insertion position conforms to the layout syntax rules of digital textbooks. This makes it easy for users to drag content into illegal nesting levels, triggering the underlying state machine to detect the illegal structure and perform forced content cleaning, thus disrupting the structured form of digital textbooks. Existing drag-and-drop displacement technologies are mostly static node migrations, unable to dynamically recalculate the layout based on the constraints of the target container before and after insertion. Summary of the Invention

[0003] The technical problem solved by this invention is that existing technologies typically map the user's physical mouse screen coordinates directly to the surface DOM elements. In deeply nested logical structures, this mapping often lacks a precise anchoring mechanism. When a physical transfer occurs across a complex structure, it is very easy to cause the core business data bound to the node to be lost or damaged. Conventional drag-and-drop methods lack the ability to semantically perceive the global abstract syntax tree of the document. During the content movement process, it is impossible to determine in real time whether the target insertion position conforms to the layout syntax structure rules of digital textbooks.

[0004] To address the aforementioned technical problems, this invention provides the following technical solution: a method for dynamic reconstruction and structured processing of digital textbook layouts, comprising the following steps: Step S1: Respond to mouse movement events, capture mouse screen pixel coordinates and convert them into source node position parameters, calculate the screen coordinates of the source node based on the source node position parameters, and construct a translation transformation matrix to render the interaction handle to one side of the source node. Step S2: Respond to the click operation of the interaction handle, call the node selection instruction of the document state machine engine to lock the source node, extract the unique identifier and attribute key-value pairs of the source node, and encapsulate them to generate a locked state data packet; Step S3: Respond to the drag start event, read the boundary data of the locked source node, call the slice extraction interface of the document state machine engine, extract the structured slice data packet from the document abstract syntax tree and write it into the drag transport layer. Step S4: During the dragging and moving process, collect the vertical screen pixel coordinates of the mouse, calculate the vertical space ratio to determine the insertion position, call the hierarchical parsing interface and the syntax tree constraint verification interface to determine the structural legality of the target position, and display auxiliary lines according to the verification results; Step S5: Respond to the placement event, extract the source node start index parameter, source node end index parameter, and target landing point index parameter, create an atomic transaction object, perform deletion operation and position mapping recalculation, perform dynamic layout recalculation, perform insertion operation, and dispatch the transaction to complete document reconstruction; Step S6: Respond to the document update event, traverse the updated document abstract syntax tree, synchronously update the sidebar directory data, calculate the scroll offset, and call the browser scroll interface to smoothly scroll the view to the target position.

[0005] As an optimization, step S1 includes the following sub-steps: Step S101: Register a mouse movement event listener on the outermost container of the editor, preset the debounce period, and record only the last physical position of continuous mouse movements within the debounce period; when the mouse moves into the area where the source node is located, extract the screen pixel coordinates of the mouse pointer position, where the screen pixel coordinates represent the horizontal and vertical physical distances of the current mouse pointer from the upper left corner of the browser viewport. Step S102: Call the pixel-to-position conversion method of the document state machine engine to convert the screen pixel coordinates into source node position parameters. The source node position parameters represent the absolute index value of the node currently hovering over by the mouse in the entire linear document structure. Call the position-to-pixel conversion method of the document state machine engine, input the source node position parameters, and calculate the absolute starting coordinates of the upper left corner of the source node's border on the screen in reverse. Step S103: Construct a translation transformation matrix based on the absolute starting coordinates, assign the translation transformation matrix to the transformation attribute of the interaction handle component, and anchor the interaction handle to one side of the source node in real time.

[0006] As an optimization, step S2 includes the following sub-steps: Step S201: Receive a single click event signal generated when the user presses the interaction handle, and extract the source node position parameter from the context bound to the click event; Step S202: Invoke the node selection instruction of the document state machine engine, pass the source node position parameter to the document state machine engine, the document state machine engine finds the corresponding source node according to the source node position parameter and calculates the closed boundary of the source node, replaces the selection state in the memory stack with the overall mapping of the source node, and generates a node selection object. Step S203: Call the parsing interface of the document abstract syntax tree, read the unique identifier string and attribute key-value pair dictionary carried by the source node object, and combine and encapsulate them into a locked state data packet.

[0007] As an optimization, step S3 includes the following sub-steps: Step S301: Listen for the drag start event bound to the interaction handle component. When the user presses and holds the interaction handle and the mouse moves more than the preset anti-mistouch constant on the physical plane of the screen, trigger the drag start event signal. Step S302: In response to the drag start event signal, read the boundary data of the locked source node, the boundary data including the source node start index parameter and the source node end index parameter; Step S303: Call the slice extraction interface of the document state machine engine, take the global abstract syntax tree of the document as the processing object, take the source node start index parameter and the source node end index parameter as input parameters, locate all tree nodes with the source node start index parameter as the starting point and the source node end index parameter as the ending point according to the depth-first traversal algorithm, perform a deep copy operation, and output the structured slice data packet.

[0008] As an optimization, step S4 includes the following sub-steps: Step S401: When the mouse is in a drag-and-drop state, continuously collect the vertical screen pixel coordinates of the mouse pointer in the browser viewport at a preset frequency. Step S402: Call the underlying view resolver to extract the reference node of the current mouse hover position, and obtain the top physical pixel boundary value and bottom physical pixel boundary value of the reference node on the screen. Step S403: Calculate the vertical space ratio using the landing point offset calculation formula, and set the first space judgment threshold and the second space judgment threshold. If the vertical space ratio is less than the first space judgment threshold, it is determined that the user's intention is to insert before the landing reference node, and the target landing index parameter is assigned the logical starting index value of the landing reference node. If the vertical space ratio is greater than or equal to the first space judgment threshold and less than or equal to the second space judgment threshold, it is determined that the user's intention is to insert into the landing reference node, and the target landing index parameter is assigned to the available start or end index value inside the landing reference node. If the vertical space ratio is greater than the second space judgment threshold, it is determined that the user's intention is to insert after the landing reference node, and the target landing index parameter is assigned to the logical end index value of the landing reference node.

[0009] As an optimization, step S4 further includes the following sub-steps: Step S404: Call the hierarchical parsing interface of the document state machine engine, input the target landing point index parameter, output the direct parent node type identifier of the newly inserted node, read the structured slice data packet, and extract the root node type identifier inside it. Step S405: Call the syntax tree constraint verification interface, take the parent node type identifier and the root node type identifier as input parameters, query the digital textbook rule table, and determine whether the target type is allowed to be a legal child node of the parent type; Step S406: When the verification result is true, render a highlighted horizontal auxiliary line of the first color on the screen and set the placement allow flag in global memory to true; when the verification result is false, redraw the color of the highlighted horizontal auxiliary line to the second color and set the global placement allow flag to false. When the placement permission flag is true, delete, position mapping recalculation, layout dynamic recalculation, and insertion operations are performed. When the placement permission flag is false, the placement process is terminated.

[0010] As an optimization, step S5 includes the following sub-steps: Step S501: Intercept the placement event, extract the source node start index parameter, source node end index parameter and target landing point index parameter, and instantiate an atomic transaction object in the document state machine engine. The atomic transaction object is used to temporarily store all modification instructions for the document. Step S502: Call the deletion interface of the atomic transaction object, input the source node start index parameter and the source node end index parameter, and mark all nodes in the interval as removed; Step S503: Invoke the mapping record matrix built into the atomic transaction object, and use the position mapping algorithm to calculate the actual insertion index parameter. The expression of the position mapping algorithm is: ; in, This is the calculated actual insertion index parameter, used to guide the write coordinates of the final slice data packet. The index parameter for the initially predicted target landing point. and These are the start and end absolute indices of the source node, respectively.

[0011] As an optimization, step S5 includes the following sub-steps: Step S504: Call the hierarchical parsing interface of the document state machine engine. Based on the actual insertion index parameter p4, call the hierarchical parsing interface to locate the target container node corresponding to the insertion position. Traverse the attribute dictionary of the target container node and extract the layout constraint parameter set. The layout constraint parameter set includes the physical pixel parameter of the total available width of the target container and the integer parameter of the number of columns of the target container. Step S505: Use the layout dynamic recalculation algorithm to overwrite the width attribute of the block-level child nodes inside the structured slice data packet to generate an adaptive slice data packet; extract the locked state data packet in global memory and overwrite the unique identifier string and attribute key-value pair dictionary contained therein into the root node attribute of the adaptive slice data packet. Step S506: Call the insertion interface of the atomic transaction object, and pass in the actual insertion index parameter and the adaptive slice data package as parameters; attach the actual insertion index parameter as metadata to the atomic transaction object, and then call the dispatch interface of the document state machine engine to submit the atomic transaction object to the main thread to generate the modified final document abstract syntax tree.

[0012] As an optimization, step S6 includes the following sub-steps: Step S601: In response to the document update event, the sidebar directory extension component obtains the latest document abstract syntax tree output by the document state machine engine; and calls the depth-first traversal algorithm to perform a full scan of the document abstract syntax tree and extract the nodes whose node type identifier is marked as the title attribute. Step S602: For each title node, extract the unique identifier string bound to it and the absolute position index parameter of the title node in the current linear document structure. Encapsulate all the extracted identifiers and index parameters into an object array according to the document sequence. Use the object array to overwrite the directory tree structure of the user interface and update the position index of the corresponding title.

[0013] As an optimization, step S6 further includes the following sub-steps: Step S603: Read the actual insertion index parameter from the transaction metadata carried by the document update event, input the parameter into the coordinate mapping interface of the document state machine engine, output dictionary data containing physical coordinate information, and extract the absolute vertical physical pixel value of the distance between the top edge of the newly inserted node and the top of the webpage from the dictionary data. Step S604: Calculate the target scroll offset using the view scrolling algorithm, use the target scroll offset as the ordinate parameter, call the browser scrolling interface, configure the scrolling behavior attribute to smooth mode, so that the editor viewport automatically scrolls and focuses on the target position.

[0014] The beneficial effects of this invention are as follows: This invention responds to mouse movement and converts it into source node position parameters. It constructs a translation transformation matrix using absolute starting coordinates, anchoring the interaction handle to the source node in real time. This isolates the cursor editing state of the internal text from the operation state of the entire external block content. Before dragging, the source node is locked by calling the node selection command of the document state machine engine, pre-encapsulating the unique identifier and attribute key-value pairs carried by the node into a locked state data packet. During dragging, the vertical space ratio is calculated by continuously collecting the mouse's vertical screen pixel coordinates in real time and combining them with the landing point offset calculation formula to predict the insertion intention. Based on the verification results, visual feedback is provided using the hierarchical parsing interface and the syntax tree constraint verification interface. Addressing the adaptive problem of multimedia components in complex column layouts, this invention, after intercepting the placement event and performing position mapping recalculation, primarily… The system dynamically locates the target container node, extracts its available total width and number of columns, and other layout constraint parameters. Before actually writing the slice data to the target position, it uses a layout dynamic recalculation algorithm to generate adaptive slice data packages for the internal block-level child nodes. After responding to a document update event, the sidebar directory extension component uses a depth-first traversal algorithm to fully scan the latest document abstract syntax tree, extracts the identifiers of all title nodes and the latest absolute position index parameters, and overwrites the directory tree object array of the interface in real time. It extracts the absolute vertical physical pixel value of the newly inserted node through reverse coordinate mapping, and combines the height of the top fixed navigation bar and the visual safety margin. It uses a view scrolling algorithm to calculate the target scroll offset, and calls the underlying scrolling interface and configures it to smooth mode, forcing the viewport to automatically focus on the new position after the jump, thus avoiding the reconstructed content being covered by other fixed elements of the webpage. Attached Figure Description

[0015] Figure 1 The flowchart illustrates the steps of a method for dynamic reconstruction and structured processing of digital textbook layouts, as provided in one embodiment of the present invention. Detailed Implementation

[0016] To make the above-mentioned objects, features and advantages of the present invention more apparent and understandable, the specific embodiments of the present invention will be described in detail below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments.

[0017] Example, refer to Figure 1 This paper provides a method for dynamic reconstruction and structured processing of digital textbook layouts, including the following steps: Step S1: Respond to mouse movement events, capture mouse screen pixel coordinates and convert them into source node position parameters, calculate the screen coordinates of the source node based on the source node position parameters, and construct a translation transformation matrix to render the interaction handle to one side of the source node. Step S2: Respond to the click operation of the interaction handle, call the node selection instruction of the document state machine engine to lock the source node, extract the unique identifier and attribute key-value pairs of the source node, and encapsulate them to generate a locked state data packet; Step S3: Respond to the drag start event, read the boundary data of the locked source node, call the slice extraction interface of the document state machine engine, extract the structured slice data packet from the document abstract syntax tree and write it into the drag transport layer. Step S4: During the dragging and moving process, collect the vertical screen pixel coordinates of the mouse, calculate the vertical space ratio to determine the insertion position, call the hierarchical parsing interface and the syntax tree constraint verification interface to determine the structural legality of the target position, and display auxiliary lines according to the verification results; Step S5: Respond to the placement event, extract the source node start index parameter, source node end index parameter, and target landing point index parameter, create an atomic transaction object, perform deletion operation and position mapping recalculation, perform dynamic layout recalculation, perform insertion operation, and dispatch the transaction to complete document reconstruction; Step S6: Respond to the document update event, traverse the updated document abstract syntax tree, synchronously update the sidebar directory data, calculate the scroll offset, and call the browser scroll interface to smoothly scroll the view to the target position.

[0018] This invention breaks through the traditional purely physical mouse drag-and-drop mode in digital textbooks, which is prone to data loss. With the collaborative support of the underlying document state machine engine and the global abstract syntax tree, it achieves high-fidelity stripping and secure reorganization of structured components, providing a system-level underlying solution for complex and deeply nested digital textbook typesetting that balances data integrity and visual adaptability.

[0019] Step S1 includes the following sub-steps: Step S101: Register a mouse movement event listener on the outermost container of the editor, preset the debounce period, and record only the last physical position of continuous mouse movements within the debounce period; when the mouse moves into the area where the source node is located, extract the screen pixel coordinates of the mouse pointer position, which represent the horizontal and vertical physical distance of the current mouse pointer from the upper left corner of the browser viewport. Step S102: Call the pixel-to-position conversion method of the document state machine engine to convert the screen pixel coordinates into the source node position parameter. The source node position parameter represents the absolute index value of the node currently hovering over by the mouse in the entire linear document structure. Call the position-to-pixel conversion method of the document state machine engine, input the source node position parameter, and calculate the absolute starting coordinates of the upper left corner of the source node's border on the screen in reverse. Step S103: Construct a translation transformation matrix based on the absolute starting coordinates, assign the translation transformation matrix to the transformation attribute of the interaction handle component, and anchor the interaction handle to one side of the source node in real time.

[0020] In a specific embodiment of the present invention, when dynamically adjusting the structure of digital teaching materials, it is necessary to bind the user's physical mouse actions with the deeply nested DOM tree logical structure. This process is completed by the dynamic injection and positioning steps of the interaction handle. During the initialization phase, a mouse movement event listener is registered on the outermost container of the editor. In order to prevent a large amount of redundant calculations from being generated when the mouse moves quickly, thereby blocking the browser's main thread, this embodiment sets a debounce period of 50 milliseconds, which means that only the last physical position is recorded for continuous mouse movements within 50 milliseconds. When the mouse moves into the area containing the source node, the event listener captures the screen pixel coordinates of the mouse pointer position. This represents the horizontal and vertical physical distance between the current mouse pointer and the top-left corner of the browser viewport; Get screen pixel coordinates Then, the underlying `posAtCoords` method of ProseMirror is called. This is because screen pixel coordinates only represent a single point of light on the screen. In a deeply nested browser DOM environment, it is difficult to directly determine the paragraph or component the user is currently pointing to using physical coordinates. The `posAtCoords` method receives screen pixel coordinates. Then, by traversing the document tree model, the source node position parameter is output as an integer. The source node position parameter represents the absolute index value of the node where the mouse is currently hovering in the entire linear document structure, which is used to determine the current operation object. If no valid source node position parameter is parsed, the interaction handle is hidden or the previous valid state is maintained. By calling the `coordsAtPos` method, the interaction handle is displayed next to the source node. Specifically, the source node position parameter calculated in the previous step is passed in, and the absolute starting coordinates of the top-left corner of the source node's border on the screen are calculated in reverse. ; To render the interaction handle outside the source node without obscuring the text content, a translation transformation matrix is ​​used in conjunction with the absolute starting coordinates to perform matrix transformation calculations. The mathematical expression for the translation transformation matrix is: ; in, The translation transformation matrix is... `d` represents the absolute starting coordinates of the top-left corner of the source node's border on the screen, and `d` is a horizontal offset constant; element This represents the final physical pixel location of the interaction handle in the horizontal direction; The second row represents scaling and translation along the Y-axis, where the element... This represents the final physical pixel position of the interaction handle in the vertical direction, ensuring that the handle is strictly aligned with the top of the source node. The third row contains fixed constants set to satisfy the rules of homogeneous coordinate matrix multiplication; In this embodiment, the horizontal offset constant is set to 36 pixels; The translation transformation matrix is ​​directly output and assigned to the CSS Transform property of the interactive handle component. The interactive handle is anchored and rendered in real time on the left side of the source node. Through this physical rendering method derived from the logical position, a clear physical starting point for dragging is provided visually and operationally, effectively isolating the cursor editing state of the internal text from the operation state of the entire block of content outside.

[0021] This invention effectively avoids the massive redundant calculations caused by rapid mouse swipes by introducing a debounce cycle, preventing the browser's main thread from being blocked. At the same time, based on the absolute starting coordinates and translation transformation matrix, the interaction handle is anchored and rendered to the outside of the source node in real time. Without obscuring the teaching content, it provides users with clear physical operation anchor points and isolates the cursor editing state of the internal text from the operation state of the entire block of content in terms of both visual appearance and underlying logic.

[0022] Step S2 includes the following sub-steps: Step S201: Receive a single click event signal generated when the user presses the interaction handle, and extract the source node position parameter from the context bound to the click event; Step S202: Call the node selection instruction of the document state machine engine, pass the source node position parameter to the document state machine engine, the document state machine engine finds the corresponding source node according to the source node position parameter and calculates the closed boundary of the source node, replaces the selection state in the memory stack with the overall mapping of the source node, and generates a node selection object. Step S203: Call the parsing interface of the document abstract syntax tree, read the unique identifier string and attribute key-value pair dictionary carried by the source node object, and combine and encapsulate them into a locked state data packet.

[0023] In one specific embodiment of the present invention, when a user presses the interaction handle with the left mouse button, a click event signal is generated. The source node position parameter, calculated in step S1, is extracted from the context bound to this click event and denoted as... It directly calls the instruction set of the underlying document state machine engine, editor.commands.setNodeSelection(p_0); After the instruction is invoked, the source node position parameter is passed to the underlying document state machine engine. The underlying document state machine engine will find the corresponding source node based on the source node position parameter and calculate the closed boundary of the source node, thereby forcibly replacing the selection state in the memory stack with the overall mapping of the source node. This operation generates a selection object with the type identifier NodeSelection in the underlying document state machine engine, which wraps the entire source node; After marking is completed, it is necessary to extract and lock the internal data of the source node. Specifically, the parsing interface of the underlying abstract syntax tree is called to read the specific data structure carried by the source node, and two types of core data are extracted. The first type of data is a unique identifier string, which is a 36-character string generated according to the UUID v4 standard. In complex digital teaching materials, the unique identifier string is a unique credential for linking external databases, such as a database of answers to after-class exercises or a record of video playback progress. The second type of data is attribute key-value pair dictionary. The attribute key-value pair dictionary is a dictionary structure in JSON format. The key of the dictionary is the string type attribute name, and the value is the corresponding specific value or configuration item. The extracted unique identifier string and the attribute key-value pair dictionary are combined and encapsulated into a locked state data packet. Through this pre-locking mechanism, a snapshot data containing the complete node genes is obtained. This snapshot data is specifically used to provide a data source for reconstructing new nodes when the user releases the mouse and triggers the destruction of the native browser DOM, ensuring that the business data stored inside the node remains absolutely locked and has zero loss during subsequent physical transfers.

[0024] This invention forces the calculation of closed boundaries and replaces the selection area by calling the node selection instruction of the state machine. Before the actual physical displacement begins, it preemptively strips and extracts the unique identifier and attribute key-value pairs of the source node, and then encapsulates them into a locked state data packet. Before triggering the destruction of the browser's native DOM, it provides a snapshot source containing the complete node genes, ensuring the absolute security and high-fidelity restoration of internal business data in subsequent reconstruction.

[0025] Step S3 includes the following sub-steps: Step S301: Listen for the drag start event bound to the interaction handle component. When the user presses and holds the interaction handle and the mouse moves more than the preset anti-mistouch constant on the physical plane of the screen, trigger the drag start event signal. Step S302: In response to the drag start event signal, read the boundary data of the locked source node. The boundary data includes the source node start index parameter and the source node end index parameter. Step S303: Call the slice extraction interface of the document state machine engine, take the global abstract syntax tree of the document as the processing object, take the source node start index parameter and the source node end index parameter as input parameters, locate all tree nodes with the source node start index parameter as the starting point and the source node end index parameter as the ending point according to the depth-first traversal algorithm, perform a deep copy operation, and output the structured slice data packet.

[0026] In a specific embodiment of the present invention, after the absolute locking of the source node at the logical layer is completed in step S2, once the user actually starts moving the mouse to drag, the target content must be completely extracted and data-encapsulated at this moment to prevent data loss when moving across complex document structures. Specifically, a listener for the native drag start event is bound to the interaction handle component. When the user presses down on the interaction handle and the mouse moves more than the preset 3-pixel anti-mistouch constant in this embodiment, a native drag start event signal is generated. Immediately read the boundary data of the source node determined in step S2. The boundary data includes the source node start index parameter and the source node end index parameter, where the source node start index parameter represents the starting absolute index of the source node in the linear sequence of the document, denoted as . The source node end index parameter represents the absolute index of the end of the source node's closing label, denoted as . ; After obtaining the boundary data, the data is sliced ​​and serialized. Specifically, the slice extraction interface state.doc.slice(p_1, p_2) of the underlying document state machine is called. The document's global abstract syntax tree is the processing object. The abstract syntax tree is a multi-branch tree data structure, where each branch represents a typesetting level in the document. The source node's start index parameter and source node's end index parameter are passed as input parameters to the slice extraction interface. Following the depth-first traversal algorithm, all tree nodes starting from the source node's start index parameter and ending at the source node's end index parameter are located, and a deep copy operation is performed to output a structured slice data package. Structured slice data includes two core types of data: the first type is plain text string data, which is the paragraph text content that the user actually reads; the second type is nested dictionary data that describes the layout style, recording the node type, such as video components, and the attribute dictionary they carry, such as the video playback link and the Base64 encoded cover image. Structured slice data packets are written to the HTML5 standard DataTransfer drag-and-drop transport layer and the global state manager.

[0027] The preset displacement constant of this invention can effectively filter out accidental touch signals generated by unintentional clicks. After dragging is established, instead of performing shallow HTML structure extraction, it performs depth-first traversal and deep copy with the global abstract syntax tree as the processing object. It packages the plain text content and the nested dictionary describing the layout style together into a structured slice, which fundamentally avoids the damage to rich media genes that occurs when moving across complex document structures.

[0028] Step S4 includes the following sub-steps: Step S401: When the mouse is in a drag-and-drop state, continuously collect the vertical screen pixel coordinates of the mouse pointer in the browser viewport at a preset frequency. Step S402: Call the underlying view resolver to extract the reference node of the current mouse hover position, and obtain the top physical pixel boundary value and bottom physical pixel boundary value of the reference node on the screen. Step S403: Calculate the vertical space ratio using the landing point offset calculation formula, and set the first space judgment threshold and the second space judgment threshold. If the vertical space ratio is less than the first space determination threshold (0.25 in this embodiment), it is determined that the user's intention is to insert before the landing reference node, and the target landing index parameter is assigned the logical starting index value of the landing reference node. If the vertical space ratio is greater than or equal to the first space determination threshold and less than or equal to the second space determination threshold (0.75 in this embodiment), then it is determined that the user's intention is to insert into the landing reference node, and the target landing index parameter is assigned to the available start or end index value inside the landing reference node. If the vertical space ratio is greater than the second space judgment threshold, it is determined that the user's intention is to insert after the landing reference node, and the target landing index parameter is assigned to the logical end index value of the landing reference node.

[0029] During the dragging process, this invention continuously collects vertical screen pixel coordinates at high frequency and calculates the precise spatial proportion using the landing point offset calculation formula. It can intelligently analyze user expectations by combining the set spatial judgment threshold, thereby accurately transforming the rigid physical position of the mouse into a landing point index with contextual semantic logic.

[0030] Step S4 also includes the following sub-steps: Step S404: Call the hierarchical parsing interface of the document state machine engine, input the target landing point index parameter, output the direct parent node type identifier of the newly inserted node, read the structured slice data packet, and extract the root node type identifier inside it. Step S405: Call the syntax tree constraint verification interface, take the parent node type identifier and the root node type identifier as input parameters, query the digital textbook rule table, and determine whether the target type is allowed to be a legal child node of the parent type; Step S406: When the verification result is true, render a highlighted horizontal auxiliary line of the first color on the screen and set the placement allow flag in global memory to true; when the verification result is false, redraw the color of the highlighted horizontal auxiliary line to the second color and set the global placement allow flag to false. When the placement permission flag is true, delete, position mapping recalculation, layout dynamic recalculation, and insertion operations are performed. When the placement permission flag is false, the placement process is terminated.

[0031] In a specific embodiment of the present invention, during the process of a user pressing and holding the interaction handle and dragging the textbook content, it is necessary to predict the position that the user wants to insert, and it is necessary to determine in real time whether the target position will destroy the layout and grammatical structure of the digital textbook before the user releases the mouse. Ordinary dragging lacks semantic awareness and often causes the underlying state machine to detect illegal structure and thus perform content cleaning. In step S4, the native dragover event is bound. If the user's mouse is in a dragging state, the vertical screen pixel coordinates of the mouse pointer in the browser viewport are continuously collected at a preset fixed frequency. The vertical screen pixel coordinates represent the absolute physical pixel difference between the current mouse and the top of the viewport. In this embodiment, the preset fixed frequency is 16 milliseconds, corresponding to a 60-frame refresh rate. Call the underlying view resolver to extract the underlying reference node where the current mouse hover position is located, and use the browser's native getBoundingClientRect method to obtain the top and bottom physical pixel boundary values ​​of the reference node on the screen. For block-level content nodes, the vertical spatial proportion is calculated using a preset landing point offset calculation formula. The mathematical expression of the landing point offset calculation formula is: ; in, For the proportion of vertical space, This represents the current vertical screen pixel coordinates of the mouse pointer within the browser viewport. The physical pixel boundary value of the reference node on the screen. The physical pixel boundary value at the bottom of the screen for the reference node; The numerator represents the total physical pixel height of the reference node on the screen. This represents the physical pixel offset of the current mouse pointer from the top of the reference node where it lands; The underlying engine's state.doc.resolve(p_3) hierarchical parsing interface is called, and the target landing point index parameter is input for deep parsing. When the intention is determined to be before or after the insertion of a node, the interface outputs the direct parent node type identifier of the landing point reference node; when the intention is determined to be inside the node, the interface outputs the node type identifier of the landing point reference node itself as the parent type; at the same time, the structured slice data packet is read and its root node type identifier is extracted. The underlying syntax tree constraint validation interface is called, specifically the Node.canReplaceWith method provided by ProseMirror. The parent node type identifier and the root node type identifier of the dragged content are passed as joint input parameters to the syntax tree constraint validation interface. The syntax tree constraint validation interface queries the digital textbook Schema rule table defined during initialization to determine whether the target type is allowed to be a legal child node of the parent type and outputs the validation result. When the verification result is true, drive the Dropcursor extension component to render a highlighted horizontal auxiliary line with hexadecimal color code #00FF00 (green) at the top or bottom of the screen, and set the placement permission flag in global memory to true; When the validation result is false, i.e., an illegal nested scene, the color of the highlighted horizontal auxiliary line is redrawn to #FF0000 (red) warning. At the same time, the global placement allow flag is forcibly set to false, the native placement event is directly intercepted and discarded, and the dragged content will bounce back to its original position with an animation.

[0032] Before the user releases the mouse, this invention queries the digital textbook rule table to determine the legality of the extracted parent-child node nesting in advance, and provides the user with intuitive visual feedback by rendering different colored highlighted horizontal auxiliary lines. In conjunction with the setting of global memory flags, it can intercept illegal cross-level nesting operations from the source, avoiding destructive content cleaning caused by the underlying state machine due to structural collapse.

[0033] Step S5 includes the following sub-steps: Step S501: Intercept the placement event, extract the source node start index parameter, source node end index parameter and target landing point index parameter, and instantiate an atomic transaction object in the document state machine engine. The atomic transaction object is used to temporarily store all modification instructions for the document. Step S502: Call the deletion interface of the atomic transaction object, input the source node start index parameter and the source node end index parameter, and mark all nodes in the interval as removed; Step S503: Invoke the built-in mapping record matrix of the atomic transaction object and use the position mapping algorithm to calculate the actual insertion index parameter. The expression of the position mapping algorithm is: ; in, This is the calculated actual insertion index parameter, used to guide the write coordinates of the final slice data packet. The index parameter for the initially predicted target landing point. and These are the start and end absolute indices of the source node, respectively. This represents the absolute index length occupied by the deleted source node.

[0034] This invention utilizes atomic transaction objects to temporarily store all modification instructions, avoiding partial rendering anomalies caused by single operations. The position mapping algorithm avoids coordinate offset errors caused by the removal of upstream content when dragging from top to bottom by subtracting the absolute index length occupied by the deleted source node, thus ensuring the accuracy of the final slice data packet writing position.

[0035] Step S5 includes the following sub-steps: Step S504: Call the hierarchical parsing interface of the document state machine engine. Based on the actual insertion index parameter p4, call the hierarchical parsing interface to locate the target container node corresponding to the insertion position. Traverse the attribute dictionary of the target container node and extract the layout constraint parameter set. The layout constraint parameter set includes the physical pixel parameter of the total available width of the target container and the integer parameter of the number of columns of the target container. Step S505: Use the layout dynamic recalculation algorithm to overwrite the width attribute of the block-level child nodes inside the structured slice data packet to generate an adaptive slice data packet; extract the locked state data packet in global memory and overwrite the unique identifier string and attribute key-value pair dictionary contained therein into the root node attribute of the adaptive slice data packet. Step S506: Call the insertion interface of the atomic transaction object, passing in the actual insertion index parameter and the adaptive slice data package as parameters; attach the actual insertion index parameter as metadata to the atomic transaction object, and then call the dispatch interface of the document state machine engine to submit the atomic transaction object to the main thread to generate the modified final document abstract syntax tree.

[0036] In one specific embodiment of the present invention, the native placement events of the entire page are intercepted to prevent the browser's default text drag-and-drop behavior. Once the interception is successful, three core integer data are extracted. The three core integer data include: the source node starting index parameter, set to... This represents the original starting position of the source node in the document tree; The source node end index parameter is set to... This represents the original end position of the source node in the document tree; The target landing point index parameter is set to This represents the target landing point index parameter that is calculated and verified in real time during step S4. Simultaneously read the structured slice data packet extracted in step S3; In the underlying document state machine engine, a blank atomic transaction object is instantiated, and the delete interface of the atomic transaction object is called. The input parameter of the delete interface is... and The underlying document state machine engine records the interval within the transaction. All nodes within are marked as removed; After executing the deletion command, the position mapping is recalculated. The mapping record matrix built into the atomic transaction object is called, and the actual insertion index parameter is calculated using the position mapping algorithm. when When the user drags content from the top of the document to the bottom, since the content above is deleted, the target landing point index parameter below is subtracted from the length of the deleted content to locate the correct physical corresponding point. when This indicates that the user dragged content from below to above. The deletion of the source node occurs after the target node and will not affect the index sequence before the target node. The actual inserted index parameter... Maintain the original predicted position Consistent; Because dragging a parent node into its own child nodes is prohibited, therefore It is impossible to fall and between; Obtain the actual insertion index parameter To prevent container collapse and reflow chaos when dragging content directly into complex layout containers, dynamic recalculation of the layout is performed before insertion. Specifically, the underlying engine's hierarchical parsing interface is called to locate the target container node that contains the structured slice data packet. The attribute dictionary of the target container node is traversed to extract the set of layout constraint parameters. The set of layout constraint parameters includes the physical pixel parameter of the total available width of the target container and the integer parameter of the number of columns of the target container. The read structured slice data packet is used as a traversable trie to extract the integer parameter of the number of columns in the target container. And perform a validity check: If Then Forced assignment of 1; like Then, the layout dynamic recalculation algorithm is used to override the width attribute of all its internal block-level child nodes, such as image components and video containers. The mathematical expression of the layout dynamic recalculation algorithm is: ; in, This refers to the physical pixel parameter of the component width obtained after recalculation. The physical pixel parameter representing the total available width of the target container; The integer parameter for the number of columns in the target container; As a constant for column spacing, in this embodiment, the constant for column spacing is set to 16 pixels.

[0037] Replace the width attribute value of the original component in the structured slice data packet with the calculated W2 to generate the updated adaptive slice data packet. Before calling the insert interface, extract the locked state data packet and rewrite the unique identifier string and attribute key-value pair dictionary contained therein into the root node attribute of the adaptive slice data packet to complete the lossless inheritance of business data. Through this algorithm, when a component that was originally displayed in full width is dragged into a container with a three-column layout, its internal layout properties will be instantly scaled and reconstructed to perfectly fit the size of the target container node, while the original core business data is preserved. Call the insertion interface of the atomic transaction object to... The atomic transaction object internally records the data of the adaptive slice data packet that has been overwritten and passed in. arrive Delete and in Two sets of instructions for inserting slices at the specified location; The dispatch interface of the underlying document state machine engine is called to submit an atomic transaction object containing two sets of instructions to the main thread. When submitting, the actual insertion index parameter is attached to the object as metadata. After receiving the atomic transaction object, the engine generates the modified final document abstract syntax tree in memory at once.

[0038] When a large full-width component is dragged into a multi-column container, this invention actively detects the number of columns and available width of the target container, automatically overwrites the physical pixel parameters of the component for proportional reconstruction, eliminates container collapse and rearrangement chaos caused by size incompatibility, and, in conjunction with the pre-extracted locked state data packet, inherits core business data while completing visual layout scaling.

[0039] Step S6 includes the following sub-steps: Step S601: In response to the document update event, the sidebar directory extension component obtains the latest document abstract syntax tree output by the document state machine engine; and calls the depth-first traversal algorithm to perform a full scan of the document abstract syntax tree and extract the nodes whose node type identifier is marked as the title attribute. Step S602: For each title node, extract the unique identifier string bound to it and the absolute position index parameter of the title node in the current linear document structure. Encapsulate all the extracted identifiers and index parameters into an object array according to the document sequence. Use the object array to overwrite the directory tree structure of the user interface and update the position index of the corresponding title.

[0040] After responding to the underlying update event, the extended component captures the unique identifiers of all heading nodes and the latest reorganized absolute position indexes by performing a full scan of the latest output abstract syntax tree. It then dynamically overwrites the front-end user interface directory tree with these identifiers, ensuring that the sidebar outline can overcome physical delays and remain synchronized with the latest dynamically reorganized textbook structure.

[0041] Step S6 also includes the following sub-steps: Step S603: Read the actual insertion index parameter from the transaction metadata carried by the document update event, input the parameter into the coordinate mapping interface of the document state machine engine, output dictionary data containing physical coordinate information, and extract the absolute vertical physical pixel value of the distance between the top edge of the newly inserted node and the top of the webpage from the dictionary data. Step S604: Calculate the target scroll offset using the view scrolling algorithm, use the target scroll offset as the ordinate parameter, call the browser scrolling interface, configure the scrolling behavior attribute to smooth mode, so that the editor viewport automatically scrolls and focuses on the target position.

[0042] In a specific embodiment of the present invention, when the atomic jump transaction in step S5 is completed, the underlying document state machine engine will dispatch the latest document abstract syntax tree to the browser rendering engine and trigger a global document update event. At this time, it is necessary to solve the problem that the drag span is too large, causing the content to leave the visible area and the sidebar outline to fail. This process is achieved through the directory synchronization and automatic view alignment steps, triggering the global state synchronization mechanism. Specifically, data-level directory synchronization is performed. In the editor's memory, a sidebar directory extension component is built. The sidebar directory extension component registers a global listener for document update events. Upon receiving an update signal, the sidebar directory extension component obtains the latest document abstract syntax tree output by the underlying document state machine engine. The column directory extension component calls the depth-first traversal algorithm to perform a full scan of the structure of the latest document abstract syntax tree, extracts the nodes whose node type identifier is marked as the title attribute, and for each title node, extracts the unique identifier string of length 36 characters bound inside it, and the latest integer absolute position index parameter of the title node in the current linear document structure. All extracted identifiers and index parameters are encapsulated into an object array in document order. The sidebar directory extension component uses this object array to overwrite the directory tree DOM structure of the user interface and automatically update the ID position index of the corresponding title. Through this operation, it is ensured that the sidebar navigation can reflect the latest textbook structure after drag-and-drop reconstruction in real time and accurately. After the directory data synchronization is completed, the actual insertion index parameter is read from the transaction metadata carried by the document update event. The actual insertion index parameter is input into the coordinate mapping interface of the underlying document state machine. The coordinate mapping interface outputs dictionary data containing physical coordinate information by querying the browser's rendering tree in reverse. The absolute vertical physical pixel value of the distance between the top edge of the newly inserted node and the top of the entire webpage is extracted from the dictionary data. To prevent newly inserted nodes from being obscured by other fixed elements on the webpage, a view scrolling algorithm is used to calculate the final scroll offset. The mathematical expression for the view scrolling algorithm is: ; in, This represents the final calculated target scroll offset integer value, which is used to directly guide the final positioning of the browser scrollbar; This represents the absolute vertical physical pixel value of the top edge of the newly inserted node obtained in the previous step; The physical pixel height constant representing the fixed navigation bar at the top of the digital textbook editor; Represents the visual safety margin constant; In this embodiment, the height of the top fixed navigation bar is kept constant. Set the value to 60 pixels and the visual safety margin constant to 24 pixels; After calculating the target scroll offset, the target scroll offset is used as the ordinate parameter to call the browser's native window scrolling application interface and force its scrolling behavior attribute to be configured as smooth mode. After this operation is executed, the browser rendering engine takes over the main rendering thread of the page and calculates the interpolation at a refresh rate of 60 frames per second, so that the editor viewport automatically scrolls and smoothly focuses on the new position after the jump, completing the interaction loop.

[0043] This invention not only reverse-maps the absolute vertical coordinates of the top of the newly inserted node, but also specifically deducts the height of the top fixed navigation bar and the visual safety margin to calculate the target offset. Finally, it calls the browser scrolling interface in smooth mode to force the viewport to follow, effectively avoiding the problem that the newly inserted content will leave the visible area or be obscured by other fixed elements of the interface after the jump.

[0044] This invention responds to mouse movement and converts it into source node position parameters. It constructs a translation transformation matrix using absolute starting coordinates and anchors the interaction handle to the source node in real time. Visually and operationally, it effectively isolates the cursor editing state of the internal text from the operation state of the entire block of content. It provides a clear physical operation anchor point for deeply nested document logic structures. Before dragging is initiated, this method locks the source node by calling the node selection instruction of the document state machine engine. It pre-encapsulates the unique identifier and attribute key-value pairs carried by the node into a locked state data packet, which solves the problem that the underlying data is easily lost when the browser's native DOM is destroyed. It ensures that the core business data stored inside the node remains locked and is not lost during subsequent physical transfers. During drag-and-drop movement, this invention continuously collects the vertical screen pixel coordinates of the mouse in real time and calculates the vertical space ratio using the landing point offset calculation formula. This allows for accurate prediction of the user's true intention to insert the mouse before, inside, or after the landing point reference node. Combined with the hierarchical parsing interface and the syntax tree constraint verification interface, it can proactively determine the structural legality of the target type by querying the digital textbook rule table before the user releases the mouse. Based on the verification results, it dynamically renders different colored highlight auxiliary lines on the screen to provide intuitive visual feedback. Furthermore, it works with global flags to directly intercept native events in illegal nesting scenarios, greatly improving the standardization and security of digital textbook typesetting and editing. To address the adaptive behavior of multimedia components in complex column layouts, this invention, after intercepting placement events and performing position mapping recalculation, actively locates the target container node downwards and extracts its set of layout constraint parameters, such as the available total width and the number of columns. Before actually writing the slice data to the target position, a layout dynamic recalculation algorithm is used to dynamically overwrite and proportionally scale the width attributes of internal block-level child nodes, such as full-width image or video components, to generate adaptive slice data packages. This eliminates the container collapse and rearrangement chaos caused by forcibly dragging wide components into narrow column layout containers. At the same time, in conjunction with the attribute overwriting of locked state data packages, structured adaptive reconstruction is achieved while ensuring that the UI visuals adapt to the target container size. Upon responding to a document update event, this invention utilizes a depth-first traversal algorithm to fully scan the latest document abstract syntax tree, extracting the identifiers of all heading nodes and the latest absolute position index parameters. This process overwrites the directory tree object array on the interface in real time, ensuring that the sidebar navigation reflects the latest textbook structure after drag-and-drop reconstruction. The method extracts the absolute vertical physical pixel values ​​of newly inserted nodes through reverse coordinate mapping and, combined with the fixed height of the top navigation bar and the visual safety margin, uses a view scrolling algorithm to calculate the target scroll offset. This is then used to call the underlying scrolling interface and configure it to smooth mode, forcing the viewport to automatically focus on the new position after the jump. This prevents the reconstructed content from being obscured by other fixed elements on the webpage, ensuring visual continuity for users during in-depth editing processes.

[0045] Those skilled in the art will understand that embodiments of the present invention can be provided as methods, systems, or computer program products. Therefore, the present invention can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, the present invention can take the form of a computer program product implemented on one or more computer-usable storage media containing computer-usable program code. The storage medium can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as Static Random Access Memory (SRAM), Electrically Erasable Programmable Read-Only Memory (EEPROM), Erasable Programmable Read Only Memory (EPROM), Programmable Read-Only Memory (PROM), Read-Only Memory (ROM), magnetic storage, flash memory, magnetic disk, or optical disk. These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The function specified in one or more boxes.

[0046] It should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention and are not intended to limit it. Although the present invention has been described in detail with reference to preferred embodiments, those skilled in the art should understand that modifications or equivalent substitutions can be made to the technical solutions of the present invention without departing from the spirit and scope of the technical solutions of the present invention, and all such modifications or substitutions should be covered within the protection scope of the present invention.

Claims

1. A method for dynamic reconstruction and structured processing of digital textbook layout, characterized in that, Includes the following steps: Step S1: Respond to mouse movement events, capture mouse screen pixel coordinates and convert them into source node position parameters, calculate the screen coordinates of the source node based on the source node position parameters, and construct a translation transformation matrix to render the interaction handle to one side of the source node. Step S2: Respond to the click operation of the interaction handle, call the node selection instruction of the document state machine engine to lock the source node, extract the unique identifier and attribute key-value pairs of the source node, and encapsulate them to generate a locked state data packet; Step S3: Respond to the drag start event, read the boundary data of the locked source node, call the slice extraction interface of the document state machine engine, extract the structured slice data packet from the document abstract syntax tree and write it into the drag transport layer. Step S4: During the dragging and moving process, collect the vertical screen pixel coordinates of the mouse, calculate the vertical space ratio to determine the insertion position, call the hierarchical parsing interface and the syntax tree constraint verification interface to determine the structural legality of the target position, and display auxiliary lines according to the verification results; Step S5: Respond to the placement event, extract the source node start index parameter, source node end index parameter, and target landing point index parameter, create an atomic transaction object, perform deletion operation and position mapping recalculation, perform dynamic layout recalculation, perform insertion operation, and dispatch the transaction to complete document reconstruction; Step S6: Respond to the document update event, traverse the updated document abstract syntax tree, synchronously update the sidebar directory data, calculate the scroll offset, and call the browser scroll interface to smoothly scroll the view to the target position.

2. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 1, characterized in that, Step S1 includes the following sub-steps: Step S101: Register a mouse movement event listener on the outermost container of the editor, preset the debounce period, and record only the last physical position of continuous mouse movements within the debounce period; when the mouse moves into the area where the source node is located, extract the screen pixel coordinates of the mouse pointer position, where the screen pixel coordinates represent the horizontal and vertical physical distances of the current mouse pointer from the upper left corner of the browser viewport. Step S102: Call the pixel-to-position conversion method of the document state machine engine to convert the screen pixel coordinates into source node position parameters. The source node position parameters represent the absolute index value of the node where the mouse is currently hovering in the entire linear document structure. Call the document state machine engine's position-to-pixel conversion method, input the source node position parameter, and calculate the absolute starting coordinates of the top left corner of the source node's border on the screen in reverse; Step S103: Construct a translation transformation matrix based on the absolute starting coordinates, assign the translation transformation matrix to the transformation attribute of the interaction handle component, and anchor the interaction handle to one side of the source node in real time.

3. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 2, characterized in that, Step S2 includes the following sub-steps: Step S201: Receive a single click event signal generated when the user presses the interaction handle, and extract the source node position parameter from the context bound to the click event; Step S202: Invoke the node selection instruction of the document state machine engine, pass the source node position parameter to the document state machine engine, the document state machine engine finds the corresponding source node according to the source node position parameter and calculates the closed boundary of the source node, replaces the selection state in the memory stack with the overall mapping of the source node, and generates a node selection object. Step S203: Call the parsing interface of the document abstract syntax tree, read the unique identifier string and attribute key-value pair dictionary carried by the source node object, and combine and encapsulate them into a locked state data packet.

4. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 3, characterized in that, Step S3 includes the following sub-steps: Step S301: Listen for the drag start event bound to the interaction handle component. When the user presses and holds the interaction handle and the mouse moves more than the preset anti-mistouch constant on the physical plane of the screen, trigger the drag start event signal. Step S302: In response to the drag start event signal, read the boundary data of the locked source node, the boundary data including the source node start index parameter and the source node end index parameter; Step S303: Call the slice extraction interface of the document state machine engine, take the global abstract syntax tree of the document as the processing object, take the source node start index parameter and the source node end index parameter as input parameters, locate all tree nodes with the source node start index parameter as the starting point and the source node end index parameter as the ending point according to the depth-first traversal algorithm, perform a deep copy operation, and output the structured slice data packet.

5. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 4, characterized in that, Step S4 includes the following sub-steps: Step S401: When the mouse is in a drag-and-drop state, continuously collect the vertical screen pixel coordinates of the mouse pointer in the browser viewport at a preset frequency. Step S402: Call the underlying view resolver to extract the reference node of the current mouse hover position, and obtain the top physical pixel boundary value and bottom physical pixel boundary value of the reference node on the screen. Step S403: Calculate the vertical space ratio using the landing point offset calculation formula, and set the first space judgment threshold and the second space judgment threshold. If the vertical space ratio is less than the first space judgment threshold, it is determined that the user's intention is to insert before the landing reference node, and the target landing index parameter is assigned the logical starting index value of the landing reference node. If the vertical space ratio is greater than or equal to the first space judgment threshold and less than or equal to the second space judgment threshold, it is determined that the user's intention is to insert into the landing reference node, and the target landing index parameter is assigned to the available start or end index value inside the landing reference node. If the vertical space ratio is greater than the second space judgment threshold, it is determined that the user's intention is to insert after the landing reference node, and the target landing index parameter is assigned to the logical end index value of the landing reference node.

6. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 5, characterized in that, Step S4 further includes the following sub-steps: Step S404: Call the hierarchical parsing interface of the document state machine engine, input the target landing point index parameter, output the direct parent node type identifier of the newly inserted node, read the structured slice data packet, and extract the root node type identifier inside it. Step S405: Call the syntax tree constraint verification interface, take the parent node type identifier and the root node type identifier as input parameters, query the digital textbook rule table, and determine whether the target type is allowed to be a legal child node of the parent type; Step S406: When the verification result is true, render a highlighted horizontal auxiliary line of the first color on the screen and set the placement allow flag in global memory to true; when the verification result is false, redraw the color of the highlighted horizontal auxiliary line to the second color and set the global placement allow flag to false. When the placement permission flag is true, delete, position mapping recalculation, layout dynamic recalculation, and insertion operations are performed. When the placement permission flag is false, the placement process is terminated.

7. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 6, characterized in that, Step S5 includes the following sub-steps: Step S501: Intercept the placement event, extract the source node start index parameter, source node end index parameter and target landing point index parameter, and instantiate an atomic transaction object in the document state machine engine. The atomic transaction object is used to temporarily store all modification instructions for the document. Step S502: Call the deletion interface of the atomic transaction object, input the source node start index parameter and the source node end index parameter, and mark all nodes in the interval as removed; Step S503: Invoke the mapping record matrix built into the atomic transaction object, and use the position mapping algorithm to calculate the actual insertion index parameter. The expression of the position mapping algorithm is: ； in, This is the calculated actual insertion index parameter, used to guide the write coordinates of the final slice data packet. The index parameter for the initially predicted target landing point. and These are the start and end absolute indices of the source node, respectively.

8. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 7, characterized in that, Step S5 includes the following sub-steps: Step S504: Call the hierarchical parsing interface of the document state machine engine. Based on the actual insertion index parameter p4, call the hierarchical parsing interface to locate the target container node corresponding to the insertion position. Traverse the attribute dictionary of the target container node and extract the layout constraint parameter set. The layout constraint parameter set includes the physical pixel parameter of the total available width of the target container and the integer parameter of the number of columns of the target container. Step S505: Use the layout dynamic recalculation algorithm to overwrite the width attribute of the block-level child nodes inside the structured slice data packet to generate an adaptive slice data packet. Extract the lock state data packet from global memory, and overwrite the unique identifier string and attribute key-value pair dictionary contained therein into the root node attribute of the adaptive slice data packet; Step S506: Call the insertion interface of the atomic transaction object, and pass in the actual insertion index parameter and the adaptive slice data packet as parameters; The actual insertion index parameter is appended as metadata to the atomic transaction object. Then, the dispatch interface of the document state machine engine is called to submit the atomic transaction object to the main thread, generating the modified final document abstract syntax tree.

9. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 8, characterized in that, Step S6 includes the following sub-steps: Step S601: In response to the document update event, the sidebar directory extension component obtains the latest document abstract syntax tree output by the document state machine engine; and calls the depth-first traversal algorithm to perform a full scan of the document abstract syntax tree and extract the nodes whose node type identifier is marked as the title attribute. Step S602: For each title node, extract the unique identifier string bound to it and the absolute position index parameter of the title node in the current linear document structure. Encapsulate all the extracted identifiers and index parameters into an object array according to the document sequence. Use the object array to overwrite the directory tree structure of the user interface and update the position index of the corresponding title.

10. The method for dynamic reconstruction and structured processing of digital textbook layout as described in claim 9, characterized in that, Step S6 further includes the following sub-steps: Step S603: Read the actual insertion index parameter from the transaction metadata carried by the document update event, input the parameter into the coordinate mapping interface of the document state machine engine, output dictionary data containing physical coordinate information, and extract the absolute vertical physical pixel value of the distance between the top edge of the newly inserted node and the top of the webpage from the dictionary data. Step S604: Calculate the target scroll offset using the view scrolling algorithm, use the target scroll offset as the ordinate parameter, call the browser scrolling interface, configure the scrolling behavior attribute to smooth mode, so that the editor viewport automatically scrolls and focuses on the target position.

Images