jsPsychのプログラムをChatGPTに書いてもらう(悲しいお知らせ)

最近話題の ChatGPT ですが、いろんなプログラム言語のコードを書いてくれます。
CでもPHPでもJavaScriptでも、ってところで、jsPsychの事を思い出して、入力してみました。

### hello world

```
jsPsychでHelloWorldをして
```

#### 結果
```html:hello.html
<!DOCTYPE html>
<html>
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspsych/6.1.0/jspsych.js"></script>
  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jspsych/6.1.0/css/jspsych.css">
</head>
<body>
  <script>
    var hello_world = {
      type: 'html-keyboard-response',
      stimulus: 'Hello World!'
    };

    jsPsych.init({
      timeline: [hello_world]
    });
  </script>
</body>
</html>
```
おおお！　これは、
### もっと複雑なこともできるの？
ということで、やってみました。
```
jsPsychで画面中央に"+"を表示して、
次に画像を表示して、
キーボードで"f"か"j"を選択する。　画像は5枚でランダマイズする。
実験終了後はcsvで保存する。
```
#### 結果

```javascript:myexp.js
// Create an array of image paths
var images = [
  "path/to/image1.jpg",
  "path/to/image2.jpg",
  "path/to/image3.jpg",
  "path/to/image4.jpg",
  "path/to/image5.jpg"
];

// Shuffle the images array
images = jsPsych.randomization.shuffle(images);

// Define the trial for displaying a fixation cross
var fixation_cross_trial = {
  type: 'html-keyboard-response',
  stimulus: '<div style="font-size:60px;">+</div>',
  choices: [],
  response_ends_trial: false,
  trial_duration: 500
};

// Define the trial for displaying an image
var image_trial = {
  type: 'image-keyboard-response',
  stimulus: jsPsych.timelineVariable('image_path'),
  choices: ['f', 'j'],
  data: {
    image_path: jsPsych.timelineVariable('image_path'),
    response: jsPsych.data.getLastTrialData().key
  }
};

// Create the timeline
var timeline = [];
timeline.push(fixation_cross_trial);
timeline.push({
  timeline: images.map(function(path) {
    return {
      image_path: path,
      ...image_trial
    };
  }),
  timeline_variables: images.map(function(path) {
    return {
      image_path: path
    };
  })
});

// Start the experiment
jsPsych.init({
  timeline: timeline,
  on_finish: function() {
    // Save the data to a csv file
    var csv_data = jsPsych.
```

しゅごい、できてる..
その他でも
```
jsPsychで、被検者情報を入力する画面を作りたい。
入力するのは、
"被検者番号" (3桁)
"性別"(1:男、2:女、3:答えたくない)を、キー入力で選択
の2つで、1画面にまとめる。
```
なんて指示でもコードを書いてくれました。

もう毎度本家サイトでリファレンス読まなくてもできてしまうの！？

## ところが

あら、これは、、、今となっては懐かしい jsPsych.init() ではないですか。  
6.1.0 とか書いてあるし、今の7系にはしてもらえないの？  
  
ということで追加で質問
```
chatGPTが学習したjsPsychのバージョンは何？
```
すると、

```
OpenAIは、2021年までのjsPsychのバージョンを学習しています。私たちは最新版のjsPsychには対応していませんので、ご注意ください。
```

うわあ、ちょうど後方互換性を捨てたあの頃に一致です。　がっくり。

### 結論
現在(2023年2月)の ChatGPT が生成してくれるプログラムはバージョン6です。
ですので、どうしてもプログラムを書きたくない場合は、自分でバージョン7にインポートするか 
(参考) [jsPsych6用のプログラムをjsPsych7用にインポートしてみた](https://qiita.com/temochiz/items/c5a3c244757df89b7657)
バージョン6で実験する事になります。

そんなわけで、
・全くわかっていない人がChatGPTだけでjsPsychのプログラムを生成して実験するのは大変そう。
・今まである程度使い込んでいた人がChatGPTを使うと、開発効率は大きく改善される予感がする。
と考えます。

### おまけ

データをローカルに保存するときに、ファイル名が被らないように時分秒を追加する関数も、調べるのが面倒だったのですが、
```
js で、指定した文字列に日付け時分秒(YYYYMMDDHHMMSS)を付加する関数を作って
```
で、さくっと書いてくれました。
```javascript:sample.js
function addTimestamp(str) {
  var date = new Date();
  var year = date.getFullYear();
  var month = (date.getMonth() + 1).toString().padStart(2, '0');
  var day = date.getDate().toString().padStart(2, '0');
  var hour = date.getHours().toString().padStart(2, '0');
  var minute = date.getMinutes().toString().padStart(2, '0');
  var second = date.getSeconds().toString().padStart(2, '0');
  return str + year + month + day + hour + minute + second;
}

console.log(addTimestamp("Timestamp: "));
```

すごく便利ですね。
今後に期待です。

そして、、あきらめきれずに次回に続く
https://qiita.com/temochiz/items/950fd495e28e90f55147