chamilo
/
chamilo-lms
mirror of https://github.com/chamilo/chamilo-lms/tree/1.11.x
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

When clicking in the box now we load the children

Browse Source
skala
Julio Montoya 13 years ago
parent eaafb8a0d6
commit 57df516cf1
7 changed files with 221 additions and 85 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 152
      main/admin/skills.php
  2. 11
      main/css/base.css
  3. BIN
      main/img/icons/22/add.png
  4. 10
      main/inc/ajax/skill.ajax.php
  5. 2
      main/inc/lib/main_api.lib.php
  6. 54
      main/inc/lib/skill.lib.php
  7. 77
      main/inc/lib/skill.visualizer.lib.php

152
main/admin/skills.php
Unescape View File

@ -20,13 +20,18 @@ $this_section = SECTION_PLATFORM_ADMIN;
$htmlHeadXtra[] = api_get_jquery_ui_js(true);
$htmlHeadXtra[] = api_get_js('jquery.jsPlumb.all.js');
Display::display_header();
//Display::display_reduced_header();
//Display::display_header();
Display::display_reduced_header();
$skill = new Skill();
$skills = $skill->get_all(true);
$type = 'edit'; //edit
$skill_visualizer = new SkillVisualizer($skills, $type);
$tree = $skill->get_skills_tree(null, true);
$skill_visualizer = new SkillVisualizer($tree, $type);
echo '<a class="a_button gray" id="add_item_link" href="#">Add item</a>';
$skill_visualizer->display_html();
@ -35,6 +40,13 @@ $url = api_get_path(WEB_AJAX_PATH).'skill.ajax.php?1=1';
?>
<script>
var url = '<?php echo $url; ?>';
var skills = [];
var parents = [];
var parents = ['block_1'];
jsPlumb.bind("ready", function() {
$("#dialog-form").dialog({
autoOpen: false,
@ -43,6 +55,7 @@ jsPlumb.bind("ready", function() {
height : 380
});
//Filling skills select
$.getJSON( "<?php echo $url.'&a=get_skills' ?>", {},
function(data) {
$.each(data, function(n, parent) {
@ -52,6 +65,7 @@ jsPlumb.bind("ready", function() {
}
);
//Filling gradebook select
$.getJSON( "<?php echo $url.'&a=get_gradebooks' ?>", {},
function(data) {
$.each(data, function(n, gradebook) {
@ -61,23 +75,80 @@ jsPlumb.bind("ready", function() {
}
);
//On click box
$(".open_block").live('click', function() {
var original_id = $(this).attr('id');
var id = $(this).attr('id');
if (jQuery.inArray(id, parents) == -1) {
parents.push(id);
}
console.log(parents);
open_block(original_id, id);
});
//open block function
function open_block(original_id, id) {
my_id = original_id.split('_')[1];
for (var i = 0; i < skills.length; i++) {
window_id = id.split('_')[1];
if (jQuery.inArray(skills[i].element, parents) == -1) {
jsPlumb.deleteEndpoint(skills[i].endp);
$("#"+skills[i].element).remove();
}
}
jsPlumb.animate(original_id, {left: 900}, { duration:1000 });
pos = $('#'+original_id).position();
top_value = pos.top + 200 ;
load_children(my_id, top_value);
}
function load_children(my_id, top_value) {
// var a = '<div style="top:300px; left:100px;" class="window edit_window ui-draggable" id="block_15">aaaa</div>';
//Loading children
var ix = 1;
$.getJSON(url+'&a=load_children&id='+my_id, {},
function(json) {
$.each(json,function(i,item) {
left_value = 130*ix+500;
//top_value = 300;
$('body').append('<div id="block_'+item.id+ '" class="open_block window " >'+item.name+i+'</div>')
var es = prepare("block_" + item.id, jsPlumbDemo.editEndpoint);
jsPlumb.connect({source: es, target:"block_"+my_id});
jsPlumb.animate("block_" + item.id, {left: left_value, top : top_value}, { duration:1000 });
ix++;
});
}
);
}
$(".edit_block").click(function() {
var my_id = $(this).attr('id');
my_id = my_id.split('_')[2];
return false;
});
//Filling select
$("#add_item_link").click(function() {
$("#dialog-form").dialog("open");
$("#gradebook_id").addClass('chzn-select');
$("#gradebook_id").addClass('chzn-select');
$("#gradebook_id").chosen();
$("#parent_id").chosen();
});
var url = '<?php echo $url; ?>';
$("#parent_id").chosen();
});
var name = $( "#name" ),
description = $( "#description" ),
allFields = $( [] ).add( name ).add( description ), tips = $(".validateTips");
allFields = $( [] ).add( name ).add( description ), tips = $(".validateTips");
$("#dialog-form").dialog({
buttons: {
@ -116,8 +187,7 @@ jsPlumb.bind("ready", function() {
$("#name").attr('value', '');
$("#description").attr('value', '');
}
});
});
$(".window").bind('click', function() {
var id = $(this).attr('id');
@ -133,36 +203,31 @@ jsPlumb.bind("ready", function() {
var newMode = jsPlumb.setRenderMode(desiredMode);
jsPlumbDemo.init();
};
resetRenderMode(jsPlumb.CANVAS);
resetRenderMode(jsPlumb.CANVAS);
});
;(function() {
prepare = function(elId, endpoint) {
jsPlumbDemo.initHover(elId);
//jsPlumbDemo.initAnimation(elId);
var e = jsPlumb.addEndpoint(elId, endpoint);
jsPlumbDemo.initjulio(e);
skills.push({element:elId, endp:e});
return e;
},
window.jsPlumbDemo = {
initjulio :function(e) {
initjulio :function(e) {
},
initHover :function(elId) {
$("#" + elId).click(function() {
var all = jsPlumb.getConnections({source:elId});
for (var i = 0; i < discs.length; i++) {
var d = document.getElementById(discs[i]);
if (d) d.parentNode.removeChild(d);
}
//var all = jsPlumb.getConnections({scope:"DEFAULT", source:elId});
console.log(all);
//console.log(all);
//alert(elId);
// jsPlumb.hide(elId);
@ -239,8 +304,7 @@ jsPlumb.bind("ready", function() {
var connectorHoverStyle = {
lineWidth:7,
strokeStyle:"#2e2aF8"
};
};
jsPlumb.Defaults.Overlays = [
[ "Arrow", { location:0.9 } ],
@ -258,26 +322,25 @@ jsPlumb.bind("ready", function() {
var edit_arrow_color = '#ccc';
var editEndpoint = {
//connectorStyle:connectorPaintStyle,
connector:[ "Flowchart", { stub:40 } ],
connector:[ "Flowchart", { stub:35 } ],
hoverPaintStyle:connectorHoverStyle,
connectorHoverStyle:connectorHoverStyle,
anchors: ['BottomCenter','TopCenter'],
endpoint:"Rectangle",
paintStyle:{ width:25, height:21, fillStyle:edit_arrow_color },
paintStyle:{ width:20, height:20, fillStyle:edit_arrow_color },
isSource:true,
scope:'blue rectangle',
maxConnections:10,
connectorStyle : {
gradient:{stops:[[0, edit_arrow_color], [0.5, edit_arrow_color], [1, edit_arrow_color]]}, //gradient stuff
lineWidth:5,
lineWidth:2,
strokeStyle: edit_arrow_color
},
isTarget:true,
dropOptions : exampleDropOptions
};
jsPlumb.setMouseEventsEnabled(true);
jsPlumb.setMouseEventsEnabled(true);
//Default
var default_arrow_color = '#ccc';
@ -295,8 +358,7 @@ jsPlumb.bind("ready", function() {
},
isTarget:false,
setDraggableByDefault : false,
};
};
// Done end point
var done_arrow_color = '#73982C';
@ -312,12 +374,8 @@ jsPlumb.bind("ready", function() {
strokeStyle:done_arrow_color
},
isTarget:false,
setDraggableByDefault : false,
setDraggableByDefault : false,
};
<?php $skill_visualizer->display_js();?>
// three ways to do this - an id, a list of ids, or a selector (note the two different types of selectors shown here...anything that is valid jquery will work of course)
@ -335,17 +393,13 @@ jsPlumb.bind("ready", function() {
jsPlumbDemo.attachBehaviour();
}
};
})();
$(document).ready( function() {
//When creating a connection see
//http://jsplumb.org/apidocs/files/jsPlumb-1-3-2-all-js.html#bind
jsPlumb.bind("jsPlumbConnection", function(conn) {
alert("Connection created " + conn.sourceId + " to " + conn.targetId + " ");
//alert("Connection created " + conn.sourceId + " to " + conn.targetId + " ");
//jsPlumb.detach(conn);
});
//When double clicking a connection
@ -359,9 +413,6 @@ $(document).ready( function() {
if (confirm("Delete connection from " + conn.sourceId + " to " + conn.targetId + "?"))
jsPlumb.detach(conn);
})
});
;(function() {
@ -414,8 +465,6 @@ function checkLength( o, n, min, max ) {
}
</script>
<a class="a_button gray" id="add_item_link" href="#">Add item</a>
<div id="dialog-form" style="display:none;">
<div style="width:500px">
<form id="add_item" name="form">
@ -433,7 +482,7 @@ function checkLength( o, n, min, max ) {
</div>
<div class="formw">
<select id="parent_id" name="parent_id" />
</select>
</select>
</div>
</div>
@ -444,6 +493,9 @@ function checkLength( o, n, min, max ) {
<div class="formw">
<select id="gradebook_id" name="gradebook_id[]" multiple="multiple" />
</select>
<span class="help-block">
Gradebook Description
</span>
</div>
</div>
<div class="row">
@ -459,7 +511,7 @@ function checkLength( o, n, min, max ) {
</div>
<?php
Display::display_footer();
//Display::display_footer();
// The header.
/*

11
main/css/base.css
Unescape View File

@ -3240,7 +3240,7 @@ div.admin_section h4 {
/* chosen javascript checkbox select width fix */
.chzn-select {
min-width: 250px;
min-width: 200px;
}
#lp_item_list {
width:90%;
@ -3931,3 +3931,12 @@ form div.error input, form div.error textarea {
.dragActive {
border: 2px dotted orange;
}
.edit_block {
z-index: 100;
}
#language_list {
width:100px !important;
}

BIN
main/img/icons/22/add.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

10
main/inc/ajax/skill.ajax.php
Unescape View File

@ -52,6 +52,16 @@ switch ($action) {
$skills = $skill->get_all($load_user_data);
echo json_encode($skills);
break;
case 'load_children':
$id = isset($_REQUEST['id']) ? $_REQUEST['id'] : null;
$skills = $skill->get_children($id);
$return = array();
foreach($skills as $skill) {
$return [$skill['data']['id']] = array('name' => $skill['data']['name'], 'id'=>$skill['data']['id']);
}
echo json_encode($return);
break;
case 'skill_exists':
$skill_data = $skill->get($_REQUEST['skill_id']);
if (!empty($skill_data)) {

2
main/inc/lib/main_api.lib.php
Unescape View File

@ -3001,7 +3001,7 @@ function api_display_language_form($hide_if_no_choice = false) {
</script>';
$html .= '<form id="lang_form" name="lang_form" method="post" action="'.api_get_self().'">';
$html .= "<select class=\"chzn-select\" name=\"language_list\" onchange=\"javascript: jumpMenu('parent',this,0);\">";
$html .= '<select id="language_list" class="chzn-select" name="language_list" onchange="javascript: jumpMenu(\'parent\',this,0);">';
foreach ($original_languages as $key => $value) {
if ($folder[$key] == $user_selected_language) {
$option_end = ' selected="selected" >';

54
main/inc/lib/skill.lib.php
Unescape View File

@ -51,6 +51,17 @@ class SkillRelSkill extends Model {
}
return $parents;
}
public function get_children($skill_id, $add_child_info = true) {
$skills = $this->find('all', array('where'=> array('parent_id = ? '=> $skill_id)));
$skill_obj = new Skill();
if (!empty($skills)) {
foreach ($skills as &$skill) {
$skill['data'] = $skill_obj->get($skill['skill_id']);
}
}
return $skills;
}
}
/**
@ -116,11 +127,12 @@ class Skill extends Model {
ON skill.id = skill_rel_skill.skill_id ";
$result = Database::query($sql);
$skills = array();
if (Database::num_rows($result)) {
while ($row = Database::fetch_array($result, 'ASSOC')) {
$skill_rel_skill = new SkillRelSkill();
$a = $skill_rel_skill->get_skill_parents($row['id']);
$row['level'] = count($a)-1;
$row['level'] = count($a)-1;
$row['gradebooks'] = self::get_gradebooks_by_skill($row['id']);
$skills[$row['id']] = $row;
}
@ -150,6 +162,11 @@ class Skill extends Model {
return $result;
}
function get_children($skill_id) {
$skill_rel_skill = new SkillRelSkill();
$skills = $skill_rel_skill->get_children($skill_id, true);
return $skills;
}
public function add($params) {
if (!isset($params['parent_id'])) {
$params['parent_id'] = 1;
@ -180,8 +197,6 @@ class Skill extends Model {
}
}
/**
* Return true if the user has the skill
*
@ -255,38 +270,45 @@ class Skill extends Model {
}
public static function get_skills_tree($user_id = null) {
$skills = self::get_all();
public function get_skills_tree($user_id = null, $return_flat_array = false) {
$skills = $this->get_all();
$refs = array();
$skills_tree = null;
// Create references for all nodes
$flat_array = array();
if (!empty($skills)) {
foreach($skills as &$skill) {
if ($skill['parent'] == null) {
$skill['parent'] = 'root';
if ($skill['parent_id'] == 0) {
$skill['parent_id'] = 'root';
}
$skill['data'] = array('parent' => $skill['parent']); // because except main keys (id, name, children) others keys are not saved while in the space tree
$skill['data'] = array('parent_id' => $skill['parent_id']); // because except main keys (id, name, children) others keys are not saved while in the space tree
if ($user_id) {
$skill['data']['achieved'] = self::user_has_skill($user_id, $skill['id']);
$skill['data']['achieved'] = $this->user_has_skill($user_id, $skill['id']);
}
$refs[$skill['id']] = &$skill;
$flat_array[$skill['id']] = &$skill;
}
// Moving node to the children index of their parents
foreach($skills as $skillInd => &$skill) {
$refs[$skill['parent']]['children'][] = &$skill;
$refs[$skill['parent_id']]['children'][] = &$skill;
$flat_array[$skillInd] = $skill;
}
$skills_tree = array(
'name' => get_lang('SkillRootName'),
'id' => 'root',
'children' => $refs['root']['children'],
'data' => array()
);
}
'name' => get_lang('SkillRootName'),
'id' => 'root',
'children' => $refs['root']['children'],
'data' => array()
);
}
//var_dump($flat_array);exit;
if ($return_flat_array) {
return $flat_array;
}
unset($skills);
return $skills_tree;
}

77
main/inc/lib/skill.visualizer.lib.php
Unescape View File

@ -7,8 +7,8 @@
class SkillVisualizer {
private $offsetX = 100;
private $offsetY = 50;
private $offsetX = 400;
private $offsetY = 0;
private $html = '';
private $type = 'read';
@ -21,20 +21,24 @@
function prepare_skill_box($skill, $position, $class) {
$block_id = $skill['id'];
$this->html .= '<div id="block_'.$block_id.'" class="window '.$class.'" style="top:' . $position['y'] . 'px; left:' . $position['x'] . 'px;">';
$this->html .= '<div id="block_'.$block_id.'" class="open_block window '.$class.'" style="top:' . $position['y'] . 'px; left:' . $position['x'] . 'px;">';
$gradebook_string = '';
if (!empty($skill['gradebooks'])) {
foreach($skill['gradebooks'] as $gradebook) {
$gradebook_string .= Display::span($gradebook['name'], array('class'=>'label_tag notice','style'=>'width:50px'));
$gradebook_string .= Display::span($gradebook['name'], array('class'=>'label_tag notice','style'=>'width:50px')).'<br />';
}
}
$skill['name'] = Display::url($skill['name'], '#', array('id'=>'edit_block_'.$block_id, 'class'=>'edit_block'));
$this->html .= $skill['name'].' '.$gradebook_string;
if ($this->type == 'edit' && $skill['parent_id'] != 0) {
$this->html .= Display::url(get_lang('Edit'), '#', array('id=>"edit_block_'.$block_id,'class'=>'edit_block'));
$this->html .= Display::url(get_lang('Add'), '#', array('id=>"edit_block_'.$block_id,'class'=>'edit_block'));
$this->html .= Display::url(get_lang('Delete'), '#', array('id=>"edit_block_'.$block_id,'class'=>'edit_block'));
//$this->html .= Display::url(Display::return_icon('edit.png', get_lang('Edit'), array(), 22), '#', array('id'=>'edit_block_'.$block_id,'class'=>'edit_block'));
//$this->html .= Display::url(Display::return_icon('add.png', get_lang('Add'), array(), 22), '#', array('id'=>'edit_block_'.$block_id,'class'=>'edit_block'));
//$this->html .= Display::url(Display::return_icon('delete.png', get_lang('Delete'), array(), 22), '#', array('id=>"edit_block_'.$block_id,'class'=>'edit_block'));
//$this->html .= Display::url(Display::return_icon('up.png', get_lang('Close'), array(), 22), '#', array('id'=>'close_block_'.$block_id,'class'=>'close_block'));
//$this->html .= Display::url(Display::return_icon('down.png', get_lang('Open'), array(), 22), '#', array('id'=>'open_block_'.$block_id,'class'=>'open_block'));
}
$this->html .= '</div>';
}
@ -43,8 +47,7 @@
* Adds a node using jplumb
*/
private function add_item($skill, $position) {
$block_id = $skill['id'];
$block_id = $skill['id'];
$end_point = 'readEndpoint';
//var_dump($skill);
@ -88,23 +91,63 @@
$brothers = array();
$constant = 100;
$canvas = 1000;
//$this->add_item($skill, array('x' => $x + $this->offsetX, 'y' => $y + $this->offsetY));
foreach ($this->skills as $skill) {
if (isset($brothers[$skill['parent_id']])) {
foreach ($this->skills as &$skill) {
if (!in_array($skill['parent_id'], array(0,1))) {
continue;
}
$childs = isset($skill['children']) ? count($skill['children']) : 0 ;
//$x = round($this->offsetX * sin(deg2rad($corner * $count)));
//$y = round($this->offsetY * cos(deg2rad($corner * $count)));
/*if (isset($brothers[$skill['parent_id']])) {
$brothers[$skill['parent_id']] +=2;
} else {
$brothers[$skill['parent_id']] = 1;
}
//$x = round($this->offsetX * sin(deg2rad($corner * $count)));
//$y = round($this->offsetY * cos(deg2rad($corner * $count)));
}*/
$my_count = 0;
$brother_count = $brothers[$skill['id']];
$x = $brothers[$skill['parent_id']]*100;
$y = $skill['level']*120;
$parent_x = 0;
if ($skill['parent_id'] == 0) {
$x = $constant*$childs/2;
//$this->offsetX = $constant*$childs;
} else {
$max = isset($this->skills[$skill['parent_id']]['children']) ? count($this->skills[$skill['parent_id']]['children']) : 0;
foreach($this->skills[$skill['parent_id']]['children'] as $id => $sk) {
if ($skill['id'] == $sk['id']) {
break;
}
$my_count++;
}
$parent_x = isset($this->skills[$skill['parent_id']]['x']) ? $this->skills[$skill['parent_id']]['x'] : 0;
$x = $my_count*150 + $parent_x - (150*$max/2) ;
//$x = $my_count*150 + $parent_x - (150*$max/2) - 20*$childs;
//$x = $my_count*150 + $parent_x - 100*$childs;
}
$y = $skill['level']*150;
$skill['x'] = $x;
$skill['y'] = $y;
// var_dump($skill);
//$skill['description'] = "{$brothers[$skill['parent_id']]} $x - $y";
//$skill['name'] = $skill['name']." | $x = $my_count * 150 + $parent_x - (150* $max/2) - 10*$childs ";
$this->add_item($skill, array('x' => $this->offsetX + $x, 'y' => $this->offsetY +$y));
}
}
echo $this->get_html();
}
/**

Write Preview
Loading…
Cancel
Save