32cd2100d9dd11140705c848850e86c4f79191c4
max
Tue Sep 1 07:02:04 2026 -0700
Reusable "view snapshot" sessions for durable, minimal Share-a-link links
"Share a link" could only share the whole cart: it saved a session holding
every track, setting and position, which bloated the central db and leaked
the sharer's unrelated tracks to whoever opened the link. Anonymous share
sessions (under the reserved user "l") were also never reaped, so they
accumulated forever, and their 8-char names were generated client-side with
no uniqueness check, so two shares could collide and silently overwrite.
Adds a lightweight "snapshot session" facility (lib/snapshotSession.c): a
snapshot stores only the handful of cart variables a feature declares (a
registered snapshotType, e.g. "blat" -> {db, blatLastBigBed}), moves only
those variables' trash files into durable sessionData storage, and is saved
under a "__"-prefixed name. The "__" marks it machine-made: hidden from the
My Sessions list by default and eligible for reaping. For the anonymous "l"
owner the durable files fan out over two extra hash levels so one directory
never fills with millions of entries.
Every anonymous link now shares one server-side name generator
(snapshotNewName): a unique (db-checked), crypto-strong, "__"-prefixed token,
so tokens never collide. The hgSession doSaveSessionJson endpoint gained
hgS_snapshotType (save a minimal snapshot rather than the whole cart) and
hgS_doAnonName (reserve a unique anonymous name without saving, so the
top-right dialog can preview the exact link before it is created).
Wired three callers to the facility:
- hgc htcBlatAlign "Share a link": a minimal "blat" snapshot instead of a
full-cart anonymous session.
- hgBlat results "Share a link": creates a "blat" snapshot on click and
reveals its ?u=&s= reopen link (rebuilt from the durable bigPsl by the
existing doShareReopen), replacing the trash-only reveal.
- top-right "Share a link": anonymous links use the reserved server name;
logged-in named shares are unchanged.
snapshotReaper (hg/utils) garbage-collects abandoned anonymous snapshots: it
deletes user "l" "__" rows whose lastUse is older than the TTL (hg.conf
snapshot.ttlDays, default ~4 years) and removes their durable files. lastUse
is bumped on every open by the existing session load, so a link stays alive
as long as it is used. Meant to run from the trash-cleaner cron.
Also folds in the recent Share-dialog work in these files: the auto share
name is a short "_" prefix instead of "share_", the dialog previews the link
and creates it only when the button is clicked (no orphan session just from
opening the dialog), an optional name field with an overwrite warning, and
the anonymous save path forces the reap-eligible "__" name.
refs #38197
diff --git src/hg/js/hgSession.js src/hg/js/hgSession.js
index a1dda41235a..1cba1a3abdd 100644
--- src/hg/js/hgSession.js
+++ src/hg/js/hgSession.js
@@ -1,834 +1,835 @@
// hgSession.js - the experimental client-rendered "My Sessions" page.
//
// An opt-in modern alternative to the classic server-rendered hgSession page, applying hgBlat's
// facelift strategy (#37996): hgSession.c emits the session list and page config as an inline JSON
// global (hgSessionData) into an empty #sessionApp container, and this file builds the UI - a
// save-current-view card, a searchable/sortable DataTable of saved sessions with inline
// Overwrite/Share/Edit/Delete, and an "Advanced" panel for loading and backup.
//
// The inline table actions POST to small JSON endpoints in hgSession.c (hgS_doDeleteJson, etc.) and
// update the table in place. Navigation actions (load a session, load from URL/file, save to file,
// reset) are ordinary form submits/links against the existing hgSession actions.
//
// Styling: shared house-style components in gbModern.css (.gbPill, .gbCard, .gbModal*, .gbTable,
// .gbBanner, .gbSection), session-specific layout in hgSession.css.
/* global $, hgSessionData, convertTitleTagsToMouseovers, htmlEncode, commify, gbShowTimingDialog */
// Cart action variables (must match the hgs* defines in hgSession.h; hgSessionPrefix is "hgS_").
var SESS_ACT = {
save: 'hgS_doSaveSessionJson',
rename: 'hgS_doRenameSessionJson',
del: 'hgS_doDeleteJson',
share: 'hgS_doShareJson',
gallery: 'hgS_doGalleryJson',
overwrite: 'hgS_doOverwriteJson',
describe: 'hgS_doDescribeJson'
};
var SESS_P = {
oldName: 'hgS_oldSessionName',
newName: 'hgS_newSessionName',
share: 'hgS_newSessionShare',
descr: 'hgS_newSessionDescription',
shareAnon:'hgS_shareAnon'
};
var sessData = null; // set in sessionBuild: {config, sessions}
var sessDt = null; // the DataTable API
var sessSelectMode = false; // bulk-select (checkbox column) shown?
function sessEnc(s) {
// HTML-escape via the shared utils.js helper (escapes quotes too, so it is attribute-safe).
return (typeof htmlEncode === 'function') ? htmlEncode(String(s == null ? '' : s)) : String(s);
}
function sessNum(n) {
return (typeof commify === 'function') ? commify(n) : String(n);
}
function sessRandomShareName() {
- // Mirror the server's auto/anonymous share-name convention ("share_" + 8 URL-safe alphanumeric
- // chars). hgSession.c's doSaveSessionJson generates the same style server-side for the top-right
- // "Share a link"; we generate it here so the confirm dialog can show the name before saving.
+ // Auto-name convention for machine-generated session names: a leading "_" (which marks the name
+ // as internally generated, and is kept verbatim by the short-link encoder) followed by 8 URL-safe
+ // alphanumeric chars. This is the single source of the convention: the top-right "Share a link"
+ // menu (topLinks.js) and hgSession.c both defer to a name generated here.
var chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
var s = '';
for (var i = 0; i < 8; i++) {
s += chars.charAt(Math.floor(Math.random() * chars.length));
}
- return 'share_' + s;
+ return '_' + s;
}
function sessMbpPos(pos) {
// Shorten a position to megabases to save horizontal space:
// "chr7:155799529-155812871" -> "chr7:155.80-155.81 Mbp". Falls back to the raw string
// if it doesn't parse.
var m = /^(.+):([0-9,]+)-([0-9,]+)$/.exec(String(pos));
if (!m) { return String(pos); }
var s = parseInt(m[2].replace(/,/g, ''), 10);
var e = parseInt(m[3].replace(/,/g, ''), 10);
if (isNaN(s) || isNaN(e)) { return String(pos); }
return m[1] + ':' + (s / 1e6).toFixed(2) + '-' + (e / 1e6).toFixed(2) + ' Mbp';
}
function sessMsg(text, cls) {
// Show a transient status line at the top of the app (cls: 'ok' | 'err' | '').
var el = document.getElementById('sessMsg');
if (!el) { return; }
el.className = 'sessMsg' + (cls ? ' ' + cls : '');
el.innerHTML = text ? sessEnc(text) : '';
}
// ---- AJAX ----------------------------------------------------------------
// Post an action to hgSession and get JSON back. Always carry the session id so the CGI loads the
// right cart. onOk(resp) is called for {success:true,...} or {name,url}; onErr(msg) for {error}.
function sessAjax(params, onOk, onErr) {
var data = $.extend({}, params);
data[sessData.config.cartVar] = sessData.config.hgsid;
$.ajax({
type: 'POST',
url: 'hgSession',
data: data,
dataType: 'json',
cache: false,
success: function(resp) {
if (resp && resp.error) {
if (onErr) { onErr(resp.error); } else { sessMsg(resp.error, 'err'); }
} else {
if (onOk) { onOk(resp); }
}
},
error: function() {
var m = 'Sorry, that action could not be completed. Please try again.';
if (onErr) { onErr(m); } else { sessMsg(m, 'err'); }
}
});
}
// ---- modal (generic) -----------------------------------------------------
// One reusable overlay lives inside #sessionApp (so the gbModern tokens inherit into it). Open on
// backdrop click and Esc close, matching hgBlat's modal behavior.
function sessModalEnsure() {
if (document.getElementById('sessModalBg')) { return; }
var bg = document.createElement('div');
bg.id = 'sessModalBg';
bg.className = 'gbModalBg';
bg.style.display = 'none';
bg.innerHTML = '';
document.getElementById('sessionApp').appendChild(bg);
$(bg).on('click', function(ev) { if (ev.target === this) { sessModalClose(); } });
$(document).on('keydown.sessModal', function(ev) {
var b = document.getElementById('sessModalBg');
if (b && b.style.display !== 'none' && ev.key === 'Escape') { sessModalClose(); }
});
}
function sessModalOpen(html) {
sessModalEnsure();
document.getElementById('sessModal').innerHTML = html;
document.getElementById('sessModalBg').style.display = 'flex';
}
function sessModalClose() {
var bg = document.getElementById('sessModalBg');
if (bg) { bg.style.display = 'none'; }
}
// A confirmation dialog with Cancel + a primary/danger OK. opts: {title, bodyHtml, okLabel,
// okClass, onOk}. bodyHtml is caller-built safe HTML. The OK button is focused on open so the
// user can confirm with just the Enter key.
function sessConfirm(opts) {
var okClass = opts.okClass || 'primary';
sessModalOpen(
'
' + sessEnc(opts.title) + '
' +
'
' + opts.bodyHtml + '
' +
'
' +
'' +
'
');
$('#sessCfCancel').on('click', sessModalClose);
$('#sessCfOk').on('click', function() { opts.onOk(); });
document.getElementById('sessCfOk').focus();
}
// ---- session lookup / row helpers ---------------------------------------
function sessByEnc(enc) {
var list = sessData.sessions;
for (var i = 0; i < list.length; i++) {
if (list[i].encName === enc) { return list[i]; }
}
return null;
}
function sessRowByEnc(enc) {
// Return the DataTables row API for the session with this encName, or null.
var found = null;
sessDt.rows().every(function() {
if (this.data().encName === enc) { found = this; }
});
return found;
}
// ---- table cell rendering ------------------------------------------------
// Inline icons (Font Awesome solid paths, embedded as SVG so they do not depend on the site's Font
// Awesome version). fill:currentColor picks up the button's text/danger color.
var SESS_TRASH_SVG = '';
// Font Awesome "floppy-disk" (save) regular/outline path - reads more clearly as a save icon.
var SESS_SAVE_SVG = '';
// Font Awesome "lock" solid path - marks a private (not-shared) session, since sharing is the default.
var SESS_LOCK_SVG = '';
function sessActionsHtml(row) {
// Order: Share, Edit, then the icon-only Overwrite (floppy) and Delete (trash).
var e = sessEnc(row.encName);
return '' +
'' +
'' +
'';
}
function sessNameCellHtml(row) {
var html = '' + sessEnc(row.name) + '';
if (row.description) {
html += ' ⓘ';
}
// Sessions are shared by default; mark only the exceptions: a lock for private, a badge for the
// public gallery. A plain shared-by-link session gets no marker.
if (row.shared === 0) {
html += ' ' +
SESS_LOCK_SVG + '';
} else if (row.shared >= 2) {
html += ' Public';
}
return html;
}
// ---- Overwrite -----------------------------------------------------------
function sessDoOverwrite(row) {
sessAjax(sessActParams(SESS_ACT.overwrite, row), function(resp) {
row.useCount = resp.useCount;
if (resp.created) { row.created = resp.created; }
if (resp.db) { row.db = resp.db; }
var r = sessRowByEnc(row.encName);
if (r) { r.data(row).draw(false); }
sessModalClose();
sessMsg('Overwrote “' + row.name + '” with your current browser view.', 'ok');
});
}
function sessOpenOverwrite(row) {
sessConfirm({
title: 'Overwrite session',
bodyHtml: 'Replace the saved session ' + sessEnc(row.name) + ' with the view you are ' +
'looking at now? The name and description stay the same; the previously saved view is lost.',
okLabel: 'Overwrite',
onOk: function() { sessDoOverwrite(row); }
});
}
// ---- Delete --------------------------------------------------------------
function sessOpenDelete(row) {
sessConfirm({
title: 'Delete session',
bodyHtml: 'Delete the session ' + sessEnc(row.name) + '? This cannot be undone. ' +
'Any shared links to it will stop working.',
okLabel: 'Delete',
okClass: 'danger',
onOk: function() {
sessAjax(sessActParams(SESS_ACT.del, row), function() {
var r = sessRowByEnc(row.encName);
if (r) { r.remove().draw(false); }
var list = sessData.sessions;
for (var i = 0; i < list.length; i++) {
if (list[i].encName === row.encName) { list.splice(i, 1); break; }
}
sessModalClose();
sessMsg('Deleted “' + row.name + '”.', 'ok');
});
}
});
}
// ---- Edit (rename + description) ----------------------------------------
function sessOpenEdit(row) {
var html = '
Edit session
' +
'' +
'' +
'' +
'' +
'' +
'' +
'
' +
'' +
'
';
sessModalOpen(html);
document.getElementById('sessEditName').value = row.name;
document.getElementById('sessEditDesc').value = row.description || '';
document.getElementById('sessEditPrivate').checked = (row.shared === 0);
document.getElementById('sessEditName').focus();
$('#sessEditCancel').on('click', sessModalClose);
$('#sessEditOk').on('click', function() { sessSaveEdit(row); });
}
function sessSaveEdit(row) {
var newName = document.getElementById('sessEditName').value.trim();
var newDesc = document.getElementById('sessEditDesc').value;
if (!newName) {
var err = document.getElementById('sessEditErr');
err.style.display = 'block';
err.innerHTML = sessEnc('Please enter a name.');
return;
}
var descChanged = (newDesc !== (row.description || ''));
var nameChanged = (newName !== row.name);
var wantPrivate = document.getElementById('sessEditPrivate').checked;
var privChanged = (wantPrivate !== (row.shared === 0));
// Order matters: apply description and privacy while the session still has its OLD name, then
// rename last (renaming changes the DB key the other endpoints look up by).
function finish() {
if (nameChanged) {
// encName changes on rename; reload for authoritative state.
window.location.reload();
} else {
var r = sessRowByEnc(row.encName);
if (r) { r.data(row).draw(false); }
sessModalClose();
sessMsg('Saved changes to “' + row.name + '”.', 'ok');
}
}
function doRename() {
if (nameChanged) {
var rp = sessActParams(SESS_ACT.rename, row);
rp[SESS_P.newName] = newName;
sessAjax(rp, finish, function(m) { sessEditError(m); });
} else { finish(); }
}
function doPriv() {
if (privChanged) {
var sp = sessActParams(SESS_ACT.share, row);
sp[SESS_P.share] = wantPrivate ? 0 : 1;
sessAjax(sp, function(resp) { row.shared = resp.shared; doRename(); },
function(m) { sessEditError(m); });
} else { doRename(); }
}
function doDesc() {
if (descChanged) {
var dp = sessActParams(SESS_ACT.describe, row);
dp[SESS_P.descr] = newDesc;
sessAjax(dp, function() { row.description = newDesc; doPriv(); },
function(m) { sessEditError(m); });
} else { doPriv(); }
}
doDesc();
}
function sessEditError(msg) {
var err = document.getElementById('sessEditErr');
if (err) { err.style.display = 'block'; err.innerHTML = sessEnc(msg); }
else { sessMsg(msg, 'err'); }
}
// ---- Share (copy link + sharing level) ----------------------------------
function sessOpenShare(row) {
var mailBody = encodeURIComponent('Here is a UCSC Genome Browser session I would like to ' +
'share with you: ') + encodeURIComponent(row.shareUrl);
var mailto = 'mailto:?subject=' + encodeURIComponent('UCSC Genome Browser session ' + row.name) +
'&body=' + mailBody;
var html = '
Sessions are loadable by anyone with the ' +
'link by default; use Edit to make one private.
' +
'' +
'' +
'
' +
'
';
sessModalOpen(html);
var inp = document.getElementById('sessShareUrl');
inp.value = row.shareUrl;
document.getElementById('sessGalleryChk').checked = (row.shared >= 2);
$('#sessShareClose').on('click', sessModalClose);
$('#sessShareCopy').on('click', function() {
inp.focus(); inp.select();
if (navigator.clipboard) { navigator.clipboard.writeText(row.shareUrl); }
else { try { document.execCommand('copy'); } catch (e) { /* ignore */ } }
this.textContent = 'Copied';
});
$('#sessGalleryChk').on('change', function() { sessSetGallery(row, this.checked ? 1 : 0); });
}
function sessShareErr(msg) {
var err = document.getElementById('sessShareErr');
if (err) { err.style.display = 'block'; err.innerHTML = sessEnc(msg); }
}
function sessAfterSharedChange(row, newShared) {
row.shared = newShared;
var c = document.getElementById('sessShareChk');
var g = document.getElementById('sessGalleryChk');
if (c) { c.checked = (newShared >= 1); }
if (g) { g.checked = (newShared >= 2); }
var r = sessRowByEnc(row.encName);
if (r) { r.data(row).draw(false); }
}
function sessSetGallery(row, want) {
var p = sessActParams(SESS_ACT.gallery, row);
p[SESS_P.share] = want;
sessAjax(p, function(resp) { sessAfterSharedChange(row, resp.shared); }, function(m) {
sessShareErr(m);
document.getElementById('sessGalleryChk').checked = (row.shared >= 2);
});
}
// Build the base params for an action on a given session (decoded name; the CGI re-encodes it).
function sessActParams(action, row) {
var p = {};
p[action] = '1';
p[SESS_P.oldName] = row.name;
return p;
}
// ---- Save current view ---------------------------------------------------
function sessDoSave() {
var name = document.getElementById('sessSaveName').value.trim();
if (!name) {
- // Empty name: offer to save under a server-style random "share_XXXXXXXX" name, after
+ // Empty name: offer to save under a random internal "_XXXXXXXX" name, after
// confirming the user really meant to leave it blank.
var rand = sessRandomShareName();
sessConfirm({
title: 'Save without a name?',
bodyHtml: 'You left the session name empty. Your session will be saved under the ' +
'randomly generated name ' + sessEnc(rand) + '.
You can also create ' +
'these quick share links any time from the Share a link option at the top ' +
'right of every Genome Browser page.',
okLabel: 'Save session',
onOk: function() { sessModalClose(); sessDoSaveWithName(rand); }
});
return;
}
sessDoSaveWithName(name);
}
function sessDoSaveWithName(name) {
var priv = document.getElementById('sessSavePrivate').checked;
var descEl = document.getElementById('sessSaveDesc');
var desc = descEl ? descEl.value.trim() : '';
var p = {};
p[SESS_ACT.save] = '1';
p[SESS_P.newName] = name;
// doSaveSessionJson always saves shared-by-link (the default); chain the optional description
// and, if the user asked for "only I can load it", make it private, then reload to show the row.
function afterDesc() {
if (priv) {
var sp = {};
sp[SESS_ACT.share] = '1';
sp[SESS_P.oldName] = name;
sp[SESS_P.share] = 0;
sessAjax(sp, function() { window.location.reload(); },
function() { window.location.reload(); });
} else {
window.location.reload();
}
}
sessAjax(p, function() {
if (desc) {
var dp = {};
dp[SESS_ACT.describe] = '1';
dp[SESS_P.oldName] = name;
dp[SESS_P.descr] = desc;
sessAjax(dp, afterDesc, afterDesc);
} else {
afterDesc();
}
});
}
// ---- Advanced panel (navigation forms) ----------------------------------
function sessAdvancedHtml(C) {
var sid = '';
var loadUser = '';
if (C.loggedIn) {
loadUser =
'
';
}
// ---- build the whole page -----------------------------------------------
function sessAccountHtml(C) {
// The signed-in account line (Signed in as X · Sign out · Change password) now lives in the
// top-right menu bar, so it is intentionally not rendered here. Kept commented out so QA can
// add it back if wanted:
/*
if (C.loggedIn) {
var s = 'Signed in as ' + sessEnc(C.userName) + '';
if (C.logoutUrl) { s += ' · Sign out'; }
if (C.changePasswordUrl) {
s += ' · Change password';
}
return s;
}
*/
if (!C.loggedIn && C.loginAvail && C.loginUrl) {
return 'You are not signed in. Sign in to save and manage named sessions.';
}
return '';
}
function sessSaveCardHtml(C) {
if (!C.loggedIn) { return ''; }
// Assembly and position separated by a colon (e.g. "hg38: chr7:1-1,000"); assembly is already
// the accession for hubs (trackHubSkipHubName on the server).
var loc = '';
if (C.db && C.position) { loc = sessEnc(C.db) + ': ' + sessEnc(C.position); }
else if (C.db) { loc = sessEnc(C.db); }
else if (C.position) { loc = sessEnc(C.position); }
if (loc && C.trackCount) {
loc += ', ' + sessNum(C.trackCount) + ' track' + (C.trackCount === 1 ? '' : 's') + ' shown';
}
var what = loc ? '' + loc + '' : '';
return '
' +
'
' +
'Save the current view as a stable session link' + what + '
' +
'
' +
'' +
'' +
'' +
'
' +
'' +
'
';
}
function sessRecentHtml(recent) {
// A quick shortcut to re-save the session the user most recently saved, keeping its name and
// description. Hidden when there are no saved sessions.
if (!recent) { return ''; }
return '
';
}
function sessTableHtml(C) {
if (!C.loggedIn) { return ''; }
return '
Your saved sessions
' +
'
';
}
function sessionBuild() {
sessData = hgSessionData;
// When the page was loaded with &measureTiming=1 the C side attaches sessData.timing; time the
// client-side render too so the dialog shows the full server+client picture.
var tBuildStart = (sessData.timing && window.performance) ? performance.now() : 0;
var C = sessData.config;
var app = $('#sessionApp');
var intro = '
' + sessAccountHtml(C) +
(sessAccountHtml(C) ? ' ' : '') +
'A session is a stable link to a Genome Browser view that you can save, load later, share ' +
'or copy into a manuscript. See the ' +
'Sessions User’s Guide and the ' +
'Session Gallery.
';
// The session most recently saved/overwritten (max lastUse), for the one-click "Update now".
var recent = null;
(sessData.sessions || []).forEach(function(s) {
if (!recent || s.lastUseEpoch > recent.lastUseEpoch) { recent = s; }
});
app.html(
intro +
'' +
sessRecentHtml(recent) +
sessSaveCardHtml(C) +
sessAdvancedHtml(C) +
sessTableHtml(C)
);
// Save current view. Enter in either the name or the description field saves.
$('#sessSaveBtn').on('click', sessDoSave);
$('#sessSaveName, #sessSaveDesc').on('keydown', function(ev) {
if (ev.key === 'Enter') { ev.preventDefault(); sessDoSave(); }
});
// One-click update of the most recently saved session.
if (recent) {
$('#sessUpdateNow').on('click', function() {
sessConfirm({
title: 'Update session',
bodyHtml: 'Overwrite ' + sessEnc(recent.name) + ' with the view you are ' +
'looking at now? The session name and description stay the same.',
okLabel: 'Update now',
onOk: function() { sessDoOverwrite(recent); }
});
});
}
// Advanced toggle.
$('#sessAdvHead').on('click', function() {
var body = document.getElementById('sessAdvBody');
var open = body.style.display !== 'none';
body.style.display = open ? 'none' : 'grid';
$(this).find('.caret').html(open ? '▸' : '▾');
});
// Session table.
if (C.loggedIn) { sessBuildTable(); }
if (typeof convertTitleTagsToMouseovers === 'function') { convertTitleTagsToMouseovers(); }
// Timing report (only when loaded with &measureTiming=1): a pill that opens the shared dialog.
if (sessData.timing) {
var clientRows = [{ label: 'build page (JS)',
ms: Math.round(performance.now() - tBuildStart) }];
var pill = document.createElement('button');
pill.type = 'button';
pill.className = 'gbPill';
pill.id = 'sessTimingBtn';
pill.innerHTML = '⏱ Timing';
pill.title = 'Show where this page spent its time (server and browser)';
pill.addEventListener('click', function() {
gbShowTimingDialog(sessData.timing, clientRows);
});
var bar = document.querySelector('#sessionApp .sessToolbar') ||
document.getElementById('sessionApp');
bar.appendChild(pill);
// measureTiming=1 on the URL is an explicit request to see the numbers, so open the dialog
// right away; the pill stays for reopening it after Close.
gbShowTimingDialog(sessData.timing, clientRows);
}
}
// ---- bulk select / delete ------------------------------------------------
function sessToggleSelect() {
if (sessSelectMode) { sessDeleteSelected(); } else { sessSetSelectMode(true); }
}
function sessSetSelectMode(on) {
sessSelectMode = on;
sessDt.column(0).visible(on); // the leading checkbox column
var b = document.getElementById('sessSelectBtn');
if (on) {
b.textContent = 'Delete all selected';
b.classList.add('primary');
} else {
b.textContent = 'Select';
b.classList.remove('primary');
$('#sessionAppTable .sessSelChk, #sessSelAll').prop('checked', false);
}
}
function sessDeleteSelected() {
var encs = [];
$('#sessionAppTable tbody .sessSelChk:checked').each(function() {
encs.push(this.getAttribute('data-enc'));
});
if (encs.length === 0) { sessSetSelectMode(false); return; } // nothing picked: just exit
sessConfirm({
title: 'Delete selected sessions',
bodyHtml: 'Delete ' + encs.length + ' selected session' +
(encs.length === 1 ? '' : 's') + '? This cannot be undone.',
okLabel: 'Delete ' + encs.length,
okClass: 'danger',
onOk: function() {
sessModalClose();
var remaining = encs.length;
function done() { if (--remaining === 0) { window.location.reload(); } }
encs.forEach(function(enc) {
var row = sessByEnc(enc);
if (!row) { done(); return; }
sessAjax(sessActParams(SESS_ACT.del, row), done, done);
});
}
});
}
function sessBuildTable() {
sessDt = $('#sessionAppTable').DataTable({
data: sessData.sessions,
pageLength: 15,
lengthChange: true,
lengthMenu: [[15, 50, 100, -1], [15, 50, 100, 'All']],
order: [[3, 'desc']], // newest (Created) first by default
dom: '<"sessToolbar"fl>rt<"sessFoot"ip>',
language: { searchPlaceholder: 'Search sessions', search: '', lengthMenu: 'Show _MENU_',
emptyTable: 'No saved sessions yet.' },
columns: [
{ title: '',
className: 'sessSelCol', data: null, orderable: false, searchable: false, visible: false,
render: function(d, type, row) {
return ''; } },
{ title: 'Session', className: 'sessNameCol', data: 'name',
render: function(d, type, row) {
return (type === 'display') ? sessNameCellHtml(row) : row.name; } },
{ title: 'Assembly', data: 'db',
render: function(d, type, row) {
if (type !== 'display') { return row.db || ''; }
var html = sessEnc(row.db || 'n/a');
// Region: band, locus (gene) and the position shortened to Mbp, so it all fits.
var region = [];
if (row.band) { region.push(sessEnc(row.band)); }
if (row.locus) { region.push(sessEnc(row.locus)); }
if (row.position) { region.push(sessEnc(sessMbpPos(row.position))); }
if (region.length) {
html += ' ' + region.join(' ') + '';
}
return html; } },
{ title: 'Created', data: 'createdEpoch',
render: function(d, type, row) {
return (type === 'display') ?
'' +
sessEnc(row.created) + '' : row.createdEpoch; } },
{ title: 'Last used', data: 'lastUseEpoch',
render: function(d, type, row) {
return (type === 'display') ?
'' +
sessEnc(row.lastUseDate || row.lastUse) + '' : row.lastUseEpoch; } },
{ title: 'Views', data: 'useCount',
render: function(d, type) { return (type === 'display') ? sessNum(d) : d; } },
{ title: 'Actions', className: 'sessActionsCol', data: null, orderable: false,
searchable: false,
render: function(d, type, row) { return (type === 'display') ? sessActionsHtml(row) : ''; } }
]
});
// Delegate the row action buttons.
$('#sessionAppTable tbody').on('click', 'button[data-act]', function() {
var act = this.getAttribute('data-act');
var row = sessByEnc(this.getAttribute('data-enc'));
if (!row) { return; }
if (act === 'overwrite') { sessOpenOverwrite(row); }
else if (act === 'share') { sessOpenShare(row); }
else if (act === 'edit') { sessOpenEdit(row); }
else if (act === 'delete') { sessOpenDelete(row); }
});
// Bulk-select control: a "Select" button after the length dropdown reveals a checkbox column and
// becomes a primary "Delete all selected" button.
var selBtn = document.createElement('button');
selBtn.type = 'button';
selBtn.id = 'sessSelectBtn';
selBtn.className = 'gbPill';
selBtn.textContent = 'Select';
selBtn.title = 'Select multiple sessions to delete them at once';
document.querySelector('#sessionApp .sessToolbar').appendChild(selBtn);
$(selBtn).on('click', sessToggleSelect);
// Header "select all" toggles every checkbox on the current page.
$('#sessionAppTable').on('change', '#sessSelAll', function() {
$('#sessionAppTable tbody .sessSelChk').prop('checked', this.checked);
});
// Column-header tooltips (set title, then let utils.js convert to styled mouseovers).
var tips = {
'Session': 'Click a name to load that session in the Genome Browser',
'Assembly': 'The genome assembly this session was saved on',
'Created': 'When the session was first saved',
'Last used': 'When the session was last saved or loaded',
'Views': 'How many times this session has been loaded',
'Actions': 'Overwrite with your current view, share, edit, or delete'
};
$('#sessionAppTable thead th').each(function() {
var t = tips[$(this).text().trim()];
if (t) { $(this).attr('title', t); }
});
}
$(document).ready(function() {
if (typeof hgSessionData !== 'undefined' && document.getElementById('sessionApp')) {
sessionBuild();
}
});