Compare commits
No commits in common. "017a624c667bafa76fb8f225374a6d30bb4f97af" and "3fb3ef927ab8b5d4fec5e95209642ce6ed795ff7" have entirely different histories.
017a624c66
...
3fb3ef927a
|
|
@ -167,8 +167,7 @@
|
|||
information hidden to make reading
|
||||
messages easier.
|
||||
<ul>
|
||||
<li>Tap on the <i class="bi
|
||||
bi-clock"></i> clock to see the
|
||||
<li>Tap on the pound sign to see the
|
||||
date and time of the message.</li>
|
||||
<li>Tap again to hide the popup.</li>
|
||||
<li>Long chat messages are scrollable.
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@ th, td {
|
|||
}
|
||||
|
||||
.message-mobile-date-time {
|
||||
width: 2em;
|
||||
width: 1em;
|
||||
}
|
||||
|
||||
.message-from-user {
|
||||
|
|
|
|||
|
|
@ -103,8 +103,7 @@ function processFragment() {
|
|||
async function saveToDatabase(filename: string, xml: string) {
|
||||
db.entries
|
||||
.put({ filename, backupData: xml })
|
||||
.then(_ => toggleLoadPrevious(true))
|
||||
.catch(err => console.error('Saving Failed', err));
|
||||
.catch(err => displayFatalError('Saving Failed', err));
|
||||
}
|
||||
|
||||
function displayBackup(xsltProcessor: XSLTProcessor, filename: string, xmlText: string): boolean {
|
||||
|
|
@ -137,29 +136,7 @@ function displayBackup(xsltProcessor: XSLTProcessor, filename: string, xmlText:
|
|||
}
|
||||
}
|
||||
|
||||
function toggleLoadPrevious(toggle: boolean) {
|
||||
ui.loadPreviousButtons.forEach(btn => {
|
||||
if (toggle) {
|
||||
btn.classList.remove('disabled');
|
||||
} else {
|
||||
btn.classList.add('disabled');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
async function initEvents() {
|
||||
db.entries.count()
|
||||
.then(count => {
|
||||
if (count < 1) {
|
||||
toggleLoadPrevious(false);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
//Something wrong with db access, disable buttons anyway.
|
||||
console.error(err);
|
||||
toggleLoadPrevious(false);
|
||||
});
|
||||
|
||||
function initEvents() {
|
||||
ui.loadPreviousButtons.forEach(button => button.addEventListener('click', async () => {
|
||||
await populateSavedBackups();
|
||||
}));
|
||||
|
|
@ -213,7 +190,15 @@ async function populateSavedBackups() {
|
|||
}
|
||||
|
||||
window.addEventListener('DOMContentLoaded', async () => {
|
||||
await initEvents();
|
||||
window.addEventListener('resize', () => {
|
||||
if (window.innerWidth <= 500) {
|
||||
ui.chatDisplay.querySelector('table')?.classList.add('table-sm');
|
||||
} else {
|
||||
ui.chatDisplay.querySelector('table')?.classList.remove('table-sm');
|
||||
}
|
||||
});
|
||||
|
||||
initEvents();
|
||||
showLoadingIndicator(false);
|
||||
showApplication(true);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -8,9 +8,9 @@ export const chatDisplay: HTMLElement = document.getElementById('chat-display')!
|
|||
export const fileSelector: HTMLInputElement = document.getElementById('backup-file')! as HTMLInputElement;
|
||||
export const savedBackups: HTMLSelectElement = document.getElementById('saved-backups')! as HTMLSelectElement;
|
||||
export const viewNewButtons =
|
||||
<NodeListOf<HTMLElement>>document.querySelectorAll('#unloaded-view-new-button, #loaded-view-new-button');
|
||||
document.querySelectorAll('#unloaded-view-new-button, #loaded-view-new-button');
|
||||
export const loadPreviousButtons =
|
||||
<NodeListOf<HTMLElement>>document.querySelectorAll('#unloaded-load-previous-button, #loaded-load-previous-button');
|
||||
document.querySelectorAll('#unloaded-load-previous-button, #loaded-load-previous-button');
|
||||
export const previousBackupsList: HTMLDivElement = document.getElementById('previous-backups-list')! as HTMLDivElement;
|
||||
export const noFileLoadedControls: HTMLDivElement = document.getElementById('no-file-loaded-controls')! as HTMLDivElement;
|
||||
export const fileLoadedControls: HTMLDivElement = document.getElementById('file-loaded-controls')! as HTMLDivElement;
|
||||
|
|
|
|||
|
|
@ -1,137 +1,137 @@
|
|||
<?xml version="1.0"?>
|
||||
|
||||
<!--
|
||||
|
||||
This XSLT file is based on the default XSL stylesheet generated by MSN
|
||||
Messenger, and unlike the rest of the application, is probably(?) not
|
||||
covered under the AGPL.
|
||||
|
||||
The file was originally retrieved from this project:
|
||||
|
||||
https://github.com/jerecui/MSNChatHistoryCombiner
|
||||
|
||||
-->
|
||||
|
||||
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
|
||||
<!-- localized strings -->
|
||||
<xsl:variable name='ColumnHeader_Date'>Date</xsl:variable>
|
||||
<xsl:variable name='ColumnHeader_Time'>Time</xsl:variable>
|
||||
<xsl:variable name='ColumnHeader_From'>From</xsl:variable>
|
||||
<xsl:variable name='ColumnHeader_Message'>Message</xsl:variable>
|
||||
|
||||
<!-- variables -->
|
||||
<xsl:variable name='UseZebraStripe'>1</xsl:variable>
|
||||
<xsl:variable name='ZebraStripeStyle'>background-color:#e0edff</xsl:variable>
|
||||
<xsl:variable name='MostRecentSessionFirst'>0</xsl:variable>
|
||||
|
||||
<xsl:template match="Log">
|
||||
<table id='BodyTable' class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="d-lg-none message-mobile-date-time">
|
||||
<!-- for mobile date/time -->
|
||||
</th>
|
||||
<th class="d-none d-lg-table-cell">
|
||||
<xsl:value-of select="$ColumnHeader_Date"/>
|
||||
</th>
|
||||
<th class="d-none d-lg-table-cell">
|
||||
<xsl:value-of select="$ColumnHeader_Time"/>
|
||||
</th>
|
||||
<th class="message-from-user">
|
||||
<xsl:value-of select="$ColumnHeader_From"/>
|
||||
</th>
|
||||
<th>
|
||||
<xsl:value-of select="$ColumnHeader_Message"/>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody class="table-group-divider">
|
||||
<xsl:choose>
|
||||
<!-- newest session first -->
|
||||
<xsl:when test="$MostRecentSessionFirst = 1">
|
||||
<xsl:apply-templates>
|
||||
<xsl:sort select='@SessionID' order='descending' data-type='number'/>
|
||||
<xsl:sort select='@DateTime' order='ascending'/>
|
||||
</xsl:apply-templates>
|
||||
</xsl:when>
|
||||
|
||||
<!-- oldest session first -->
|
||||
<xsl:otherwise>
|
||||
<xsl:apply-templates>
|
||||
<xsl:sort select='@SessionID' order='ascending' data-type='number'/>
|
||||
<xsl:sort select='@DateTime' order='ascending'/>
|
||||
</xsl:apply-templates>
|
||||
</xsl:otherwise>
|
||||
</xsl:choose>
|
||||
</tbody>
|
||||
</table>
|
||||
</xsl:template>
|
||||
|
||||
|
||||
<xsl:template match="Message">
|
||||
<tr>
|
||||
<xsl:call-template name="CommonMessageProcessing" />
|
||||
|
||||
<td class="message-from-user"><xsl:apply-templates select="From/User"/> </td>
|
||||
<td class="message-content">
|
||||
<div class="overflow-auto">
|
||||
<xsl:value-of select="Text"/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</xsl:template>
|
||||
|
||||
|
||||
<xsl:template match="Invitation|InvitationResponse|Join|Leave">
|
||||
<tr>
|
||||
<xsl:call-template name="CommonMessageProcessing" />
|
||||
|
||||
<td>
|
||||
<span>
|
||||
<xsl:value-of select="Text"/>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</xsl:template>
|
||||
|
||||
<xsl:template match="From/User">
|
||||
<a class="info-popover" href="javascript:void(0);" tabindex="0"
|
||||
data-bs-trigger="focus"
|
||||
data-bs-container="body" data-bs-toggle="popover"
|
||||
data-bs-placement="bottom" data-bs-title="Username">
|
||||
<xsl:attribute name="data-bs-content">
|
||||
<xsl:value-of select="@FriendlyName"/>
|
||||
</xsl:attribute>
|
||||
<xsl:value-of select="@FriendlyName"/>
|
||||
</a>
|
||||
</xsl:template>
|
||||
|
||||
<xsl:template name="CommonMessageProcessing">
|
||||
<!-- zebra-stripe the sessions -->
|
||||
<xsl:if test="$UseZebraStripe = 1">
|
||||
<xsl:if test="(@SessionID mod 2) = 1">
|
||||
<xsl:attribute name="style">
|
||||
<xsl:value-of select="$ZebraStripeStyle"/>
|
||||
</xsl:attribute>
|
||||
</xsl:if>
|
||||
</xsl:if>
|
||||
|
||||
<!-- mobile shows a popover span for date/time -->
|
||||
<td class="d-lg-none message-mobile-date-time">
|
||||
<a class="info-popover" href="javascript:void(0);" tabindex="0"
|
||||
data-bs-trigger="focus"
|
||||
data-bs-container="body" data-bs-toggle="popover"
|
||||
data-bs-placement="right" data-bs-title="Date/Time">
|
||||
<xsl:attribute name="data-bs-content">
|
||||
<xsl:value-of select="@Date"/> <xsl:value-of select="@Time"/>
|
||||
</xsl:attribute>
|
||||
<i class="bi bi-clock"></i>
|
||||
</a>
|
||||
</td>
|
||||
<td class="d-none d-lg-table-cell message-date"> <xsl:value-of select="@Date"/> </td>
|
||||
<td class="d-none d-lg-table-cell message-time"> <xsl:value-of select="@Time"/> </td>
|
||||
</xsl:template>
|
||||
|
||||
|
||||
</xsl:stylesheet>
|
||||
<?xml version="1.0"?>
|
||||
|
||||
<!--
|
||||
|
||||
This XSLT file is based on the default XSL stylesheet generated by MSN
|
||||
Messenger, and unlike the rest of the application, is probably(?) not
|
||||
covered under the AGPL.
|
||||
|
||||
The file was originally retrieved from this project:
|
||||
|
||||
https://github.com/jerecui/MSNChatHistoryCombiner
|
||||
|
||||
-->
|
||||
|
||||
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
|
||||
<!-- localized strings -->
|
||||
<xsl:variable name='ColumnHeader_Date'>Date</xsl:variable>
|
||||
<xsl:variable name='ColumnHeader_Time'>Time</xsl:variable>
|
||||
<xsl:variable name='ColumnHeader_From'>From</xsl:variable>
|
||||
<xsl:variable name='ColumnHeader_Message'>Message</xsl:variable>
|
||||
|
||||
<!-- variables -->
|
||||
<xsl:variable name='UseZebraStripe'>1</xsl:variable>
|
||||
<xsl:variable name='ZebraStripeStyle'>background-color:#e0edff</xsl:variable>
|
||||
<xsl:variable name='MostRecentSessionFirst'>0</xsl:variable>
|
||||
|
||||
<xsl:template match="Log">
|
||||
<table id='BodyTable' class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="d-lg-none message-mobile-date-time">
|
||||
<!-- for mobile date/time -->
|
||||
</th>
|
||||
<th class="d-none d-lg-table-cell">
|
||||
<xsl:value-of select="$ColumnHeader_Date"/>
|
||||
</th>
|
||||
<th class="d-none d-lg-table-cell">
|
||||
<xsl:value-of select="$ColumnHeader_Time"/>
|
||||
</th>
|
||||
<th class="message-from-user">
|
||||
<xsl:value-of select="$ColumnHeader_From"/>
|
||||
</th>
|
||||
<th>
|
||||
<xsl:value-of select="$ColumnHeader_Message"/>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody class="table-group-divider">
|
||||
<xsl:choose>
|
||||
<!-- newest session first -->
|
||||
<xsl:when test="$MostRecentSessionFirst = 1">
|
||||
<xsl:apply-templates>
|
||||
<xsl:sort select='@SessionID' order='descending' data-type='number'/>
|
||||
<xsl:sort select='@DateTime' order='ascending'/>
|
||||
</xsl:apply-templates>
|
||||
</xsl:when>
|
||||
|
||||
<!-- oldest session first -->
|
||||
<xsl:otherwise>
|
||||
<xsl:apply-templates>
|
||||
<xsl:sort select='@SessionID' order='ascending' data-type='number'/>
|
||||
<xsl:sort select='@DateTime' order='ascending'/>
|
||||
</xsl:apply-templates>
|
||||
</xsl:otherwise>
|
||||
</xsl:choose>
|
||||
</tbody>
|
||||
</table>
|
||||
</xsl:template>
|
||||
|
||||
|
||||
<xsl:template match="Message">
|
||||
<tr>
|
||||
<xsl:call-template name="CommonMessageProcessing" />
|
||||
|
||||
<td class="message-from-user"><xsl:apply-templates select="From/User"/> </td>
|
||||
<td class="message-content">
|
||||
<div class="overflow-auto">
|
||||
<xsl:value-of select="Text"/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</xsl:template>
|
||||
|
||||
|
||||
<xsl:template match="Invitation|InvitationResponse|Join|Leave">
|
||||
<tr>
|
||||
<xsl:call-template name="CommonMessageProcessing" />
|
||||
|
||||
<td>
|
||||
<span>
|
||||
<xsl:value-of select="Text"/>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</xsl:template>
|
||||
|
||||
<xsl:template match="From/User">
|
||||
<a class="info-popover" href="#" tabindex="0"
|
||||
data-bs-trigger="focus"
|
||||
data-bs-container="body" data-bs-toggle="popover"
|
||||
data-bs-placement="bottom" data-bs-title="Username">
|
||||
<xsl:attribute name="data-bs-content">
|
||||
<xsl:value-of select="@FriendlyName"/>
|
||||
</xsl:attribute>
|
||||
<xsl:value-of select="@FriendlyName"/>
|
||||
</a>
|
||||
</xsl:template>
|
||||
|
||||
<xsl:template name="CommonMessageProcessing">
|
||||
<!-- zebra-stripe the sessions -->
|
||||
<xsl:if test="$UseZebraStripe = 1">
|
||||
<xsl:if test="(@SessionID mod 2) = 1">
|
||||
<xsl:attribute name="style">
|
||||
<xsl:value-of select="$ZebraStripeStyle"/>
|
||||
</xsl:attribute>
|
||||
</xsl:if>
|
||||
</xsl:if>
|
||||
|
||||
<!-- mobile shows a popover span for date/time -->
|
||||
<td class="d-lg-none message-mobile-date-time">
|
||||
<a class="info-popover" href="#" tabindex="0"
|
||||
data-bs-trigger="focus"
|
||||
data-bs-container="body" data-bs-toggle="popover"
|
||||
data-bs-placement="right" data-bs-title="Date/Time">
|
||||
<xsl:attribute name="data-bs-content">
|
||||
<xsl:value-of select="@Date"/> <xsl:value-of select="@Time"/>
|
||||
</xsl:attribute>
|
||||
#
|
||||
</a>
|
||||
</td>
|
||||
<td class="d-none d-lg-table-cell message-date"> <xsl:value-of select="@Date"/> </td>
|
||||
<td class="d-none d-lg-table-cell message-time"> <xsl:value-of select="@Time"/> </td>
|
||||
</xsl:template>
|
||||
|
||||
|
||||
</xsl:stylesheet>
|
||||
|
|
|
|||
Loading…
Reference in New Issue