Skip to content
Permalink

Comparing changes

This is a direct comparison between two commits made in this repository or its related repositories. View the default comparison for this range or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: adobe/da-live
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: 79c494d410ccfaa7bc59eacd3bc610e1e87fff46
Choose a base ref
..
head repository: adobe/da-live
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: 3e6999101bfe0bb6e8e270d4482de7e08e780434
Choose a head ref
12 changes: 10 additions & 2 deletions blocks/browse/da-list/da-list.js
Original file line number Diff line number Diff line change
@@ -244,9 +244,17 @@ export default class DaList extends LitElement {
async drop(e) {
e.preventDefault();
const items = e.dataTransfer?.items;
if (!items) return;
if (!items) {
this.shadowRoot.querySelector('.da-browse-panel').classList.remove('is-dragged-over');
return;
}

const entries = [...items].map((item) => item.webkitGetAsEntry()).filter((x) => x);
if (!entries.length) {
this.shadowRoot.querySelector('.da-browse-panel').classList.remove('is-dragged-over');
return;
}

const entries = [...items].map((item) => item.webkitGetAsEntry());
const makeBatches = (await import(`${getNx()}/utils/batch.js`)).default;
const { getFullEntryList, handleUpload } = await import('./helpers/drag-n-drop.js');
this._dropFiles = await getFullEntryList(entries);
1 change: 1 addition & 0 deletions blocks/edit/da-versions/da-versions.css
Original file line number Diff line number Diff line change
@@ -61,6 +61,7 @@
.da-version-entry {
position: relative;
margin-bottom: 48px;
cursor: pointer;
}

.da-version-entry.is-audit {
5 changes: 4 additions & 1 deletion blocks/edit/da-versions/da-versions.js
Original file line number Diff line number Diff line change
@@ -39,6 +39,10 @@ export default class DaVersions extends LitElement {

async handlePreview(e, entry) {
e.stopPropagation();
const entryEl = e.target.closest('.da-version-entry');
if (!entryEl.classList.contains('is-open')) {
entryEl.classList.toggle('is-open');
}
const detail = { url: `${DA_ORIGIN}${entry.url}` };
const opts = { detail, bubbles: true, composed: true };
const event = new CustomEvent('preview', opts);
@@ -146,7 +150,6 @@ export default class DaVersions extends LitElement {
}

render() {
if (!this._versions) return nothing;
return html`
<div class="da-versions-panel">
<p class="da-versions-title">
7 changes: 6 additions & 1 deletion blocks/edit/utils/helpers.js
Original file line number Diff line number Diff line change
@@ -171,7 +171,7 @@ const getSheetProps = (sheet) => {
};
};

async function saveJson(fullPath, sheets, dataType = 'blob') {
export function convertSheets(sheets) {
const { publicSheets, privateSheets } = sheets.reduce((acc, sheet) => {
if (sheet.name.startsWith('private-')) {
acc.privateSheets[sheet.name] = getSheetProps(sheet);
@@ -200,6 +200,11 @@ async function saveJson(fullPath, sheets, dataType = 'blob') {
if (privateNames.length > 0) {
json[':private'] = privateSheets;
}
return json;
}

async function saveJson(fullPath, sheets, dataType = 'blob') {
const json = convertSheets(sheets);

const formData = new FormData();

2 changes: 1 addition & 1 deletion blocks/shared/pathDetails.js
Original file line number Diff line number Diff line change
@@ -73,7 +73,7 @@ function getFullDetails({ editor, pathParts, ext }) {
const path = ext === 'html' && !fullPath.endsWith('html') && editor !== 'sheet' ? `${fullPath}.html` : fullPath;

// TODO: Fix this later
const tld = repo === 'da-bacom' ? '.aem.page' : '.hlx.page';
const tld = repo === 'da-bacom' ? '.aem.live' : '.hlx.live';

return {
owner: org,
56 changes: 56 additions & 0 deletions blocks/sheet/da-sheet-panes.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
:host {
margin-top: 44px;
position: relative;
}

.da-sheet-panes {
height: 100%;
}

.da-sheet-preview {
display: none;
}

.da-sheet-pane-tabs {
display: none;
position: absolute;
top: 20px;
right: -56px;
}

.da-sheet-pane-tabs.is-visible {
display: unset;
}

.da-editor-tabs-full {
padding: 6px;
border-radius: 4px;
box-shadow: rgb(181 181 181) 0 0 5px 0;
background: rgb(255 255 255);
box-sizing: border-box;
}

.da-editor-tabs-quiet {
padding: 6px;
}

.da-editor-tab {
display: block;
width: 50px;
height: 44px;
text-indent: -1000px;
overflow: hidden;
border-radius: 2px;
border: none;
cursor: pointer;
}

.da-editor-tab.show-preview {
background: url('/blocks/edit/img/Smock_Preview_18_N.svg') center center / 20px no-repeat rgb(239 239 239);
background-blend-mode: hard-light;
}

.da-editor-tab.show-versions {
background: url('/blocks/edit/img/Smock_Calendar_18_N.svg') center center / 20px no-repeat;
background-blend-mode: hard-light;
}
86 changes: 86 additions & 0 deletions blocks/sheet/da-sheet-preview.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
:host {
display: block;
width: 375px;
margin: 0 auto;
padding-left: 32px;
border: none;
position: relative;
font-family: var(--body-font-family);
}

.da-sheet-preview {
box-shadow: rgb(181 181 181) 0 0 20px 0;
border-radius: 12px;
height: 500px;
padding: var(--spacing-200);
overflow: scroll;
box-sizing: border-box;
}

.da-preview-menubar {
--editor-btn-bg-color: #EFEFEF;
--editor-btn-bg-color-hover: #e9e9e9;

position: fixed;
top: 50%;
transform: translateY(-50%);
right: 12px;
padding: 6px 6px 0;
border-radius: 4px;
box-shadow: rgb(181 181 181) 0 0 5px 0;
background: rgb(255 255 255);
box-sizing: border-box;
grid-area: toolbar;
z-index: 1;
}

.da-preview-menuitem {
border: none;
display: block;
width: 44px;
height: 44px;
text-indent: -1000px;
overflow: hidden;
border-radius: 2px;
margin-bottom: 6px;
background: url(/blocks/edit/img/Smock_Close_18_N.svg) center center / 20px no-repeat var(--editor-btn-bg-color);
}

ul {
list-style: none;
margin: 0;
padding: 0;
}

.da-sheet-tab-key {
background-color: #e9e9e9;
padding: 4px 8px;
box-sizing: border-box;
font-weight: 700;
border-radius: 8px;
}

.da-sheet-key-value {
margin: 12px 0;
display: grid;
grid-template-columns: [column-1] auto [column-2] 1fr;
}

.da-sheet-key-value li {
background-color: #f5f5f5;
border-radius: 8px;
margin: 0 0 2px 6px;
grid-column: span 2;
display: grid;
grid-template-columns: subgrid;
gap: 12px;
}

.da-sheet-key {
font-weight: 700;
padding: 4px 0 4px 8px;
}

.da-sheet-value {
padding: 4px 8px 4px 0;
}
86 changes: 86 additions & 0 deletions blocks/sheet/da-sheet-preview.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
import { LitElement, html, nothing } from 'da-lit';
import { getNx } from '../../scripts/utils.js';
import getPathDetails from '../shared/pathDetails.js';

const { default: getStyle } = await import(`${getNx()}/utils/styles.js`);

const style = await getStyle('/blocks/sheet/da-sheet-preview.css');

class DaSheetPreview extends LitElement {
static properties = {
data: { type: Object },
_formatted: { state: true },
};

connectedCallback() {
super.connectedCallback();
this.shadowRoot.adoptedStyleSheets = [style];
this.details = getPathDetails();
}

update(props) {
if (props.has('data')) {
if (this.data) {
const type = this.data[':type'];
const baseData = type === 'sheet' ? { data: this.data } : this.data;
this._formatted = Object.keys(baseData).reduce((acc, key) => {
if (!key.startsWith(':')) {
acc.push({ key, data: baseData[key].data });
}
return acc;
}, []);
}
}
super.update(props);
}

handleClose() {
const opts = { detail: { action: 'close' }, bubbles: true, composed: true };
const event = new CustomEvent('close', opts);
this.dispatchEvent(event);
}

getUrl(value) {
if (value.startsWith('http')) return value;
return `https://main--${this.details.repo}--${this.details.owner}.aem.page${value}`;
}

renderValue(value) {
if (!(value.startsWith('/') || value.startsWith('http'))) return value;
const links = value.split(',').map((val) => val.replaceAll(' ', ''));
return links.map((link) => html`<a href="${this.getUrl(link)}" target="_blank">${link}</a> `);
}

renderFormatted() {
return html`
<ul>
${this._formatted.map((tab) => html`
<li class="da-sheet-tab-key">${tab.key}</li>
${tab.data.map((row) => html`
<ul class="da-sheet-key-value">
${Object.keys(row).map((col) => html`
<li>
<div class="da-sheet-key">${col}</div>
<div class="da-sheet-value">${this.renderValue(row[col])}</div>
</li>
`)}
</ul>
`)}
`)}
</ul>
`;
}

render() {
return html`
<div class="da-sheet-preview">
${this._formatted ? this.renderFormatted() : nothing}
</div>
<div class="da-preview-menubar">
<button class="da-preview-menuitem" @click=${this.handleClose}>Close</button>
</div>
`;
}
}

customElements.define('da-sheet-preview', DaSheetPreview);
3 changes: 3 additions & 0 deletions blocks/sheet/da-sheet-tabs.css
Original file line number Diff line number Diff line change
@@ -2,6 +2,7 @@
display: flex;
gap: var(--spacing-200);
margin-bottom: var(--spacing-200);
flex-wrap: wrap;
}

svg {
@@ -14,6 +15,7 @@ ul {
list-style: none;
display: flex;
gap: var(--spacing-200);
flex-wrap: wrap;
}

li {
@@ -81,6 +83,7 @@ button:hover .icon {
border: 2px solid var(--s2-gray-800);
border-radius: 6px;
padding: 0 12px;
line-height: 28px;
}

.add-sheet:hover {
2 changes: 1 addition & 1 deletion blocks/sheet/da-sheet-tabs.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { LitElement, html, nothing } from 'da-lit';
import { getNx } from '../../scripts/utils.js';
import { debouncedSaveSheets } from './utils.js';
import { debouncedSaveSheets } from './utils/utils.js';

const { default: getStyle } = await import(`${getNx()}/utils/styles.js`);
const { default: getSvg } = await import(`${getNx()}/utils/svg.js`);
Loading