Form:Inscription: Difference between revisions

From Cives
Jump to navigationJump to search
No edit summary
No edit summary
 
(47 intermediate revisions by the same user not shown)
Line 12: Line 12:
{{{for template|Inscription}}}
{{{for template|Inscription}}}
<html>
<html>
<table>
<table id="imgTable">
     <tr>
     <tr>
    <td><img id="letterA" src="SampleLetters/A.png" alt="letter A"></td>
        <td><img id="lettera1" src="venetianLetters/a1.png" alt="a1"></td>
    <td><img id="letterB" src="SampleLetters/B.png" alt="letter B"></td>
        <td><img id="lettera1r" src="venetianLetters/a1r.png" alt="a1r"></td>
    <td><img id="letterC" src="SampleLetters/C.png" alt="letter A"></td>
        <td><img id="lettera2" src="venetianLetters/a2.png" alt="a2"></td>
    <td><img src="SampleLetters/CH.png" alt="letter A"></td>
        <td><img id="lettera2r" src="venetianLetters/a2r.png" alt="a2r"></td>
    <td><img src="SampleLetters/D.png" alt="letter A"></td>
        <td><img id="lettera4" src="venetianLetters/a4.png" alt="a4"></td>
    <td><img src="SampleLetters/E.png" alt="letter A"></td>
        <td><img id="lettera5" src="venetianLetters/a5.png" alt="a5"></td>
    <td><img src="SampleLetters/G.png" alt="letter A"></td>
 
    <td><img src="SampleLetters/H.png" alt="letter A"></td>
        <td><img id="letterb1" src="venetianLetters/b1.png" alt="b1"></td>
        <td><img id="letterb2" src="venetianLetters/b2.png" alt="b2"></td>
        <td><img id="letterb3" src="venetianLetters/b3.png" alt="b3"></td>
        <td><img id="letterb3r" src="venetianLetters/b3r.png" alt="b3r"></td>
 
        <td><img id="letterd1" src="venetianLetters/d1.png" alt="d1"></td>
        <td><img id="letterd2" src="venetianLetters/d2.png" alt="d2"></td>
        <td><img id="letterd3" src="venetianLetters/d3.png" alt="d3"></td>
        <td><img id="letterd4" src="venetianLetters/d4.png" alt="d4"></td>
 
        <td><img id="lettere1" src="venetianLetters/e1.png" alt="e1"></td>
        <td><img id="lettere1r" src="venetianLetters/e1r.png" alt="e1r"></td>
        <td><img id="lettere2" src="venetianLetters/e2.png" alt="e2"></td>
        <td><img id="lettere2r" src="venetianLetters/e2r.png" alt="e2r"></td>
        <td><img id="lettere3" src="venetianLetters/e3.png" alt="e3"></td>
 
        <td><img id="letterg1" src="venetianLetters/g1.png" alt="g1"></td>
        <td><img id="letterg2" src="venetianLetters/g2.png" alt="g2"></td>
 
        <td><img id="letterh1" src="venetianLetters/h1.png" alt="h1"></td>
        <td><img id="letterh2" src="venetianLetters/h2.png" alt="h2"></td>
        <td><img id="letterh3" src="venetianLetters/h3.png" alt="h3"></td>
 
        <td id="tdint1"><img id="letterint1" src="venetianLetters/int1.png" alt="int1"></td>
        <td id="tdint2"><img id="letterint2" src="venetianLetters/int2.png" alt="int2"></td>
 
        <td><img id="letterj1" src="venetianLetters/j1.png" alt="j1"></td>
        <td><img id="letterj2" src="venetianLetters/j2.png" alt="j2"></td>
        <td><img id="letterj3" src="venetianLetters/j3.png" alt="j3"></td>
        <td><img id="letterj4" src="venetianLetters/j4.png" alt="j4"></td>
 
        <td><img id="letterk1" src="venetianLetters/k1.png" alt="k1"></td>
        <td><img id="letterk2" src="venetianLetters/k2.png" alt="k2"></td>
 
        <td><img id="letterl1" src="venetianLetters/l1.png" alt="l1"></td>
        <td><img id="letterl1r" src="venetianLetters/l1r.png" alt="l1r"></td>
        <td><img id="letterl2" src="venetianLetters/l2.png" alt="l2"></td>
 
    <td><img id="letterm1" src="venetianLetters/m1.png" alt="m1"></td>
        <td><img id="letterm1r" src="venetianLetters/m1r.png" alt="m1r"></td>
        <td><img id="letterm2r" src="venetianLetters/m2.png" alt="m2"></td>
        <td><img id="letterm2r" src="venetianLetters/m2r.png" alt="m2r"></td>
     </tr>
     </tr>
     <tr>
     <tr>
         <td><img src="SampleLetters/I.png" alt="letter A"></td>
         <td><img id="lettern" src="venetianLetters/n.png" alt="n"></td>
         <td><img src="SampleLetters/K.png" alt="letter A"></td>
        <td><img id="letternr" src="venetianLetters/nr.png" alt="nr"></td>
         <td><img src="SampleLetters/L.png" alt="letter A"></td>
 
         <td><img src="SampleLetters/M.png" alt="letter A"></td>
        <td><img id="lettero1" src="venetianLetters/o1.png" alt="o1"></td>
         <td><img src="SampleLetters/N.png" alt="letter A"></td>
        <td><img id="lettero2" src="venetianLetters/o2.png" alt="o2"></td>
         <td><img src="SampleLetters/O.png" alt="letter A"></td>
        <td><img id="lettero3" src="venetianLetters/o3.png" alt="o3"></td>
         <td><img src="SampleLetters/P.png" alt="letter A"></td>
        <td><img id="lettero4" src="venetianLetters/o4.png" alt="o4"></td>
         <td><img src="SampleLetters/Q.png" alt="letter A"></td>
 
    </tr>
        <td><img id="letterp1" src="venetianLetters/p1.png" alt="p1"></td>
    <tr>
        <td><img id="letterp1r" src="venetianLetters/p1r.png" alt="p1r"></td>
         <td><img src="SampleLetters/R.png" alt="letter A"></td>
        <td><img id="letterp2" src="venetianLetters/p2.png" alt="p2"></td>
         <td><img src="SampleLetters/SH.png" alt="letter A"></td>
        <td><img id="letterp2r" src="venetianLetters/p2r.png" alt="p2r"></td>
         <td><img src="SampleLetters/S.png" alt="letter A"></td>
 
         <td><img src="SampleLetters/T.png" alt="letter A"></td>
