選択結果

講師や講師の多くは、講師や講義中にリアルタイムのインタラクションを追加するためにクリッカーや学生対応システムを使用しています。 Moodleはchoiceと呼ばれる作り付けの世論調査活動を持っていますそれは学生が多くのオプションのうちの1つを選ぶことを可能にするように設定することができます。非常に多くの学生がモバイルデバイスを使用しているため、教師はMoodleのモバイルウェブインターフェースを使用するか、Moodleモバイルアプリケーションを使用して、学生に選択活動を行わせることができます。

このガイドでは、ライブの選択結果をリアルタイムの動的グラフで表示するためのMoodle Webサービスの設定について説明します。クリッカーの要件を置き換えて、代わりに学生自身のモバイルデバイスを使用してください。

選択結果ビューの例

初期設定

このためには、次のコンポーネントを設定する必要があります。

  1. あなたのMoodleサイトの設定
  2. Moodleウェブサービスを介してあなたのMoodleサイトを呼び出す別のPHPスクリプトページ
  3. 選択結果をオンラインで視覚的なグラフで表示するためのchartjs(または同様のオンライングラフ作成アプリケーション)インストール

Moodleサイトの設定

1)あなたのサイトがWebサービスの準備ができていることを確認してください:これはサイト管理 - >あなたが「Webサービスを有効にする」設定を有効にして保存する必要がある拡張機能にあります

Webサービスを有効にする

2)あなたのサイトがWebサービスプロトコルの準備ができていることを確認してくださいこれはサイト管理 - >プラグイン - > Webサービス - >あなたが使用したいプロトコルのどちらかを有効にし保存する必要があるプロトコルの管理にあります 。 RESTプロトコルを使用する

RESTプロトコルを有効にする

3)サイト設定がモバイルアクセスに対応していることを確認して、モバイルデバイスを介してユーザーから選択を送信できるようにしますこれは[サイトの管理] - >プラグイン - > Webサービス - >モバイルにあります。 「

モバイルアクセスを有効にする


4)新しいユーザーを追加します - それらを "Choice View User"かそれに類似したものと呼びます。この操作の詳細については、 アカウントの管理を参照してください。

5)新しいロールを追加します - それを「Choice WS Role」またはそれに類似したものと呼びます。これは、 サイト管理 - >ユーザー - >許可 - >ロール定義にあります。最初の「新しいロールの追加」ページで、「ロールまたはアーキタイプを使用」を「ロールなし」に設定したままにし、このロールを割り当てる可能性があるコンテキストタイプでは続行をクリック - システムに課題

カスタムロールを追加

機能 - サービスという言葉のフィルタ - Webサービスの許可:RESTプロトコル、または使用しているプロトコルのいずれかをクリックします。

機能を追加する

最後に[このロールを作成]をクリックします。この操作の詳細については、 カスタムロールの作成を参照してください。

6)新しいユーザーを新しいロールに割り当てます。これは、 サイト管理 - >ユーザー - >許可 - >システムロールの課題にあります。新しいロールをクリックします新しいユーザーを検索します(ユーザー名でフィルタリングする必要があるかもしれません)リストからユーザーを選択し、Addをクリックしてそのユーザーをロールに割り当てます。

ロールを割り当てます

[システムロールの課題]ページを再ロードすると、新しいユーザーがそのロールの[ロールを持つユーザー]列に表示されます。

7)選択結果に対して呼び出されるWebサービスを作成します。これは、サイトの管理 - >プラグイン - > Webサービス - >外部サービスです。Webサービスを追加し、それをChoice Viewまたはそれに似たものと呼びます。そして最後に「サービスを追加」をクリックしてください。

Webサービスを追加する

次に、Choice関数を検索して、Webサービスに2つの関数を追加します(choiceという語句でフィルタリングする必要があるかもしれません)。 - mod_choice_get_choice_results - mod_choice_get_choices_by_courses

機能を追加する

8)新規ユーザーをWebサービスの許可ユーザーリストに追加するこれは、 サイトの管理 - >プラグイン - > Webサービス - >外部サービスにあります。許可ユーザーを追加するには、Choice View Webサービスの[許可ユーザー]リンクをクリックします。ユーザーをChoice Viewロールに課題たインターフェースへ。新規ユーザーを検索します(ユーザー名でフィルターする必要があるかもしれません)リストからユーザーを選択し、「追加」をクリックしてそのユーザーを「許可ユーザー」リストに割り当てます。

9)期待されるHTTP(S)リクエストを認証するためのWebサービストークンを作成しますこれはサイト管理 - >プラグイン - > Webサービス - >トークンの管理で選択ビュー用に作成したユーザーの検索追加をクリックします。作成したばかりのChoice Viewサービスを選択します必要に応じてIP制限を追加します必要に応じて時間制限を追加します変更を保存をクリックして結果のトークンをコピーします

トークンを追加

10)選択活動にアクセスしたいすべてのコースの教師として、新しいユーザー「Choice View User」を登録します。これは、Webサービスがユーザーのトークンを使用して選択活動の詳細にアクセスできるようにするために必要です。

結果を表示するためのPHPスクリプトページ

このページはあなたのMoodleサイト選択活動にアクセスし、それらの結果を視覚的なグラフで表示します。サンプルのPHPスクリプトコードを、ホストして呼び出したい場所にコピーします。選択活動がホストされているあなたのMoodleサイトにhttpまたはhttpsでアクセスする必要があります。 PHPスクリプト自体にあなたのMoodleサイトへのアクセスを持つRESTウェブサービスログインの詳細が含まれているため、それが公にアクセス可能なURLになる場合は、ある程度のセキュリティも必要です。 htaccessログインかそれに類似したものをお勧めします。サンプルのPHPスクリプトコードを編集して保存し、コードの "<yourURL>"と "<yourtoken>"にMoodleサイトのURLとChoice Viewトークンの値をそれぞれ追加します。

