プログラムソースをブラウザで編集できるようにする

◎構想記録                                                                  
・テキストエディタにはCodeMirrorの採用を検討する                                               

◎当面の目標                                                                 
・ブラウザだけでコンテンツの作成、メンテナンスをできるようにする                                       
  ・テキストエディタを不要にする                                                      
  ・ターミナルソフトを不要にする                                                      
  ・ファイル転送ソフトを不要にする                                                     
・最低限の機能を用意                                                             
  ・ディレクトリやファイルをツリー表示                                                   
  ・ディレクトリやファイルを新規作成したり、複写したり、削除したりできる。名前の変更もできる                        
  ・ソースファイルを編集し保存でき、履歴を残すことができる                                         
  ・ファイルをアップロードできる                                                      

◎TODO                                                                  
・CodeMirrorを使ってみる                                                          済
・CodeMirrorを使った編集機能を実装する                                                   済
・メニューを付ける                                         簡易的なものを実装           済
・初期画面で新規作成状態にする                                                       済
・ファイル保存ダイアログを実装する。並行してファイル保存APIを実装する                                  済
・ファイルアクセスダイアログのファイルをクリックして選択できるようにする                                  済
※ここで一回区切りをつけ、問題点を整理しながら実装方針、設計(部品名、変数名、関数名)を再検討して、使いながら実装する            
・ファイルアクセス用ダイアログを1つで実装するように方針を変更、それに伴って変数名等も変更                          
・ファイル保存ダイアログでファイル情報を表示(ファイル名、更新日、サイズ)                                  
・ファイル保存ダイアログで並び順変更に対応                                                  
・ファイル保存ダイアログでディレクトリを作成できるようにする                                         
・認証機能を付ける                                                              
・保存機能を付ける                                                              
・ディレクトリ・ファイル一覧機能を付ける                                                   
・ディレクトリ・ファイル追加、削除、名前変更機能を付ける                                           
・アップロード機能を付ける                                                          
・実装したものをモジュール化しフレームワーク化する                                              
・フレームワークの仕様書をまとめる                                                      

◎作業記録                                                                  
・CodeMirrorを使ってみる。試したファイルをcodemirror_step01.htmlとして保存                                  
             save()を使って同期させてみた                                            
