Base64 to PNG with JS [closed] - javascript

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 8 years ago.
Improve this question
Do you guys know of a method to convert a base64 string to a PNG with javascript. I basically want to display it in a website.
Example string:
"imageData": "iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IB2cksfwAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAC9JREFUOI1jYaAyYKGdgYse/6fIpDhZRlQDqQRGDRw1cNTAUQPpbSC0PKOegVQCADCrA81JwUxoAAAAAElFTkSuQmCC"

You can use document.getElementById() to get the element and set the src to look like this:
<img id="dynImg" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />
for example: this creates a small red dot
document.getElementById("dynImg").src = "data:image/png;base64,iVBORw0K...";
Example:
<img id="dynImg" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />

I'm not you can use AJAX in Javascript library to load image
Use AJAX like below code
$(document).ready(function(e) {
$("#mydiv").load("myfile.php");
});
Use this script file for library jquery-1.9.1.js
Below code did in php. call this in ajax. For getting in base64 image src.
<?php
$path= 'http://harikarank.com/harikarank/harikarank.png';
$type = pathinfo($path, PATHINFO_EXTENSION);
$data = file_get_contents($path);
$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);
?>
<img src="<?php echo $base64;?>" />
Then store the base64 image in your folder using server side script. then call saved path in javascript

Related

