Merge pull request #112 from sveltejs/oncreate-prevents-autorun

only autorun if no oncreate
sveltejs · Jul 22, 2017 · f01b8f9 · f01b8f9
2 parents 9c945ad + 88525ba
commit f01b8f9
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 6 deletions.
diff --git a/server/manifests/bundle.json b/server/manifests/bundle.json
@@ -1,5 +1,5 @@
 
 		{
-			"bundle.js": "client/dist/bundle.4f94c5b2e0057d3579ce48414878d32914eb084b.js"
+			"bundle.js": "client/dist/bundle.9b928683a0dcb3e1116edb9e26b2fa645cac78f2.js"
 		}
 
diff --git a/server/manifests/css.json b/server/manifests/css.json
@@ -1 +1 @@
-{"main.css":"client/dist/main.db39ee6dfded6099e124b9a3bafbd0b8.css"}
+{"main.css":"client/dist/main.668fe1eea5359e2f207cdcb4dc619a1b.css"}
diff --git a/universal/routes/Repl/Viewer.html b/universal/routes/Repl/Viewer.html
@@ -1,5 +1,5 @@
 <div class='iframe-container'>
-	<iframe ref:child class='{{error || pendingImports ? "greyed-out" : ""}}' srcdoc='
+	<iframe ref:child class='{{error || pending || pendingImports ? "greyed-out" : ""}}' srcdoc='
 		<!doctype html>
 		<html>
 			<head>
@@ -28,6 +28,10 @@
 
 			{{error.message}}
 		</p>
+	{{elseif pending}}
+		<div class='pending' on:click='run()'>
+			<span>Click to run</span>
+		</div>
 	{{elseif pendingImports}}
 		<p class='info message'>loading {{pendingImports}} {{pendingImports === 1 ? 'dependency' : 'dependencies'}} from packd.now.sh (this may take a while if the package isn't cached)</p>
 	{{/if}}
@@ -66,13 +70,34 @@
 		position: absolute;
 		top: 0;
 		width: 100%;
+		height: 100%;
 		padding: 1em;
 		pointer-events: none;
 	}
 
 	.overlay p {
 		pointer-events: all;
 	}
+
+	.pending {
+		position: absolute;
+		width: 100%;
+		height: 100%;
+		text-align: center;
+		top: 0;
+		left: 0;
+		pointer-events: all;
+	}
+
+	.pending span {
+		position: absolute;
+		top: calc(50% - 0.5em);
+		line-height: 1;
+		left: 0;
+		text-align: center;
+		width: 100%;
+		font-size: 2em;
+	}
 </style>
 
 <script>
@@ -154,7 +179,18 @@
 
 					const missingImports = bundle.imports.filter( x => !importCache[ x ] );
 
-					const createComponent = () => {
+					const ready = () => {
+						// TODO this is very hacky — would be great if this information
+						// was exposed by the compiler somehow
+						if (/[^_]oncreate/.test(bundle.code)) {
+							this.set({ pending: true });
+						} else {
+							this.set({ pending: false });
+							this.createComponent();
+						}
+					};
+
+					this.createComponent = () => {
 						this.set({ error: null });
 
 						if ( toDestroy ) {
@@ -226,14 +262,14 @@
 						promise
 							.then( () => {
 								if ( cancelled ) return;
-								createComponent();
+								ready();
 							})
 							.catch( error => {
 								if ( cancelled ) return;
 								this.set({ error });
 							});
 					} else {
-						createComponent();
+						ready();
 					}
 				}
 
@@ -285,6 +321,13 @@
 					if ( error ) this.set({ error });
 				});
 			});
+		},
+
+		methods: {
+			run () {
+				this.set({ pending: false });
+				this.createComponent();
+			}
 		}
 	};
 </script>
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		{"main.css":"client/dist/main.db39ee6dfded6099e124b9a3bafbd0b8.css"}
		{"main.css":"client/dist/main.668fe1eea5359e2f207cdcb4dc619a1b.css"}