・CodeMirrorを使った編集機能を実装する。   特にするべきことは無かった                                   
・アプリの開発を始めた。仕様を簡単にまとめた。(この文書の中)                                        
・アプリの製作にとりかかった。index.htmlを作成                                                
・メニューを付ける  サーバに問い合わせていたがやめてクライアント側で表示することにした                           
・メニューの表示ができて、onclick を定義する。                                                
・onclick で関数の名前を使って呼び出す方法を決める                                              
  ・グローバル(root直下に定義した)関数                                                   
  ・オブジェクトのメソッド                                                         
 今後のことも考えて、テキストエディタをクラスとして作成していくモデルケースとする                              
 フレームワークとアプリの関係、フレームワークの構成を検討する                                        
  ・今回のアプリの操作の様子(まずはエラーなどは無視)                                           
    ・ログイン                                                              
      ・ID、パスワードを入力してログインボタンをクリック                                       
    ・ファイル作成                                                            
      ・テキストエリアにコードを記述                                                  
    ・名前を付けて保存                                                          
      ・メニューをクリック                                                       
      ・ファイルダイアログで保存するフォルダを探す                                           
      ・ファイルダイアログで保存するフォルダを作る                                           
      ・ファイルダイアログでファイル名を決める                                             
    ・ファイルを閉じる                                                          
       新規ファイル編集画面になる                                                   
    ・ファイルを編集するために開く                                                    
      ・メニューをクリック                                                       
      ・ファイルダイアログでフォルダを探す                                               
      ・ファイルダイアログでファイルを選択する                                             
    ・検索する                                                              
      ・マウスの右ボタンをクリックする                                                 
      ・検索を選ぶ                                                           
      ・検索ダイアログの検索文字列に検索したい文字を入力する                                      
      ・検索ダイアログの検索ボタンを押す                                                
        ・検索された文字がハイライトになる                                              
      ・検索ダイアログの検索ボタンを押す                                                
        ・次に検索された文字がハイライトになる                                            
      ・検索ダイアログの手前を検索ボタンを押す                                             
        ・上方向に検索された文字がハイライトになる                                          
      ・検索ダイアログの移動ボタンをドラッグする                                            
    ・置換                                                                
      ・マウスの右ボタンをクリックする                                                 
      ・置換を選ぶ                                                           
      ・置換ダイアログの旧文字列に検索したい文字を入力する                                       
      ・置換ダイアログの新文字列に新しい文字を入力する                                         
      ・置換ダイアログの検索ボタンを押す                                                
        ・検索された文字がハイライトになる                                              
      ・検索ダイアログの置換ボタンを押す                                                
        ・検索された文字が置換され次に検索された文字がハイライトになる                                
      ・検索ダイアログの移動ボタンをドラッグする                                            
    ・ファイルを複写                                                           
      ・ファイルメニューのファイルを複写するをクリックする                                       
      ・ファイルダイアログでファイルを選択した状態で、複写ボタンを押す                                 
      ・ファイルダイアログで保存先ディレクトリを探す                                          
      ・ファイルダイアログで保存先ファイル名を入力する                                         
      ・ファイルダイアログで保存ボタンを押す                                              
    ・ファイルの名前を変える                                                       
      ・ファイルメニューのファイルの名前を変えるをクリックする                                     
      ・ファイルダイアログでファイルを選択した状態で、名前変更ボタンを押す                               
      ・ファイルダイアログで新しいファイル名を入力する                                         
      ・ファイルダイアログで変更ボタンを押す                                              
    ・ファイルを削除する                                                         
      ・ファイルメニューのファイルを削除するをクリックする                                       
      ・ファイルダイアログでファイルを選択した状態で、削除ボタンを押す                                 
      ・確認ダイアログでOKを押す                                                   
    ・ファイルを移動                                                           
      ・ファイルメニューのファイルを移動するをクリックする                                       
      ・ファイルダイアログでファイルを選択した状態で、移動ボタンを押す                                 
      ・ファイルダイアログで移動先ディレクトリを探す                                          
      ・ファイルダイアログで移動ボタンを押す                                              

  ・フレームワークの役割                                                          
    ・画面表示                                                              
    ・API受付                                                             
    ・ファイルアクセスAPI(読込、名前を付けて保存、上書き保存、ディレクトリ作成、名前変更、移動、削除)                
    ・ファイルダイアログ(開く、名前を付けて保存、上書き保存、ディレクトリ作成、名前変更、移動、削除、検索履歴)             
  ・フレームワークの考え方                                                         
    ・アプリによってファイルを書き換えない                                                
    ・アプリの情報はconfig.phpに書く                                                   
      ・ロードすべきjsファイル                                                     
    ・index.html(名前の変更可)がフレームワークの本体。このファイルがあるところがアプリケーションのルートディレクトリ          
  ・フレームワークのすべきこと                                                       
    ・アプリケーション情報を使ってリクエストURLから表示機能を決定する                                 
    ・表示機能に必要なロールを判断して、必要な場合は、アプリケーションのログイン機能を呼び出す                      
    ・ログイン処理                                                            
    ・デフォルト機能の決定                                                        
    ・デフォルト機能の呼び出し                                                      
    ・メニュー付きフレーム表示                                                      
    ・アプリケーション起動                                                        
    ・コントロール                                                            
      ・判定                                                              
      ・分岐                                                              
    ・認証                                                                
    ・描画                                                                
  ・アプリケーションの実装方法                                                       
    ・フレームワークで用意しているクラスをそのまま使う                                          
      ・ベース機能                                                           
        ・ログイン機能                                                        
        ・汎用機能                                                          
    ・フレームワークで用意しているクラスから派生させて使う                                        
    ・フレームワークで用意しているクラスと同じメソッド、プロパティー、インターフェースを持ったクラスを作って使う             
  ・画面のタイプ                                                              
    ・シングル                                                              
    ・メニュー付き                                                            
    ・メニュー&ツリー付き                                                        
  ・フレームワーク、アプリケーション通して、必要となる機能、操作、フェーズをリストアップ (SPAなので言葉を変えてみる)         
    ・機能          操作        処理       分岐     反応          フェーズ            
     テキスト編集      アクセス      画面決定     認証不要   要求画面表示                      
                                    認証必要   ログイン画面表示                    
                 ログイン      認証       エラー    メッセージ付きログイン画面表示             
                                    成功     要求画面表示                      
  ・今回のアプリの考え方                                                          
    ・1画面1機能とする                                                         
    ・必要に応じてメニュー付きの画面を使う                                                
  ・今回のアプリの画面                                                           
    ・初期画面                                                              
      ・ログイン画面    編集にはロールが必要なので                                         
    ・ログイン画面        画面タイトル、ID,パスワード、ボタン、メッセージ                           
    ・編集画面(メニュー付き)  編集エリア、編集ダイアログ、右クリックメニュー                             
      ・初期状態(ファイル指定なし)                                                  
        ・メニュー                                                          
        ・編集エリアに編集ウインドウが一つデフォルトのサイズで表示、ファイル名は未定義                        
      ・初期状態(ファイル指定あり)                                                  
        ・メニュー                                                          
        ・編集エリアに編集ウインドウが一つデフォルトのサイズで表示、指定されたファイルを読み込んだ状態で表示             
      ・初期状態(ファイル指定あり、かつ、編集状態情報あり)                                      
        ・メニュー                                                          
        ・編集エリアに編集ウインドウが一つデフォルトのサイズで表示、指定されたファイルを読み込んだ状態で最終表示状態で表示      
      ・メニュー                                                            
        ・新しいウインドウを開く                                                   
        ・新規作成                                                          
        ・名前を付けて保存                                                      
        ・上書き保存                                                         
        ・名前を変更                                                         
        ・移動                                                            
        ・削除                                                            
      ・右クリックメニュー                                                       
        ・UNDO                                                          
        ・REDO                                                          
        ・複写                                                            
        ・貼付                                                            
        ・削除                                                            
        ・検索                                                            
        ・置換                                                            
  ・アプリが情報を持ち決定すること                                                     
    ・画面テーマ                                                             
    ・ロゴマーク                                                             
    ・認証方法     ・ユーザデータ(ユーザ、ユーザロール、デフォルト画面、利用可能機能)                                 
    ・メニューリスト(メニュータイトル、onClick 時関数定義)                                       
    ・処理関数リスト                                                           
    ・分岐定義                                                              
    ・画面定義                                                              
