Destramic

November 18, 2015

Wasn't changing cover values on mine....I'll have another play when I'm back home...thanks for your reply, I'll let you know how it goes

November 17, 2015

hey guys i've tried to run this query on my database but it only partially works...the images paths will change but the values for cover won't budge $:-\$

table

---------------------

item_id

path - varchar

cover - int(1)

--------------------

cover will be 1 or 0 depending if the image is the main image.

i can see anything i'm doing wrong here...can someone please shine some light on why both path and cover values are not swapping.

here is my sql:

UPDATE item_images im1, item_images im2 
SET im1.cover = im2.cover, 
    im2.cover = im1.cover, 
    im1.path = im2.path, 
    im2.path = im1.path
WHERE im1.item_id = im2.item_id
AND im1.path = '1447700522.jpg'
AND im2.path = '1447700481.jpg'
AND im1.item_id = 58

thank you

November 17, 2015

ok brillaint...if you're saying that seems fine then i'm happy...thanks for your reply and sorry for the delay

:happy-04:

November 11, 2015

hey guys i'm half way through making a upload script for my site which consists of js and php...but i'm a little concerned about its functionality and how the best way it should work.

here is a screenshot of how it looks when a user will click and upload a picture

i used a XMLHttpRequest which moves the image from a temporary directory and uploads to my selected directory...happy days!

now i give the user a option to edit image where they can rotate and crop the image (server side)

this is where i need help on the scripts functionality please.

now when a user uploads a picture it saves onto my server directory...depending on how big the image is it can sometimes take 45 seconds for a 4/5 meg picture to upload which causes problem with the users experience (i think) because...of time...the only way i can see the user editing a image is when it's 100% uploaded and not before....cause if they try to edit before the upload is complete i'm unable to select the image to crop and rotate server side as it wont be uploaded yet.

it all just seems like a long process waiting and i'm a bit stuck on what is best to do here.

do i continue to allow editing on a image, when its 100% uploaded or is there a better way?

i hope my problem is clear enough...also if you'd like to see any code please let me know.

thank you

November 1, 2015

changing this in my nginx config sorted it

client_max_body_size 	500M;

works great now...but is this the correct debug info i should be getting? as it spits out xhr.onload twice

99% uploaded 
100% uploaded
200
Server got:  
100% uploaded
done
200 
Server got: uploaded

js:

	 function upload_image(image, name){
		  var data = new FormData();
		      xhr  = new XMLHttpRequest();
		      
		  data.append('image', image);
		  data.append('name', name);
		  data.append('item_id', 2);
		  xhr.open('POST', 'save.php', true);
		  
		  xhr.upload.onprogress = function(e) {
		    if (e.lengthComputable) {
		    	var percentage = Math.round((e.loaded * 100) / e.total);
		      console.log(percentage + '% uploaded');
		    }
		  }
		  
		  xhr.onreadystatechange = function() {
			  if(xhr.readyState == 4 && xhr.status == 200) {
			  console.log("done");
			  }
			}
		  
		  xhr.onload = function() {
			  console.log(this.status);
		    if (this.status === 200) {
		      var response =  this.response
		      console.log('Server got:', response);
		    }
		  }
		  
		  xhr.send(data);
	 }

thank you

November 1, 2015

well i'm using my localhost at the moment...running nginx...so there should be no reason why 413 error should come up =/

November 1, 2015

ok well i did what you said and it came back with

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help http://xhr.spec.whatwg.org/ 
413

still 413 error...still working fine on smaller image size

thanks for your post

November 1, 2015

hey guys im running a XML HTTP request and i'm getting the error 413 - ie. image too large. I know its js i'm executing but i think its a php problem so i changed some settings in my php.ini

post_max_size = 10M
upload_max_filesize = 10M

here is the js i'm using

	 function upload_image(image){
		  var data = new FormData();
		      xhr  = new XMLHttpRequest();
		      
		  data.append('image', image);
		  xhr.open('POST', 'save.php', true);
		  
		  xhr.upload.onprogress = function(e) {
		    if (e.lengthComputable) {
		      var percentComplete = (e.loaded / e.total) * 100;
		      console.log(percentComplete + '% uploaded');
		    }
		  }
		  
		  xhr.onload = function() {
			  console.log(this.status);
		    if (this.status === 200) {
		      var response =  this.response
		      console.log('Server got:', response);
		    }
		  }
		  
		  xhr.send(data);
	 }

