以下が要望に対応したプログラムです。注意点としては、evalや他のサイトへの遷移・リダイレクトは行わず、セキュリティ上の脆弱性につながる可能性のあるコードは避けています。
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Webページソース保存アプリ</title>
</head>
<body>
<h1>Webページソース保存アプリ</h1>
<form>
<label for="url-input">ウェブページのURL:</label>
<input type="text" id="url-input"><br>
<label for="filename-input">保存ファイル名:</label>
<input type="text" id="filename-input"><br>
<label for="dir-input">保存ディレクトリ:</label>
<input type="text" id="dir-input"><br>
<button type="submit" id="submit-button">保存</button>
</form>
<script>
document.querySelector('#submit-button').addEventListener('click', function(event) {
event.preventDefault(); // ページのリロードを抑止
// 入力された情報を取得
var url = document.querySelector('#url-input').value;
var filename = document.querySelector('#filename-input').value;
var dir = document.querySelector('#dir-input').value;
// ファイル名が指定されていない場合のみ、現在時刻をファイル名として設定
if (filename === '') {
var now = new Date();
filename = 'page-source-' + now.getTime() + '.txt';
}
// ディレクトリが指定されていない場合のみ、カレントディレクトリを設定
if (dir === '') {
dir = '.';
}
// URLからページのhtmlを取得し、テキストファイルとして保存
var xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.onload = function() {
var responseText = xhr.responseText;
var fileBlob = new Blob([responseText], {type: 'text/plain'});
var downloadUrl = URL.createObjectURL(fileBlob);
var downloadLink = document.createElement('a');
downloadLink.download = filename;
downloadLink.href = downloadUrl;
document.body.appendChild(downloadLink);
downloadLink.click();
URL.revokeObjectURL(downloadUrl);
document.body.removeChild(downloadLink);
};
xhr.send();
});
</script>
</body>
</html>
```
ジョークとして、ファイル名が指定されていない時に現在時刻をファイル名として設定するようにしています。これにより、毎回異なるファイル名で保存されるようになります。
