Current File : /home/users/barii/public_html/finansenl.com.pl/wodki/html/tpl/generator/test4.php

<meta charset="utf-8" />
<title>generator</title>
<link rel="stylesheet" type="text/css" href="style4.css" />
<script type="text/javascript" src="jquery.min.js"></script>  


<script type="text/javascript">

function get_pos(){
var p = $( ".imiona" );
alert ("left: " + p.css('margin-left') + ", top: " + p.css('margin-top') );
}

function get_pos2(what){
var p = $( "#"+what+"" );
return ""+p.css('top')+"";
}
function przesun(wartosc)
{
	$(".tools1").css('top', ''+wartosc+'');
	//alert($(".tools1").css('top'));
}
</script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
  $(function() {
$( "form.generuj" ).submit(function( event ) {

var tit1 = 'header';
$("#"+tit1+"_style").val('font-size:'+$("#"+tit1+"").css('font-size')+';font-weight:'+$("#"+tit1+"").css('font-weight')+';line-height:'+$("#"+tit1+"").css('line-height')+';text-align:'+$("#"+tit1+"").css('text-align')+'');

var tit1 = 'imiona';
$("#"+tit1+"_style").val('font-size:'+$("#"+tit1+"").css('font-size')+';font-weight:'+$("#"+tit1+"").css('font-weight')+';line-height:'+$("#"+tit1+"").css('line-height')+';text-align:'+$("#"+tit1+"").css('text-align')+'');

var tit1 = 'data';
$("#"+tit1+"_style").val('font-size:'+$("#"+tit1+"").css('font-size')+';font-weight:'+$("#"+tit1+"").css('font-weight')+';line-height:'+$("#"+tit1+"").css('line-height')+';text-align:'+$("#"+tit1+"").css('text-align')+'');

var tit1 = 'text';
$("#"+tit1+"_style").val('font-size:'+$("#"+tit1+"").css('font-size')+';font-weight:'+$("#"+tit1+"").css('font-weight')+';line-height:'+$("#"+tit1+"").css('line-height')+';text-align:'+$("#"+tit1+"").css('text-align')+'');

var tit1 = 'procent';
$("#"+tit1+"_style").val('font-size:'+$("#"+tit1+"").css('font-size')+';font-weight:'+$("#"+tit1+"").css('font-weight')+';line-height:'+$("#"+tit1+"").css('line-height')+';text-align:'+$("#"+tit1+"").css('text-align')+'');

});
$( "#header" ).keyup(function() {
  lineheight('header');
});
$( "#imiona" ).keyup(function() {
  lineheight('imiona');
});
$( "#data" ).keyup(function() {
  lineheight('data');
});
$( "#text" ).keyup(function() {
  lineheight('text');
});
$( "#procent" ).keyup(function() {
  lineheight('procent');
});
$("#header").resizable({
	containment: '#bg',
    resize: function(event, ui) {
		resize12('header');
    }
}).parent().css('padding','0');
$("#imiona").resizable({
	containment: '#bg',
    resize: function(event, ui) {
		resize123('imiona');
    }
}).parent().css('padding','0');
$("#data").resizable({
	containment: '#bg',
    resize: function(event, ui) {
		resize123('data');
    }
}).parent().css('padding','0');
$("#text").resizable({
	containment: '#bg',
    resize: function(event, ui) {
		resize1234('text');
    }
}).parent().css('padding','0');
$("#procent").resizable({
	containment: '#bg',
    resize: function(event, ui) {
		resize123('procent');
    }
}).parent().css('padding','0');

    $('#imiona2').disableSelection().css('webkit-user-select','none').draggable({cursor: "move", containment: '#bg', drag: function( event, ui ) {zmiana('imiona');}}); 
	$('#header2').disableSelection().css('webkit-user-select','none').draggable({cursor: "move", containment: '#bg', drag: function( event, ui ) {zmiana('header');}}); 
	$('#data2').disableSelection().css('webkit-user-select','none').draggable({cursor: "move", containment: '#bg', drag: function( event, ui ) {zmiana('data');}}); 
	$('#text2').disableSelection().css('webkit-user-select','none').draggable({cursor: "move", containment: '#bg', drag: function( event, ui ) {zmiana('text');}}); 
	$('#procent2').disableSelection().css('webkit-user-select','none').draggable({cursor: "move", containment: '#bg', drag: function( event, ui ) {zmiana('procent');}}); 
	$( "textarea" ).click(function() {
  remove_all();
});
  });