it works with smaller images but when trying to upload a 4.4 mb image i get the error 413...now i'm a little confused on how i'm getting this error as i've changed my post and upload max sizes

is there something obvious i'm missing here please?

thank you

October 23, 2015

brilliant..thanks for the help Jacques!

$base = "data:image/gif;base64,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";

function is_image_string($image)
{
    $image = preg_replace('#data:image/[^;]+;base64,#', '', $image);
    
    if (@imagecreatefromstring(base64_decode($image)))
    {
        return true;
    }
    else
    {
        return false;
    }
}

if (is_image_string($base))
{
    echo 'yeah!';
}

October 23, 2015

i'm just trying to test to see if image is base64 but i'm getting an error:

Warning: imagecreatefromstring(): Empty string or invalid image in ...

now i know the image exists cause i found it here: http://jsfiddle.net/casiano/xadvz/

what am i doing wrong here please guys?...also is this the best method to test if a image string?

$base = "data:image/gif;base64,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";

function is_base64_image($image)
{
    if (@imagecreatefromstring(base64_decode($image)))
    {
        return true;
    }
    else
    {
        return false;
    }
}

if (is_base64_image($base))
{
    echo 'yeah!';
}

thank you

October 21, 2015

Hey guys just wanted to post the cropping function i made.

which goes well with something like this: http://jsfiddle.net/...ramic/ybq2mab5/

if the image you are cropping is smaller/bigger or same size as orginal it will return crop exact for orginal image...works with x y co-ordinates too...hope it can help someone as much as it's helped me

thanks for your help guys!

function crop($image_source, $selected_x, $selected_y, $selected_x2, $selected_y2, $image_x = null, $image_y = null, $image_x2 = null, $image_y2 = null)
{
    list($orginal_x2, $orginal_y2) = getimagesize($image_source);
    
    if (!is_null($image_x))
    {
        if (is_null($image_x2) || $image_x2 === $orginal_x2)
        {
            $selected_x -= $image_x;
        }
        else if ($image_x2 > $orginal_x2)
        {
            $difference        = (($image_x2 - $orginal_x2) / $image_x2 * 100);
            $image_difference  = $image_x * ((100 - $difference) / 100);
            $select_difference = $selected_x * ((100 - $difference) / 100);
            
            $selected_x = ($select_difference - $image_difference);
        }
        else if ($image_x2 < $orginal_x2)
        {
            $difference        = ($orginal_x2 / $image_x2);
            $image_difference  = $image_x * $difference;
            $select_difference = $selected_x * $difference; 
            
            $selected_x = ($select_difference - $image_difference);
        }
    }
    
    if (!is_null($image_y))
    {
        if (is_null($image_y2) || $image_y2 === $orginal_y2)
        {
            $selected_y -= $image_y;
        }
        else if ($image_y2 > $orginal_y2)
        {
            $difference        = (($image_y2 - $orginal_y2) / $image_y2 * 100);
            $image_difference  = $image_y * ((100 - $difference) / 100);
            $select_difference = $selected_y * ((100 - $difference) / 100);
            
            $selected_y = ($select_difference - $image_difference);
        }
        else if ($image_y2 < $orginal_y2)
        {
            $difference        = ($orginal_y2 / $image_y2);
            $image_difference  = $image_y * $difference;
            $select_difference = $selected_y * $difference; 
            
            $selected_y = ($select_difference - $image_difference);
        }
    }

    if (!is_null($image_x2))
    {
        if ($image_x2 > $orginal_x2)
        {
             $width_difference = (($image_x2 - $orginal_x2) / $image_x2 * 100);
             $selected_x2     *= ((100 - $width_difference) / 100);
        }
        else if ($image_x2 < $orginal_x2)
        {
            $width_difference = (($orginal_x2 - $image_x2) / $image_x2 * 100);
            $selected_x2     *= (1 + $width_difference / 100);
        }
        else 
        {
            $width_difference = 100 - (($image_x2 - $selected_x2) / $image_x2 * 100);
            $selected_x2      = $width_difference / 100 * $orginal_x2;
        }
    }
    
    if (!is_null($image_y2))
    {
        if ($image_y2 > $orginal_y2)
        {
             $height_difference = (($image_y2 - $orginal_y2) / $image_y2 * 100);
             $selected_y2      *= ((100 - $height_difference) / 100);
        }
        else if ($image_y2 < $orginal_y2)
        {
            $height_difference = (($orginal_y2 - $image_y2) / $image_y2 * 100);
            $selected_y2      *= (1 + $height_difference / 100);
        }
        else
        {
            $height_difference = 100 - (($image_y2 - $selected_y2) / $image_y2 * 100);
            $selected_y2       = $height_difference / 100 * $orginal_y2;
        }
    }

    $image        = imagecreatetruecolor($selected_x2, $selected_y2);
    $image_source = imagecreatefrompng($image_source);

    imagecopyresized($image, $image_source, 0, 0, $selected_x, $selected_y, $selected_x2, $selected_y2, $selected_x2, $selected_y2);
    imagepng($image, 'percentage.png');
    
    imagedestroy($image);
    imagedestroy($image_source);
}