<td><img id="letterr1" src="venetianLetters/r1.png" alt="r1"></td>
         <td><img src="SampleLetters/U.png" alt="letter A"></td>
        <td><img id="letterr1r" src="venetianLetters/r1r.png" alt="r1r"></td>
         <td><img src="SampleLetters/V.png" alt="letter A"></td>
        <td><img id="letterr2" src="venetianLetters/r2.png" alt="r2"></td>
         <td><img src="SampleLetters/X.png" alt="letter A"></td>
        <td><img id="letterr2r" src="venetianLetters/r2r.png" alt="r2r"></td>
         <td><img src="SampleLetters/Z.png" alt="letter A"></td>
<td><img id="letterr3" src="venetianLetters/r3.png" alt="r3"></td>
        <td><img id="letterr3r" src="venetianLetters/r3r.png" alt="r3r"></td>
        <td><img id="letterr4" src="venetianLetters/r4.png" alt="r4"></td>
        <td><img id="letterr4r" src="venetianLetters/r4r.png" alt="r4r"></td>
        <td><img id="letterr5" src="venetianLetters/r5.png" alt="r5"></td>
 
        <td><img id="letters'1" src="venetianLetters/s'1.png" alt="s'1"></td>
        <td><img id="letters'2" src="venetianLetters/s'2.png" alt="s'2"></td>
        <td><img id="letters'2r" src="venetianLetters/s'2r.png" alt="s'2r"></td>
        <td><img id="letters'p" src="venetianLetters/s'p.png" alt="s'p"></td>
<td><img id="letters1" src="venetianLetters/s1.png" alt="s1"></td>
        <td><img id="letters1r" src="venetianLetters/s1r.png" alt="s1r"></td>
        <td><img id="letters2" src="venetianLetters/s2.png" alt="s2"></td>
 
         <td><img id="lettert1" src="venetianLetters/t1.png" alt="t1"></td>
         <td><img id="lettert2" src="venetianLetters/t2.png" alt="t2"></td>
         <td><img id="lettert3" src="venetianLetters/t3.png" alt="t3"></td>
         <td><img id="lettert4" src="venetianLetters/t4.png" alt="t4"></td>
<td><img id="lettert5" src="venetianLetters/t5.png" alt="t5"></td>
     
         <td><img id="letteru1" src="venetianLetters/u1.png" alt="u1"></td>
         <td><img id="letteru2" src="venetianLetters/u2.png" alt="u2"></td>
         <td><img id="letteru3" src="venetianLetters/u3.png" alt="u3"></td>
 
        <td><img id="letterv1" src="venetianLetters/v1.png" alt="v1"></td>
        <td><img id="letterv1r" src="venetianLetters/v1r.png" alt="v1r"></td>
         <td><img id="letterv2" src="venetianLetters/v2.png" alt="v2"></td>
         <td><img id="letterv2r" src="venetianLetters/v2r.png" alt="v2r"></td>
         <td><img id="letterv3" src="venetianLetters/v3.png" alt="v3"></td>
          
      </tr>
      <tr>
