CookBook

IMBox に投稿種別を追加する方法(iframe)

投稿日:2020-12-01 更新日:

この CookBook では、IMBox に投稿種別を追加する方法について紹介しています。
以下のドキュメントを参照することで、IMBox に投稿種別を追加することができます。
IMBox プログラミングガイド - メッセージ種別追加プログラム

この CookBook では、入力された URL を iframe で表示する投稿種別を追加します。

完成サンプル

以下の完成サンプルをダウンロードしてご活用ください。

e builder プロジェクト : im_cookbook_152112.zip
imm ファイル : im_cookbook_152112-1.0.0.imm

ローカル環境で表示させる場合は、以下のURLにアクセスしてください。
http://localhost:8080/imart/imbox
なおベースURLである以下の部分は、環境に合わせて適宜変更してください。
http://localhost:8080/imart

レシピ

  1. imbox-message-config を作成します。
  2. 投稿処理を作成します。
  3. タイムライン表示画面を作成します。

1. imbox-message-config を作成します。

src/main/conf/imbox-message-config/imbox-message-config_im_cookbook_152112.xml

行数 説明
12 メッセージ種別名称を設定します。
13 投稿欄表示用のファイルパスを設定します。
14 タイムライン表示用のファイルパスを設定します。

2. 投稿処理を作成します。

src/main/jssp/src/im_cookbook_152112/message_type/views/type_iframe.js

src/main/jssp/src/im_cookbook_152112/message_type/views/type_iframe.html

行数 説明
19 iframe の URL を入力用コントロールです。
22 本文入力用のコントロールです。
37-38 URL と本文を取得し、アトリビュートとして設定します。

3. タイムライン表示画面を作成します。

src/im_cookbook_152112/message_type/views/iframe_timeline.js

行数 説明
8 送信されたメッセージを取得します。
11 送信された URL を取得します。
17-19 iframe 要素の ID, iframe を最大化して表示するリンク要素の ID, iframe を最大化して表示するダイアログ要素の ID を生成します。
src/im_cookbook_152112/message_type/views/iframe_timeline.html

行数 説明
14 iframe を表示します。
15 最大化リンクを表示します。クリックすると、iframe を画面の最大サイズのダイアログ内に表示します。
16 最大化リンククリック時に表示するダイアログです。
21 iframe の読み込み完了時に、最大化リンクを表示する処理です。
24 最大化リンククリック時に、ダイアログを表示する処理です。

まとめ

この CookBook では、iframe を表示できるメッセージ種別を追加する方法を紹介しました。
是非ご活用ください。

-CookBook

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

ファイルアップロード登録LDタスクの使い方

このCookBookでは、IM-LogicDesigner でのIM-BISのファイルアップロード登録LDタスクの使い方について紹介しています。 このタスクは、以下の使い方をすることができます。 単独 …

no image

IM-BloomMaker コンボボックスエレメントのサジェストにサーバから取得した値を表示する

このCookBookでは、intra-mart Accel Platform 2020 Spring から利用可能になったコンボボックスエレメントのサジェストにサーバから取得した値を表示する方法につい …

IM-LogicDesignerを利用して、IM-Workflow完了案件の確認対象者を削除する

このCookBookでは、IM-LogicDesignerを利用して、IM-Workflow完了案件の確認対象者を削除する方法について紹介しています。 完了案件でも、確認対象者が確認することはできます …

no image

ワークスペースカレンダーアイテムでスケジュール機能と連携したスケジュールを登録する方法

このCookBookでは、intra-mart Accel Collaboration ワークスペースのワークスペースカレンダーについて紹介しています。 intra-mart Accel Collab …

no image

IM-BloomMaker Bulma を使用した入力系画面の作成

intra-mart Accel Platform 2020 Summer から、コンテンツ種別「Bulma」が提供されました。 このCookBookでは、スクリプト開発モデルのサンプル登録画面をもと …