retold-content-system 1.0.12 → 1.0.13

package/web-application/retold-content-system.js

@@ -2781,18 +2781,45 @@ let tmpCached=tmpBrowseProvider.getChildFolders(pPath);if(!tmpCached){if(typeof
 	 * Get the current location from state.
 	 *
 	 * @returns {string} The current location path
-	 */getCurrentLocation(){let tmpStateAddresses=this.options.StateAddresses||{};let tmpAddress=tmpStateAddresses.CurrentLocation||'AppData.PictFileBrowser.CurrentLocation';return this.pict.manifest.getValueByHash({AppData:this.pict.AppData,Pict:this.pict},tmpAddress)||'';}}module.exports=PictViewFileBrowserBrowseTree;module.exports.default_configuration=_ViewConfiguration;},{"pict-view":88}],72:[function(require,module,exports){const libPictView=require('pict-view');const _ViewConfiguration={"ViewIdentifier":"Pict-FileBrowser-ListDetail","DefaultRenderable":"ListDetail-Container","DefaultDestinationAddress":"#Pict-FileBrowser-ListPane","AutoRender":false,"Templates":[{"Hash":"FileBrowser-ListDetail-Container-Template","Template":/*html*/"\n<div class=\"pict-fb-detail\" id=\"Pict-FileBrowser-DetailList\">\n\t<div class=\"pict-fb-breadcrumb\" id=\"Pict-FileBrowser-Breadcrumb\"></div>\n\t<div class=\"pict-fb-detail-header\">\n\t\t<div class=\"pict-fb-detail-header-cell pict-fb-detail-col-name\" onclick=\"pict.views['{~D:Record.ViewHash~}'].sortBy('Name')\">Name</div>\n\t\t<div class=\"pict-fb-detail-header-cell pict-fb-detail-col-size\" onclick=\"pict.views['{~D:Record.ViewHash~}'].sortBy('Size')\">Size</div>\n\t\t<div class=\"pict-fb-detail-header-cell pict-fb-detail-col-modified\" onclick=\"pict.views['{~D:Record.ViewHash~}'].sortBy('Modified')\">Modified</div>\n\t</div>\n\t<div id=\"Pict-FileBrowser-DetailRows\"></div>\n</div>\n"},{"Hash":"FileBrowser-ListDetail-Row-Template","Template":/*html*/"\n<div class=\"pict-fb-detail-row{~D:Record.SelectedClass~}\" data-index=\"{~D:Record.Index~}\" onclick=\"{~D:Record.ClickHandler~}\" ondblclick=\"{~D:Record.DblClickHandler~}\">\n\t<span class=\"pict-fb-detail-icon\">{~D:Record.Icon~}</span>\n\t<span class=\"pict-fb-detail-name\">{~D:Record.Name~}</span>\n\t<span class=\"pict-fb-detail-size\">{~D:Record.SizeFormatted~}</span>\n\t<span class=\"pict-fb-detail-modified\">{~D:Record.ModifiedFormatted~}</span>\n</div>\n"},{"Hash":"FileBrowser-ListDetail-Empty-Template","Template":/*html*/"<div class=\"pict-fb-empty\">{~D:Record.Message~}</div>"},{"Hash":"FileBrowser-Breadcrumb-Segment-Template","Template":/*html*/"<span class=\"pict-fb-breadcrumb-segment\" onclick=\"{~D:Record.ClickHandler~}\">{~D:Record.Label~}</span>"},{"Hash":"FileBrowser-Breadcrumb-Separator-Template","Template":/*html*/"<span class=\"pict-fb-breadcrumb-separator\">/</span>"},{"Hash":"FileBrowser-Breadcrumb-Current-Template","Template":/*html*/"<span class=\"pict-fb-breadcrumb-current\">{~D:Record.Label~}</span>"}],"Renderables":[{"RenderableHash":"ListDetail-Container","TemplateHash":"FileBrowser-ListDetail-Container-Template","DestinationAddress":"#Pict-FileBrowser-ListPane","RenderMethod":"replace"}]};/**
+	 */getCurrentLocation(){let tmpStateAddresses=this.options.StateAddresses||{};let tmpAddress=tmpStateAddresses.CurrentLocation||'AppData.PictFileBrowser.CurrentLocation';return this.pict.manifest.getValueByHash({AppData:this.pict.AppData,Pict:this.pict},tmpAddress)||'';}}module.exports=PictViewFileBrowserBrowseTree;module.exports.default_configuration=_ViewConfiguration;},{"pict-view":88}],72:[function(require,module,exports){const libPictView=require('pict-view');// Chunked rendering constants — for folders with very large file counts
+// we render rows in chunks via requestAnimationFrame so the main thread
+// stays responsive instead of freezing on one massive assignContent call.
+const _CHUNKED_RENDER_THRESHOLD=500;const _CHUNK_FIRST_SIZE=200;const _CHUNK_SUBSEQUENT_SIZE=400;const _ViewConfiguration={"ViewIdentifier":"Pict-FileBrowser-ListDetail","DefaultRenderable":"ListDetail-Container","DefaultDestinationAddress":"#Pict-FileBrowser-ListPane","AutoRender":false,"Templates":[{"Hash":"FileBrowser-ListDetail-Container-Template","Template":/*html*/"\n<div class=\"pict-fb-detail\" id=\"Pict-FileBrowser-DetailList\">\n\t<div class=\"pict-fb-breadcrumb\" id=\"Pict-FileBrowser-Breadcrumb\"></div>\n\t<div class=\"pict-fb-detail-header\">\n\t\t<div class=\"pict-fb-detail-header-cell pict-fb-detail-col-name\" onclick=\"pict.views['{~D:Record.ViewHash~}'].sortBy('Name')\">Name</div>\n\t\t<div class=\"pict-fb-detail-header-cell pict-fb-detail-col-size\" onclick=\"pict.views['{~D:Record.ViewHash~}'].sortBy('Size')\">Size</div>\n\t\t<div class=\"pict-fb-detail-header-cell pict-fb-detail-col-modified\" onclick=\"pict.views['{~D:Record.ViewHash~}'].sortBy('Modified')\">Modified</div>\n\t</div>\n\t<div id=\"Pict-FileBrowser-DetailRows\"></div>\n</div>\n"},{"Hash":"FileBrowser-ListDetail-Row-Template","Template":/*html*/"\n<div class=\"pict-fb-detail-row{~D:Record.SelectedClass~}\" data-index=\"{~D:Record.Index~}\" onclick=\"{~D:Record.ClickHandler~}\" ondblclick=\"{~D:Record.DblClickHandler~}\">\n\t<span class=\"pict-fb-detail-icon\">{~D:Record.Icon~}</span>\n\t<span class=\"pict-fb-detail-name\">{~D:Record.Name~}</span>\n\t<span class=\"pict-fb-detail-size\">{~D:Record.SizeFormatted~}</span>\n\t<span class=\"pict-fb-detail-modified\">{~D:Record.ModifiedFormatted~}</span>\n</div>\n"},{"Hash":"FileBrowser-ListDetail-Empty-Template","Template":/*html*/"<div class=\"pict-fb-empty\">{~D:Record.Message~}</div>"},{"Hash":"FileBrowser-Breadcrumb-Segment-Template","Template":/*html*/"<span class=\"pict-fb-breadcrumb-segment\" onclick=\"{~D:Record.ClickHandler~}\">{~D:Record.Label~}</span>"},{"Hash":"FileBrowser-Breadcrumb-Separator-Template","Template":/*html*/"<span class=\"pict-fb-breadcrumb-separator\">/</span>"},{"Hash":"FileBrowser-Breadcrumb-Current-Template","Template":/*html*/"<span class=\"pict-fb-breadcrumb-current\">{~D:Record.Label~}</span>"}],"Renderables":[{"RenderableHash":"ListDetail-Container","TemplateHash":"FileBrowser-ListDetail-Container-Template","DestinationAddress":"#Pict-FileBrowser-ListPane","RenderMethod":"replace"}]};/**
  * Listing view that shows files in a detailed table with columns for
  * name, size, and modified date.
  *
  * Supports sorting by column header click and single-click selection
  * with double-click to open folders.
- */class PictViewFileBrowserListDetail extends libPictView{constructor(pFable,pOptions,pServiceHash){let tmpOptions=Object.assign({},_ViewConfiguration,pOptions);super(pFable,tmpOptions,pServiceHash);this._cachedFileList=[];}/**
+ */class PictViewFileBrowserListDetail extends libPictView{constructor(pFable,pOptions,pServiceHash){let tmpOptions=Object.assign({},_ViewConfiguration,pOptions);super(pFable,tmpOptions,pServiceHash);this._cachedFileList=[];// Chunked render state
+this._activeRebuildFrame=null;this._activeRebuildToken=0;}/**
+	 * Cancel any in-flight chunked rebuild so it does not overlap with a
+	 * fresh navigation.
+	 */_cancelActiveRebuild(){if(this._activeRebuildFrame!==null&&typeof cancelAnimationFrame==='function'){cancelAnimationFrame(this._activeRebuildFrame);this._activeRebuildFrame=null;}this._activeRebuildToken++;}/**
 	 * After rendering the container shell, populate the rows.
 	 */onAfterRender(pRenderable){// Render the container with the view hash
 let tmpContainerHTML=this.pict.parseTemplateByHash('FileBrowser-ListDetail-Container-Template',{ViewHash:this.Hash});this.pict.ContentAssignment.assignContent('#Pict-FileBrowser-ListPane',tmpContainerHTML);this.rebuildList();this.rebuildBreadcrumb();this.pict.CSSMap.injectCSS();return super.onAfterRender(pRenderable);}/**
 	 * Rebuild the file list rows.
-	 */rebuildList(){let tmpListProvider=this.pict.providers['Pict-FileBrowser-List'];if(!tmpListProvider){return;}let tmpFileList=tmpListProvider.getSortedFileList();this._cachedFileList=tmpFileList;let tmpSelectedFile=tmpListProvider.getSelectedFile();if(tmpFileList.length===0){let tmpEmptyHTML=this.pict.parseTemplateByHash('FileBrowser-ListDetail-Empty-Template',{Message:'This folder is empty'});this.pict.ContentAssignment.assignContent('#Pict-FileBrowser-DetailRows',tmpEmptyHTML);return;}let tmpHTML='';for(let i=0;i<tmpFileList.length;i++){let tmpEntry=tmpFileList[i];let tmpIsSelected=tmpSelectedFile&&tmpSelectedFile.Name===tmpEntry.Name&&tmpSelectedFile.Path===tmpEntry.Path;let tmpRecord={Index:i,Name:tmpEntry.Name,Icon:tmpListProvider.getEntryIcon(tmpEntry),SizeFormatted:tmpEntry.Type==='folder'?'--':tmpListProvider.formatFileSize(tmpEntry.Size),ModifiedFormatted:tmpListProvider.formatDate(tmpEntry.Modified),SelectedClass:tmpIsSelected?' selected':'',ClickHandler:"pict.views['"+this.Hash+"'].selectEntry("+i+")",DblClickHandler:"pict.views['"+this.Hash+"'].openEntry("+i+")"};tmpHTML+=this.pict.parseTemplateByHash('FileBrowser-ListDetail-Row-Template',tmpRecord);}this.pict.ContentAssignment.assignContent('#Pict-FileBrowser-DetailRows',tmpHTML);}/**
+	 *
+	 * For folders with more than _CHUNKED_RENDER_THRESHOLD items, the render
+	 * is split into chunks scheduled via requestAnimationFrame so the main
+	 * thread stays responsive. Smaller folders use the synchronous fast path.
+	 */rebuildList(){// Cancel any in-flight chunked rebuild from a previous folder
+this._cancelActiveRebuild();let tmpListProvider=this.pict.providers['Pict-FileBrowser-List'];if(!tmpListProvider){return;}let tmpFileList=tmpListProvider.getSortedFileList();this._cachedFileList=tmpFileList;let tmpSelectedFile=tmpListProvider.getSelectedFile();if(tmpFileList.length===0){let tmpEmptyHTML=this.pict.parseTemplateByHash('FileBrowser-ListDetail-Empty-Template',{Message:'This folder is empty'});this.pict.ContentAssignment.assignContent('#Pict-FileBrowser-DetailRows',tmpEmptyHTML);return;}// SMALL FOLDER FAST PATH — keep the existing synchronous behavior
+// for normal-sized folders so there's no perceptible change.
+if(tmpFileList.length<=_CHUNKED_RENDER_THRESHOLD){let tmpHTML='';for(let i=0;i<tmpFileList.length;i++){tmpHTML+=this._buildRowHTML(tmpFileList[i],i,tmpSelectedFile);}this.pict.ContentAssignment.assignContent('#Pict-FileBrowser-DetailRows',tmpHTML);return;}// LARGE FOLDER CHUNKED PATH — paint a loading row immediately, then
+// fill rows in chunks via requestAnimationFrame.
+let tmpLoadingHTML='<div class="retold-remote-filebrowser-loading-row">'+'Loading '+tmpFileList.length.toLocaleString()+' items\u2026'+'</div>';this.pict.ContentAssignment.assignContent('#Pict-FileBrowser-DetailRows',tmpLoadingHTML);this._rebuildListChunked(tmpFileList,tmpSelectedFile);}/**
+	 * Build the HTML for a single row. Extracted so both the fast path
+	 * and the chunked path can share it.
+	 */_buildRowHTML(pEntry,pIndex,pSelectedFile){let tmpListProvider=this.pict.providers['Pict-FileBrowser-List'];let tmpIsSelected=pSelectedFile&&pSelectedFile.Name===pEntry.Name&&pSelectedFile.Path===pEntry.Path;let tmpRecord={Index:pIndex,Name:pEntry.Name,Icon:tmpListProvider.getEntryIcon(pEntry),SizeFormatted:pEntry.Type==='folder'?'--':tmpListProvider.formatFileSize(pEntry.Size),ModifiedFormatted:tmpListProvider.formatDate(pEntry.Modified),SelectedClass:tmpIsSelected?' selected':'',ClickHandler:"pict.views['"+this.Hash+"'].selectEntry("+pIndex+")",DblClickHandler:"pict.views['"+this.Hash+"'].openEntry("+pIndex+")"};return this.pict.parseTemplateByHash('FileBrowser-ListDetail-Row-Template',tmpRecord);}/**
+	 * Render the file list into chunks via requestAnimationFrame.
+	 * After the first chunk replaces the loading row, each subsequent
+	 * chunk is appended to the rows container.
+	 */_rebuildListChunked(pFileList,pSelectedFile){let tmpSelf=this;let tmpToken=++this._activeRebuildToken;let tmpTotal=pFileList.length;let tmpOffset=0;let _renderNextChunk2=function _renderNextChunk(){if(tmpToken!==tmpSelf._activeRebuildToken){return;}let tmpRowsContainer=document.getElementById('Pict-FileBrowser-DetailRows');if(!tmpRowsContainer){return;}let tmpChunkSize=tmpOffset===0?_CHUNK_FIRST_SIZE:_CHUNK_SUBSEQUENT_SIZE;let tmpEnd=Math.min(tmpOffset+tmpChunkSize,tmpTotal);let tmpChunkHTML='';for(let i=tmpOffset;i<tmpEnd;i++){tmpChunkHTML+=tmpSelf._buildRowHTML(pFileList[i],i,pSelectedFile);}if(tmpOffset===0){// Replace the loading row on the first chunk
+tmpRowsContainer.innerHTML=tmpChunkHTML;}else{// Append subsequent chunks
+tmpRowsContainer.insertAdjacentHTML('beforeend',tmpChunkHTML);}tmpOffset=tmpEnd;if(tmpOffset<tmpTotal){tmpSelf._activeRebuildFrame=requestAnimationFrame(_renderNextChunk2);}else{tmpSelf._activeRebuildFrame=null;}};if(typeof requestAnimationFrame==='function'){this._activeRebuildFrame=requestAnimationFrame(_renderNextChunk2);}else{// No rAF (shouldn't happen in a browser, but be safe) — fall back
+// to synchronous render
+_renderNextChunk2();while(tmpOffset<tmpTotal){_renderNextChunk2();}}}/**
 	 * Rebuild the breadcrumb navigation bar.
 	 */rebuildBreadcrumb(){let tmpCurrentLocation=this.getCurrentLocation();let tmpHTML='';// Root segment — use SVG home icon if provider is available
 let tmpIconProvider=this.pict.providers['Pict-FileBrowser-Icons'];let tmpHomeLabel=tmpIconProvider?tmpIconProvider.getIcon('home',16):'\uD83C\uDFE0';tmpHTML+=this.pict.parseTemplateByHash('FileBrowser-Breadcrumb-Segment-Template',{Label:tmpHomeLabel,ClickHandler:"pict.views['"+this.Hash+"'].navigateToPath('')"});if(tmpCurrentLocation){let tmpParts=tmpCurrentLocation.split('/');let tmpAccumulatedPath='';for(let i=0;i<tmpParts.length;i++){tmpAccumulatedPath=tmpAccumulatedPath?tmpAccumulatedPath+'/'+tmpParts[i]:tmpParts[i];tmpHTML+=this.pict.parseTemplateByHash('FileBrowser-Breadcrumb-Separator-Template',{});if(i===tmpParts.length-1){// Last segment — not clickable
@@ -3770,13 +3797,29 @@ this.pict.ContentAssignment.projectContent(pRenderable.RenderMethod,pRenderable.
 	 *
 	 * @param {Renderable} pRenderable - The renderable that was rendered.
 	 */onAfterRender(pRenderable){if(this.pict.LogNoisiness>3){this.log.trace("PictView [".concat(this.UUID,"]::[").concat(this.Hash,"] ").concat(this.options.ViewIdentifier," onAfterRender:"));}if(pRenderable&&pRenderable.RootRenderableViewHash===this.Hash){const tmpTransactionQueue=this.pict.TransactionTracking.clearTransactionQueue(pRenderable.TransactionHash)||[];for(const tmpEvent of tmpTransactionQueue){const tmpView=this.pict.views[tmpEvent.Data.ViewHash];if(!tmpView){this.log.error("PictView [".concat(this.UUID,"]::[").concat(this.Hash,"] ").concat(this.options.ViewIdentifier," onAfterRender: Could not find view for transaction hash ").concat(pRenderable.TransactionHash," and ViewHash ").concat(tmpEvent.Data.ViewHash,"."));continue;}tmpView.onAfterProject();// Execute the developer-overridable post-render behavior
-tmpView.onAfterRender(tmpEvent.Data.Renderable);}}return true;}/**
+tmpView.onAfterRender(tmpEvent.Data.Renderable);}// Queue is drained and nested child renders have each cleaned up
+// their own transactions; remove this root render's entry from
+// the tracking map so it does not leak.
+this.pict.TransactionTracking.unregisterTransaction(pRenderable.TransactionHash);}return true;}/**
 	 * Lifecycle hook that triggers after the view is rendered (async flow).
 	 *
 	 * @param {ErrorCallback} fCallback - The callback to call when the async operation is complete.
 	 * @param {Renderable} pRenderable - The renderable that was rendered.
-	 */onAfterRenderAsync(fCallback,pRenderable){this.onAfterRender(pRenderable);const tmpAnticipate=this.fable.newAnticipate();if(pRenderable&&pRenderable.RootRenderableViewHash===this.Hash){const queue=this.pict.TransactionTracking.clearTransactionQueue(pRenderable.TransactionHash)||[];for(const event of queue){/** @type {PictView} */const tmpView=this.pict.views[event.Data.ViewHash];if(!tmpView){this.log.error("PictView [".concat(this.UUID,"]::[").concat(this.Hash,"] ").concat(this.options.ViewIdentifier," onAfterRenderAsync: Could not find view for transaction hash ").concat(pRenderable.TransactionHash," and ViewHash ").concat(event.Data.ViewHash,"."));continue;}tmpAnticipate.anticipate(tmpView.onAfterProjectAsync.bind(tmpView));tmpAnticipate.anticipate(fNext=>{tmpView.onAfterRenderAsync(fNext,event.Data.Renderable);});// Execute the developer-overridable post-render behavior
-}}return tmpAnticipate.wait(fCallback);}/**
+	 */onAfterRenderAsync(fCallback,pRenderable){// NOTE: this.onAfterRender(pRenderable) will itself clear the
+// transaction queue and unregister the transaction if this view is
+// the root renderable - see onAfterRender above. So by the time the
+// loop below runs, the queue is already empty and there is nothing
+// to drain. Keeping the async queue walk here defensively in case
+// future subclasses override onAfterRender in ways that skip the
+// drain, but the common path is now "sync drain, async no-op".
+this.onAfterRender(pRenderable);const tmpAnticipate=this.fable.newAnticipate();const tmpIsRootRenderable=pRenderable&&pRenderable.RootRenderableViewHash===this.Hash;if(tmpIsRootRenderable){const queue=this.pict.TransactionTracking.clearTransactionQueue(pRenderable.TransactionHash)||[];for(const event of queue){/** @type {PictView} */const tmpView=this.pict.views[event.Data.ViewHash];if(!tmpView){this.log.error("PictView [".concat(this.UUID,"]::[").concat(this.Hash,"] ").concat(this.options.ViewIdentifier," onAfterRenderAsync: Could not find view for transaction hash ").concat(pRenderable.TransactionHash," and ViewHash ").concat(event.Data.ViewHash,"."));continue;}tmpAnticipate.anticipate(tmpView.onAfterProjectAsync.bind(tmpView));tmpAnticipate.anticipate(fNext=>{tmpView.onAfterRenderAsync(fNext,event.Data.Renderable);});// Execute the developer-overridable post-render behavior
+}}return tmpAnticipate.wait(pError=>{// Nested virtual-assignment children have now settled their own
+// onAfterRenderAsync chains (and unregistered their own
+// transactions along the way). Ensure this root render's entry
+// is also gone - unregisterTransaction is a no-op if the sync
+// onAfterRender above already removed it, so this is safe to
+// call unconditionally on the root path.
+if(tmpIsRootRenderable&&pRenderable&&pRenderable.TransactionHash){this.pict.TransactionTracking.unregisterTransaction(pRenderable.TransactionHash);}return fCallback(pError);});}/**
 	 * Lifecycle hook that triggers after the view is projected into the DOM.
 	 *
 	 * @param {Renderable} pRenderable - The renderable that was projected.