・上記の検討を考慮して第一段としてのアプリを作る。                                              
・メニューを付ける                                                              
  ・メニューをとりあえずの項目で配置                                                    
・初期画面で新規作成状態にする                                                        
  ・空のtextareaを表示                                                           
・ファイル保存ダイアログを実装する。並行してファイル保存APIを実装する                                   
  ・メニューの onclickはグローバルに直接記述                                                
  ・ダイアログの動きを検討                                                         
    ・メニューのクリックを受けて                                                     
      ・編集エリアを操作できなくする                                                  
      ・ルートディレクトリのファイル、ディレクトリ一覧を取得するAPIを呼び出す                            
    ・ファイル、ディレクトリ一覧APIのコールバックを受けて                                       
      ・ファイルダイアログを見える状態にする                                              
      ・ファイル、ディレクトリ一覧を表示し onClickイベントを設定する                                  
      ・ファイル名入力フォームを表示する                                                
      ・保存ボタン、キャンセルボタン、ディレクトリ作成ボタンを表示する                                 
    ・ファイルダイアログのイベントを受けて                                                
      ・保存の場合                                                           
        ・名前が未入力の場合はエラーメッセージ「名前を入力してください」                               
        ・同じ名前のファイルがある場合は確認メッセージ「同名のファイルがあります、上書きしますか」                  
          ・yes の場合、パスと中身を持ってファイル保存APIを呼び出す                               
          ・noの場合は確認ダイアログを非表示にする                                         
        ・同じ名前のディレクトリがある場合はエラーメッセージ「同名のディレクトリがあります」                     
      ・キャンセルの場合                                                        
      ・上位クリックの場合                                                       
      ・ディレクトリクリックの場合                                                   
      ・ファイルクリックの場合                                                     
    ・ファイル保存APIのコールバックを受けて                                              
      ・成功ならば、メッセージダイアログに「保存しました」と表示                                    
      ・失敗ならば、メッセージダイアログに「保存に失敗しました」と表示し、理由も表示                          
  ・各種ダイアログの下準備をした                                                      
  ・getFileListAPI を仮実装                                                       
  ・ファイルとディレクトリを区別して返すように変更                                             
  ・現在のディレクトリを表示                                                        
  ・上に上がるボタンを表示                                                         
  ・右メニューを付ける                                                           
  ・名前を付けて保存するために必要なクライアント側機能とAPIを実装                                    
    ・操作時のイメージ                                                          
      ・(エディタを起動する)                                                     
      ・(テキストを書く)                                                       
      ・(メニューの別名保存をクリックする)                                              
      ・ファイルダイアログを表示する                                                  
      ・(ファイル名を入力する)                                                    
      ・(保存ボタンを押す)                                                      
      ・ファイル名とテキストをパラメータとしてファイル保存APIを呼ぶ                                 
      ・ファイルを保存して、結果を返す                                                 
      ・結果を表示する                                                         
      ・(OKボタンを押す)                                                      
      ・ファイルダイアログを閉じる                                                   
    ・ファイルダイアログの中止ボタンにクリックイベント処理を追加                                     
      ・ファイルダイアログとオーバーレイを非表示にする                                         
    ・ファイルダイアログの保存ボタンにクリックイベント処理を追加                                     
      ・別名保存APIを実装し、呼び出す                                                
    ・ここまでの問題点                                                          
      ・ファイル名入力で右クリック&ペーストができない                                         
  ・ファイルを読み込むために必要なクライアント側機能とAPIを実装                                     
    ・操作時のイメージ                                                          
      ・(エディタを起動する)                                                     
      ・(「開く」メニューをクリックする)                                               
      ・ファイルダイアログを表示する                                                  
      ・(ディレクトリを選択する)                                                   
      ・(ファイルを選択するする)                                                   
      ・(読込ボタンを押す)                                                      
      ・ファイル名をパラメータとしてファイル読込APIを呼ぶ                                      
      ・ファイルを読み込んで返す                                                    
      ・ファイルの中身を表示する                                                    
      ・ファイルダイアログを閉じる                                                   
    ・ファイルダイアログを表示                                                      
      ・開くボタンを追加                                                        
    ・開くボタンのイベント処理を記述                                                   
      ・ファイルパスを持ってファイルロードAPIを呼び出す                                       
    ・ファイルロードAPIを実装                                                     
      ・ファイルを読んで中身を返す                                                   
    ・ファイルロードAPIのコールバック処理を実装                                            
      ・CodeMirrorを削除しtextareaを復活                                                
      ・textareaに取得したテキストを設定                                                
      ・textareaを元にCodeMirrorを設置                                                 
    ・ここまでの問題点                                                          
      ・保存ボタンが表示されたまま。保存ダイアログで開くボタンが表示されたまま。                            
      ・ファイル名を手入力しており、ファイルリストから選択する形になっていない。                            
      ・一旦CodeMirrorを削除して、再設置しているがこれを止められればやめる                               
  ・ファイルを上書き保存するために必要なクライアント側機能とAPIを実装                                  
    ・操作時のイメージ                                                          
      ・(エディタを起動する)                                                     
      ・(「開く」メニューをクリックする)                                               
      ・ファイルダイアログを表示する                                                  
      ・(ディレクトリを選択する)                                                   
      ・(ファイルを選択するする)                                                   
      ・(読込ボタンを押す)                                                      
      ・ファイル名をパラメータとしてファイル読込APIを呼ぶ                                      
      ・ファイルを読み込んで返す                                                    
      ・ファイルの中身を表示する                                                    
      ・ファイルダイアログを閉じる                                                   
      ・(テキストを編集するす)                                                    
      ・(「上書保存」メニューをクリックする)                                             
      ・テキストエリアに同期する                                                    
      ・テキストを取り出す                                                       
      ・テキストとパスをパラメータとして別名保存APIを呼び出す                                    
      ・コールバックで、「保存しました。」とメッセージを表示する                                    
      ・(OKボタンを押す)                                                      
    ・上書保存ボタンのイベント処理を実装                                                 
      ・テキストの取り出し                                                       
      ・別名保存APIを呼び出す                                                    
