You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
307 lines
9.1 KiB
307 lines
9.1 KiB
<?php
|
|
|
|
/*
|
|
Slovenski narečni atlas / Slovenian dialectal atlas
|
|
Copyright (C) 2017 Gregor Šajn
|
|
|
|
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 3 of the License, or
|
|
(at your option) any later version.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU General Public License for more details.
|
|
|
|
You should have received a copy of the GNU General Public License
|
|
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
*/
|
|
|
|
?>
|
|
|
|
<div class="container container-first-page"> <!--class="container"-->
|
|
<div class="row row-borders">
|
|
<div class="col-md-8">
|
|
<div class="map-view-margin">
|
|
<h3 >Slovenski narečni atlas</h3>
|
|
</div>
|
|
<div class="form">
|
|
<div class="form-group">
|
|
<label for="subjects" class="control-label col-sm-1">Tema</label>
|
|
<div class="col-sm-11">
|
|
<select class="form-control map-view-margin input-sm selects" id="subjects" onchange="ajax_change_subject();">
|
|
<?
|
|
foreach($subjects as $id=>$subject)
|
|
{
|
|
?><option value="<?=$id?>"><?=$subject?></option><?
|
|
}
|
|
?>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<br/>
|
|
<br/>
|
|
<div class="form-group">
|
|
<label for="words" class="ccontrol-label col-sm-1">Beseda</label>
|
|
<div class="col-sm-11">
|
|
<select class="form-control map-view-margin input-sm selects" id="words" onchange="ajax_add_locations();">
|
|
<?
|
|
foreach($words as $id=>$word)
|
|
{
|
|
?><option value="<?=$id?>"><?=$word?></option><?
|
|
}
|
|
?>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<!-- info panel -->
|
|
<div class="col-sm-3 info-panel">
|
|
<!-- title -->
|
|
<div id="map_title_div" class="hidden info-panel-title">
|
|
<strong>Izbrana beseda: </strong>
|
|
<br/>
|
|
<span id="map_title" class="map-title"></span> <span id="trans_count" class=""></span>
|
|
</div>
|
|
|
|
<!-- image -->
|
|
<div id="image" class="hidden info-panel-image">
|
|
<strong><span class="">Slika: </span></strong><br>
|
|
<img id="word_image" class="info-panel-image-borders" src="" style="width:250px;height:250px;"/>
|
|
<br/>
|
|
</div>
|
|
|
|
<br/>
|
|
<br/>
|
|
<!-- comment button -->
|
|
<div id="button_comment" class="hidden info-panel-comment">
|
|
<strong><span>Komentar: </span></strong><br>
|
|
<button type="button" class="btn btn-md info-panel-btn" data-toggle="modal" data-target="#modal_comment">
|
|
Odpri komentar h karti <span class="glyphicon glyphicon-book"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<!-- actual map -->
|
|
<div class="col-sm-9">
|
|
<div class="text-right">
|
|
<?
|
|
//load svg map
|
|
$this->load->view('home/map_view.php');
|
|
?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="comment">
|
|
<!-- Modal -->
|
|
<div class="modal fade" id="modal_comment" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
|
|
<div class="modal-dialog modal-lg" role="document">
|
|
<div class="modal-content" style="height: 80%;">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
|
<h4 class="modal-title" id="myModalLabel">Komentar h karti za besedo Shramba</h4>
|
|
</div>
|
|
<div class="modal-body" id="modal_comment_content">
|
|
<iframe id="modal_iframe" frameBorder="0" src=""></iframe>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn info-panel-btn" data-dismiss="modal">Zapri</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="modals">
|
|
<?
|
|
$this->load->view('home/transcription_popup_view.php');
|
|
?>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
|
|
function ajax_add_locations()
|
|
{
|
|
var id_subject=$("#subjects option:selected").val();
|
|
|
|
var svgNS = "http://www.w3.org/2000/svg";
|
|
var xlinkNS = "http://www.w3.org/1999/xlink";
|
|
|
|
var id_word=$("#words option:selected").val();
|
|
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "<?=$this->url?>ajax_add_locations",
|
|
cache: false,
|
|
data: {
|
|
id_word: id_word,
|
|
id_subject:id_subject,
|
|
},
|
|
dataType: "json",
|
|
success: function(data){
|
|
if(data.status=='ok')
|
|
{
|
|
//update modals
|
|
$('#modals').html(data.view_modals);
|
|
|
|
//update legend
|
|
$('#legend').html(data.view_legend);
|
|
|
|
//update image and commet
|
|
//map comment
|
|
if(data.word.comment)
|
|
{
|
|
$('#button_comment').removeClass('hidden');
|
|
$('#modal_iframe').attr('src',data.word.comment);
|
|
|
|
}
|
|
else
|
|
{
|
|
$('#button_comment').addClass('hidden');
|
|
$('#modal_iframe').attr('src','');
|
|
}
|
|
|
|
//map image
|
|
if(data.word.image)
|
|
{
|
|
$('#image').removeClass('hidden');
|
|
$('#word_image').attr('src',data.word.image);
|
|
|
|
}
|
|
else if(id_word!=0)
|
|
{
|
|
$('#image').addClass('hidden');
|
|
$('#word_image').attr('src','');
|
|
}
|
|
else
|
|
{
|
|
$('#image').addClass('hidden');
|
|
$('#word_image').attr('src','');
|
|
}
|
|
|
|
|
|
//map title
|
|
if(data.word.title)
|
|
{
|
|
$('#map_title_div').removeClass('hidden');
|
|
$('#map_title').text(data.word.title);
|
|
}
|
|
else
|
|
{
|
|
$('#map_title_div').addClass('hidden');
|
|
$('#map_title').text('');
|
|
}
|
|
|
|
//trans count
|
|
if(data.transcriptions_count)
|
|
{
|
|
$('#trans_count').removeClass();
|
|
$('#trans_count').addClass("text-success");
|
|
$('#trans_count').text("(Fonetični zapisi: "+data.transcriptions_count+")");
|
|
}
|
|
else
|
|
{
|
|
$('#trans_count').removeClass();
|
|
$('#trans_count').addClass('text-danger');
|
|
$('#trans_count').text("(Ni fonetičnih zapisov)");
|
|
}
|
|
|
|
//empty current markers
|
|
$("#markers").empty();
|
|
|
|
var svg = d3.select("body").select("#Layer_1");
|
|
svg.select('#pins').remove();
|
|
var defs = svg.append('defs').attr('id','pins');
|
|
|
|
//foreach and get pins for each transcription
|
|
$.each(data.words_transcriptions, function(i, transcription){
|
|
/* delujoča
|
|
var svg = d3.select("body").select("#Layer_1");
|
|
svg.append('defs').append("g").attr("id","pin"+i).append("image").attr("xlink:href",transcription.pin).attr("height","25px").attr("width","25px")
|
|
*/
|
|
|
|
var g = defs.append("g").attr("id","pin"+i);
|
|
|
|
if(transcription.id)
|
|
{
|
|
g.append("text").attr('id','text-'+transcription.pin).attr("x","0px").attr("y","2px").attr("font-size","18pt").attr('class','SIMBola').style("fill", transcription.icon_color).text(transcription.pin);
|
|
}
|
|
else
|
|
{
|
|
g.append("text").attr('id','text-'+transcription.pin).attr("x","0px").attr("y","2px").attr("font-size","18pt").text("/");
|
|
}
|
|
|
|
|
|
var element = d3.select('#text-'+transcription.pin).node();
|
|
var width = element.getBoundingClientRect().width;
|
|
|
|
g.append("text").attr("x",width+8+"px").attr("y","0px").attr("font-size","12pt").text(transcription.short_name);
|
|
|
|
// Create an SVG <use> element
|
|
var use = document.createElementNS(svgNS, "use");
|
|
|
|
use.setAttributeNS(xlinkNS, "href", "#pin"+i);
|
|
use.setAttribute("x", transcription.x);
|
|
use.setAttribute("y", transcription.y);
|
|
use.setAttribute("class", "icons_all icons-"+transcription.code_title);
|
|
|
|
if(transcription.id)
|
|
{
|
|
use.setAttribute("data-toggle","modal");
|
|
use.setAttribute("data-target","#my_modal-"+i);
|
|
}
|
|
else
|
|
{
|
|
use.style.cursor="default";
|
|
}
|
|
|
|
document.getElementById("markers").appendChild(use);
|
|
});
|
|
}
|
|
},
|
|
error: function(){
|
|
alert('Prišlo je do napake pri nalaganju podatkov. Prosimo poskusite ponovno!');
|
|
}
|
|
});
|
|
}
|
|
|
|
function ajax_change_subject()
|
|
{
|
|
var id_subject=$("#subjects option:selected").val();
|
|
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "<?=$this->url?>ajax_change_subject",
|
|
cache: false,
|
|
data: {
|
|
id_subject: id_subject
|
|
},
|
|
dataType: "json",
|
|
success: function(data){
|
|
if(data.status=='ok')
|
|
{
|
|
var options;
|
|
$('#words').empty();
|
|
|
|
$.each(data.words, function(id, title){
|
|
options += '<option value=' + id + '>' + title + '</option>';
|
|
});
|
|
|
|
$('#words').append(options);
|
|
|
|
//update map - za praznjenje ko ni izbrana nobena tema
|
|
ajax_add_locations();
|
|
}
|
|
},
|
|
error: function(){
|
|
alert('Prišlo je do napake pri nalaganju podatkov. Prosimo poskusite ponovno!');
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
|