index.scroll
Changed around line 36: playgroundIde
- The results/preview pane can be displayed by itself without the ide/editor by using `playground-project` and `playground-preview`, I haven't made a parser for these web components. Here is an example:
- belowAsCode
-
-
-
-
-
+ The results/preview pane can be displayed by itself without the ide/editor by using `playground-project` and `playground-preview` html elements. I wrote a playgroundPreviewParser to encapsulate these. Here is an example:
+ link playground-ide.scroll playgroundPreviewParser
+ belowAsCode 2
+ belowAsHtml
+ playgroundPreview
+ style height:150px
+ file index.html
+
+
+ Hello
+
+
playground-ide.scroll
Changed around line 11: playgroundFileParser
- return `
-
+
Changed around line 28: playgroundIdeParser
- return `
-
+ return `
-
- `;
+ `;
documentation.scroll
Changed around line 0
- belowAsHtmlParser
- extends belowAsCodeParser
- description displays html output of next particle in a code block
- cueFromId
- javascript
- get code() {
- return this.selectedParticles.filter(p => p.buildHtml).map(p => p.buildHtml()).join("\n")
- }
index.scroll
Changed around line 17: Serverless coding environments for the web.
- documentation.scroll
playground-ide.scroll
Changed around line 13: playgroundFileParser
- ${this.subparticlesToString()}
+ ${this.subparticlesToString()}
.requests.scroll
Changed around line 1
+ title Traffic Data
+ metaTags
+ homeButton
+ buildHtml
+ theme gazette
+
+ printTitle
+
+ container
+
+ Real time view
+ /globe.html?folderName=codeplaygrounds
+
+ button Refresh
+ link /summarizeRequests.htm?folderName=codeplaygrounds
+ post
+ // Anything
+
+ .requests.csv
+
ReadersWriters
ReadersWriters
+ sparkline
+ y Readers
+ color blue
+ width 200
+ height 200
+ sparkline
+ y Writers
+ color green
+ width 200
+ height 200
+ printTable
+
+ tableSearch
+ scrollVersionLink
.stats.json
Changed around line 1
+ {
+ "files": [
+ ".gitignore",
+ "documentation.scroll",
+ "index.scroll",
+ "playground-ide.scroll",
+ "tryscroll.scroll"
+ ],
+ "hasSslCert": true,
+ "stats": {
+ "folder": "codeplaygrounds",
+ "folderLink": "https://hub.scroll.pub/codeplaygrounds",
+ "created": "2024-12-31T20:45:41.000Z",
+ "revised": "2024-12-31T20:45:41.000Z",
+ "files": 5,
+ "mb": 1,
+ "revisions": 50,
+ "hash": "fd80a39494"
+ }
+ }
playground-ide.scroll
Changed around line 13: playgroundFileParser
- ${this.subparticlesToString()}
+ ${this.subparticlesToString()}
playground-ide.scroll
Changed around line 13: playgroundFileParser
- ${this.subparticlesToString()}
+ ${this.subparticlesToString()}
playground-ide.scroll
Changed around line 13: playgroundFileParser
- ${this.subparticlesToString()}
+ ${this.subparticlesToString()}
index.scroll
Changed around line 132: I didn't find a general way in scroll to use `encodeURIComponent` with other thi
- belowAsCode
+ belowAsCode 2
+ belowAsHtml
index.scroll
Changed around line 17: Serverless coding environments for the web.
+ documentation.scroll
- belowAsCode
+ belowAsCode 2
+ belowAsHtml
documentation.scroll
Changed around line 1
+ belowAsHtmlParser
+ extends belowAsCodeParser
+ description displays html output of next particle in a code block
+ cueFromId
+ javascript
+ get code() {
+ return this.selectedParticles.filter(p => p.buildHtml).map(p => p.buildHtml()).join("\n")
+ }
documentation.scroll
index.scroll
Changed around line 22: I implemented a playgroundIdeParser to wrap the `playground-ide` web component.
+ style height:150px
playground-ide.scroll
Changed around line 20: playgroundFileParser
- inScope playgroundFileParser
+ inScope playgroundFileParser aftertextStyleParser
+ get styles() {
+ const style = this.getParticle("style")
+ return style? `style="${style.content}"` : ""
+ }
-
+
index.scroll
Changed around line 139: tryscroll
- Would be nice if there was an easier way to `encodeURIComponent` into the iframe `src` attribute rather than implementing the `tryscrollParser`.
-
index.scroll
Changed around line 112: belowAsCode
+ The `program` parser in the `link` aftertextparser can be used to urlencode a scroll program as follows
+
+ belowAsCode
+ Link to open a scroll program on try scroll
+ link https://try.scroll.pub/# try scroll
+ program
+ scroll
+ theme gazette
+ code
+ two = 1 + 1
+
- I implemented a tryscrollParser to display try scroll in an iframe. Can scroll be loaded natively and into a web component somehow instead?
+ I didn't find a general way in scroll to use `encodeURIComponent` with other things like the `iframe` src attribute, so I implemented a tryscrollParser. It displays try scroll in an iframe.
Changed around line 137: tryscroll
- why does the above only show the editor and not the preview? When I had iframe directly both showed. Ok both don't show, but it fills the column width
+ Why does the above only show the editor and not the preview?
- belowAsCode
-
-
- belowAsCode
- Link to open a scroll program on try scroll
- link https://try.scroll.pub/# try scroll
- program
- scroll
- theme gazette
- code
- two = 1 + 1
+ Would be nice if there was an easier way to `encodeURIComponent` into the iframe `src` attribute rather than implementing the `tryscrollParser`.
- Would be nice if there was an easier way to `encodeURIComponent` into the iframe `src` attribute rather than implementing the `tryscrollParser`.
+ It would be nice if try scroll could be implemented as a web component instead of resorting to an iframe.
tryscroll.scroll
Changed around line 27: tryscrollParser
- const attrs = [`src="${this.link}"`, 'style="width: 100%; height: 300px;"']
+ const attrs = `src="${this.link}" style="width: 100%; height: 300px;"`
index.scroll
Changed around line 54: belowAsCode
- Load the code. The first two scripts are only required for the wasm based languages. The 3rd is the main web component and supports javascript natively
+ ## Load the code
+ The first two scripts are only required for the wasm based languages. The 3rd is the main web component and supports javascript natively
index.scroll
Changed around line 50: belowAsCode
- # code-api
+ # codapi
- https://codapi.org/ and https://github.com/nalgeon/codapi-js
-
- These first two are only required for wasm. The 3rd is the web component
+ https://codapi.org/ (github) is another web component which allows client-side presentation of code snippet playgrounds.
+ link https://github.com/nalgeon/codapi-js github
+ Load the code. The first two scripts are only required for the wasm based languages. The 3rd is the main web component and supports javascript natively
index.scroll
Changed around line 19: Serverless coding environments for the web.
- link playgroundIdeParser playground-ide.scroll
+ link playground-ide.scroll playgroundIdeParser
index.scroll
Changed around line 19: Serverless coding environments for the web.
+ link playgroundIdeParser playground-ide.scroll
index.scroll
Changed around line 18: Serverless coding environments for the web.
- I implemented a playgroundIdeParser to wrap the `` web component. Html, javascript, typescript, etc. files can be included in the playground like this:
+ I implemented a playgroundIdeParser to wrap the `playground-ide` web component. Html, javascript, typescript, etc. files can be included in the playground like this:
Changed around line 31: playgroundIde
- The results/preview pane can be displayed by itself without the ide/editor by using `` and ``, I haven't made a parser for these. Here is an example:
+ The results/preview pane can be displayed by itself without the ide/editor by using `playground-project` and `playground-preview`, I haven't made a parser for these web components. Here is an example:
Changed around line 112: belowAsCode
- I implemented a tryscrollParser to display tryscroll in an iframe. Can scroll be loaded natively and into a web component somehow instead?
+ I implemented a tryscrollParser to display try scroll in an iframe. Can scroll be loaded natively and into a web component somehow instead?
- link https://try.scroll.pub tryscroll
+ link https://try.scroll.pub/# try scroll
index.scroll
Changed around line 18: Serverless coding environments for the web.
+ I implemented a playgroundIdeParser to wrap the `` web component. Html, javascript, typescript, etc. files can be included in the playground like this:
Changed around line 31: playgroundIde
- TODO: make scroll parser for this also
+ The results/preview pane can be displayed by itself without the ide/editor by using `` and ``, I haven't made a parser for these. Here is an example:
Changed around line 112: belowAsCode
- Implemented a parser to display tryscroll in an iframe. Can scroll be loaded natively and into a web component somehow instead?
- link tryscroll.scroll tryscroll
+ I implemented a tryscrollParser to display tryscroll in an iframe. Can scroll be loaded natively and into a web component somehow instead?
+ link tryscroll.scroll tryscrollParser
+ link https://try.scroll.pub tryscroll
index.scroll
Changed around line 22: belowAsCode
-
+
-
+
index.scroll
Changed around line 17: Serverless coding environments for the web.
+ playground-ide.scroll
- script
- import('https://cdn.jsdelivr.net/npm/playground-elements@0.18.1/+esm')
-
- belowAsCode
-
-
-
-
+ playgroundIde
+ file index.html
+
+
+ Hello
+
+ `;
+ }
+
+ playgroundIdeParser
+ extends abstractScrollParser
+ inScope playgroundFileParser
+ description playground-ide for html/typescript/javascript
+ cueFromId
+ javascript
+ buildHtml() {
+ return `
+
+ ${this.filter(p => p.buildHtml).map(p => p.buildHtml()).join("\n")}
+
+ `;
+ }
playground-ide.scroll