Fusion Of Thoughts: jquery

Showing posts with label jquery. Show all posts

Thursday, 9 October 2014

Simple Responsive Slider using jquery

Here is a Simple Responsive Slider using jquery which works on every breakpoints. A very simple js/jquery which helps you to modify it according to your requirements.
Download infinite_Image_Carousel-master

Custom linkedin button for share and auth

<script src="http://platform.linkedin.com/in.js">
api_key:
//onLoad: onLinkedInLoad
scope: r_basicprofile r_emailaddress r_fullprofile
authorize:true
</script>
<script>
function onLinkedInAuth() {
IN.API.Profile("me")
.fields("firstName", "lastName", "industry", "location:(name)", "picture-url", "headline", "summary", "num-connections", "public-profile-url", "distance", "positions", "email-address", "educations", "date-of-birth")
.result(displayProfiles);
IN.UI.Share().params({
url: "http://www.example.com"
}).place()
}
function displayProfiles(profiles) {
console.log(profiles);
member = profiles.values[0];
}
jQuery(document).ready(function(){
jQuery("#linkdinlog").click(function(){
IN.UI.Authorize().place();
IN.Event.on(IN, "auth", onLinkedInAuth);
});
});
</script><a href="javascript:void(0)" id="linkdinlog">link</a>

Tuesday, 31 December 2013

update product quantity on check out page magento

you can do it by editing item.phtml (template/checkout/onepage/review/item.phtml) and these lines after line no #47

    <td class="a-center"><?php echo $_item->getQty() ?></td>
        <td class="a-center">
            <input name="cart[<?php echo $_item->getId() ?>][qty]" value="<?php echo $this->getQty() ?>" size="4" name="update_cart_action" id="cup_<?php echo $_item->getId() ?>" class="input-text qty" maxlength="12" />
        </td>
       <td> <button type="submit" name="update_cart_action" value="update_qty" title="<?php echo $this->__('shopping-cart-table'); ?>" id="up_<?php echo $_item->getId() ?>" class="button btn-update"><span><span><?php echo $this->__('Update'); ?></span></span></button><td>

and put Jquery code at the end

    <script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery(".btn-update").click(function(){

            var id = "#c"+this.id;
            var quan = jQuery(id).val();
            var lastChar = id.substr(id.length - 1);

            jQuery.ajax({
                url: "<?php echo Mage::getBaseUrl(); ?>checkout/cart/updatePosts/",
                data: "cart["+lastChar+"][qty]="+quan,
                async: false,
                    success: function(html){

                        location.reload();

                    }
            })
        })
    })
    </script>now override cartcontroller.php and place all the functions of the original cartcontroller.php and rename function updatePostAction by function updatePostsAction.
and change the redirect path to $this->_redirect('checkout/onepage');

Wednesday, 24 April 2013

how to check canvas is empty or not

<canvas id="canvas11″ height=”200px” width=”200px”>
<asp:Button runat=”server” ID=”btn1″ Text=”Save” OnClientClick=”checkcanvas();” />
<script type=”text/javascript”>
function checkcanvas() {
var i = isCanvasTransparent();
//i =true if canvas empty
//i =false if canvas has image
}
function isCanvasTransparent() {
var canvas1 = document.getElementById(‘canvas11′);
// true if all pixels Alpha equals to zero
var ctx = canvas1.getContext(“2d”);
var result;
var imageData = ctx.getImageData(0, 0, canvas1.offsetWidth, canvas1.offsetHeight);
for (var i = 0; i < imageData.data.length; i += 4)
if (imageData.data[i + 3] !== 0) return false;
return true;
}
</script>

countdown timer in php,

$dateFormat = “d F Y — g:i a”;
$targetDate = $futureDate;//Change the 25 to however many minutes you want to countdown change date in strtotime
$actualDate = $date1;
$secondsDiff = $targetDate – $actualDate;
$remainingDay = floor($secondsDiff/60/60/24);
$remainingHour = floor(($secondsDiff-($remainingDay*60*60*24))/60/60);
$remainingMinutes = floor(($secondsDiff-($remainingDay*60*60*24)-($remainingHour*60*60))/60);
$remainingSeconds = floor(($secondsDiff-($remainingDay*60*60*24)-($remainingHour*60*60))-($remainingMinutes*60));
$actualDateDisplay = date($dateFormat,$actualDate);
$targetDateDisplay = date($dateFormat,$targetDate);
<script type=”text/javascript”>
var days = <?php echo $remainingDay; ?>
var hours = <?php echo $remainingHour; ?>
var minutes = <?php echo $remainingMinutes; ?>
var seconds = <?php echo $remainingSeconds; ?>
function setCountDown(statusfun)
{//alert(seconds);
var SD;
if(days >= 0 && minutes >= 0){
var dataReturn = jQuery.ajax({
type: “GET”,
url: “<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB).’index.php/countdowncont/’; ?>”,
async: true,
success: function(data){
var data = data.split(“/”);
day = data[0];
hours = data[1];
minutes = data[2];
seconds = data[3];
}
});
seconds–;
if (seconds < 0){
minutes–;
seconds = 59
}
if (minutes < 0){
hours–;
minutes = 59
}
if (hours < 0){
days–;
hours = 23
}
document.getElementById(“remain”).style.display = “block”;
document.getElementById(“remain”).innerHTML = ” Your Product Reverse For “+minutes+” minutes, “+seconds+” seconds”;
SD=window.setTimeout( “setCountDown()”, 1000 );
}else{
document.getElementById(“remain”).innerHTML = “”;
seconds = “00″; window.clearTimeout(SD);
jQuery.ajax({
type: “GET”,
url: “<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB).’index.php/countdown/’; ?>”,
async: false,
success: function(html){
}
});
document.getElementById(“remain”).innerHTML = “”;
window.location = document.URL; // Add your redirect url
}
}
</script>
<?php
if($date1 < $futureDate && ($qtyCart > 0)){ ?>
<script type=”text/javascript”>
setCountDown();
</script>
<?php }else{ ?>
<style>
#remain{display:none;}
</style>
<?php }}?>
<div id=”remain”></div>

Tuesday, 18 December 2012

how to check canvas is empty or not

<canvas11″ height=”200px” width=”200px”>
<asp:Button runat=”server” ID=”btn1″ Text=”Save” OnClientClick=”checkcanvas();” />
<script type=”text/javascript”>
function checkcanvas() {
var i = isCanvasTransparent();
//i =true if canvas empty
//i =false if canvas has image
}
function isCanvasTransparent() {
var canvas1 = document.getElementById(‘canvas11′);
// true if all pixels Alpha equals to zero
var ctx = canvas1.getContext(“2d”);
var result;
var imageData = ctx.getImageData(0, 0, canvas1.offsetWidth, canvas1.offsetHeight);
for (var i = 0; i < imageData.data.length; i += 4)
if (imageData.data[i + 3] !== 0) return false;
return true;
}
</script>