・ファイルアクセスダイアログのファイルをクリックして選択できるようにする                                   
  ・課題                                                                  
    ・選択状態をどう表現するか                                                      
    ・現在aタグを使っているがこのままでいいか。そのときonClick をどう実装するか                             
  ・方針                                                                  
    ・aタグを止めてUL, LIにする                                                     
    ・オンマウスで背景が明るいグレイになる                                                
    ・選択されると背景がグレイになる                                                   
    ・選択されたファイル名を使う場合は背景がグレイになっているものを探す                                 
  ・実装                                                                  
    ・UL,LIに変更し、onclickを実装                                                    
    ・方針を変更し、ファイルをクリックしたらテキスト入力にセット                                     
    ・ファイルリストの表示を関数化                                                    
  ・課題                                                                  
    ・開くでファイルを開いた後、別名保存でエラーになった、ファイル名の"/" の辺りに問題がありそう                     
・ファイルアクセス用ダイアログを1つで実装するように方針を変更、それに伴って変数名等も変更                          
  ・検討                                                                  
    ・ファイルダイアログを使うケース                                                   
      ・ファイルを開く                                                         
        ・ディレクトリを選択して、ファイルを選択するだけ                                       
          ・ファイル選択と開くボタンクリックの2アクションにするか、選択だけで開くか                        
            ・2アクションでも苦にならないし安心なので2アクションとする                             
              ・ファイルを選択した場合にファイル名入力にファイル名を表示                            
      ・ファイルに名前を付けて保存する                                                 
        ・ディレクトリを選択して、ファイルを入力して、保存ボタンをクリックする                            
        ※検討事項                                                          
          ・ディレクトリを作成するときはどうするか                                         
      ・ファイルを上書きで保存する                                                   
        ・ファイルに名前を付けて保存すると同じで、ファイル名をはじめから設定しておく                         
        ※検討事項                                                          
          ・ダイアログの出し方は別にするか同一か                                          
      ・ファイルを移動する                                                       
        ・移動元のファイルを選択し、移動元ファイル名として表示する                                  
        ・移動先のディレクトリ選択し、移動ボタンを押す                                        
        ※検討事項                                                          
          ・移動先に同名のファイルがあったらどうするか                                       
          ・移動先に書き込み権限が無い場合どうするか                                        
          ・移動元に削除権限が無い場合どうするか                                          
          ・フェイルスーセーフの対策が必要                                             
      ・ファイル名を変える                                                       
        ・ファイルを選択し、ファイルを入力して変更ボタンをクリック                                  
        ※検討事項                                                          
          ・同名のファイルがあったらどうするか                                           
          ・変名権限がなかったらどうするか                                             
      ・ファイルを削除する                                                       
        ・ファイルを選択し、削除ボタンをクリック                                           
        ※検討事項                                                          
          ・ファイル名入力で書き換えられ、それが無ければどうするか                                 
          ・削除権限がなかったらどうするか                                             
      ※検討事項                                                            
        ・名前が付いていない場合に上書きしようとするときにどう対処するか                               
        ・付けた名前と同名のファイルが既にある場合はどうするか                                    
  ※検討事項                                                                
    ・上書き保存はファイルダイアログを使わず、結果(成功、エラー:内容)をダイアログで表示する。今バージョンでは実装しない        
  ※記録事項                                                                
    ・モジュール化は別の機会でするが、ファイルダイアログという括りではなくファイルアクセスツールとして、結果ダイアログを含める      
  ・仕様案                                                                 
    ・表示項目                                                              
      ・タイトルバー 現在のディレクトリ                                                
      ・ディレクトリ、ファイルリスト                                                  
      ・ファイル名ボックス                                                       
      ・ディレクトリ名入力ボックス                                                   
      ・実行ボタン(兼用:読込、保存、削除、移動)                                           
      ・中止ボタン                                                           
      ・右クリックメニュー(ディレクトリを作成)                                            
     (・結果ダイアログ                        )                                
    ・初期処理                                                              
      ・共通                                                              
        ・現在のディレクトリのディレクトリ、ファイル一覧を取得するAPIを呼び出し、コールバック後以下を実行する           
        ・オーバーレイを表示                                                     
        ・ファイルダイアログを表示                                                  
          ・タイトルバーを表示                                                   
          ・ディレクトリ、ファイルリストエリアを表示                                        
          ・現在のディレクトリのディレクトリ、ファイルリストを表示                                 
      ・開くメニューから起動                                                      
        ・ファイル名ボックスを参照モードで表示し、空にする                                      
        ・実行(開く)ボタンと中止ボタンを表示                                            
      ・名前を付けて保存メニューから起動                                                
        ・ファイル名ボックスを入力モードで表示し、現在のファイル名を設定                               
        ・実行(保存)ボタンと中止ボタンを表示                                            
     (・上書き保存メニューから起動                  )                                
     (  ・削除APIを発行し、コールバックで結果ダイアログを表示  )                                
      ・移動メニューから起動                                                      
        ・ファイル名ボックスを参照モードで表示し、現在のファイル名を設定                               
        ・ディレクトリ名ボックスを参照モードで表示し、空にする                                    
        ・実行(移動)ボタンと中止ボタンを表示                                            
      ・名前を変えるメニューから起動                                                  
        ・ファイル名ボックスを参照モードで表示し、現在のファイル名を設定                               
        ・実行(変更)ボタンと中止ボタンを表示                                            
      ・削除するメニューから起動                                                    
        ・ファイル名ボックスを参照モードで表示し、現在のファイル名を設定                               
        ・実行(削除)ボタンと中止ボタンを表示                                            
    ・イベント処理                                                            
      ・実行ボタンクリック                                                       
        ・開くメニューから起動したとき                                                
          ・読込APIを呼び出す                                                  
        ・名前を付けて保存メニューから起動したとき                                          
          ・保存APIを呼び出す                                                  
       (・上書き保存メニューから起動したとき    )                                        
        ・移動メニューから起動したとき                                                
          ・移動APIを呼び出す                                                  
        ・名前を変えるメニューから起動したとき                                            
          ・名前変更APIを呼び出す                                                
        ・削除するメニューから起動したとき                                              
          ・削除APIを呼び出す                                                  
  ・実装記録                                                                
  ※実装から再開                                                              


