JavaScript Forum

**Sleeping Troll** · 12:15 PM

This is my script:

Code:

<?php
require_once('xxx');
mysql_select_db(xxx);

$Msg = $_GET["Msg"];
$ClientID = $_COOKIE["Brag_Flag_user"];
//Get Clients Current Project if Exist Else Create Project
$SQL="Select * From Projects where ClientID = '$ClientID' and Status = 'Current'";
$ProjectInfo = mysql_query($SQL);
$Info = mysql_fetch_array($ProjectInfo);
if ($Info['ClientID'] != $ClientID)// Does current project exist?
    {
        $TemplateName = $_GET['TemplateName'];// TemplateName passed from selection on "home" page
        $SQL="Select * From Projects where TemplateName = '$TemplateName' and Status = 'Template'";//Get template data
        $ProjectInfo = mysql_query($SQL);
        $Info = mysql_fetch_array($ProjectInfo);
        $TemplateProjectID = $Info['ProjectID'];
        
        //Create New Project
        $SQL="Insert Into Projects (ClientID, TemplateName, Status) Values ('$ClientID', '$TemplateName', 'Current')";
        mysql_query($SQL);

        //Freshen Project Info
        $SQL="Select * From Projects where ClientID = '$ClientID' and Status = 'Current'";
        $ProjectInfo = mysql_query($SQL);
        $Info = mysql_fetch_array($ProjectInfo);
        $NewProjectID = $Info['ProjectID'];
        
        $SQL="Select * From Templates where TemplateName = '$TemplateName'";
        $TemplateData = mysql_query($SQL);
        $Data = mysql_fetch_array($TemplateData);

        //Copy Template Project Cropped Image to New Project cropped Image
        $Source = "Images/Cropped_Images/$TemplateName.png";
        $Destination = "Images/Cropped_Images/$NewProjectID.png";
        copy($Source,$Destination);
        
        //Copy Template Project Photo to New Project Photo
        $Source = "Images/Project_Photos/$TemplateName.png";
        $Destination = "Images/Project_Photos/$NewProjectID.png";
        copy($Source,$Destination);
        
        //Copy Template Photo Overlay to Project Photo Overlay
        $Source = "Images/Photo_Overlays/$TemplateName.png";
        $Destination = "Images/Photo_Overlays/$NewProjectID.png";
        copy($Source,$Destination);
        
        //Copy Template Preview to Project Preview
        $Source = "Images/Previews/$TemplateName.png";
        $Destination = "Images/Previews/$NewProjectID.png";
        copy($Source,$Destination);

        $SQL = "Select * From ProjectTexts Where ProjectID = '$NewProjectID'";
        //Copy Template Text Overlay to Project Text Overlay
        $Source = "Images/Text_Overlays/$TemplateName.png";
        $Destination = "Images/Text_Overlays/$NewProjectID.png";
        copy($Source,$Destination);

        //Get Text(s) from Template Texts Table, Insert into New Project Texts Table
        $SQL="Select * From ProjectTexts where ProjectID = '$TemplateProjectID' Order by TextID";
        $ProjectTexts = mysql_query($SQL);
        while ($Texts = mysql_fetch_array($ProjectTexts))
            {
                $TextID = $Texts['TextID'];
                $Text = $Texts['Text'];
                $SQL="Insert into ProjectTexts (ProjectID, TextID, Text) Values ('$NewProjectID','$TextID','$Text')";
                mysql_query($SQL);
            }
    }

//Load/Freshen Project Info
$SQL="Select * From Projects where ClientID = '$ClientID' and Status = 'Current'";
$ProjectInfo = mysql_query($SQL);
$Info = mysql_fetch_array($ProjectInfo);
$ProjectID = $Info['ProjectID'];
$TemplateName = $Info['TemplateName'];
$SQL="Select * From Templates where TemplateName = '$TemplateName'";
$TemplateData = mysql_query($SQL);
$Data = mysql_fetch_array($TemplateData);
$Loader = $Data['Loader'];
//Setup Page
if ($Data['Photo'] == "checked")// Does project include photo?
    {

        //Calculate Aspect Ratio
        $SQL="Select * From Photos Where TemplateName = '$TemplateName'";
        $PhotoPos = mysql_query($SQL);
        $Pos = mysql_fetch_array($PhotoPos);
        $IntWidth = $Pos['Width']*100000;
        $IntHeight = $Pos['Height']*100000;
        $divisor = $IntWidth/$IntHeight;
            if ($divisor >=1)
                {
                    $divisor = $IntHeight/$IntWidth;
                }
        $IntWidth = round($IntWidth/$divisor/100000);
        $IntHeight = round($IntHeight/$divisor/100000);

        //Flag Photo Present
        $PhotoPresent = "True";//For later conversion to javascript var
    }


