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

Skill: Display: Fix create badge page

Browse Source
pull/6010/head
Angel Fernando Quiroz Campos 8 months ago
parent 7d1873df06
commit 28d5d3a5b4
No known key found for this signature in database
GPG Key ID: B284841AE3E562CD
1 changed files with 60 additions and 81 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. 141
      public/main/template/default/skill/badge_create.html.twig

141
public/main/template/default/skill/badge_create.html.twig
Unescape View File

@ -1,21 +1,5 @@
<script>
(function() {
var designer = null
$(function() {
$(".help-badges").tooltip()
$(".help-badges-img").tooltip()
$("#btn-open-designer").on("click", function(e) {
e.preventDefault()
var designerUrl = 'https://www.openbadges.me/designer.html?origin={{ url('index') }}'
designerUrl = designerUrl + '&email={{ platformAdminEmail }}'
designerUrl = designerUrl + "&close=true"
designerUrl = designerUrl + "&hidePublish=true"
var windowOptions = "width=1200,height=680,location=0,menubar=0,status=0,toolbar=0"
designer = window.open(designerUrl, "", windowOptions)
})
$("#image").on("change", function() {
var self = this
@ -35,32 +19,31 @@
}
})
})
})()
</script>
<div class="grid grid-cols-2 gap-4">
<div class="col-md-9">
<div class="section-header section-header--h2">
<h2 class="section-header__title">{{ skill.title }}</h2>
</div>
<div class="grid md:grid-cols-3 gap-4">
<div class="order-last md:order-first col-span-2">
<form action="{{ current_url }}" class="form-horizontal" method="post" enctype="multipart/form-data">
<legend>
{{ skill.title }}
</legend>
<div class="form-group">
<label class="col-sm-2 control-label" for="image">{{ 'Image'|trans }}</label>
<div class="col-sm-10">
<input data-placement="left"
data-toggle="tooltip"
title="{{ "Badge measures 200x200 pixels in PNG"|trans }}"
type="file" name="image" id="image" class="help-badges-img" accept="image/*">
<div class="field">
<div class="float-label">
<label for="image">{{ 'Image'|trans }}</label>
<input data-placement="left" data-toggle="tooltip" type="file" name="image" id="image"
accept="image/*">
</div>
<small>{{ "Badge measures 200x200 pixels in PNG"|trans }}</small>
</div>
<div class="form-group collapse" id="badge-studio-frame" style="display: none">
<label class="col-sm-2 control-label" for="criteria"></label>
<div class="form-group invisible" id="badge-studio-frame">
<label for="criteria"></label>
<div class="col-sm-10">
<h1 class="title">Badge Studio</h1>
<div class="" id="studio">
<div id="input">
<div class="row">
<div class="col-md-4">
<div id="input" class="space-y-4">
<div class="grid md:grid-cols-4 gap-4">
<div>
<h3 class="label"><label for="studio-mask">{{ "Templates"|trans }}</label></h3>
<select name="template" class="form-control" id="studio-template"
data-path="{{ badge_studio.templates }}">
@ -70,38 +53,32 @@
</select>
<h3 class="label"><label for="studio-mask">{{ "Palettes"|trans }}</label></h3>
<select name="palette" class="form-control" id="studio-palette">
<option value="palette-1"
data-color-background="#CE001F"
data-color-stitching="#FFF"
data-color-border="#4C4F53"
data-color-detail="#999"
data-color-glyph="#FFF">{{ "Palette"|trans }} 1
<option value="palette-1" data-color-background="#CE001F"
data-color-stitching="#FFF" data-color-border="#4C4F53"
data-color-detail="#999" data-color-glyph="#FFF">
{{ "Palette"|trans }} 1
</option>
<option value="palette-2"
data-color-background="#04A"
data-color-stitching="#0AE"
data-color-border="#0AE"
data-color-detail="#FFF"
data-color-glyph="#FFF">{{ "Palette"|trans }} 2
<option value="palette-2" data-color-background="#04A"
data-color-stitching="#0AE" data-color-border="#0AE"
data-color-detail="#FFF" data-color-glyph="#FFF">
{{ "Palette"|trans }} 2
</option>
<option value="palette-3"
data-color-background="#11458B"
data-color-stitching="#3EB48D"
data-color-border="#3EB48D"
data-color-detail="#FFF"
data-color-glyph="#FFF">{{ "Palette"|trans }} 3
<option value="palette-3" data-color-background="#11458B"
data-color-stitching="#3EB48D" data-color-border="#3EB48D"
data-color-detail="#FFF" data-color-glyph="#FFF">
{{ "Palette"|trans }} 3
</option>
</select>
<br />
<h3 class="label"><label for="studio-mask">{{ "Colors"|trans }}</label></h3>
<div id="custom-palette"></div>
</div>
<div class="col-md-8">
<div class="md:col-span-3">
<div id="output"></div>
</div>
</div>
<div class="row">
<div class="col-md-3">
<div class="grid md:grid-cols-4 gap-4">
<div>
<h3 class="label"><label for="studio-mask">{{ "Mask"|trans }}</label></h3>
<p class="item">
<select name="mask" class="form-control" id="studio-mask"
@ -111,13 +88,13 @@
</select>
</p>
</div>
<div class="col-md-3">
<div>
<h3 class="label"><label for="studio-options">{{ "Options"|trans }}</label></h3>
<p class="item" id="options">
<i>None</i>
</p>
</div>
<div class="col-md-6">
<div class="col-span-2">
<h3 class="label"><label for="studio-glyph">{{ "Icon"|trans }}</label></h3>
<p class="item">
<select name="glyph" class="form-control" id="studio-glyph">
@ -440,7 +417,7 @@
<option value="pied-piper-alt">Pied Piper (Alt)</option>
<option value="pied-piper-square">Pied Piper (Square)</option>
<option value="pinterest">Pinterest</option>
<option value="pinterest-square">Pinterest (Square)</option>
<option value="pinte rest-square">Pinterest (Square)</option>
<option value="plane">Plane</option>
<option value="play">Play</option>
<option value="play-circle">Play (Circle)</option>
@ -630,11 +607,11 @@
</select>
</p>
</div>
<div class="col-md-12 text-center">
<a id="set-custom-badge" class="btn btn--primary"><em class="fa fa-check"></em>
{{ 'Use this badge'|trans }}</a>
<input type="hidden" id="badge_studio_image" name="badge_studio_image">
</div>
</div>
<div class="text-center">
<a id="set-custom-badge" class="btn btn--primary"><em class="fa fa-check"></em>
{{ 'Use this badge'|trans }}</a>
<input type="hidden" id="badge_studio_image" name="badge_studio_image">
</div>
</div>
</div>
@ -688,31 +665,33 @@
</div>
</form>
</div>
<div class="col-md-3">
<div>
<div class="openbadges-img" id="badge-container">
<img id="badge-preview"
class="img-fluid" alt="{{ 'Badge preview'|trans }}" src="{{ skill.asset }}">
</div>
<div class="create-openbadges">
<button id="btn-open-designer"
class="help-badges btn btn--primary btn-large btn-block"
data-toggle="tooltip" data-placement="bottom"
title="{{ 'Design a new badge, download it from the design tool and upload it on the platform.'|trans }}"
type="button"
>
<em class="fas fa-pencil-alt"></em> {{ 'Design a new badge'|trans }}
</button>
<div class="field">
<div>
<a id="btn-open-designer" href="https://badge.design" class="btn btn--primary" target="_blank">
<span aria-hidden="true" class="fas fa-pencil-alt"></span> {{ 'Design a new badge'|trans }}
</a>
</div>
<small>{{ 'Design a new badge, download it from the design tool and upload it on the platform.'|trans }}</small>
</div>
</div>
<div class="create-openbadges">
<button id="btn-open-badge-studio" class="help-badges btn btn-outline-primary btn-large btn-block"
data-toggle="collapse" data-target="#badge-studio-frame" aria-expanded="false"
aria-controls="badge-studio-frame"
title="{{ 'Use the Badge Studio to create your own badge from within your platform'|trans }}"
type="button"
>
<em class="fa fa-cogs"></em> {{ 'Design with Badge Studio'|trans }}
</button>
<div class="field">
<div>
<button id="btn-open-badge-studio" class="btn btn--primary-outline"
data-toggle="collapse" data-target="#badge-studio-frame" aria-expanded="false"
aria-controls="badge-studio-frame" type="button">
<samll aria-hidden="true" class="fa fa-cogs"></samll> {{ 'Design with Badge Studio'|trans }}
</button>
</div>
<small>{{ 'Use the Badge Studio to create your own badge from within your platform'|trans }}</small>
</div>
</div>
</div>
</div>
@ -720,7 +699,7 @@
<script>
$(function() {
$("#btn-open-badge-studio").click(function() {
$("#badge-studio-frame").toggle()
$("#badge-studio-frame").toggleClass("invisible")
})
$("#set-custom-badge").click(function() {

Write Preview
Loading…
Cancel
Save