theme-settings: background image can be set with fbrowser
This commit is contained in:
parent
dab12f0b93
commit
8be0a2268f
|
@ -135,6 +135,7 @@ var FileBrowser = {
|
|||
this.dataset.filename,
|
||||
embed,
|
||||
FileBrowser.id,
|
||||
this.dataset.img
|
||||
]);
|
||||
|
||||
// close model
|
||||
|
|
21
js/modal.js
21
js/modal.js
|
@ -48,6 +48,27 @@ $(document).ready(function(){
|
|||
e.preventDefault();
|
||||
toggleJotNav(this);
|
||||
});
|
||||
|
||||
// Open filebrowser for elements with the class "image-select"
|
||||
// The following part handles the filebrowser for field_fileinput.tpl
|
||||
$("body").on("click", ".image-select", function(e){
|
||||
// set a extra attribute to mark the clicked button
|
||||
this.setAttribute("image-input", "select");
|
||||
Dialog.doImageBrowser("input");
|
||||
});
|
||||
|
||||
// Insert filebrowser images into the input field (field_fileinput.tpl)
|
||||
$("body").on("fbrowser.image.input", function(e, filename, embedcode, id, img) {
|
||||
// select the clicked button by it's attribute
|
||||
var elm = $("[image-input='select']")
|
||||
// select the input field which belongs to this button
|
||||
var input = elm.parent(".input-group").children("input");
|
||||
// remove the special indicator attribut from the button
|
||||
elm.removeAttr("image-input");
|
||||
// inserte the link from the image into the input field
|
||||
input.val(img);
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
// overwrite Dialog.show from main js to load the filebrowser into a bs modal
|
||||
|
|
10
templates/field_fileinput.tpl
Normal file
10
templates/field_fileinput.tpl
Normal file
|
@ -0,0 +1,10 @@
|
|||
|
||||
<div class="form-group field input file">
|
||||
<label for="id_{{$field.0}}" id="label_{{$field.0}}">{{$field.1}}</label>
|
||||
<div class="input-group" id="{{$field.0}}">
|
||||
<input class="form-control file" name="{{$field.0}}" id="id_{{$field.0}}" type="text" value="{{$field.2}}">{{if $field.4}} <span class="required">{{$field.4}}</span> {{/if}}
|
||||
<span class="input-group-addon image-select"><i class="fa fa-picture-o"></i></span>
|
||||
</div>
|
||||
<span id="help_{{$field.0}}" class="help-block">{{$field.3}}</span>
|
||||
<div id="end_{{$field.0}}" class="field_end"></div>
|
||||
</div>
|
|
@ -1,6 +1,8 @@
|
|||
|
||||
<link rel="stylesheet" href="{{$baseurl}}/view/theme/frio/frameworks/jRange/jquery.range.css" type="text/css" media="screen" />
|
||||
<script src="{{$baseurl}}/view/theme/quattro/jquery.tools.min.js"></script>
|
||||
<script src="{{$baseurl}}/view/theme/frio/frameworks/jRange/jquery.range.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/js/ajaxupload.js" ></script>
|
||||
|
||||
{{include file="field_select.tpl" field=$schema}}
|
||||
|
||||
|
@ -20,7 +22,7 @@
|
|||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{if $background_image}}{{include file="field_colorinput.tpl" field=$background_image}}{{/if}}
|
||||
{{if $background_image}}{{include file="field_fileinput.tpl" field=$background_image}}{{/if}}
|
||||
|
||||
<div id="frio_bg_image_options" style="display: none;">
|
||||
{{foreach $bg_image_options as $options}}
|
||||
|
|
Loading…
Reference in a new issue