sbs

sbs

QRCode - Implement QR Code in Elixir

Only 650 LOC, wrote for fun :slight_smile:

https://github.com/sunboshan/qrcode

Most Liked Responses

Eiji

Eiji

@Raddi_On:
You can use for example request for json.
For example:

defmodule MyAppWeb.Controllers.ExampleController do
  def action_name(conn, %{param_name: param_value}) do
    matrix = QRCode.encode(param_value).matrix
    data = matrix |> Tuple.to_list() |> Enum.map(&Tuple.to_list/1)
    json(conn, data)
  end
end

You can also use probably Drab:

Eiji

Eiji

@Raddi_On: Just few steps:

  1. Of course you need somehow send these data to JavaScript (let’s say in json format)
  2. You need a simple function that draws qrcode - it’s just matrix of 0 (white) and 1 (black) squares. Drawing squares in canvas is one of the easiest things to do.
  3. You need to use export as I already show

I will show you how it could look in Elixir:

defmodule Example do
  # @canvas ...

  def draw_image(matrix) do
    # firstly we need to have enumarable - not tuples, so:
    matrix
    |> Tuple.to_list()
    |> Enum.map(&Tuple.to_list/1)
    # then we need to have a row numbers like:
    |> Enum.with_index()
    # then for all rows:
    |> Enum.map(&draw_row/1)
  end

  defp draw_row({row, index}) do
    row
    # we need to know also column index:
    |> Enum.with_index()
    # then for all cells in row:
    |> Enum.map(&draw_cell(&1, index))
  end

  defp draw_cell({0, column}, row) do
    do_draw_cell(row, column, {255, 255, 255})
  end
  defp draw_cell({1, column}, row) do
    do_draw_cell(row, column, {0, 0, 0})
  end

  defp do_draw_cell(row, column, color) do
    # you have row, column and color to draw
    # simply calculate `x` and `y` like:
    square_size = 5
    x = column * square_size
    y = row * square_size
    # now you can call real draw function
    # with x, y, width (square_size), height (square_size) 
    # and finally fill it with color
    Canvas.draw(@canvas, x, y, square_size, square_size, color)
    # use canvas HTML5 API to export image
    # for example on download button click
  end
end

As you can see square coordinates are noting special. You just need to know in which row and column you are and simply multiply them by number of pixels that you wish to have for each cell.

Eiji

Eiji

@sbs: No need to implement png encoder from scratch. Just draw QR code in canvas and add simple option to export it. :smiley:

For example you can draw a canvas and change it to image really easy in JavaScript:

var canvas = document.querySelector("canvas#selector.here");
var data = canvas.toDataURL("image/png");
document.write('<img src="' + data + '"/>');

It’s much more simpler and allows to simple export in much more formats without any library for this!

Where Next?

Popular in Announcing Top

wmnnd
Hi there, for my project DBLSQD, I needed a file storage solution that is a bit more flexible than Arc. Because I thought others might f...
New
Crowdhailer
The latest release of Ace (0.10.0) includes serving content over HTTP/2. I have started writing a webserver to teach my self more about...
New
pkrawat1
Presenting Aviacommerce, open source e-commerce platform in Elixir Aviacommerce is an open source e-commerce platform in Elixir. We at...
New
josevalim
EDIT: since Ecto 3.0 final version is out, this post was amended to use the final versions in the instructions below. Hi everyone, We a...
New
kelvinst
Hey everyone! Well, we made this lib a while ago and now we decided to finally go out and public with it! It’s a tool for creating and m...
New
tmbb
I’ve been working on two packages (not on hex.pm yet) to build admin interfaces for phoenix apps: bureaucrat - which contains a bunch ...
New
mindok
What is ContEx? A pure Elixir server-side data plotting/charting library outputting SVG. It has nice barcharts in particular and works g...
New
treble37
Just looking for a little feedback on a tiny helper library I built - Sometimes I find the need to convert maps with atom keys to maps w...
New
handnot2
Samly can be used to enable SAML 2.0 Single Sign On in a Plug/Phoenix application. This library uses Erlang esaml to provide plug enabl...
New
pkrawat1
Hey guyz We at @aviabird are working on a payment library in elixir/phoenix. We are targeting March 2018 to add 56 Gateways to it. Have...
New

Other popular topics Top

sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
senggen
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
New
New
9mm
I am constructing a JSON object (map) and I need to conditionally set a field. I’m trying to write proper elixir-way code… and I’m at a l...
New
gshaw
What is the idiomatic way of matching for not nil in Elixir? E.g., First way: defp halt_if_not_signed_in(conn, signed_in_account) when...
New
aesmail
Hello guys, I have finally made it. I created an admin interface for a framework. It’s been on my todo list for years and with the curre...
New
sergio_101
I am VERY much an elixir newbie. I have taken one elixir course and one phoenix course on Udemy. During that course, I saw the instructor...
New
dblack
I’ve got an issue with an app and I’ve no idea of how to troubleshoot it. I’m hoping someone here might have seen something similar. I p...
New
boundedvariable
I am going through the kafka architecture. All the features what the kafka is providing are already in Erlang. I would like hear your opi...
New
joaquinalcerro
Hi there, I am working with Ecto-Postgresql and I need to call all of the records from a specific table but the table has 40,000 records...
New

We're in Beta

About us Mission Statement