crop('image.png', 302, 1008, 525, 445, 23, 20, 2000, 1600);

October 19, 2015

I think the ingredient your missing is something like Jcrop. You just drag over the image for the coordinates. There are many, many sources for this kind of functionality. Many options for cropping the image. Simple to use. Why re-invent the wheel?

http://deepliquid.com/projects/Jcrop/demos.php

thanks but i've made my own cropper (with help from scootstah) as seen here: http://jsfiddle.net/destramic/ybq2mab5/

barand thank you for help...worked perfectly ....sorry for such a late reply

also using the following worked great to get selected part of image.

var selected = $('whatever'),
    offset      = selected.position(),
    selected_x  = offset.left, 
    selected_y  = offset.top,
    selected_x2 = selected.width(),
    selected_y2 = selected.height();

i will try and post my code to help future developers when i'm done (hopefully in the next couple of weeks)

thanks guys!!!!

October 16, 2015

Is this what you are trying to achieve?

yes thank you ...seems i was no where close to what i wanted haha...i'm bit confused on your x, y positions barand...obviously mine must be wrong but how are you getting yours please?

i'd like to get by JavaScript if possible

thanks for your help!

October 16, 2015

hey guys i'm trying to crop a certain part of a image using imagecopyresized...i'm using js to get the coordinates of the image and the selected area that i'm after

here is how i get the co-ordinates:

var offset = image.position(),
             image_x  = offset.left,
             image_y  = offset.top,
             image_x2 = selected.width(),
             image_y2 = selected.height(),
            
             offset      = selected.position(),
             selected_x  = offset.left,
             selected_y  = offset.top,
             selected_x2 = selected.width(),
             selected_y2 = selected.height();

co-ordinates

image
-----------------
x = 8  
y = 8

selected area
-----------------
x = 172  
y = 75 
x2 = 327 
y2 = 292

i'm then using this function to try and get just the selected area as a image but it's not outputting correctley

function crop($image, $selected_x = 0, $selected_y = 0, $image_x = 0, $image_y = 0, $selected_width = null, $selected_height = null)
{
    list($width, $height) = getimagesize($image);

    $thumbnail    = imagecreatetruecolor($width, $height);
    $image_source = imagecreatefromjpeg($image);

    imagecopyresized($thumbnail, $image_source, $selected_x, $selected_y, $image_x, $image_y, $selected_width, $selected_height, $width, $height);
    imagejpeg($thumbnail, "image-cropped.jpg", 100);
}

crop('image.jpg', 172, 75, 8, 8, 327, 292);

image output:

is it possible to get the selected image in the blue grid saved as a image please?

any help on what i'm doing wrong would be great..please let me know if you need more info

thank you

October 11, 2015

ouch!...now that is bad boy!

thank you :happy-04:

October 11, 2015

brilliant stuff, just what i need

thanks all

:suicide:

October 11, 2015

Ops sorry...i thought when testing before putting window location in it was working.

Just think it looks ugly being in the handlers...but doesn't look like I have much of a choice...thank you for your patience guys

October 10, 2015

yeah sorry...

ok well i think something like this would work a lot better