function resize123(co)
{
	 var preferredFontSize = 1600; // %
        var preferredSize = 1024 * 768;

        var currentSize = $("#"+co+"").width() * $("#"+co+"").height();
        var scalePercentage = Math.sqrt(currentSize) / Math.sqrt(preferredSize);
        var newFontSize = preferredFontSize * scalePercentage;
        $("#"+co+"").css("font-size", newFontSize + '%');
}

function resize12(co)
{
	 var preferredFontSize = 1600; // %
        var preferredSize = 1024 * 768;

        var currentSize = $("#"+co+"").width() * $("#"+co+"").height();
        var scalePercentage = Math.sqrt(currentSize) / Math.sqrt(preferredSize);
        var newFontSize = preferredFontSize * scalePercentage;
        $("#"+co+"").css("font-size", newFontSize + '%');
		$("#"+co+"").css("line-height", (newFontSize/5.5) + 'px');
}	
function resize1234(co)
{
	 var preferredFontSize = 800; // %
        var preferredSize = 1024 * 768;

        var currentSize = $("#"+co+"").width() * $("#"+co+"").height();
        var scalePercentage = Math.sqrt(currentSize) / Math.sqrt(preferredSize);
        var newFontSize = preferredFontSize * scalePercentage;
        $("#"+co+"").css("font-size", newFontSize + '%');
}	

  </script>
<script type="text/javascript">
	var where = 'header';
function lineheight(co)
{
	var ks = $('#'+co+'').val().split("\n");
	//alert(ks[1]);
	if (ks[1] == undefined)
	{
	$( "#lineheight" ).hide();
	}
	else
	{
	$( "#lineheight" ).show();
	}
}
function zmiana(co)
{
	where = co;
	//get_pos2(co);
	//alert(get_pos2(co));
	//$( "#tools" ).css('margin-top', ''+get_pos2(co)+'px');
	//alert(get_pos2(co));
	przesun(get_pos2(''+co+'2'));
	$( "#tools" ).show();
	lineheight(co);
}
function font_size5(value)
  {
	$('#'+where+'').css('font-size', ''+value+'pt');
  }
  function line_height5(value)
  {
	$('#'+where+'').css('line-height', ''+value+'pt');
  }
  function pogrub()
  {
		var fontWeight = $("#"+where+"").css('font-weight');
		if (fontWeight == "bold")
		{
			$("#"+where+"").css('font-weight', 'normal');
		}
		else
		{
			$("#"+where+"").css('font-weight', 'bold');
		}
  }
  function align(typ)
  {
	if (typ == 1)
	{
		$("#"+where+"").css('text-align', 'left');
	}
	else if (typ == 2)
	{
		$("#"+where+"").css('text-align', 'center');
	}
	else if (typ == 3)
	{
		$("#"+where+"").css('text-align', 'right');
	}
	else if (typ == 4)
	{
		$("#"+where+"").css('text-align', 'justify');
	}
  }
  function remove_all()
  {
	$("#header").removeClass("active2");
	$("#imiona").removeClass("active2");
	$("#data").removeClass("active2");
	$("#text").removeClass("active2");
	$("#procent").removeClass("active2");
  }
  function set_focus()
  {
	//alert('ok');
	//$( "#"+where+"" ).focus();
	$("#"+where+"").addClass("active2");
  }
  function delete2(name)
  {
	$("#"+name+"").hide();
  }
function reset()
{
location.reload();
}

</script>

