【Excel】行削除のショートカット

やあ子供たち。今日は便利な表題のショートカットを紹介するよ。
行削除はExcelの一番左の、A列のさらに左にある行番号の列の、行削除したいところで右クリックして「削除」を選択するなんてことをおじさんはいちいちやってきたのだがこれからはすべてキーボードで完結して行が消せるぞ。
その方法とは以下だよ。

  1. (Shift+スペースキー)
  2. (Ctrl+マイナスキー)

はい、まず1で行全体が選択状態となり、2の操作で行全体が削除されますと。
じゃ今日はこんなところで。チャオ!

WebGPUシェーダをhtmlの<script>タグから外部ファイルに外出しする方法

やあ子供たち。今日はタイトルの内容だよ。外出ししたWGSLのファイル名を shader.wgsl としたときにそれをhtmlに読み込んでくる方法は以下の通りだよ。

  <script id="vs" type="x-shader/x-webgpu"></script>
  <script type="text/javascript">
    fetch('shader.wgsl')
      .then(response => response.text())
      .then(data => {
        const shader = document.getElementById('vs');
        shader.textContent = data;
      });
  </script>

これは何をしているかというとまず、空のvsというIDのスクリプトタグを作っておきます。そしてそこに、shader.wgslの内容をコードでもって能動的に注入してあげるんですね。あとはvscodeに「WGSL」などの、wgslコードをハイライトしてくれる拡張をインストールして、快適にwgslを編集・閲覧することができるようになったよ。
今日はこれまで。チャオ!

ラジオボタンに関してだけはjqueryを使わせてもらう

やあ子供たち。今日はラジオボタンに関してだけは、jqueryを使わせてもらって、ラジオボタンまわりの作成工数をぐっと縮めさせてもらおうという記事だよ。ラジオボタン(ポチ)は同じグループにしたいやつは同じnameをつけるよ。
はい、以下の3拍子セットを今日はここで一気にまとめてメモしておくぞ。

  • ラジオボタングループから値を得る。
  • ラジオボタンが押されたら、ラジオグループとしての値が返るコールバックを定義する
  • ラジオボタングループに対し、値を設定し、適切なポチにチェックがつくようにする。
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Cache-Control"content="no-cache">
  <title>This is Tab TItle</title>
<style>
  /* スタイルシートコードを記述 */
</style>
</head>
<!-- スタイルシートコードについては、以下のように別ファイルからも取り込み可能。 
      その場合は.cssの中に<style></style>は必要ない
       <link rel="stylesheet" type="text/css" href="my.css" /> -->
<body>
  <!-- HTML部品設置を記述 -->
  <h1 id="hello">Hello HTML.</h1>
  <hr>
  ●radio grp
  <div class="radio-group">
    <input type="radio" name="option" value="option1" id="option1">
    <label for="option1">Option 1</label>
    <input type="radio" name="option" value="option2" id="option2">
    <label for="option2">Option 2</label>
    <input type="radio" name="option" value="option3" id="option3">
    <label for="option3">Option 3</label>
  </div>
  <button id="getValueButton1" onclick="onGetRadioGrpValue()">getValue</button>
  <button id="setValueButton1" onclick="onSetRadioGrpValue()">setValue("Option2")</button>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
  <!-- <script src="/socket.io/socket.io.js"></script> -->
  <script type="text/javascript">
    // ***javascriptのプログラムを記述***
    // var socket = io();
    // radio grp
    // ●ラジオボタングループの値を得る
    function onGetRadioGrpValue(){
      // Get the value of the selected radio button
      var selectedValue = $("input[name='option']:checked").val();
      // Do something with the selected value (e.g., display it in console or on the page)
      if(selectedValue==null)
        alert("null");
      else    
        alert(selectedValue);
    }
    // ●ラジオボタングループとしてのコールバック
    window.addEventListener("DOMContentLoaded",function(){
      $("input[name='option']").change(function() {
        // Get the value of the selected radio button
        var selectedValue = $(this).val();
        // Do something with the selected value (e.g., display it in console or on the page)
        alert(selectedValue);
      });
    });
    // ●ラジオボタングループに値をセット(値に応じた適切なradioにチェック)
    function onSetRadioGrpValue(){
        // Set the value of the radio button group to "option2"
        $("input[name='option']").val(["option2"]);
    }
    // socket.on("hoge", ()=>{
    // });
  </script>
  <!-- プログラムは以下のように別ファイルからも取り込み可能。
  <script type="text/javascript" src="./my.js"></script>  
  -->
</body>
</html>

●参考文献(というかChatGPTプロンプト)

  • how to get value from radio button group using jquery
  • how to fetch the one of the radio button that has a same name gets clicked with single callback function usiing jquery.
  • how to set value to radio button group and get the appropriate radio button is get checked.

ejsのうまい使い方についてChatGPTに聞いてみた

本日のプロンプトエンジニヤリング。
==
I have a nodejs json document composed of many fields, each of which has its own types such as text or number or boolean. I have to render this document in two modes. one for viewing it and another for editing it.
In the viewing mode, all the text type fields are rendered as a static textnode, whereas in the editing mode its rendered as a editable textbox for instance. Rendered in the case of boolean type field, should be the textnode in the viewing mode and radiobuttons in the editingmode and so on.
but I don't want to prepare and maintain two layouts for each modes, rather, I would prefer to prepare and maintain a single layout using css display grid table at once and would like to switch between two modes by somehow utilizing the power of ejs but the final concrete implementation plan wont come up to my mind and could you help me out how can I implement such a page utilizing full power of ejs.
==
ChapGPT様、今日も本当にありがとうございました。
必死でググるなんてもう何カ月もやっていません。
そんな手動きわまる作業なんてやっていられません。
あれもそういう時代だったからやっていただけのこと。
以上。チャオ!