Monday 31 August 2020

Sorting Json value using Javascript / jQuery

Sort by updated date

<script>

var data = "[

  {

    "_id": "5efd566ab3e22f002484bbb0",

    "first_name": "Jaydip",

    "last_name": "Kansagra",

    "rate": "0",

    "createdAt": "2020-07-02T03:37:14.808Z",

    "updatedAt": "2020-07-02T03:37:14.808Z"

  },

  {

    "_id": "5f16d3933fdf4a0024b7a2f8",

    "first_name": "Jaydip",

    "last_name": "Kansagra",

    "rate": "5",

    "createdAt": "2020-07-21T11:37:55.310Z",

    "updatedAt": "2020-07-21T11:37:55.310Z"

  },

  {

    "_id": "5f3bc286436d850024a2b574",

    "first_name": "Jaydip",

    "last_name": "Kansagra",

    "rate": "3",

    "createdAt": "2020-08-18T11:59:02.825Z",

    "updatedAt": "2020-08-18T11:59:02.825Z"

  }

]";

theme.blend_Obj = data;

theme.blend_Obj.sort((a, b) => (a.updatedAt > b.updatedAt) ? 1 : -1)

</script>

==================================

Sort by Rate (integer value)

<script>

topRates = [...theme.blend_Obj]

topRates.sort((a, b) => (parseInt(a.rate) < parseInt(b.rate)) ? 1 : -1);


</script>

Thursday 4 June 2020

How to convert a multidimensional Array To XML in PHP

function createxmlele($data, $name='root', &$doc=null, &$node=null){
        if ($doc==null){
            $doc = new DOMDocument('1.0','UTF-8');
            $doc->formatOutput = TRUE;
            $node = $doc;
        }

        if (is_array($data)){
            foreach($data as $var=>$val){
                if (is_numeric($var)){
                    $this->createxmlele($val, $name, $doc, $node);
                }else{
                    if (!isset($child)){
                        $child = $doc->createElement($name);
                        $node->appendChild($child);
                    }

                    $this->createxmlele($val, $var, $doc, $child);
                }
            }
        }else{
            $child = $doc->createElement($name);
            $node->appendChild($child);
            $textNode = $doc->createTextNode($data);
            $child->appendChild($textNode);
        }

        if ($doc==$node){
            return $doc;
        }
    }

Monday 16 March 2020

How to show #(hash) link when sticky header using HTML CSS

Link
<a href="#FlavoredToothpicks">Jaydip Kansagra is developer</a>
HTML
<span class="anchor" id="FlavoredToothpicks"></span><h3 class="subsection-title">Jaydip Kansagra is developer</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
CSS
.anchor {
    display: block;
    height: 100px;
    margin-top: -100px;
    visibility: hidden;
}

Tuesday 28 January 2020

Color swaches using metafiled in shopify

{% if swatch == 'Color' %}
    {%- if product.metafields.coloroptions != blank -%}
             
              {%- for field in product.metafields.coloroptions -%}
              <div data-value="{{ field | first | escape }}" class="swatch-element color {{ field | first | escape }} available">
                <div class="tooltip">{{ field | first | escape }}</div>
                    <a href="/products/{{ field | last }}">
                      {% assign phandle = field | last %}
                      {% assign additionaproduct = all_products[phandle] %}
                      {% assign getimage = 0 %}
                      {% assign additionalcolorimg = '' %}
                      {% assign multiimgs = additionaproduct.images | reverse %}
                      {% for image in multiimgs %} ​
                      {% if getimage == 0 %}
                      {% assign additionalcolorimg = image.src | img_url: 'small' %}
                      {% endif %}
                      {% endfor %}
                      <label for="section-product-template-swatch-0-{{ field | first | handle }}" style="background-color: {{ field | first | handle }}; background-image: url({{ additionalcolorimg }})"></label>
                    </a>
              </div>
              {%- endfor -%}
             
            {%- endif -%}
    {% endif %}

Tuesday 17 December 2019

Create simple tooltip html css

Preview



HTML
<span class="tooltipans" data-tooltip='All your leads will be saved to your Customers tab with a "My Sticky Elements" tag so you can easily find them'>?</span>
CSS

<style>
.tooltipans{
    position: relative;
    background: rgba(0,0,0,0.7);
    padding: 2px 7px;
    border-radius: 100%;
    font-size: 12px;
    cursor: help;
    color: #FFF;
}
.tooltipans::before, .tooltipans::after{
    position: absolute;
    left: 50%;
    opacity: 0;
    transition: allease0.3s;
}
.tooltipans::before{
    content: "";
    border-width: 10px 8px 08px;
    border-style: solid;
    border-color: rgba(0,0,0,0.3) transparent transparent transparent;
    top: -10px;
    margin-left: -8px;
}
.tooltipans::after{
    content: attr(data-tooltip);
    background: rgba(0,0,0,0.7);
    top: -10px;
    transform: translateY(-100%);
    font-size: 14px;
    margin-left: -150px;
    width: 300px;
    border-radius: 10px;
    color: #fff;
    padding: 14px;
}
.tooltipans:hover::before, .tooltipans:hover::after{
    opacity: 1;
}
</style>

Saturday 23 November 2019

How to add/update multiple products in cart in shopify

jQuery(function () {
   
jQuery('body').find(".couponproduct .gf_add-to-cart").click(function (e) {
e.preventDefault();
values = {}
                values[30370850865245] = 0;
                values[31289364840541] = 1;
                jQuery.ajax({
                      type: 'POST',
                      url: '/cart/update.js',
                      data: { updates: values},
                      dataType: 'json',
                      success: function() {
                        location.href = '/checkout';
                     }
               });
});
   
});