[svn r21035] Improve navigation and usability for creating an exercice

skala
Patrick Cool 17 years ago
parent b2aeac2abf
commit 89c9078f2b
  1. 176
      main/exercice/question_create.php
  2. 205
      main/inc/lib/javascript/jquery.customselect.js

@ -0,0 +1,176 @@
<?php // $Id: question_create.php 20569 2009-05-12 21:34:00Z pcool $
/*
==============================================================================
Dokeos - elearning and course management software
Copyright (c) 2004-2009 Dokeos SPRL
Copyright (c) 2003 Ghent University (UGent)
Copyright (c) 2001 Universite catholique de Louvain (UCL)
Copyright (c) various contributors
For a full list of contributors, see "credits.txt".
The full license can be read in "license.txt".
This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.
See the GNU General Public License for more details.
Contact address: Dokeos, rue du Corbeau, 108, B-1030 Brussels, Belgium
Mail: info@dokeos.com
==============================================================================
*/
// name of the language file that needs to be included
$language_file='exercice';
// including global Dokeos file
include("../inc/global.inc.php");
// including additional libraries
require_once (api_get_path(LIBRARY_PATH).'formvalidator/FormValidator.class.php');
require_once ('question.class.php');
// the section (tabs)
$this_section=SECTION_COURSES;
// notice for unauthorized people.
api_protect_course_script(true);
// breadcrumbs
$interbreadcrumb[]=array("url" => "exercice.php","name" => get_lang('Exercices'));
// Tool name
$nameTools=get_lang('AddQuestion');
// The form
$form = new FormValidator('add_question','post');
// form title
$form->addElement('header','',get_lang('AddQuestion'));
// the question types (normal form element)
/*
foreach (Question::$questionTypes as $key=>$value)
{
$question_types[] = get_lang($value[1]);
}
$form->addElement('select', 'question_type', get_lang('QuestionType'), $question_types);
*/
// the question types (jquery form element)
$form->addElement('hidden', 'question_type_hidden', get_lang('QuestionType'), array('id'=>'question_type_hidden'));
$form->addElement('static','','<script src="'.api_get_path(WEB_LIBRARY_PATH).'javascript/jquery.js" type="text/javascript"></script>
<script src="'.api_get_path(WEB_LIBRARY_PATH).'javascript/jquery.customselect.js" type="text/javascript"></script>');
$form->addElement('static','select_question_type', get_lang('QuestionType'),'<div id="questiontypes"></div>');
// the exercices
$tbl_exercices = Database :: get_course_table(TABLE_QUIZ_TEST);
$sql = "SELECT id,title,type,description, results_disabled FROM $tbl_exercices WHERE active<>'-1' ORDER BY title ASC";
$result = api_sql_query($sql, __FILE__, __LINE__);
$exercises['-'] = '-'.get_lang('SelectExercice').'-';
while ($row = Database :: fetch_array($result))
{
$exercises[$row['id']] = $row['title'];
}
$form->addElement('select', 'exercice', get_lang('Exercice'), $exercises);
// the submit button
$form->addElement('style_submit_button', 'SubmitCreateQuestion', get_lang('CreateQuestion'), 'class="add"');
// setting the rules
// $form->addRule('question_type', '<div class="required">'.get_lang('ThisFieldIsRequired'), 'required');
$form->addRule('exercice', '<div class="required">'.get_lang('ThisFieldIsRequired'), 'required');
$form->addRule('exercice', '<div class="required">'.get_lang('YouHaveToSelectATest'), 'numeric');
$form->registerRule('validquestiontype', 'callback', 'check_question_type');
$form->addRule('question_type_hidden', get_lang('InvalidQuestionType'), 'validquestiontype');
if ($form->validate())
{
$values = $form->exportValues();
//echo 'form validates';
//print_r($values);
foreach (Question::$questionTypes as $question_type_id => $question_type_class_and_name)
{
if (get_lang($question_type_class_and_name[1]) == $values['question_type_hidden'])
{
$answer_type = $question_type_id;
}
}
header('Location: admin.php?exerciseId='.$values['exercice'].'&newQuestion=yes&answerType='.$answer_type);
}
else
{
// header
Display::display_header($nameTools);
// displaying the form
$form->display();
// footer
Display::display_footer();
}
?>
<script>
var ddlObj1=$("#questiontypes").finalselect({id:"test",viewWidth:'260px',viewHeight:'150px',selectText:'-<?php echo get_lang('SelectQuestionType');?>-',selectImage:'<?php echo api_get_path(WEB_IMG_PATH); ?>select.png', viewMouseoverColor: '#EFEFEF'});
$("#test-select").bind('click',function(){
$("#question_type_hidden").val(ddlObj1.getText());
});
<?php
// defining the pictures of the question types
$pictures_question_types[1] = 'mcua.gif';
$pictures_question_types[2] = 'mcma.gif';
$pictures_question_types[3] = 'fill_in_blanks.gif';
$pictures_question_types[4] = 'matching.gif';
$pictures_question_types[5] = 'open_answer.gif';
$pictures_question_types[6] = 'hotspot.gif';
foreach (Question::$questionTypes as $key=>$value)
{
?>
ddlObj1.addItem('<table width="100%"><tr><td style="width: 37px;" valign="top"><?php Display::display_icon($pictures_question_types[$key],get_lang($value[1]),array('height'=>'40px;', 'style' => 'vertical-align:top;')); ?></td><td><span class="thistext"><?php echo get_lang($value[1]); ?></span><br/><sub><?php echo get_lang($value[1].'Comment'); ?></sub></td></tr></table>','');
<?php
}
?>
</script>
<?php
function check_question_type($parameter)
{
foreach (Question::$questionTypes as $key=>$value)
{
$valid_question_types[] = get_lang($value[1]);
//$valid_question_types[] = trim($value[1]);
}
if (in_array($parameter, $valid_question_types))
{
return true;
}
else
{
return false;
}
}
?>

@ -0,0 +1,205 @@

//select表示select本身,view表示跳出的é?¸é 
;(function($){
$.fn.extend({
//計算文字Byte數,並回傳
getByteLength: function(strIN){
var i, cnt=0;
for (i=0; i<strIN.length; i++){
if (escape(strIN.charAt(i)).length >= 4) cnt+=2;
else cnt++;
}
return cnt;
}
});
$.fn.extend({
//檢查文字的Byte數,超�limit指定的個數的話,就回傳true 和 未超�之�的文字index
getIndexByByte: function(strIN,limit){
var i, cnt=0;
for (i=0; i<strIN.length; i++){
if (escape(strIN.charAt(i)).length >= 4) cnt+=2;
else cnt++;
if(cnt>limit)
{
return [true,i];
}
}
return false;
}
});
$.fn.extend({
finalselect: function(options) {
var settings =
{
id:null,
animalSpeed:100,
selectWidth:"190px",
selectImage:"image/select.png",
selectText:"My friend",
zIndex: 0,
viewHeight:"100px",
viewWidth:"300px",
viewMouseoverColor:"#cfdfff",//#dcdcdc
viewTop:"28px",//top,bottom
viewLeft:" -1px"//left,right
};
if (typeof(options)!='undefined')
{
//將整批options的值assign給settings
jQuery.extend(settings, options);
}
var tmp='<div id="'+settings.id+'-select" style="cursor:default;font-size:12px;z-index:'+settings.zIndex+';border: solid 0px #999; padding: 3px; width: 180px; position: relative;">'
tmp+='<div id="'+settings.id+'-Text" style="background: url('+settings.selectImage+') no-repeat 0 0; width: '+settings.selectWidth+'; height: 21px; color: Black; padding: 0 0 0 10px;">';
tmp+='<div class="textshow" style="padding: 4px 0 0 0;">'+settings.selectText+'</div><div class="valueshow" style="display:none;"></div></div><div id="'+settings.id+'-selectshow" style="overflow-y:auto; overflow-x:hidden; height:'+settings.viewHeight+';width:'+settings.viewWidth+'; display:none; position: absolute; left:'+settings.viewLeft+'; top:'+settings.viewTop+'; border: solid 1px #999; background: white;"></div></div>';
var _handler = function() {
// 從這裡開始
$(this).html(tmp);
bindArrowClick();
bindSelectMouseover();
bindSelectMouseleave();
};
var bindArrowClick=function(){
var tmp=$('#'+settings.id+'-Text');
$("#"+settings.id+'-Text').bind("click", function(e){
var obj=$('#'+settings.id+'-selectshow');
if(obj.css('display')=='none')
{
// obj.slide();
obj.slideDown(settings.animalSpeed,function(){
obj.show();
obj.css('overflow','auto');
obj.css('overflow-x','hidden');
});
}
else
{
obj.slideUp(settings.animalSpeed,function(){
obj.hide();
});
}
});
};
var bindItemMouseover=function(){
var inx=0;
while($(".selectitem",$("#"+settings.id+"-selectshow")).get(inx)!=null)
{
var item=$(".selectitem",$("#"+settings.id+"-selectshow")).get(inx);
$(item).bind("mouseover", function(e){
$(this).css('background-color',settings.viewMouseoverColor);
});
$(item).bind("mouseout", function(e){
$(this).css('background-color','#fff');
});
$(item).bind("click", function(e){
var tmpstr=$(".thistext",$(this)).html();
var arr=$().getIndexByByte(tmpstr,30);
if(arr[0]==true)
tmpstr=tmpstr.substring(0,arr[1])+'...';
$(".textshow",$("#"+settings.id+"-Text")).html(tmpstr);
document.getElementById(settings.id+'-selectshow').style.display="none";
$(".valueshow",$("#"+settings.id+"-Text")).html($(".selectvalue",$(this)).html());
});
inx++;
}
}
var bindSelectMouseover=function(){
$('#'+settings.id+'-Text').bind("mouseover",function(){
if($.browser.msie==false)
$('#'+settings.id+'-Text').css("background-position","0 -21px");
});
}
var bindSelectMouseleave=function(){
$('#'+settings.id+'-Text').bind("mouseout",function(){
if($.browser.msie==false)
$('#'+settings.id+'-Text').css("background-position","0 0px");
});
}
this.setViewTop = function(top){
$('#'+settings.id+'-selectshow').css('top',top+'px');
}
this.setViewLeft = function(left){
$('#'+settings.id+'-selectshow').css('left',left+'px');
}
this.getLength = function(){
return $('.selectitem',$('#'+settings.id+'-selectshow')).length;
}
//add item到select裡�
//在傳itemtext時,用<span class="thistext"></span>包起�顯示的 "文字"
//例如:<span class="thistext">哇哈哈</span>,這樣select�擇後,就會顯示 "哇哈哈"
this.addItem = function(itemtext,itemvalue){
var itemhtml='<div class="selectitem"><div class="selecttext">'+itemtext
+'</div><div class="selectvalue" style=" display:none;">'+itemvalue+'</div></div><div class="selectborder"><div>';
$("#"+settings.id+'-selectshow').html($("#"+settings.id+'-selectshow').html()+itemhtml);
bindItemMouseover();
};
this.removeItem = function(index){
if($('.selectitem',$('#'+settings.id+'-selectshow')).length>index)
$($('.selectitem',$('#'+settings.id+'-selectshow')).get(index)).remove();
if($('.selectborder',$('#'+settings.id+'-selectshow')).length>index)
$($('.selectborder',$('#'+settings.id+'-selectshow')).get(index)).remove();
}
this.getValue = function(){
return $('.valueshow',$('#'+settings.id+'-Text')).html();
}
this.getText = function(){
return $('.textshow',$('#'+settings.id+'-Text')).html();
}
return this.each(_handler);
}
});
})(jQuery);
Loading…
Cancel
Save