Add qr code to table

This commit is contained in:
Jesse C. Fisher 2021-11-27 00:21:55 -08:00
parent 47939d6590
commit 6ccbc22cb2
6 changed files with 45 additions and 27 deletions

View File

@ -16,6 +16,7 @@
//= require react //= require react
//= require react_ujs //= require react_ujs
//= require components //= require components
//= require qrcode.min.js
// require react-rails-hot-loader // require react-rails-hot-loader
// require_tree . // require_tree .

View File

@ -0,0 +1,23 @@
#table-component, #table-component-container, .table
width: 100%
height: 100%
#table-controls
text-align: right
padding: 0 1em
#newgame
float: left
#qrcode
float: right
margin-top: -.5em
margin-right: 1em
transform: scale(10%)
transition: all 0.5s ease-in-out
width: 38px
height: 38px
&.full
margin-right: 2em
transform: scale(100%)
width: 384px
height: 384px

View File

@ -1,10 +0,0 @@
// Place all the styles related to the Tables controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
#table-component,
#table-component-container,
.table {
width: 100%;
height: 100%;
}

View File

@ -16,7 +16,26 @@
-# = button_to 'New Game', new_game_table_path(@table) -# = button_to 'New Game', new_game_table_path(@table)
-# - if @game && !@game.startable? -# - if @game && !@game.startable?
= button_to 'New Game', new_game_table_path(@table) #table-controls
#newgame= button_to 'New Game', new_game_table_path(@table)
#qrcode
:javascript
function gen_qrcode(){
var qrcode = new QRCode(document.getElementById("qrcode"), {
text: "#{request.original_url}",
width: 384,
height: 384,
colorDark : "#000000",
colorLight : "#ffffff00",
correctLevel : QRCode.CorrectLevel.H
});
}
gen_qrcode();
$('#qrcode').on('click', function(e) {
$('#qrcode').toggleClass("full");
e.preventDefault();
});
#game-component #game-component
- if @game.winner_player_id - if @game.winner_player_id

View File

@ -1,16 +0,0 @@
#!/usr/bin/env ruby
#
# This file was generated by Bundler.
#
# The application 'sass-convert' is installed as part of a gem, and
# this file is here to facilitate running it.
#
require 'pathname'
ENV['BUNDLE_GEMFILE'] ||= File.expand_path("../../Gemfile",
Pathname.new(__FILE__).realpath)
require 'rubygems'
require 'bundler/setup'
load Gem.bin_path('sass', 'sass-convert')

File diff suppressed because one or more lines are too long