◎概要仕様                                                                  
・対応フォーマット  仮確定                                                         
  ・javascript  .js                                                            
  ・html     .html                                                           
  ・php      .php                                                           
  ・svg      .svg                                                           
  ・テキスト   .txt                                                           
  ※拡張子によって判断。フォーマットを指定するUIは用意しない                                       
・認証        仮確定                                                         
  ・認証APIにID,パスワードを送り、セッションIDをクッキーで受け取る                                 
  ・それ以後、認証が必要なAPIにアクセスできる                                              
・メニュー      仮確定                                                         
  ・ログイン                                                                
  ・新規作成                                                                
  ・ファイルを開く                                                             
  ・上書き保存                                                               
  ・名前を付けて保存                                                            
  ・名前を変更                                                               
  ・削除する                                                                
  ・アップロード                                                              
  ・ダウンロード                                                              
  ・ログアウト                                                               
・アプリケーションタイプ                                                           
  ・SPA                                                                 
  ・index.htmlに書かれたjavascriptが必要に応じてAPIを使って処理を行い、画面を更新する                          
・必要とするAPI                                                              
  ・メニュー取得     ロールに沿ったメニューが返される   getMenuList     ※使用しないことにした                 
  ・認証         ID,パスワードを渡すと、デフォルトロールでログイン状態になり、ロールリストと現在のロールとログイン者名が返される
  ・ファイル一覧取得   パスを指定しない、または、相対パスを指定して呼び出すとディレクトリ・ファイル一覧が返って来る           
  ・ファイル読込     相対パスを指定して呼び出すと、ファイルの中身が返って来る                             
  ・ファイル書込     相対パスとファイルの中身を付けて呼び出すとそのパスに保存される                          
  ・名前変更       相対パスと新しい名前を渡すとその名前に変更される                                 
  ・ファイル削除     相対パスを渡すと削除される                                            
  ・ファイル移動     現相対パスと新相対パスを渡すと移動される                                     
  ・ファイル複写     現相対パスと新相対パスを渡すと複写される                                     
  ・ファイル作成     相対パスを渡すと新しいファイルが作成される                                    
