import { ICodePen } from '../../../interfaces/ICodePen' ; import { IPlayground } from '../../../interfaces/IPlayground' ; /**
 * Converting a legacy codepen to our new playground pattern
 */ export function playgroundAdapter ( codepen ) { const files = { } ; files [ 'app.html' ] = getHtmlContent ( codepen ) ; files [ 'app.css' ] = getCssContent ( codepen ) ; if ( codepen . js ) { files [ 'app.js' ] = Array . isArray ( codepen . js ) ? codepen . js . join ( '\n\n' ) : codepen . js ; } return { framework : 'css' , files } ; } function getHtmlContent ( codepen ) { let html = codepen . html ; if ( codepen . htmlAttributes ) { const wrapper = document . createElement ( 'div' ) ; for ( const attr in codepen . htmlAttributes ) { wrapper . setAttribute ( attr , codepen . htmlAttributes [ attr ] ) ; } wrapper . innerHTML = `\n${ html }\n` ; html = wrapper . outerHTML ; } if ( codepen . htmlTemplates ) { for ( const template of codepen . htmlTemplates ) { const ngTemplate = document . createElement ( 'script' ) ; ngTemplate . type = 'text/ng-template' ; ngTemplate . id = template . id ; ngTemplate . innerHTML = template . content ; html += `\n\n${ ngTemplate . outerHTML }` ; } } return html ; } function getCssContent ( codepen ) { if ( ! codepen . css ) { return '\n' ; } return Array . isArray ( codepen . css ) ? codepen . css . join ( '\n\n' ) : codepen . css ; }