$(document).ready(function(){
    function socket_open(port, https){    
        var location = window.location,
            host     = location.hostname,
            protocol = "http";
            
        if (https){
            protocol = "https";
        }
        
        var url = protocol + '://' + host + ':' + port;
        console.log(url);

        $.ajax({
            'url' : url,
            'success' : function() {
                  return true;
            },
            'error' : function() {
                return false;
                }
          });
    }
    
    if (socket_open(8080)){
        console.log("successful");
    }
    else{
        console.log('error');
    }
});

just one problem with this though the url has apostrophes around it causing the function to always return false.

i tied to replace apostrophes in var url but still didnt work

like i said i just want a script like this just in case the socket goes down, that way i can show something like page temporary down / redirect

thanks guys

October 10, 2015

the only problem i can see with it really is the span containing the + doesn't align centre or vertically middle.

once i have the cropper and upload working correctly i'll put a link up for you to see

October 9, 2015

The ready state changes more than once during the lifetime of the connection. That's why there is a .readyState value you can look at.

Only make a decision regarding connected/not connected when readyState is 4, which corresponds to the request having completed.

sorry requinix im not sure if what i'm trying to do is not possible of i'm doing something wrong here:

$(document).ready(function(){
	function web_socket_open(){
		var xhr = new XMLHttpRequest();

		xhr.onreadystatechange = function() {
		    if (xhr.readyState === 4) {
		        if (xhr.status === 200){
		            console.log('yes'); // returns 
			    	  return true;
		        }

		        return false;
		    }
		}

		xhr.open('GET', 'http://127.0.0.1:8080', true);
		xhr.send(null);
	}

	if (web_socket_open()){
		   console.log('yes');
		}
	else
	{
		console.log('no');
	}
});

when executing the web_socket_open function it returns no (returning false in if statement)...then in console log it shows yes during the http request, which comes from the function itself..

ideally i would like it just to return true as it should do? as url is correct

thanks for your help.

October 8, 2015

brilliant thank you...looks top notch now:

http://jsfiddle.net/destramic/ztdpou8w/

October 8, 2015

i'll be happy to pay for someone to get it to how i want...pm me if interested

thank you

October 8, 2015

can anyone please help me on how to display this ul as 3 rows please?

to look like this:

___________________

|_____|______|______|

thank you

October 8, 2015

sorry i haven't been around to test and get back to you

i've tried running this code...which returns not connected twice before returning connected...how can i get it just to return one or the other please?

	var xhr = new XMLHttpRequest();

	
	xhr.open('GET', 'http://127.0.0.1:8080', true);
	xhr.send(null);
	
	xhr.onreadystatechange = function() {
	    if (xhr.readyState === 4  && xhr.status === 200) {
		        console.log('connected')
	    }
	    else
	    {
	    	 console.log('not connected')
	    }
	}

thank you

October 4, 2015

never heard of websocket class looked at it...but not sure what to do to be honest.

AJAX is asynchronous - it does not happen linearly with the rest of your code. web_socket_open() will finish executing immediately and then eventually sometime later the onreadystatechange function will fire. Nevermind that the return will only return from that anonymous function and not web_socket_open().
function web_socket_open(href){
	var request = new XMLHttpRequest(href);
	    
	request.onreadystatechange = function() { 
		if (request.readyState === 4 && request.status === 200) {
			console.log(true);
		}

		console.log(false);
	}  
}

web_socket_open('http://127.0.0.1:8080');
And notice that if everything is good you'll see a true and false output.

ideally i would like to know if the socket was down...that way i can display page not available or something (fingers crossed that doesn't happen)...but just a precaution.

is there a better way to do this please?...i ran script and waited ages with no console log

thank you

Sign In

Destramic

Posts

Joined

Last visited

Content Type

Profiles

Forums

Posts posted by Destramic

swap column values

swap column values

dynamic upload functionality help

dynamic upload functionality help

XMLHttpRequest 413 error

XMLHttpRequest 413 error

XMLHttpRequest 413 error

XMLHttpRequest 413 error

imagecreatefromstring how?

imagecreatefromstring how?

cropping a part of an image

cropping a part of an image

cropping a part of an image

cropping a part of an image

image cropper grid

xml http request

xml http request

xml http request

image cropper grid

xml http request

image cropper grid

image cropper grid

image cropper grid

xml http request

xml http request

Browse

Activity

Important Information