・機能と実現方法                                                               
  ・メニュー  起動時にメニューリストを取得し、そのタイトルを表示する。クリックされたら定義された関数を呼び出す              
  ・ログイン                                                                
・フレームワーク                                                               
  ・API        ファイル管理API(これから作成)                                        
  ・API共通仕様                                                             
    ・API名                                                              
    ・引数                                                                
    ・結果                                                                
    ・エラー情報                                                             
  ・描画ライブラリ    標準描画ライブラリ(これから作成)                                        
  ・コントローラ     標準コントローラ(これから作成)                                         
  ・レイアウト      メニューブロックとメインブロックの上下2ブロック                                 
・ファイル操作ダイアログ                                                           
  ・ユーザ毎の最終操作ディレクトリまたはルートディレクトリのファイルとディレクトリの一覧を取得して表示                   

◎詳細仕様                                                                  
・API共通仕様                                                               
  ・API名                                                                
  ・引数                                                                  
  ・結果                                                                  
  ・エラー情報                                                               
・フレームワーク                                                               
  ・コントローラ                                                              
    ・起動時                                                               
      ・jsライブラリの読み込み                                                     
      ・初期画面の表示                                                         
        ・メニューを表示                                                       
・機能                                                                    
  ・初期化                                                                 
  ・メニュー                                                                
  ・ファイルを開く                                                             