<td><img id="letterz1" src="venetianLetters/z1.png" alt="z1"></td>
         <td><img id="letterz2" src="venetianLetters/z2.png" alt="z2"></td>
        <td><img id="letterspacebar-letter" src="venetianLetters/spacebar-letter.png" alt="spacebar"</td>
        <td><img id="letteri" src="venetianLetters/i.png" alt="z2"></td>
         <td><img id="letterj5" src="venetianLetters/j5.png" alt="j5"></td>
         <td><img id="letterv4r" src="venetianLetters/v4r.png" alt="v4r"></td>  
         <td><img id="letterv4" src="venetianLetters/v4.png" alt="v4"></td>          
     </tr>
     </tr>
<style>
#imgTable img, #slikce img{ width: 24px; height: 48px;}
img#int1{
    width: 16px;
    margin-left: -5px !important;
    margin-right: -5px !important;
}img#int2{
    width: 16px;
    margin-left: -6px !important;
    margin-right: -6px !important;
}
img#d4{
    width: 48px !important;
    height: 48px !important;
}
img#o4{
    width: 48px !important;
    height: 48px !important;
}
img#o2{
    width: 34px !important;
}
img#o3{
    width: 48px !important;
    height: 48px !important;
}
img#o1{
    width: 48px !important;
    height: 48px !important;
}
img#b1{
    width: 48px !important;
    height: 48px !important;
}
img#i{
    margin-left: -5px !important;
    margin-right: -5px !important;
}
img {
  max-height: 350px;
}
</style>
</table>
</table>
<div id="field">
<div id="field">
Line 52: Line 176:


<script type="text/javascript">
<script type="text/javascript">
// brisanje fotografije
   document.querySelector("#slikce").addEventListener("click", (e) => {
   document.querySelector("#slikce").addEventListener("click", (e) => {
   let targetDiv = document.getElementById("slikce");
   let targetDiv = document.getElementById("slikce");
Line 61: Line 188:
   let imgTags = inputValue.match(regex);
   let imgTags = inputValue.match(regex);
   imgTags = imgTags.slice(0, -1);
   imgTags = imgTags.slice(0, -1);
  console.log(imgTags);


   if (imgTags.length >= 1) {
   if (imgTags.length >= 1) {
Line 70: Line 196:
});
});


document.getElementById( "letterA" ).onclick = function() {
// dodajanje fotografije v "field"
    var slika = document.createElement("img");
    slika.src = 'SampleLetters/A.png';
    document.getElementById("slikce").appendChild(slika);
    var divContent = document.getElementById('field').innerHTML;


    document.getElementById('input_16').value =  divContent;
function handleImageClick(letter) {
 
};
document.getElementById( "letterB" ).onclick = function() {
     var slika = document.createElement("img");
     var slika = document.createElement("img");
     slika.src = 'SampleLetters/B.png';
    slika.id = letter;
     slika.src = 'venetianLetters/' + letter + '.png';
     document.getElementById("slikce").appendChild(slika);
     document.getElementById("slikce").appendChild(slika);
     var divContent = document.getElementById('field').innerHTML;
     var divContent = document.getElementById('field').innerHTML;
    document.getElementById('input_16').value = divContent;
}


    document.getElementById('input_16').value =  divContent;
var imgElements = document.querySelectorAll('img[id^="letter"]');
 
imgElements.forEach(function(img) {
 
    img.addEventListener('click', function() {
};
        var letter = this.id.replace('letter', '');
 
        handleImageClick(letter);
 
    });
buttonSubmit = document.getElementById("wpSave").children[0];
});
 
document.getElementById( "letterC" ).onclick = function() {
    var divContent = document.getElementById('field').innerHTML;
    document.getElementById('input_16').value =  divContent ;
};
 


</script>
</script>
Line 113: Line 229:
|-
|-
! Language:  
! Language:  
| {{{field|language|input type=dropdown|values=Venetic, Gaulish, Rhaetic, unknown}}}
| {{{field|language|input type=dropdown|values=Venetic, Gaulish, Rhaetic, Germanic, unknown}}}
|-
|-
! Direction:  
! Direction:  
Line 143: Line 259:
|-
|-
! Image:  
! Image:  
| {{{field|file|uploadable}}}
| {{{field|file|uploadable}}} ''Max 2MB file''
|-
|-
! Image caption:
! Image caption:
| {{{field|imageCaption|property=Has image caption}}}
| {{{field|imageCaption|property=Has image caption}}}
|-
|-
! Test
!
| {{{field|test|input type=text|hidden}}}
| {{{field|test|input type=text|}}}
|}
|}
{{{end template}}}
{{{end template}}}
</includeonly>
</includeonly>

Latest revision as of 17:07, 24 April 2024

This is the "Inscription" form. To create a page with this form, enter the page name below; if a page with that name already exists, you will be sent to a form to edit that page.