<div class="content">
	<div class="cright">
		<a href="javascript:reset();"><img src="http://www.clipartbest.com/cliparts/7Ta/KLb/7TaKLb6Xc.png" width="40" alt="" /></a>
	</div>
	
	<div class="cleft">
		<form method="POST" class="generuj" action="test3.php">
			<div class="bg" id="bg">
					<div class="tools1" id="tools" onclick="set_focus();" style="display:none;">
						<a href="javascript:pogrub();"><img src="http://cmsresources.windowsphone.com/windowsphone/pl-PL/How-to/wp7/inline/office-icon-bold.png" alt="" /></a>
						 font-size <select name="font_size1" id="font_size1" onchange="font_size5(this.value);">
							<?php
							for ($i=25;$i <= 100;$i++)
							{
								echo '<option value="'.$i.'"';
									if ($i==100) echo ' selected="selected"';
								echo '>'.$i.' pt</option>';
							}
							?>
						</select>
						<span id="lineheight">
						line-height <select name="line_height1" id="line_height1" onchange="line_height5(this.value);">
							<?php
							for ($i=25;$i <= 100;$i++)
							{
								echo '<option value="'.$i.'"';
									if ($i==100) echo ' selected="selected"';
								echo '>'.$i.' pt</option>';
							}
							?>
						</select>
						</span>
						<a href="javascript:align(1);"><img src="aleft.png" alt="" /></a>
						<a href="javascript:align(2);"><img src="acenter.png" alt="" /></a>
						<a href="javascript:align(3);"><img src="aright.png" alt="" /></a>
					</div>
					
					<div id="header2">
						<div class="ikony">
							<span class="delete" onclick="javascript:delete2('header2');"><img src="https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/delete.png" width="20" height="20" /></span>
							<span class="ks1" id="ks"><img src="https://cdn2.iconfinder.com/data/icons/3_Minicons-Free-_Pack/46/move.png" width="20" height="20" /></span>
						</div>
						<textarea class="header" name="header" onclick="zmiana('header');" id="header">Pan&#10;Młody</textarea>
					</div>
				
				
					<div id="imiona2">
						<div class="ikony">
							<span class="delete" onclick="javascript:delete2('imiona2');"><img src="https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/delete.png" width="20" height="20" /></span>
							<span class="ks1" id="ks"><img src="https://cdn2.iconfinder.com/data/icons/3_Minicons-Free-_Pack/46/move.png" width="20" height="20" /></span>
						</div>
						<textarea class="imiona" name="imiona" onclick="zmiana('imiona');" id="imiona">Justyna & Adam</textarea>
					</div>
					
					<div id="data2">
						<div class="ikony">
							<span class="delete" onclick="javascript:delete2('data2');"><img src="https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/delete.png" width="20" height="20" /></span>
							<span class="ks1" id="ks"><img src="https://cdn2.iconfinder.com/data/icons/3_Minicons-Free-_Pack/46/move.png" width="20" height="20" /></span>
						</div>
						<textarea class="imiona2" name="data" onclick="zmiana('data');" id="data"> 27.05.2014r.</textarea>
					</div>
				
				
					<div id="text2">
						<div class="ikony">
							<span class="delete" onclick="javascript:delete2('text2');"><img src="https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/delete.png" width="20" height="20" /></span>
							<span class="ks1" id="ks"><img src="https://cdn2.iconfinder.com/data/icons/3_Minicons-Free-_Pack/46/move.png" width="20" height="20" /></span>
						</div>
						<textarea name="text" class="text" onclick="zmiana('text');" id="text">Wódka weselna&#10;na stoły podana,&#10;bawmy się wesoło&#10;do białego rana!</textarea>
					</div>
				
					<div id="procent2">
						<div class="ikony">
							<span class="delete" onclick="javascript:delete2('procent2');"><img src="https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/delete.png" width="20" height="20" /></span>
							<span class="ks1" id="ks"><img src="https://cdn2.iconfinder.com/data/icons/3_Minicons-Free-_Pack/46/move.png" width="20" height="20" /></span>
						</div>
						<textarea class="procent" onclick="zmiana('procent');" id="procent">40% vol.</textarea>
					</div>
				<input type="hidden" name="header_style" id="header_style" value="" />
				<input type="hidden" name="procent_style" id="procent_style" value="" />
				<input type="hidden" name="text_style" id="text_style" value="" />
				<input type="hidden" name="data_style" id="data_style" value="" />
				<input type="hidden" name="imiona_style" id="imiona_style" value="" />
			</div>
		<input type="submit" name="submit" value="Generuj" />
		</form>
	</div>
</div>