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

Merge pull request #1335 from jloguercio/1.11.x

Browse Source 
Fix save badge button and add button to set the badge to the form - Refs #8364
pull/2487/head
José Loguercio 9 years ago committed by GitHub
parent 577ee3127d 068e786fe6
commit ebf2ba835d
3 changed files with 24 additions and 123 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. 13
      main/admin/skill_badge_create.php
  2. 97
      main/inc/lib/javascript/badge-studio/media/js/studio.js
  3. 37
      main/template/default/skill/badge_create.tpl

13
main/admin/skill_badge_create.php
Unescape View File

@ -43,7 +43,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
'id' => $skillId
);
if (isset($_FILES['image']) && $_FILES['image']['error'] == 0) {
if ((isset($_FILES['image']) && $_FILES['image']['error'] == 0) || !empty($_POST['badge_studio_image'])) {
$dirPermissions = api_get_permissions_for_new_directories();
$fileName = sha1($_POST['name']);
@ -68,13 +68,20 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$skillImagePath = sprintf("%s%s.png", $badgePath, $fileName);
$skillImage = new Image($_FILES['image']['tmp_name']);
if (!empty($_POST['badge_studio_image'])) {
$badgeImage = base64_decode(preg_replace('#^data:image/\w+;base64,#i', '', $_POST['badge_studio_image']));
file_put_contents($skillImagePath, $badgeImage);
$skillImage = new Image($skillImagePath);
} else {
$skillImage = new Image($_FILES['image']['tmp_name']);
}
$skillImage->send_image($skillImagePath, -1, 'png');
$skillThumbPath = sprintf("%s%s-small.png", $badgePath, $fileName);
$skillImageThumb = new Image($skillImagePath);
$skillImageThumb->resize(ICON_SIZE_BIG, ICON_SIZE_BIG);
$skillImageThumb->resize(ICON_SIZE_BIG);
$skillImageThumb->send_image($skillThumbPath);
$params['icon'] = sprintf("%s.png", $fileName);

97
main/inc/lib/javascript/badge-studio/media/js/studio.js
Unescape View File

@ -17,9 +17,6 @@
var $glyphSelector;
var $glyphSelectorButton;
var $settings;
var $settingsButton;
window.addEventListener('load', function init () {
$badgeRaster = new Image();
$badgeRaster.id = 'raster';
@ -57,20 +54,17 @@
*
*/
function initStudio () {
initSettings();
initGlyphSelector();
document.addEventListener('keydown', function(event) {
if (event.keyCode === 27) { // Escape
if ($settings && $settings.offsetWidth)
closeSettings();
else if ($glyphSelector && $glyphSelector.offsetWidth)
closeGlyphSelector();
}
if ($glyphSelector && $glyphSelector.offsetWidth)
closeGlyphSelector();
}
}, true);
document.addEventListener('focus', function(event) {
[$settings, $glyphSelector].forEach(function ($overlay) {
[$glyphSelector].forEach(function ($overlay) {
if ($overlay && $overlay.offsetWidth && !$overlay.contains(event.target)) {
event.stopPropagation();
$overlay.focus();
@ -79,89 +73,6 @@
}, true);
}
// ==[ Settings ]=============================================================
/**
*
*/
function initSettings () {
if ($settings)
return false;
/**$settingsButton = document.createElement('button');
$settingsButton.className = 'settings fa fa-cog';
$settingsButton.title = 'Settings';
$settingsButton.addEventListener('click', openSettings);
$studio.appendChild($settingsButton);*/
$settings = importTemplate('settings').querySelector('#settings');
$settings.querySelector('.header').appendChild(makeCloseButton(closeSettings));
$studio.appendChild($settings);
$settings.addEventListener('change', function (event) {
var $target = event.target;
handleUpdate($target.name, $target.value);
});
if (!window.localStorage)
return;
var $$options = $settings.querySelectorAll('select');
for (var i = 0, l = $$options.length; i < l; i++) {
var $option = $$options[i];
var name = $option.name;
var value = localStorage.getItem($option.name);
for (var j = 0; j < $option.length; j++) {
if ($option[j].value === value) {
$option.selectedIndex = j;
handleUpdate(name, value);
break;
}
}
}
function handleUpdate (name, value) {
switch (name) {
case 'display':
document.body.className = value;
break;
case 'badge-size':
var scale = parseFloat(value);
['WebkitTransform', 'MozTransform', 'transform'].forEach(function(transform) {
$badgeRaster.style[transform] = 'scale(' + scale + ')';
});
break;
default:
name = null;
}
if (name && window.localStorage)
localStorage.setItem(name, value);
}
}
/**
*
*/
function openSettings () {
if (!$settings)
initSettings();
$settings.classList.remove('hidden');
$settings.focus();
}
/**
*
*/
function closeSettings () {
if (!$settings)
return;
$settings.classList.add('hidden');
$settingsButton.focus();
}
// ==[ Glyph Selector ]=======================================================
/**

37
main/template/default/skill/badge_create.tpl
Unescape View File

@ -94,7 +94,7 @@
<div class="col-sm-10">
<h1 class="title">Badge Studio</h1>
<div class="" id="studio">
<form id="input">
<div id="input">
<div class="row">
<div class="col-md-4">
<h3 class="label"><label for="studio-mask">{{ "Templates" | get_lang }}</label></h3>
@ -654,31 +654,13 @@
</p>
</div>
<div class="col-md-12 text-center">
<a id="download-custom-badge" class="btn btn-primary"><em class="fa fa-download"></em> {{ 'DownloadBadge' | get_lang }}</a>
<a id="set-custom-badge" class="btn btn-primary"><em class="fa fa-check"></em> {{ 'SelectBadge' | get_lang }}</a>
<input type="hidden" id="badge_studio_image" name="badge_studio_image" >
</div>
</div>
</form>
</div>
</div>
<template id="settings-template">
<div id="settings" role="dialog" class="overlay hidden" arial-labelledby="settings-title">
<header class="header">
<h2 class="title" id="settings-title">{{ "Settings" | get_lang }}</h2>
</header>
<div class="panel">
<select name="display">
<option value="light">Light</option>
<option value="dark">Dark</option>
</select>
<select name="badge-size">
<option value="1">Normal</option>
<option value="0.75">Large</option>
<option value="0.5">Medium</option>
<option value="0.25">Small</option>
</select>
</div>
</div>
</template>
</div>
<template id="glyph-selector-template">
<div id="glyph-selector" role="dialog" class="overlay hidden" aria-label="Select a glyph" tabIndex="0">
@ -744,7 +726,7 @@
</div>
<p class="openbadges-text">{{'BadgePreview' | get_lang }}</p>
<div class="openbadges-img {{ skill.icon ? '' : 'hide' }}" id="badge-container">
<img id="badge-preview" alt="{{ 'BadgePreview' | get_lang }}" src="{{ skill.icon ? skill.web_icon_path : '' }}">
<img id="badge-preview" class="img-responsive" alt="{{ 'BadgePreview' | get_lang }}" src="{{ skill.icon ? skill.web_icon_path : '' }}">
</div>
</div>
</div>
@ -755,10 +737,11 @@
{{ badge_studio.script_js }}
<script>
$(document).ready(function() {
$('#download-custom-badge').click(function (){
var img = $('#raster').attr('src');
var url = img.replace(/^data:image\/[^;]/, 'data:application/octet-stream');
window.open(url);
$('#set-custom-badge').click(function () {
var data = $('#raster').attr('src');
$('#badge_studio_image').val(data);
$('#badge-preview').attr('src', data);
$('#badge-container').removeClass('hide');
});
})
</script>
Write Preview
Loading…
Cancel
Save