Page designer i frame implementation - #129
asad-rafter wants to merge 9 commits into
Conversation
|
|
||
| // Size the container to fill the modal viewport | ||
| parentIFrame.getPageInfo(function (info) { | ||
| var rem = parseFloat(getComputedStyle(document.documentElement).fontSize) || 16; |
There was a problem hiding this comment.
@asad-rafter please use Numbaer.parseFloat instead of parseFloat
| setTimeout(function () { | ||
| try { | ||
| var buttons = window.parent.document.querySelectorAll('button'); | ||
| for (var b = 0; b < buttons.length; b++) { |
| @@ -0,0 +1,173 @@ | |||
| /** | |||
There was a problem hiding this comment.
@asad-rafter please use optional chain expression, and avoid unicode chars and long separation lines
| try { | ||
| var ffOptions = JSON.parse(player.formFactorOptions); | ||
| var w = window.innerWidth; | ||
| var ff = w <= 767 ? 'mobile' : (w <= 1023 ? 'tablet' : 'desktop'); |
There was a problem hiding this comment.
@asad-rafter are these numbers hardcodded in PD? is there any chance the customer would need different breakpoints
| background: #fff; | ||
| } | ||
|
|
||
| .cld-adv-applied { |
| try { | ||
| var parsed = JSON.parse(playerOptionsRaw); | ||
| var keys = ['autoplay', 'muted', 'loop', 'controls']; | ||
| for (var i = 0; i < keys.length; i++) { |
| var order = ['mobile', 'tablet', 'desktop']; | ||
| var ff = getActiveFormFactor(); | ||
| if (formValues[ff]) return formValues[ff]; | ||
| for (var i = 0; i < order.length; i++) { |
| var formFactorOrder = ['mobile', 'tablet', 'desktop']; | ||
| var formFactorImageUrls = {}; | ||
| var lastResolvedUrl = null; | ||
| for (var i = 0; i < formFactorOrder.length; i++) { |
| var order = ['mobile', 'tablet', 'desktop']; | ||
| var ff = getActiveFormFactor(); | ||
| if (formValues[ff]) return formValues[ff]; | ||
| for (var i = 0; i < order.length; i++) { |
There was a problem hiding this comment.
@asad-rafter Please use a for-of loop@asad-rafter Please use a for-of loop
| var ffOrder = ['mobile', 'tablet', 'desktop']; | ||
| var ffOptions = {}; | ||
|
|
||
| for (var fi = 0; fi < ffOrder.length; fi++) { |
| // ── New per-form-factor format ──────────────────────────────────────── | ||
| if (isNewFormat(val)) { | ||
| var entry = resolveEntry(val.formValues); | ||
| if (!entry || !entry.asset) return viewmodel; |
|
|
||
| var asset = entry.asset; | ||
| var publicId = asset.public_id; | ||
| var cloudName = currentSite.getCustomPreferenceValue('CloudinaryPageDesignerCloudName'); |
There was a problem hiding this comment.
@asad-rafter cname and cloudName are used also out this if-block. Move the definitions one level higher
| for (var i = 0; i < formFactorOrder.length; i++) { | ||
| var formFactor = formFactorOrder[i]; | ||
| var formFactorEntry = val.formValues[formFactor]; | ||
| if (formFactorEntry && formFactorEntry.asset) { |
| } | ||
|
|
||
| // ── Legacy format ───────────────────────────────────────────────────── | ||
| if (context.content[editorId] && context.content[editorId].imageUrl) { |
|
|
||
| // ── Legacy format ───────────────────────────────────────────────────── | ||
| if (context.content[editorId] && context.content[editorId].imageUrl) { | ||
| var cname = currentSite.getCustomPreferenceValue('CloudinaryPageDesignerCNAME'); |
There was a problem hiding this comment.
@asad-rafter would become redundant once the code is fixed with previous comment
|
@asad-rafter please use util functions for the code shared by both widgets, so it won't be written twic: The exact same block — { mobile: 767, tablet: 1023 } + JSON.parse + two typeof === 'number' guards + try/catch — appears in: │ File │ Line │ |
|
@asad-rafter please check if we can remove |
Checked — they can't be removed. SFCC Page Designer requires a dedicated server-side JS init file per editor (referenced via the JSON descriptor). The two files serve distinct purposes: imageForm.js wires up mediaPicker + studioWidget, while videoForm.js wires up mediaPicker + advancedConfig and also configures playerOptions. They now share the breakpoints logic via cloudinaryPDUtils, so duplication is gone even though the files themselves remain. |
|
|
||
| .cld-advanced-btn:disabled, | ||
| .cld-advanced-btn[aria-disabled="true"] { | ||
| color: #c9c7c5; |
There was a problem hiding this comment.
@asad-rafter Please use color: #757575 to adhere to accessibility standards
No description provided.