$SQL = "Select * From ProjectTexts Where ProjectID = '$ProjectID'";
        if ($ProjectTexts = mysql_query($SQL))
            {
                $TextsArray = array();
                while ($Texts = mysql_fetch_array($ProjectTexts))
                    {
                        $Text = urldecode($Texts['Text']);
                        array_push($TextsArray,$Text);
                        mysql_query($SQL);
                    }
                $TextPresent = "True";//For later conversion to javascript var
            }
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 
<META HTTP-EQUIV="Expires" CONTENT="-1"> 
<head>
<title>Brag Flags! Current Project</title>
<?php
if ($PhotoPresent == "True")
    {
        echo("
                    <script type='text/javascript' src='scripts/cropper/lib/prototype.js' language='javascript'></script>
                    <script type='text/javascript' src='scripts/cropper/lib/scriptaculous.js?load=builder,dragdrop' language='javascript'></script>
                    <script type='text/javascript' src='scripts/cropper/cropper.js' language='javascript'></script>
                    <script type='text/javascript' src='scripts/PhotoPresent.js' language='javascript'></script>
                ");
    }
if ($TextPresent == "True")
    {
        echo("
                    <script type='text/javascript' src='scripts/TextPresent.js' language='javascript'></script>
                ");
    }
?>
<script type="text/javascript">
<!--
var ProjectID = "<?php echo $ProjectID ?>";
var TextPresent = "<?php echo $TextPresent ?>";
var TextsArray = new Array()
<?php foreach($TextsArray as $ID => $Text){echo "TextsArray[$ID] = \"$Text\";";} ?>
var TextsString = TextsArray.join("~");
var TemplateName = "<?php echo $TemplateName ?>"; 
var PhotoPresent = "<?php echo $PhotoPresent ?>";   
var ProjectPhoto = "Images/Project_Photos/"+TemplateName+".png"
var Width = "<?php echo $Pos['Width'] ?>";
var Height = "<?php echo $Pos['Height'] ?>";
var Divisor = "<?php echo $divisor ?>";
var Ratiox = "<?php echo $IntWidth ?>";
var Ratioy = "<?php echo $IntHeight ?>";
var Loader = "<?php echo $Loader ?>";
var UploadOK;
var CropOverlay = null;
var CropTop;
var CropLeft;
var CropWidth=Width;
var CropHeight=Height;
var Preview = "Images/Previews/"+TemplateName+".png";
function Init(Element)
    {
            try
              {  // Firefox, Opera 8.0+, Safari
                  xmlHttp=new XMLHttpRequest();
              }
                    catch (e)
                      {  // Internet Explorer
                          try
                            {
                                  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
                            }
                                      catch (e)
                                    {
                                             try
                                          {
                                              xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                                          }
                                                catch (e)
                                                  {
                                                      alert("Your browser does not support AJAX!");
                                                          }
                                        }
                      }
        return;
    }
    
function PageInit()
    {
        alert("PageInit")
        if (TextPresent == "True")
            {
                document.getElementById('texts').style.visibility = "visible";
            }
                    
        if (PhotoPresent == "True")
            {
                document.getElementById("Prompt").innerHTML = "<div align='center'><input type='button' name='Crop' id='Crop' value='Crop on' onclick = 'AttachCrop()'/></div>";
                document.getElementById('EditImage').src = ProjectPhoto;
                document.getElementById('Prompt').style.visibility = 'visible';
            }
        TxttoImg();
        document.getElementById("PreviewImage").src = Preview;
        return;
    }
    
function PageRefresh()
    {
        if (TextPresent == "True")
            {
                document.getElementById('texts').style.visibility = "visible";
            }
                    
        if (PhotoPresent == "True")
            {
                document.getElementById("testwrapheading").innerHTML = "<div align='center' id = 'testwrapheading' name = 'testwrapheading' class = 'style1'>Updating Image<br>&nbsp;</div>";
                document.getElementById("testwrapheading").innerHTML = "<div align='center' id = 'testwrapheading' name = 'testwrapheading' class = 'style1'>Uploaded Image<br>&nbsp;</div>";
                document.getElementById("Prompt").innerHTML = "<div align='center'><input type='button' name='Crop' id='Crop' value='Crop on' onclick = 'AttachCrop()'/></div>";
                document.getElementById('Prompt').style.visibility = 'visible';
                document.getElementById('EditImage').src = ProjectPhoto;
            }
    TxttoImg();
    document.getElementById("PreviewImage").src = Preview;
    return;
    }

function Delete()
    {
        var Check = confirm("Are you sure you wish to Delete the current Flag?");
        if (Check == true)
            { 
                Init();
                ReqStr = "Delete.php";
                xmlHttp.open("Get",ReqStr,false);
                xmlHttp.send(null);
                window.location = "index.php";
            }
        return;
    }
    
function Save()
    {
            {
                Init();
                ReqStr = "Save.php";
                xmlHttp.open("Get",ReqStr,false);
                xmlHttp.send(null);
                window.location = "index.php";
            }
        return;
    }

function AddtoCart()
    {
            {
                Init();
                ReqStr = "AddtoCart.php";
                xmlHttp.open("Get",ReqStr,false);
                xmlHttp.send(null);
                window.location = "Cart.php";
            }
        return;
    }

function Error(Err)
    {
        alert(Err + " Please try again.");
        stopUpload(".."+ProjectPhoto,300,300);
        document.getElementById('testwrap').innerHTML = "<img src='"+ProjectPhoto+"' width='300' alt='Edit image' title='Edit image' name='EditImage' id='EditImage'>";
        return;
    }
-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link href="BragFlags.css" rel="stylesheet" type="text/css" />
</head>
<body onload= PageInit()>
<table width="100%" border="0">
    <tr>
        <!-- Bumper -->
        <td>&nbsp;</td>
        <!-- Bumper -->
        <!-- Login Panel Start -->
        <td width="90" align = "center" nowrap id = "Message">
            <div class = "style1"> <?php echo $Msg ?>
                    <div class = "style2"> 
                            <a href = "#" onclick = "Save()">Save Flag</a><br />
                            <a href = "#" onclick = "Delete()">Delete Flag</a><br />
                            <a href = "#" onclick = "AddtoCart()">Add to Cart</a><br />
                    </div>
            </div></td>
        <!-- Login Panel End -->
        <!-- Bumper -->
        <td width="1">&nbsp;</td>
        <!-- Bumper -->
        <!-- Banner Panel Start -->
        <td id = "Banner" align="center" height="120"><div><img src="Images/Bnnr.png" alt="Brag Flags Designer" title="Brag Flags Designer"/></div></td>
        <!-- Banner Panel End -->
        <!-- Bumper -->
        <td>&nbsp;</td>
        <!-- Bumper -->
        <!-- Navigation Panel Start -->
        <td width="90" align="center" valign="middle" nowrap id = "Navigation">
            <div class="style2"><a href = "FAQ.php">FAQ</a><br />
                            <a href = "Contact.php">Contact Us</a><br />
                            <a href = "About.php">About us</a><br />
                            <a href = "Cart.php">My Cart</a><br />
            </div></td>
        <!-- Navigation Panel End -->
        <!-- Bumper -->
        <td>&nbsp;</td>
        <!-- Bumper -->
    </tr>
</table>
<table width="100%">    
    <tr>

                                        <!-- Left Panel Start -->
<?php
if ($TextPresent == "True")
    {
        $ID = '0';
        echo("
                    <td width='50%' height='60' align='center' valign='top' id = 'Left_Panel'>
                        <div id='texts' style='visibility:hidden' name='texts' align='center' class = 'style2'>
                        <div class = 'style1'>Edit Text</div>
                        <form id = 'Texts' name = 'Texts'>
                ");
                    //Get Texts Info
                    foreach($TextsArray as $ID => $Text)
                        {
                            $DecodedText = urldecode($Text);
                            echo("    
                                        <input type='text' class = 'TextBox' id= '$ID' name= '$ID' value ='$DecodedText' onKeyup ='SetText(this.id,encodeURIComponent(this.value))'/>
                                    ");
                        }
        echo("
                        <div>
                        <input name='UpdateText' type='button' id='UpdateText' value='Update' onClick = 'TxttoImg();'>
                        </div>
                        </form>
                        </div>
                    </td>
                ");
    }
?>        
                                        <!-- Left Panel End -->
                                        <!-- Right Panel Start -->
        <td width="50%" height="610" rowspan="4" align="right" valign="top" id = 'Right_Panel'>
<?php
        echo("
            <div align='center' id='PreviewWrap' name='PreviewWrap'><img src='' alt='Preview image' title='Preview image' width='400' id='PreviewImage'>
                ");
?>        
            </div>
        </td>
        <!-- Right Panel End -->    
    </tr>
<?php
if ($PhotoPresent == "True")
    {
        echo("
                    <tr>
                        <td id='UploadedImage' name='UploadedImage' width='50%' align='center' valign='middle' nowrap>
                            <div align='center' id = 'testwrapheading' name = 'testwrapheading' class = 'style1'>Select an Image to upload<br>&nbsp;</div>
                            <div id='testwrap'>
                                <img src='' width='300' alt='Edit image' title='Edit image' id='EditImage' name='EditImage'/>
                            </div>
                            <div id='Prompt' name='Prompt' style='visibility:visible'></div>
                        </td>
                    </tr>
                    <tr>
                        <td align='center' valign='middle' nowrap></td>
                    </tr>
                    <tr>
                        <td width='50%' height='60' align='center' valign='bottom' nowrap>
                            <form id='UploadData' name = 'UploadData' action='Uploader.php' method='post' enctype='multipart/form-data' target='upload_target' >
                                <div id='f1_upload_form' align='center'>
                                <div>
                                    <input type='hidden' name='MAX_FILE_SIZE' value='5000000' />
                                    <input name='UploadFile' type='file' accept='image/*' size=0 onChange = 'StartUpload(this.value)'/>
                                </div>
                                </div>
                            </form>
                        </td>
                    </tr>
                ");
        }
?>
</table>
<iframe border= "0" id = "upload_target" name = "upload_target" width = "0" Height = "0"></iframe>
</body>
</html>

My javascript includes (in red)(cropper ui) is throwing a "draggable is not defined" error, this script was working and now is not. I have tried relocating scripts to no avail, please help.

Url is http://www.bragflags.bravehost.com select "Xmas" template
This is the line in cropper.js which throws error:

Code:

Object.extend(Object.extend(CropDraggable.prototype,Draggable.prototype),{initialize:function(_1){
this.options=Object.extend({drawMethod:function(){
}},arguments[1]||{});

**chrishirst** · 01-25-2009, 12:33 PM

and Draggable is defined where exactly?

or maybe it should be Draggables.register(this);

**Sleeping Troll** · 02:10 PM

It is defined in this snippet from prototype library:

Code:

var Draggables = {
  drags: [],
  observers: [],

  register: function(draggable) {
    if(this.drags.length == 0) {
      this.eventMouseUp   = this.endDrag.bindAsEventListener(this);
      this.eventMouseMove = this.updateDrag.bindAsEventListener(this);
      this.eventKeypress  = this.keyPress.bindAsEventListener(this);

      Event.observe(document, "mouseup", this.eventMouseUp);
      Event.observe(document, "mousemove", this.eventMouseMove);
      Event.observe(document, "keypress", this.eventKeypress);
    }
    this.drags.push(draggable);
  },

Did I mention that this was working fine and then *poof*

**chrishirst** · 01-25-2009, 03:39 PM

Ok
that's Draggables and draggable taken care of;

So where is Draggable (with a capital D and no "s") ?

**Sleeping Troll** · 05:44 PM

It would appear you are correct and I will give it a try, however this is cut and paste code, I have not edited it and it was working previously! I have been seeing some really strange things occur with hosts. for example scripts reverting to earlier versions! Have you had any like experiences recently?

Capital "D" is the way it is in original files, I am so totally lost!

**alexbirkett** · 01-21-2010, 03:52 PM

Line 225 of version 1.8.3 dragdrop.js?