コード構成

グラフを表示するには、スクリプトコードはchartjsのインストール、または他のグラフ作成アプリケーションへのアクセスも必要になります。詳細については、 http: //www.chartjs.org/を参照してください。また、スクリプトコードを編集して、chartjsインストールのサーバーディレクトリの場所をコードの "<yourchartjslocation>"に追加する必要もあります。

結果を表示するには、PHPスクリプトコードのURLをブラウザに入力するだけです。

Webサービスは、ページドロップダウンにコースアクセス可能なすべての選択活動を表示し、最初に作成された活動を表示します。データベースからの選択IDが既にわかっている場合は、代わりにURLに次のようにパラメーターを追加できます。 "?choiceid = X"。

最後のポイントは、表示されるグラフが最新の結果で定期的に更新されるように、サンプルのPHPスクリプトコードが5秒ごとに簡単にページをリロードするように設定されていることです。このリロードは、必要に応じて、たとえばAJAXを使用して、よりエレガントに処理できます。


サンプルコード

 <?php

$ url = "<yourURL>" ;
$ function = "mod_choice_get_choice_results" ;
$ function2 = "mod_choice_get_choices_by_courses" ;
$ token = "<yourtoken>" ;

//タイトルを含む選択の詳細を取得
$ ch2 = curl_init   ;
curl_setopt  $ ch2  CURLOPT_URL  " $ url /webservice/rest/server.php?wsfunction= $ function2 &wstoken = $トークン &moodlewsrestformat = json"  ;
curl_setopt  $ ch2  CURLOPT_RETURNTRANSFER  1  ;
$ result2 = json_decode  curl_exec  $ ch2   ;

if  isset  $ _REQUEST [ 'choiceid' ]  )) {
    $ choiceid = intval  $ _REQUEST [ 'choiceid' ]  ;
{//アクセス可能な選択肢が見つかりました - 他の 場合 }(0>)> の選択肢 ($結果2を 数えます 
    $ choiceid = intval  $ result2 - > choices [ 0 ] - > id  ;
}  {
    $ choiceid = 0  //デフォルト値
}
if  $ choiceid < 1  {
    echo  "無効なID"  ;
}
$ color = "249,128,18" ; // Moodle orange、必要に応じて変更してください。

$ ch = curl_init   ;
curl_setopt  $ ch  CURLOPT_URL  " $ url /webservice/rest/server.php?wsfunction= $ function &wstoken = $トークン &choiceid = $ choiceid &moodlewsrestformat = json"  ;
curl_setopt  $ ch  CURLOPT_RETURNTRANSFER  1  ;
$ result = json_decode  curl_exec  $ ch   ;

$ graph_title = "" ;
$ dropdown = "<select name = 'choiceid' onchange = 'this.form.submit()'> \ n " ;
$ dropdown 。= "<option value = '0'>選択</option> \ n " ;

foreachの ($結果2 - $選択肢 として > の選択肢 ){
    $ dropdown 。= "<option value = ' {$ choice-> id} '" ;
    if  $ choice - > id == $ choiceid  {
        $ graph_title = $ choice - > name ;
        $ dropdown 。= "選択" ;
    }
    $ dropdown 。= "> {$ choice->名前} </option> \ n " ;
}
$ dropdown 。= "</select> \ n " ;

//棒グラフのデータ
$ chart = new stdClass   ;
$ data = array   ;
$ labels = array   ;
foreach  $ result - > options  $ a として  {
    $ data [ ] = $ a - > numberofuser ;
    $ラベル [] = $ A - > テキスト  "(" ラウンド ($ - > percentageamount、1) "%。。)";
}
$ chart - > labels = $ labels ;
$ dataset = new stdClass   ;
$ dataset - > data = $ data ;
$ dataset - > fillColor = "rgba( {$ color} 、0.5)" ;
$ dataset - > strokeColor = "rgba( {$ color} 、0.8)" ;
$ dataset - > highlightFill = "rgba( {$ color} 、0.75)" ;
$ dataset - > highlightStroke = "rgba( {$ color} 、1)" ;
$ chart - > datasets = array  $ dataset  ;

curl_close  $ ch  ;


<! Doctype HTML >
< html >
        
                < meta http - equiv = "refresh" content = "5" >
                <タイトル>棒グラフ</タイトル>
                < script src = "<yourchartjslocation>" > </script>
        </ head >
        ボディ
        センター
        < h1 > <?php echo  $ graph_title  ; < > / h1 >
                < div id = "キャンバスホルダー" >
                        < canvas id = "chart-area" width = "900" height = "600" />
                </ div >

            < form > <?php echo  $ dropdown  ; ?> < noscript > <入力タイプ= "送信"= "送信" > </ noscript > </ form >

        <スクリプト>
            var pieData = <?php echo json_encode  $ chart  ; ; >

                        ウィンドウ onload = function   {
                                VaRの CTX =ドキュメント getElementByIdを 'チャートエリア')。 getContext  '2d'  ;
                                ウィンドウ myPie = 新しいチャート(CTX)。 Bar  pieData  { animationSteps  1 レスポンシブ false }  ;
                        }。
		</script>
        </ center >
        </ body >
</ html >