← 2. Cool Projects 1

Puma Browser

Mark as complete Bookmark

Puma is a mobile web browser available on the App Store and Play Store. Launched in 2019, it is the first browser with native support for web monetization.

An Ad-Free Experience

By design, Puma is built with privacy in mind. There are no ads. Instead, the browser helps pay creators directly while keeping viewers' data private.

It's a little bit like the Brave browser and the complete opposite of the Chrome and Edge business models.

Streaming Micropayments

Web monetized users stream micropayments in real-time to web monetized sites. You'll learn

  • [x] #739
  • [ ] https://github.com/octo-org/octo-repo/issues/740
  • [ ] Add delight to the experience when all tasks are complete :tada:

testing whether this highlights

testing whether this highlights

In the words of Abraham Lincoln:

Pardon my French

Puma image

Ashvin image

<meta
<!doctype html>
<html>
  <head>
    <title>Web Monetized Site</title>
    <meta
      name="monetization"
      content="$wallet.example.com/alice">
  </head>
</html>

function pendingEventHandler (event) {
  console.log(event)
}

document
  .monetization
  .addEventListener('monetizationpending', pendingEventHandler)

// Define your revenue share here.
// If these weights add to 100 then they represent the percent each pointer gets.
const pointers = {
  '$alice.example': 50,
  '$bob.example': 40,
  '$connie.example': 9.5,
  '$dave.example': 0.5
}

// this is the same `pickPointer()` function implemented in the previous snippet
function pickPointer () {
  const sum = Object.values(pointers).reduce((sum, weight) => sum + weight, 0)
  let choice = Math.random() * sum

  for (const pointer in pointers) {
    const weight = pointers[pointer]
    if ((choice -= weight) <= 0) {
      return pointer
    }
  }
}

app.use((req, res, next) => {
  // is this request meant for Web Monetization?
  if (req.header('accept').includes('application/spsp4+json')) {
    // choose our random payment pointer
    const pointer = pickPointer()

    // turn the payment pointer into a URL in accordance with the payment pointer spec
    // https://paymentpointers.org/
    const asUrl = new URL(pointer.startsWith('$') ? 'https://' + pointer.substring(1) : pointer)
    asUrl.pathname = asUrl.pathname === '/' ? '/.well-known/pay' : asUrl.pathname

    // redirect to our chosen payment pointer so they get paid
    res.redirect(302, asUrl.href)
  } else {
    // if the request is not for Web Monetization, do nothing
    next()
  }
})

A sub heading

In which I emphasize things

Charity

The future

oday, we enable seamless payments for creators, app & game developers via Coil and ILP protocol and access to HNS & ENS domains. Long term, our goal is to give 1b people access to Web3 world, DeFi, the peer to peer and ownership based economy.