◎詳細決定変更の経緯(今後、作業記録に記載)                                                 
・レイアウトはとりあえず動くものを早く作るという趣旨で上下2ブロックのみとした(ログイン前も)                        
・このアプリの主導権はクライアント上のJavaScriptかサーバ上のPHPか?                                      
・  それによって、メニューをクリックしたときの処理をどうするかが決まる                                   
・  今回はjavascriptに主導権を持たせ、サーバでの作業が必要なときのみAPIで呼び出すこととする。                        
・  そういう意味では、メニューをサーバに問い合わせるのはナンセンスなので仕様を変更する。                          
・このバージョンはフレームワークを意識しつつもファイルの共有などをせず単独でメンテナンスできるものとし、早急な開発を優先する         

◎処理実装の決定変更の経緯(今後、作業記録に記載)                                              
・jsの読み込みについて、今回はindex.htmlに直接記述した。アプリケーション専用のhtmlファイルという位置付け                   
・フレームワークとアプリケーションを分離するファイル構成を模索していくこととする。                              
・フレームワークとアプリケーションの関係とコントローラの働き                                         
  ・フレームワークは自身とアプリケーションに必要なJavascriptを読み込む                                   
  ・フレームワークは初期表示を行い、アプリケーションのデフォルトまたは指定の機能を呼び出す。                        
  ・コントローラ                                                              
    ・機能                                                                
      ・セッションハイジャックに備える                                                 
      ・ロールを変更する前に開いた画面からのアクセスを拒否する                                     
      ・デフォルト画面はログイン画面                                                  
      ・画面を指定すればログインしなくても見える画面も存在する                                     
        ・その画面をゲスト(guest)が参照できるように設定                                       
        ・その画面にログイン画面からリンクを張ることでアクセスできるようにする                            
        ・例  お知らせ  ログイン前に見ていただきたいお知らせ(第三者に見られてもいいことが前提)                 
            ヘルプ   ログイン方法など                                             
    ・詳細仕様                                                              
      ・PageクラスからAppPageクラスを派生させ、各ページはこれを派生させる                                
      ・OnPreInitで以下のロジックを実装する                                               
        ・リクエストページを決定する                                                 
          ・ログインしていないときは、"","/","/default.aspx"の場合はリクエストページなしと判断して                 
           Login.aspxをリクエストページとする。                                          
          ・ログインしているときは、"","/","/default.aspx"の場合はリクエストページなしと判断して                  
          ・そのロールのデフォルトページをリクエストページとする。                                 
        ・セッション変数のトークンIDとクッキーのトークンIDが一致することを確認する                        
          ・どちらかにトークンIDが存在して一致しなければ、                                    
           要求ページをエラーページとしメッセージを「トークンエラー」とし、ボタンを「ログインページ」とする            
        ・セッション変数に認証情報が存在することを確認する                                      
          ・認証情報が存在しない場合は初期化してロールをゲストとする                                
        ・リクエストページが必要とするロールを持っているか確認する                                  
          ・ロールがguestの場合は、、リクエスト情報をセッション変数に保存して、Login.aspxにリダイレクトする             
          ・それ以外で持っていなければ、エラー画面を表示し「権限がありません」と表示する                      
        ・ロールIDとポストバックのロールIDが一致することを確認する                                
          ・一致しなければ、エラーページに「この画面は古くなっています。閉じてください。」と表示する。               
        ・セッション変数の認証情報を更新する                                             
        ・トークンIDを生成し、セッション変数のトークンIDとクッキーのトークンIDを書き換える                   
  ・ログインページ          メニュー付きページ                                          
    ・表示内容                                                              
      ・ページタイトル                                                         
      ・ID入力     userid                                                    
      ・パスワード入力  password                                                   
      ・ログインボタン  login      ポストバック                                         
      ・メッセージ                                                           
    ・初回表示                                                              
      ・メッセージを「ログインしてください」とする                                           
    ・ポストバック処理                                                          
      ・ログインクリック                                                        
        ・userid,passwordが一致し、エラーカウントが5未満か最終ログイン時刻が5分以上前のユーザを抽出する                
        ・見つかった場合                                                       
          ・ユーザテーブルのエラーカウントをクリアし、最終ログイン時刻を更新する                          
          ・認証情報をセッション変数に設定                                             
          ・セッション変数のリクエストページがあれば、そこにリダイレクト                              
          ・無ければ、デフォルトロールを取得し、そのロールのデフォルトページを取得してリダイレクトする               
        ・見つからなかった場合                                                    
          ・エラーカウントをアップする。ユーザテーブルのログインエラーカウントをアップし最終ログイン時刻を更新する。        
                ※エラーカウントが 0なら成功記録、それ以外ならエラー記録となる。                       
          ・メッセージを「ID、パスワードが間違っています。5回以上間違った場合は、5分以上待ってから再度ログインしてください」と 
           赤で表示し、再表示。※何回間違ったかは表示しない。ユーザIDの存在を知られない為。                   
  ・メニュー                                                                
    ・ロール変更          ダイアログで実現                                           
    ・ロール別メニュー       ロールページ設定により自動生成                                    
  ・ヘルプ登録            PDFファイルをアップロードして、タイトルと簡単な説明を付けて、参照できるようにする           
                    タイトルや説明の更新やファイルの取り換えも出来、削除もできる                     
                    内容を階層化できる                                          
  ・ヘルプ(未ログイン) GuestHelp                                                     
  ・ヘルプ(ログイン)  Help                                                       
  ・お知らせ登録           ヘルプと同等だが階層化はない、代わりに組織毎に作成できる。上位組織の人は複数の組織のお知らせが見える 
  ・お知らせ(未ログイン)GuestNotice                                                    
  ・お知らせ(ログイン) Notice                                                      
  ・マスタ登録ページ                                                            
  ・データ登録ページ                                                            
  ・データ参照ページ         自分の所属する組織が管轄する組織のデータを参照できる。                        
                    上位組織者の場合は管轄組織から条件を設定して参照できる                        
  ・データ処理ページ                                                            
  ・エラーページ           シングルページ                                            
  ・懸念事項                                                                
    ・マスターページの使い方              Noticeの真似をすればできる  1行目は2か所を変更。                
                              2つのプレールフォルダのうち一つ目にこれまでのdiv を入れる            
    ・マスターページと子ページのイベント発生順     子ページが起動してからマスターページの起動なのでAppPgeで間に合う         
    ・動的に配置したコントロールへのイベントハンドラ設定  AddHandlerで設定できた                            

◎メモ                                                                    

◎ファイル・ライブラリ                                                            
・index.html       メインファイル。現在はアプリ部分と混在だが、フレームワークとアプリに分離予定。                   
・codemirror       codemirror本家よりダウンロードして展開 (codemirror-5.57.0)                            
・ajax.js         ajaxの呼び出し専用のjavascriptファイル                                       
・ajax.php        ajaxによるAPI呼び出しの受け口とapi処理。今後分離する予定                              

・codemirror_step01.html codemirrorの実験に使ったファイル                                          


<TODOと状況>