README.md

@@ -12,7 +12,7 @@
 
 `hype` wraps `hono` with useful features for fast prototyping:
 
-- HTTP logging to the console (disable with `NO_HTTP_LOG` env variable)
+- HTTP logging (disable with `NO_HTTP_LOG` env variable)
 - Static files served from `pub/`
 - Page-based routing to `.tsx` files that export a `JSX` function in `./src/pages`
 - Transpile `.ts` files in `src/js/blah.ts` via `website.com/js/blah.ts`

example/src/css/main.css

@@ -33,8 +33,4 @@ h1 {
   100% {
     background-position: 100% 50%;
   }
-}
-
-ul {
-  list-style-type: none;
 }

example/src/js/burger.ts

@@ -2,8 +2,6 @@ export function initBurger() {
   document.addEventListener('click', ev => {
     const el = (ev?.target as HTMLElement).closest('.burger') as HTMLImageElement
 
-    if (!el) return
+    if (el) el.src = '/img/bite.png'
-
-    el.src = el.src.endsWith('/img/burger.png') ? '/img/bite1.png' : '/img/bite2.png'
   })
 }

example/src/pages/index.tsx

@@ -4,10 +4,6 @@ export default () => (
     <h1>Hello, world!</h1>
     <p>Welcome to <span class="hype">hype</span>!</p>
     <p>If you're seeing this, something definitely went right.</p>
-
+    <a href="/about">About This Website</a>
-    <ul>
-      <li><a href="/about">About This Website</a></li>
-      <li><a href="/js-test">JS Test</a></li>
-    </ul>
   </section>
 )

example/src/pages/js-test.tsx

@@ -1,11 +0,0 @@
-import { frontend as fe } from 'hype'
-
-fe(function test() {
-  alert('ding dong')
-})
-
-export default () => (
-  <section>
-    <a href="#" click="test()">test</a>
-  </section>
-)

src/frontend.ts

@@ -1,10 +0,0 @@
-let funcs: string[] = []
-
-// Designate a function in a .tsx file as frontend
-export function frontend(code: Function) {
-  funcs.push(code.toString())
-}
-
-export function feFunctions(): string[] {
-  return funcs
-}

src/index.tsx

@@ -6,14 +6,12 @@ import color from 'kleur'
 
 import { transpile } from './utils'
 import defaultLayout from './layout'
-import { feFunctions } from './frontend'
 
 const SHOW_HTTP_LOG = true
 const CSS_RESET = await Bun.file(join(import.meta.dir, '/reset.css')).text()
 const PICO_CSS = await Bun.file(join(import.meta.dir, '/pico.css')).text()
 
 export * from './utils'
-export { frontend } from './frontend'
 
 export type HypeProps = {
   pico?: boolean
@@ -78,33 +76,14 @@ export class Hype<
       this.use('*', async (c, next) => {
         await next()
 
-        const contentType = c.res.headers.get('content-type')
+        if (c.res.headers.get('content-type')?.includes('text/html')) {
-        if (!contentType?.includes('text/html')) return
+          const html = await c.res.text()
-
+          const formatted = formatHTML(html)
-        const res = c.res.clone()
+          c.res = new Response(formatted, c.res)
-        const html = await res.text()
+        }
-        const formatted = formatHTML(html)
-        c.res = new Response(formatted, c.res)
       })
     }
 
-    // serve frontend js
-    this.use('*', async (c, next) => {
-      await next()
-
-      const contentType = c.res.headers.get('content-type')
-      if (!contentType?.includes('text/html')) return
-
-      const fns = feFunctions()
-      if (!fns.length) return
-
-      const res = c.res.clone()
-      const html = await res.text()
-      const newHtml = html.replace('</body>', `<script>${fns.join('\n')}</script></body>`)
-
-      c.res = new Response(newHtml, c.res)
-    })
-
     // css reset
     this.get('/css/reset.css', async c => new Response(CSS_RESET, { headers: { 'Content-Type': 'text/css' } }))