any time a negative number on site, color it red [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 5 years ago.
Improve this question
Thinking there's probably some javascript out there that achieves this, but everything I've found thus far seems to be very conditional. I'm trying to figure out something across my entire site that anytime there's a negative number like -30, it's always displayed in red. These values will be scraped data outputs via php. So anytime on my html page, if there's a displayed text value that's a negative, it's turned red, that's what I'm trying to do.
Not sure if this is enough details, but basically that php is outputting data like: -30%. I have a xhtml file referencing many php files scraping and outputting values and numbers. I'm trying to find a way to put some script into my xhtml file that says: if value on this page ANYWHERE is less than 0, color red. Etc
Anyone know of some good examples of this?
My test coding is this:
xml:
<p><font color="grey">All time high</font></p>
<?php include 'ref3.php';?>
<?php include 'alltimenasfullnumber.php';?>
<p><font color="grey">Yearly growth</font></p>
<?php include 'nasyearlygrowth.php';?>
php ref:
<?php
$doc = new DOMDocument;
// foriegn stocks
$doc->preserveWhiteSpace = false;
$doc->strictErrorChecking = false;
$doc->recover = true;
$doc->loadHTMLFile('http://www.money.cnn.com/data/markets/');
$xpath = new DOMXPath($doc);
$query = "//a[#class='world-market']";
$entries = $xpath->query($query);
foreach ($entries as $entry) {
echo trim($entry->textContent); // use `trim` to eliminate spaces
}
?>
I think the best solution is to wrap each result on your xhtml page into a distinctive tag (pre, in my example).
Here there is my code, hope this will help you:
<html>
<head>
<style type="text/css">
.redFont {
color: red;
}
</style>
<script type="text/javascript">
function redText() {
var elements = document.getElementsByTagName('pre')
for(i=0; i< elements.length; i++)
{
if(elements[i].innerHTML < 0) {
elements[i].classList.add('redFont');
};
}
}
</script>
</head>
<body>
<p>
<font color="grey">Yearly growth</font>
</p>
<pre><?php echo 30; ?></pre>
<pre><?php echo -12; ?></pre>
<pre><?php echo 15; ?></pre>
<script>redText();</script>
</body>
Bye,
Laura

Passing parameter with double quotes [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I am trying to pass a variable with caracter ", but there is a problem with " of "Big Bang".
<?php
echo $aux; //Hi! "Text" Text2'Text3
?>
//mysql_real_escape_string($aux);
addslashes($aux); //return Hi! \"Big Bang\" Text\'Text2
<a onclick="share('<?= $aux ?>')">Send</a>
What you should be doing is generating a JavaScript string , so you need to escape for JavaScript (json_encode()) and remove the call to addslashes which is for escaping PHP.
<a onclick='share(<?= json_encode($aux) ?>)'>Send</a>
Note that if you have any HTML entities in your PHP string, such as < they will be decoded by the HTML parser. That was the problem with HTML encoding your quotes, they were being decoded to quotes within a JavaScript quote.
Ideally, you'd separate your concerns to avoid combining 3 languages.
The following example makes the data from PHP available in JavaScript (escape for JavaScript)
<a id='share-link'>Send</a>
<script>
document.getElementById('share-link').addEventListener('click', function() {
var shareContent = <?= json_encode($aux) ?>;
share(shareContent);
});
</script>
Or you could embed the data from PHP into a data attribute (escape for HTML)
<a id="share-link" data-share-content="<?= htmlentities($aux) ?>">Send</a>
<script>
document.getElementById('share-link').addEventListener('click', function() {
share( this.getAttribute("data-share-content") );
});
</script>
You could even go back to your inline script (not recommended)
<a id="share-link"
onclick="share(this.getAttribute('data-share-content'))"
data-share-content="<?= htmlentities($aux) ?>"
>Send</a>

Php variable in script [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I have this code:
<script>
newTextBoxDiv.after().html(<?php echo $do_shortcode('[dropdown]') ?>'<span class="wpcf7-form- control-wrap text-73'+ counter + '"> '+ '<input type="text" name="text-73'+ counter + '" value="" size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false"></span>'+'pocet<br>');
newTextBoxDiv.appendTo("#test");
</script>
After .html( I need get value from php. Could you tell me how to do it?
You have to generate proper Javascript. You're not. What you're doing is the equivalent of:
... .html(some text from php'<span....);
^---no opening quote
^---no closing quote
^--- no + to concatenate
Never EVER directly echo text from PHP to Javascript. Always use json_encode():
... .html(<?php echo json_encode($do_shortcode('[dropdown'])) ?> + '<span ...
Of course, this assumes that whatever function that $do_shortcode is pointing at will return some plain text. Adjust as needed for whatever it DOES return.
1) Make sure that your file is being evaluated as PHP - that is, its a .php file
2) Test to see if echo "aaa" works instead of echo $do_shortcode to see if PHP evaluation is working, but what isn't working is the "do short code" part. That will help you troubleshoot.
3) Use View Source to inspect the output.
Pls dont do thinks link this.
if you already have your data when you running the php scripte, why do you need javascript for rendering?
when you have to do it with javascript or you dont have your data at the point of rendering: use ajax.
Its simply confusing to render javascript with php that generates html.

script to get users image from their login name [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I'm looking for the answer to a question.. that seems really complex.
I'm looking to get a file name from a user that logs in.
For example:
User logs in as 'admin' and the file that comes is /admin.jpg
User logs in as 'john' and the file that comes is /john.jpg
I currently have the script to get the users name, the script is:
<?php echo ''. get_current_user(); ?>
Hope someone can help.. I have looked all over
Jason
Well, if the name is get_current_user() then the image is
$image = "/" . get_current_user() . ".jpg"
You just need to include this in a img tag...
echo '<img src="' . $image . '" alt="Image" />';
You can save the images in a folder (named user_images for example) and than you can take the image of every user like this:
<img src="<?php echo 'user_images/'. get_current_user().'\.jpg'; ?>">

Change image source but then image doesnt appear [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I got this code online and wanted to change the image source from an online picture, to the one i have on my root folder. But everytime i change the file location, image doesnt appear.
var firstreel=new reelslideshow({
wrapperid: "myreel", //ID of blank DIV on page to house Slideshow
dimensions: [1310, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://i30.tinypic.com/531q3n.jpg"], //["image_path", "optional_link", "optional_target"]
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new"],
["http://i30.tinypic.com/531q3n.jpg"],
["http://i31.tinypic.com/119w28m.jpg"] //<--no trailing comma after very last image element!
],
Place it to a folder without spaces in its path or replace the spaces in your path with %20 (url encoded space char)
If the html / js is palced inside your "Project AMBIENT" folder you dont have to use the full path. You can use "./Photos/xyz.ext" or depends on where the files are placed "../Photos/xyz.ext"
You can't use a local file path:
C:\Users\Rizal\Desktop\Project AMBIENT\Photos\b.jpg
you have to use a file that is hosted on a web server:
www.x.com/images/stuff.jpg
try using file:///C:\Users\Rizal\Desktop\Project_AMBIENT\Photos\b.jpg
you will have to properly escape the whitespace in Project Ambient or rename it to Project_AMBIENT or something like that.
File URI scheme
Update
Put the following in a file called "img_form.html" and double click it:
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<form id="target" action="javascript:return false;">
<input type="text" value="http://i30.tinypic.com/531q3n.jpg" />
<input type="submit" value="Go" />
</form>
<br>
<img id="image"/>
<script>
$('#target').submit(function() {
$('#image').attr('src', $("input:first").val());
});
</script>
</body>
Now change the text in the input form to some local url:
Unix:
file:///Users/snies/Pictures/043.jpg
Windows:
file://localhost/c:/some/folder/foo.jpg
file:///c:/some/folder/foo.jpg
and press the button.

Categories

Resources