Xojoで作るSlackクライアント

2017.06.02  投稿者: moongift
XojoSlack

Webアプリケーションをデスクトップアプリケーションのように扱える技術としてElectronが有名ですが、先日日本語入力に不具合が発生しました。

Backspace can not erase the last one character during Japanese IME conversion (macOS) · Issue #9173 · electron/electron

Backspaceキーを押しても文字が消せないという不具合で、ストレスを感じている人も多いのではないかと思います。これがSlackの公式アプリで発生したのが大きな問題になっていました。

そこで代替手段としてXojoでSlackクライアントを作ってみました。

複数チームに対応させる

Slackといえばチーム切り替えが肝になります。そこでリストボックスを使ってチームを切り替えられるようにします。

まずメインウィンドウ(mainWindow)に+ボタンを付けます。押した時のイベントはチーム追加用のウィンドウを開くことです。モーダルとして開きます。

teamWindow.ShowModal

teamWindowは次のような画面です。

チーム名を入力してOKボタンを押した時には、mainWindowのaddTeamメソッドを呼びます。

if Self.txtTeamName.Text = "" then
  MsgBox("チーム名を入力してください")
  return
end if
mainWindow.addTeam(Self.txtTeamName.Text)
Self.Close

addTeamメソッドでは幾つかの処理を行っています。

  1. リストに追加する
  2. すでに表示しているチームを非表示にする
  3. 新しいチームを表示する
  4. 設定ファイルに書き出す

処理としては次のようになります。

// 1. リストに追加する
Self.lstTeam.AddRow(teamName)

// 2. すでに表示しているチームを非表示にする
Self.allTeamDisable()

// 3. 新しいチームを表示する
Self.showTeam(teamName)

// 4. 設定ファイルに書き出す
Self.writeConfig(teamName)

メンバー変数を追加する

今回はすべてのチーム情報をmainWindowに紐付けて管理します。そのため、 HTMLViewerをメンバーとして管理します(chatViewerとします)。

この配列の中に各チーム毎のHTMLViewerを入れていきます。

すでに表示しているチームを非表示にする

この処理ではすでに表示しているチーム情報の HTMLViewer を非表示(VisibleプロパティをFalse)にしていきます。

Dim chatView as HTMLViewer
if aryChat = nil then
  return
end if
For i as integer = 0 to aryChat.Ubound
  chatView = aryChat(i)
  chatView.Visible = False
Next

新しいチームを表示する

新しいチームを表示するのはHTMLViewerの役割になります。動的にchatViewerを追加していきます。注意点としてはユーザエージェントを変更しているということでしょうか。

Dim chatView as HTMLViewer = new HTMLViewer
Dim url as string = "https://" + teamName + ".slack.com"

chatView = new chatViewer

chatView.Top = 0
chatView.Left = 105
chatView.Height = Me.Height
chatView.Width = Me.Width  - chatView.Left
chatView.Enabled = True
chatView.Visible = True
chatView.UserAgent = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_5) AppleWebKit/603.2.4 (KHTML, like Gecko) Version/10.1.1 Safari/603.2.4"
chatView.LoadURL(url)
chatView.HelpTag = teamName

aryChat.append(chatView)

設定ファイルに書き出す

登録した内容は設定ファイルに書き出すことで、起動時に再現できるようにします。

Dim OutPut as TextOutputStream
Dim OutFile as FolderItem
Dim content as String
Dim comma as string

For i as integer = 0 to aryChat.Ubound
  content = content + comma + aryChat(i).HelpTag
  comma = ","
Next

OutFile = SpecialFolder.UserHome.child(Self.configName)
Try
  OutPut = TextOutputStream.Create(OutFile)
  OutPut.Write(ConvertEncoding(content, Encodings.UTF8))
  OutPut.Close
Catch e As IOException

End Try

起動時に復元する

逆に起動時は設定ファイルの内容を読み込んで復元します。

Dim InPut as TextInputStream
Dim InFile as FolderItem
Dim content as String
Dim teams() as string

InFile = SpecialFolder.UserHome.child(Self.configName)
Try
  InPut = TextInputStream.Open(InFile)
  content = InPut.ReadAll
  InPut.Close
  teams = content.Split(",")
  For i as integer = 0 to teams.Ubound
    Self.lstTeam.AddRow(teams(i))
    Self.showTeam(teams(i))
    Self.allTeamDisable()
  Next
  Dim chatView as HTMLViewer = Self.aryChat(0)
  chatView.Visible = True
Catch e As IOException

End Try

ここまでの実装で複数チームを追加できるようになります。後はリストをクリックした時にチームを切り替えるだけです。

Self.allTeamDisable()
Dim chatView as HTMLViewer = Self.aryChat(row)
chatView.Visible = True


なお、macOS版での制限としてファイルダイアログを使ったファイル添付ができません。ただし、ドラッグ&ドロップによるファイルアップロードはできますので大きな問題はないでしょう。

最新版のElectronでは不具合も解消されたようですが、手元の環境でエラーが続いてしまっている方はお試しください。なお、コードはmoongift/xojo_slackにアップロードしてあります。実装時の参考にしてください。