bertanya-tanya apa yang kami lakukan dengan server web kami pada pekerjaan kartu nama dari minggu lalu? Ini menyalakan dinding grafiti LED raksasa. Animasi dapat dikirimkan pengguna menggunakan desainer Internet. Anda dapat menonton umpan online dari animasi individu juga. Di antarmuka Internet berjalan pada Google App Engine untuk skalabilitas maksimum dan juga ketahanan.
Dalam caranya saat ini – untuk kita tutupi semua ins serta di luar membangun dinding grafiti jaringan Anda sendiri.
Konsep ikhtisar
Urutan grafiti dirancang di Internet dengan desainer animasi JavaScript. Urutan yang diselesaikan divalidasi serta disimpan dalam database; Kami membuat backend basis data untuk PHP / MySQL serta Google Apps (Python). Urutan disinkrasi dari API datafeed sederhana. Server Web mini kami mengambil urutan animasi dari umpan, serta cache mereka pada kartu SD. Akhirnya, urutan ditampilkan pada matriks LED raksasa.
Tampilan besar, resolusi rendah
Layar grafiti kami adalah 1 meter persegi, 5 × 5 matriks LED. Ini dipengaruhi oleh meja kopi Punk Daft yang ditawarkan oleh habitat beberapa tahun yang lalu. Meja Punk Daft menelurkan banyak replika DIY, termasuk ini yang dapat diperintahkan ini untuk membangun meja punk daft. Seiring waktu, pola berubah menjadi sejumlah permutasi, seperti “tabel punk daft” kami. Menyediakan variasi furnitur besar dan berkedip, kami mencari istilah yang jauh lebih baik daripada “Meja Punk Daft”. Kami datang dengan “tampilan besar, resolusi rendah” atau llrd untuk pendek (dilafalkan ‘lemak babi).
Tabel Punk Daft asli melintas secara acak, atau pada waktunya untuk musik. Tabel replika [Mathieu Roncheau] menyimpan urutan animasi di EEPROM. Gaya pertama kami mengambil langkah ini lebih lanjut dengan menyimpan data animasi pada kartu SD yang diformat lemak. Sekarang, kami telah menempatkan desainer di Internet untuk memastikan bahwa kami dapat mengambil urutan animasi yang dikirimkan pengguna melalui Internet.
Antarmuka online.
Animasi grafiti untuk LLRD diproduksi dengan pembuat urutan JavaScript sederhana. Tonton umpan online animasi yang dikirimkan pengguna, atau coba sendiri. Desainer urutan grafiti serta backend data ditulis, untuk PHP / MySQL serta Google App Engine, termasuk dalam arsip kerja.
Desainer urutan grafiti javascript mudah digunakan:
Klik kotak untuk mengaktifkan led yang ditampilkan di setiap bingkai animasi Anda.
Gunakan tombol panah untuk menavigasi antar frame.
Cadangan serta membawa alat kembali menyediakan metode sederhana untuk menyimpan urutan Anda secara lokal dalam file teks.
“Tambahkan bingkai teks” Sisipkan bingkai karakter menggunakan font bitmaped. Jika Anda tidak menyukai font default, hanya menghasilkan yang baru:
Klik tombol ‘Edit Font’ ke ton font yang ada.
Buat modifikasi Anda.
Klik ‘Perbarui Font’ untuk mengganti gaya font default dengan bingkai baru.
Array gaya font adalah tabel pencarian bitmap untuk karakter ASCII antara area serta Z (karakter ASCII 32 hingga 90, “!” # $% & ‘() * +, -. / 0123456789 :; <=>. @Abcdefghijklmnopqrstuvwxyz “). Untuk menambahkan gaya font baru secara permanen, cukup tempel Fontset yang diperbarui dalam kode JavaScript yang sesuai dengan variabel ‘font =’. Pilihan “format font” di kotak cadangan akan menghasilkan bitmap yang diformat variabel yang disiapkan untuk menempelkan font yang ada.
Ketika Anda telah menyelesaikan animasi, masuk ke nama Anda di kotak penulis serta tekan kirim. Kode urutan akan diproduksi serta dikirim ke server.
Desainer grafiti berbasis JavaScript Internet dipengaruhi oleh versi offline oleh [Mathieu Roncheau]. Kode sumber Delphi [Mathieu] serta executable diarsipkan di sini. Desainer berbasis JavaScript kami memiliki beberapa fitur tambahan, berbasis browser, serta tidak perlu Anda menjalankan file .exe yang tidak dikenal. Meskipun itu dimaksudkan untuk berjalan di web, desainer juga akan bekerja dari salinan regional di komputer Anda.
Script akan bekerja untuk semua jenis matriks arbitrer, hanya memodifikasi dptrows serta variabel DPTCOLS ke dimensi llrd Anda.
Pemirsa online memanfaatkan permintaan asinkron HTTP (Ajax-ISH) untuk menunjukkan umpan streaming dari animasi grafiti yang dikirimkan pengguna. Ini akan mencoba mengatur cookie untuk memastikan bahwa itu dapat dimulai dengan urutan segar setiap kali halaman dimuat. Jika Anda tidak mengaktifkan cookie, itu hanya dimulai pada 0 pada kunjungan Anda berikutnya.
Format bitmap urutan
Builder Urutan mengeluarkan setiap kolom sebagai bitmap yang diformat ASCII. Bitmap untuk setiap kolom dipisahkan oleh spasi, serta setiap bingkai penuh diakhiri dengan umpan baris (NR). Gaya ini didefinisikan oleh [Mathieu Roncheau] Program Sequencer PC, kami menyimpannya untuk menjaga kompatibilitas mundur.
Data bitmap nol di sudut kiri atas bingkai. Sel-sel teratas dari setiap kolom adalah bit 0, serta sel-sel bawah adalah bit 4. Tampaknya lebih rasional untuk mematuhi notasi dasar matematika serta memanfaatkan sel kiri bawah sebagai asal, namun kami tidak menata spesifikasi. .
Nilai untukR Setiap kolom ditemukan dengan memperlakukan LED LED sebagai 1 dalam jumlah biner, serta konversi menjadi desimal. Misalnya, kolom pertama di atas adalah 10000 biner, atau 1 desimal. Kolom terakhir adalah 11111 biner, atau desimal 31. Anda dapat mengkonfirmasi konversi kami menggunakan kalkulator Binary-desimal Internet.
Perhatikan bahwa bitmap kolom diwakili oleh ekuivalen ASCII dari nilai desimal yang sebenarnya. Digit numerik dikodekan sesuai dengan standar ASCII, yang merupakan nilai aktual ditambah 0x30h. Selanjutnya, angka multi-digit disimpan sebagai karakter pribadi; 24 Pada contoh disimpan sebagai 0x32h, 0x34h.
Sisi server
Backend adalah aplikasi perangkat lunak sederhana yang menerima urutan animasi, melakukan beberapa validasi, serta menyimpannya ke database. Urutan yang disimpan dapat diakses dari DataFeed API.
Backend.
Kami menyusun dua versi backend; keduanya ada di arsip kerja. Yang pertama adalah backend PHP / MySQL sederhana untuk volume rendah di Internet llrds, yang lain adalah versi Google App / versi Python yang harus dapat menangani banyak pembaca harian.
Sangat mudah untuk menulis backend untuk platform pilihan Anda. MODIFIKASI Tindakan tipe kirimkan desainer grafiti untuk menunjuk ke backend Anda; Kedua versi yang saat ini dipublikasikan ke backend.php. Sekarang, tangkap variabel ‘penulis’ serta ‘seq’ di server Anda serta menyimpannya ke database.
Backend kami melakukan sedikit validasi untuk mencegah serangan pada sistem. Kami menerapkan cek di fase sehingga mereka tidak menyia-nyiakan banyak sumber daya. Pertama, ukuran umum pengajuan diperiksa untuk memastikannya dalam alasan. Selanjutnya, urutan dibagi menjadi bingkai pribadi serta masing-masing diperiksa formulir. Jika melewati validasi, itu disimpan ke database.
Feed API.
Urutan dapat diakses dengan API datafeed sederhana. API memiliki dua variabel:
.
Max – jumlah maksimum urutan untuk dikirim.
Terakhir – Urutan terakhir membaca, hanya data baru yang dikirim.
DataFeed memulai setiap urutan animasi dengan karakter ‘#’, dipenuhi dengan nomor ID serta umpan baris. ‘#’ Adalah nilai bitmap yang tidak valid yang memberi tahu klien ke awal urutan baru. Klien dapat memanfaatkan nomor ID dengan variabel terakhir API untuk mendapatkan urutan segar pada setiap tarikan.
Perangkat keras
Server Web Mini.
Kami menggunakan server web mini PIC24F kami sebagai klien yang diaktifkan TCP untuk proyek ini. Memeriksa artikel kami sebelumnya untuk menemukan cara untuk mengembangkan server web.
Tabel Punk Daft.
[MrGalleta] memiliki tutorial bangunan yang fantastis untuk bagian tabel aktual dari replika tabel punk daft. LLRD dapat mengambil banyak bentuk, seperti hiasan dinding kami.
Sebagian besar gaya Replika Table Punk Daft dikelola oleh Expander output 74HCT595 (PDF) serta array transistor ULN2803A (PDF). Papan pengemudi dari ini dapat diintegruktur menggabungkan keduanya menjadi PCB yang mudah dietsa, melalui lubang. Setiap papan pengemudi memiliki dua 74HTC595S, atau 16 output; Kami membutuhkan dua papan driver untuk 25 sel kami llrd.
74HCT595 adalah Expander Output Serial yang dikelola oleh antarmuka seperti SPI. Pembaruan diprakarsai dengan menjatuhkan garis latch. Tentukan setiap LED (ON atau OFF) diletakkan pada garis data, dipenuhi dengan pulsa jam. Bit diletakkan pada pin output ketika sinyal kait kembali tinggi. Cascade data dari pin output data dari satu 595, ke input data berikutnya. Memeriksa tutorial 74xx595 ini untuk tampilan terperinci di interfacing perangkat ini.
Penting untuk dicatat bahwa kami menggunakan 74HCT595, serta bukan 74HC595. Bagian “HCT” bekerja melalui berbagai variasi voltase, termasuk tegangan operasi server web mini: 3.3Volts.
Sumber-sumber 74HCT595 saat ini, yang berarti kami kemungkinan besar akan menjalankan satu LED langsung dari setiap output pada 3,3Volts. Karena sebagian besar LLRD memiliki 2-8 led per sel, beroperasi antara 5 serta 24volts, kami menggunakan array transistor ULN2803A untuk mengalihkan beban yang lebih besar. ULN2803A menenggelamkan arus, daripada sumbernya; Itu menghidupkan koneksi darat LED, bukan kekuatan.
LLRD kami memiliki dua LED per sel, berjalan pada 20mA dengan pasokan 5 volt serta resistor 56ohm. Kami menyolder LED di sekitar sepotong kardus, bukannya etsa 25 papan sirkuit kecil.
Koneksi
Koneksi 5 kabel antara server web mini serta papan driver mengontrol llrd.
Server.
Llrd.
Keterangan
V +.
Vsys.
Pasokan 3.3Volt untuk 595-an.
Gnd.
Gnd.
Koneksi darat bersama.
RA0.
Data dalam.
Sinyal data.
RA1.
Jam
Sinyal jam.
Rb15.
Memalangi
Sinyal kait.
–
JED
Catu daya yang dipimpin.
Firmware.
Firmware kami ditulis dalam PEMULAI MPLAB serta kompiler demo Microchip C30. Temukan lebih lanjut tentang pemrograman serta bekerja dengan PIC24F dalam tutorial pengantar kami. Dua versi firmware termasuk dalam arsip kerja. Yang pertama baru saja membaca semua * .SEQ data urutan dari kartu SD, versi kedua menambahkan microchip tcp / ip stack untuk konektivitas web. di sebelahScover lebih lanjut tentang kartu microchip SD serta perpustakaan TCP / IP di tutorial server web mini kami.
Semua fungsi grafis, termasuk klien TCP, dapat ditemukan di graffitigfx.c. Klien TCP didasarkan pada contoh klien TCP generik yang disertakan dengan TCP / TCP. Kami memenuhi pendekatan multitasking kooperatif microchip serta memecahkan kode kami menjadi segmen-segmen kecil yang membagikan waktu CPU dengan sisa tumpukan TCP / IP.
Klien secara teratur menautkan ke DataFeed serta meminta urutan baru. Urutan baru diuraikan untuk nomor ID, serta ditambahkan ke data sementara pada kartu SD. ID terakhir yang terdeteksi ditulis ke file data sementara yang sangat akhir, serta ditambahkan ke variabel terakhir URL pada permintaan data selanjutnya. Kami merekam ID di akhir data untuk mencegah dikomposiskan berulang ke sektor yang sama pada kartu SD. Idealnya aus leveling di dalam kartu SD 1GB memadai untuk mencegah masalah untuk beberapa dekade pertama penggunaan pertama. Jika tidak ada koneksi jaringan, gadget memutar semua jenis * .SEQ data di direktori root kartu SD.
Fungsi parser menerjemahkan frame serta mengirimkannya ke llrd. Parser relatif kuat terhadap kesalahan. Data yang buruk yang membuatnya melewati rutin validasi backend akan ditolak pada tingkat gadget tanpa efek sakit. Jika beberapa bingkai korup menangani untuk menampilkan, itu hampir tidak akan diperhatikan di antara pola abstrak lainnya yang diputar di dinding.
1
2.
3.
#define gfx_use_tcp_client // sertakan klien TCP
#define gfx_tcp_only // hanya lakukan TCP serta memeriksa file temp, jangan memeriksa data lain pada kartu SD.
#define gfx_clear_temp_on_reset // opsional menghapus data temp pada reset. Bagus untuk engine Google App …
Tiga mendefinisikan di awal graffitigfx.c mengelola fitur mana yang termasuk dalam waktu kompilasi. Gfx_use_tcp_client mengkompilasi firmware dengan klien TCP yang diaktifkan, mengomentari makna ini untuk kartu SD hanya versi firmware. GFX_TCP_LY mengabaikan semua jenis data .SEQ pada kartu SD, serta hanya urutan permainan yang diunduh dari web. Pilihan GFX_CLEAR_TEMP_ON_RESET akan menghapus data urutan sementara pada setiap reset; Ini berguna untuk basis data yang memiliki ID rekaman non-berurutan, seperti Datastore Google. Di masa depan, definisi-definisi ini dapat diubah menjadi variabel yang ditetapkan oleh data konfigurasi pada kartu SD.
Membawanya lebih jauh
Firmware sederhana kami adalah titik awal yang stabil untuk dinding grafiti internet. Sementara kami sedang mengerjakan pekerjaan ini, kami datang dengan banyak fitur tambahan yang tidak membuatnya menjadi prototipe.
Tampilkan alamat IP saat startup.
Data konfigurasi pada kartu SD yang menetapkan URL data, refresh frekuensi, serta variabel lainnya.
Antarmuka telnet atau web untuk konfigurasi jarak jauh.
Server TCP untuk akses gain langsung ke layar; dorong bingkai animasi dari PC jarak jauh.
Klien surat yang melaporkan kesalahan serta informasi kondisi.
Pesan kemajuan selama startup serta unduhan urutan. Kartu SD tidak ada / kesalahan penuh.
Menggulir umpan twitter.
Pikiranmu?
Jangan hanya check out tentang proyek ini, berkontribusi beberapa bingkai ke dinding grafiti.
Lain kali kita akan memperkenalkan proyek pic24f terakhir kami, ransel Ethernet untuk $ 20 kecil Nokia LCD knock-off dari SPARKFUN Electronics.