Skip to main content

Tsoft V5 Snippets

T-Soft v5 tema kodlarken kullanabileceğiniz snippet'ler

Javascript, smarty (.tpl) ve scss snippet'lerine bu eklenti ile kolaylıkla sahip olursunuz.

Amacı tsoft.com.tr ve tsoftecommerce.com ön uç geliştiricilerine yardımcı olmaktır.

Kurulum#

tsoft-v5-snippet - install

Tavsiyeler#


  • .tpl dosyalarında daha iyi bir sözdizimi vurgulaması için Smarty Template Support önceden kurmanız önerilir.

  • Emmet Kısaltmaları için aşağıdakileri settings.json dosyanıza yapıştırabilirsiniz (F1'e basın, ardından Open Settings (JSON)'u arayın)
F1 + > Open Setting (JSON)
"emmet.includeLanguages": {
"smarty": "html"
}

== veya ayar giriş alanına includeLanguages yazabilir ve item => "smarty" ve value =>"html" ekleyebilirsiniz.


Setting

Nasıl Görünüyor?#

JavaScript#

JavaScript

Smarty#

Smarty

SCSS#

SCSS

Snippet Örnekleri#

JAVASCRIPT V5T-Soft V5 için Javascript kod parçacıkları.

JavaScript Snippets#

cl ⇥#

console.log();

cv ⇥#

console.log('variable',variable);

ael ⇥#

selector.addEventListener("click",e=>{
console.log(e)
});

docready ⇥#

document.addEventListener("DOMContentLoaded",e=>{
console.log(e)
});

vuecreateapp ⇥#

Vue.createApp(appName).mount('#appSelector');

vuescript ⇥#

window['appName'] = {
data() {
return {
P:``,
}
},
}
Vue.creatApp(appName).mount(`#app-selector`);

tsubmitform ⇥#

T(`#selector`).on('submit', e => {
e.stopPropagation();
e.preventDefault();
const formEl = e.target;
if(!T.checkValidity(formEl))
return;
var data = new FormData(formEl);
axios.post('/srv/service/servicepath', data).then(response => {
const result = response.data;
console.log('result:', result);
formEl.reset();
T.notify({
text:"element",
className: 'success',
duration: 3200
});
});
});

newswiper ⇥#

new Swiper(selector, {
slidesPerView: 2,
spaceBetween: T.isMobile() ? 8 : 15,
navigation: {
nextEl: `#swiper-next-${BLOCK.ID}`,
prevEl:`#swiper-prev-${BLOCK.ID}`,
},
pagination: {
el: '.swiper-pagination',
clickable: true
},
breakpoints: {
576: {
slidesPerView: 3
},
768: {
slidesPerView: 4
}
}
});

axiosget ⇥#

axios.get("url").then((res)=> {
console.log(res.data);
})
.catch((error)=> {
console.log(error);
})

axiospost ⇥#

axios.post("url", formData).then((res)=> {
console.log(res.data);
})
.catch((error)=> {
console.log(error);
})

fetchget ⇥#

fetch("users.json").then(res=> res.json())
.then(data=> {
data.forEach(el => {
console.log(el);
});
})
.catch(err => console.log(err))

tcartcallback ⇥#

Cart.callback.add.push((res)=>{
console.log(res)
})

tready ⇥#

T.ready(function(){
})

tisEmptyObject ⇥#

T.isEmptyObject(obj)

teach ⇥#

T.each(T(`div`),(i, el)=>{
console.log(i, el);
});

tsetCookie ⇥#

T.setCookie(cookieName, cookieValue, exdays)

tgetCookie ⇥#

T.getCookie(cookieName)

tblock ⇥ BLOCK#

BLOCK.

tsetting ⇥ SETTING#

SETTING.

timage ⇥ IMAGE#

IMAGE.

tgetlink ⇥#

T.getLink(`param`,'value','link');

tpopshow ⇥#

popoverAlert.show(
T(`selector`)[0], msg, false, `btn btn-danger text-left`, true, `inline`
);

tpophide ⇥#

popoverAlert.hide(item, [`btn`, `btn-outline-danger`, `text-left`]);

tpophideall ⇥#

popoverAlert.hideAll();

tloadSubFolder ⇥#

loadSubFolder({
pageId: 1,
blockParentId: 1000,
subFolder: 'subfoldername',
params: { oneparam: oneparam, twoparam: twoparam },
success: function(loadRes){
T.modal({ html: loadRes, width:'480px' });
evalScripts(loadRes)
}
});

tisMobile ⇥#

T.isMobile()

tgetUrlParam ⇥#

getUrlParam('param')

tscrollToElm ⇥#

scrollToElm(`[href='#id']`);

tlocalApi ⇥#

LocalApi.get(`key`);

tevalScripts ⇥#

evalScripts(content);

ts ⇥ tselector#

T(`selector`);

twrap ⇥#

T.wrap(T(`toWrapSelector`)[0],'','classname');

taddclass ⇥#

T(`selector`).addClass('active');

tremoveclass ⇥#

T(`selector`).removeClass('active');

ttoggleclass ⇥#

T(`selector`).toggleClass('active');

thasclass ⇥#

T(`selector`).hasClass('active');

tindex ⇥#

T(`selector`).index();

tclick ⇥#

T(`#selector`).on(`click`, e => {
e.stopPropagation();
e.preventDefault();
const el = e.target;
});

toffclick ⇥#

T(`#selector`).off(`click`, e => {
e.stopPropagation();
e.preventDefault();
const el = e.target;
});

toneclick ⇥#

T(`#selector`).one(`click`, e => {
e.stopPropagation();
e.preventDefault();
const el = e.target;
});

ttrigger ⇥#

T(`selector`).trigger('click');

thtml ⇥#

T(`selector`).html('element');

ttext ⇥#

T(`selector`).text('text');

theightset ⇥#

T(`selector`).height(400);

theightget ⇥#

T(`selector`).height();

tshow ⇥#

T(`selector`).show(`flex`);

thide ⇥#

T(`selector`).hide();

tnotify ⇥#

T.notify({
text:`messageandtext`,
className: `success`,
duration: 3200,
stopOnFocus: true,
close: true,
gravity:`top`,
position: `left`,
iconClass: `ti-thumbs-up`,
});

tmodal ⇥#

T.modal({
id: 'new-modal',
class: `classname`,
width: `480px`,
title: `ModalTitle`,
html: result.statusText,
close: true,
openCallback: () => {
},
closeCallback: () => {
}
});

tpublishingPopupCallback ⇥#

window.publishingPopupCallback=function(){
}

ttooltip ⇥#

T.tooltip(T(`selector`)[0], {
placement:`top`
});

tcheckvalidity ⇥#

if(!T.checkValidity(e.target)) return;

tvat ⇥#

T.vat(price, vat);

tformat ⇥#

T.format(number);

ttimeconverter ⇥#

T.timeConverter(1652702396000, `d.m.y`);

tbuttonlock ⇥#

const button = T(`#form_submit_button`)[0];
T.buttonLock.dom = button;
T.buttonLock.tmp = button.innerHTML;
T.buttonLock.lock();

tbuttonunlock ⇥#

T.buttonLock.unlock();

Tsoft most used servives#

sretrunnotes ⇥#

`/srv/service/order-v4/order-return/${product_id}`

svideo ⇥#

`/srv/service/gallery/video-detail/${product_id}`

sfastlook ⇥#

`/srv/service/product-detail/view/606`

sfolders ⇥#

`/srv/service/content/get/${BLOCK.ID}/folder_name`

slanguage ⇥#

`/srv/service/language/change/${tr}`

scurrency ⇥#

`/srv/shopping/shopping/set-currency/${tl}`

scountry ⇥#

`/srv/shopping/shopping/set-country/${TR}`

sproductlist ⇥#

`/srv/service/content/get-block/1003/category/${catID}`

scatservice ⇥#

`/srv/service/category/get/${catID}`

scatproduct ⇥#

`/srv/service/product/filter/category/${catID}?pg=1`

sgettree ⇥#

`/srv/service/category/getTree/${catID}`

sgetblock ⇥#

`/srv/service/content/get-block/1018/content/${içerik_id}`

sinstallment ⇥#

`/srv/service/product-detail/credit-card-installment-list/${product_id}/${sub_product_id}`

spaymentoptions ⇥#

`/srv/service/product-detail/payment-options/${product_id}/${sub_product_id}`

scampaignproduct ⇥#

`/srv/campaign-v2/campaign/get-list-by-type/product/${product_id}`

scampaigncart ⇥#

`/srv/campaign-v2/campaign/get-list-by-type/cart`

scampaigncat ⇥#

`/srv/campaign-v2/campaign/get-list-by-type/category/${id}`

scart ⇥#

`/srv/service/cart/load?link=sepet`

scomment ⇥#

`/srv/service/product-detail/comments/${product_id}`

scommentpoint ⇥#

`/srv/service/product-detail/comment-average/${product_id}`

sbrand ⇥#

`/srv/service/filter/get/brands`

srelatedblock ⇥#

`/srv/service/content/getBlock/1070/product/${product_id}`

srelated ⇥#

`/srv/service/product/get-related-products/${product_id}/1`

ssubstitution ⇥#

`/srv/service/product/get-related-products/${product_id}/2`

saccessory ⇥#

`/srv/service/product/get-related-products/${product_id}/3`

scomplement ⇥#

`/srv/service/product/get-related-products/${product_id}/4`
SMARTY

T-Soft V5 için Smarty kod parçacıkları.

Smarty Snippets#

border- ⇥#

border-options

fw- ⇥#

fw-options

text- ⇥#

text-options

btn- ⇥#

btn-options

btn-outline- ⇥#

btn-outline-options

bg- ⇥#

btn-outline-options

pos-rd ⇥#

position-desktop-relative

pos-sd ⇥#

position-desktop-sticky

pos-ad ⇥#

position-desktop-absolute

pos-fd ⇥#

position-desktop-fixed

pos-r ⇥#

position-relative

pos-s ⇥#

position-sticky

pos-a ⇥#

position-absolute

pos-f ⇥#

position-fixed

column ⇥#

flex-direction-column

row-f ⇥#

flex-direction-row

row-r ⇥#

flex-direction-row-reverse

wrap ⇥#

flex-wrap

wrap-r ⇥#

flex-wrap-reverse

shrink ⇥#

flex-shrink-options

a-center ⇥#

align-items-center

a-end ⇥#

align-items-flex-end

a-start ⇥#

align-items-flex-start

j-center ⇥#

justify-content-center

j-between ⇥#

justify-content-between

j-between ⇥#

justify-content-between

j-around ⇥#

justify-content-around

j-evenly ⇥#

justify-content-evenly

j-start ⇥#

justify-content-flex-start

j-end ⇥#

justify-content-flex-end

container ⇥#

container-options

extraformat ⇥#

{format price=($P.PRICE_SELL - ($P.PRICE_SELL * $P.NUMERIC1/100))}

extraformat ⇥#

{format price=($P.PRICE_SELL - ($P.PRICE_SELL * $P.NUMERIC1/100))}

extravat ⇥#

{vat price=($P.PRICE_SELL - ($P.PRICE_SELL * $P.NUMERIC1/100)) vat=$P.VAT}

vuetemplate ⇥#

<div id="selector" class="row" v-cloak>
</div>
<script>
const appName = {
data() {
return {
}
}
};
Vue.createApp(appName).mount('selector');
</script>

IS_ADMIN_LOGGED ⇥#

IS_ADMIN_LOGGED

IS_LAZY_LOAD_ACTIVE ⇥#

IS_LAZY_LOAD_ACTIVE

IS_MEMBER_LOGGED_IN ⇥#

IS_MEMBER_LOGGED_IN

IS_VENDOR ⇥#

IS_VENDOR

LANGUAGE ⇥#

LANGUAGE

LANGUAGE_SELECTED ⇥#

LANGUAGE_SELECTED

LANGUAGE_LIST ⇥#

LANGUAGE_LIST

IS_HTTPS_ACTIVE ⇥#

IS_HTTPS_ACTIVE

FILTER_PROPERTY_LIST ⇥#

FILTER_PROPERTY_LIST

IS_RECOMMENDATION_ACTIVE ⇥#

IS_RECOMMENDATION_ACTIVE

SYMBOL_ ⇥#

SYMBOL_options

LAZY_LOAD_LOADING_IMAGE ⇥#

LAZY_LOAD_LOADING_IMAGE

DISPLAY_FAVOURITE_BUTTON ⇥#

DISPLAY_FAVOURITE_BUTTON

DISPLAY_COMPARISON_BUTTON ⇥#

DISPLAY_COMPARISON_BUTTON

DISPLAY_CART_BUTTON ⇥#

DISPLAY_CART_BUTTON

DISPLAY_LANGUAGES ⇥#

DISPLAY_LANGUAGES

CAMPAIGN_LIST ⇥#

CAMPAIGN_LIST

CURRENCY_LIST ⇥#

CURRENCY_LIST

data-toggle ⇥#

data-toggle="options"

CURRENCY ⇥#

CURRENCY

CHILDREN ⇥#

CHILDREN

CHILDREN|@count ⇥#

CHILDREN|@count

MEDIUM_WEBP_JPG ⇥#

MEDIUM_WEBP_JPG

VARIANT_TYPE_ID ⇥#

VARIANT_TYPE_ID

VARIANT_IDS ⇥#

VARIANT_IDS

TITLE ⇥#

TITLE

SMALL ⇥#

SMALL

MEDIUM ⇥#

MEDIUM

BIG ⇥#

BIG

P ⇥#

P.options

SUB ⇥#

SUB.options

VARIANT_FEATURE1_LIST ⇥#

VARIANT_FEATURE1_LIST

tsubfolder ⇥#

/srv/service/content-v5/sub-folder/{$PAGE_ID/{$BLOCK.PARENT_ID}/subfoldername/?product={$P.ID}&variant={$P.VARIANT_ID}

tfor ⇥#

{for $i=1 to $P.STOCK}
$i
{/for}

tvat ⇥#

{vat price=$P.PRICE_SELL vat=$P.VAT}

tformat ⇥#

{format price=$P.PRICE_SELL}

|string_format ⇥#

|string_format:'%.1f'

|date_format ⇥#

|date_format:'Y,m,d,H,i,s'

|strip_tags|escape ⇥#

|strip_tags|escape:'html'

|strpos ⇥#

|strpos:''

|default ⇥#

|default:''

|replace ⇥#

|replace:'':''

|count ⇥#

|@count

| ⇥#

|options

texchange ⇥#

{exchange price=$P.PRICE_SELL from=$P.TARGET_CURRENCY to='USD'}

THEME_FOLDER ⇥#

THEME_FOLDER

ASSETS ⇥#

ASSETS

TABS ⇥#

TABS

MENU ⇥#

MENUoptions

titeration ⇥#

$smarty.foreach.name.iteration

RELATED_PRODUCTS ⇥#

RELATED_PRODUCTS_IDS1_options

SYMBOL_ ⇥#

SYMBOL_options

ADDITIONAL_FIELD ⇥#

ADDITIONAL_FIELD_options

NUMERIC1 ⇥#

NUMERIC1

COUNTER ⇥#

COUNTER

debugserver ⇥#

<pre>{$smarty.server|@debug_print_var}</pre>

explode ⇥#

{assign var="CATARRAY" value=","|explode:$P.CATEGORY_IDS}

inarray ⇥#

{in_array('20', array('10','20','30'))}

mathsmarty ⇥#

{math assign="SEPETTUTARI" equation="x*((100+v)/100)*((100-y)/100)" x=$P.PRICE_SELL y=$P.ADDITIONAL_FIELD_1 v=$P.VAT}

wame ⇥#

https://api.whatsapp.com/send?phone=9{$WHATSAPP_NO}&text=

jsondecode ⇥#

json_decode($P.VARIANT_DATA, true)

pid ⇥#

{$P.ID}

bid ⇥#

BLOCK.ID

jsvoid ⇥#

javascript:void(0)

|substr ⇥#

|substr:0:5

urlpage ⇥#

{url type='page' id='68'}

predebug ⇥#

<pre>{arr|@debug_print_var}</pre>

var_dump ⇥#

<pre>{$arr|@var_dump}</pre>

editorfiles ⇥#

/Data/EditorFiles/v5images/

debug ⇥#

{debug}

/literal ⇥#

{debug}

BLOCK ⇥#

BLOCK.options

SETTING ⇥#

SETTING.options

IMAGE ⇥#

IMAGE.options

Services#

sretrunnotes ⇥#

/srv/service/order-v4/order-return/${$P.ID}

ssearch ⇥#

/srv/service/order-v4/order-return/${$P.ID}

svideo ⇥#

/srv/service/gallery/video-detail/${$P.ID}

sfastlook ⇥#

/srv/service/product-detail/view/606

sfolders ⇥#

/srv/service/content/get/block_id/folder_name

slanguage ⇥#

/srv/service/language/change/tr

scurrency ⇥#

/srv/shopping/shopping/set-currency/tl

scountry ⇥#

/srv/shopping/shopping/set-country/TR

sproductlist ⇥#

/srv/service/content/get-block/1003/category/catID

scatservice ⇥#

/srv/service/category/get/catID

scatproduct ⇥#

/srv/service/product/filter/category/catID?pg=1

sgettree ⇥#

/srv/service/category/getTree/catID

sgetblock ⇥#

/srv/service/content/get-block/1018/content/içerik_id

sinstallment ⇥#

/srv/service/product-detail/credit-card-installment-list/${$P.ID}/${$P.VARIANT_ID}

spaymentoptions ⇥#

/srv/service/product-detail/payment-options/${$P.ID}/${$P.VARIANT_ID}

scampaignproduct ⇥#

/srv/campaign-v2/campaign/get-list-by-type/product/${$P.ID}

scampaigncart ⇥#

/srv/campaign-v2/campaign/get-list-by-type/cart

scampaigncat ⇥#

/srv/campaign-v2/campaign/get-list-by-type/category/id

scart ⇥#

/srv/service/cart/load?link=sepet

scomment ⇥#

/srv/service/product-detail/comments/${$P.ID}

scommentpoint ⇥#

/srv/service/product-detail/comment-average/${$P.ID}

sbrand ⇥#

/srv/service/filter/get/brands

srelatedblock ⇥#

/srv/service/content/getBlock/1070/product/${$P.ID}

srelated ⇥#

/srv/service/product/get-related-products/${$P.ID}/1

ssubstitution ⇥#

/srv/service/product/get-related-products/${$P.ID}/2

saccessory ⇥#

/srv/service/product/get-related-products/${$P.ID}/3

scomplement ⇥#

/srv/service/product/get-related-products/${$P.ID}/4
SCSS V5T-Soft V5 için SCSS kod parçacıkları. Örnek kullanım.

SCSS Snippets#

transparentize ⇥#

transparentize($bgPrimary, 0.5);

darken ⇥#

darken($bgPrimary, 10%)

lighten ⇥#

lighten($bgPrimary, 10%)

$gridColumns ⇥#

$gridColumns

$gridPadding ⇥#

$gridPadding

$mobileGridPadding ⇥#

$mobileGridPadding

$xxlScreen ⇥#

$xxlScreen

$xlScreen ⇥#

$xlScreen

$lgScreen ⇥#

$lgScreen

$mdScreen ⇥#

$mdScreen

$smScreen ⇥#

$smScreen

$bg ⇥#

$bgoptions
$bgBody
$bgPrimary
$bgSecondary
$bgWhite
$bgBlack
$bgGray
$bgLight
$bgDarkGray
$bgSuccess
$bgInfo
$bgWarning
$bgDanger

$border ⇥#

$borderoptions
$borderBody
$borderPrimary
$borderSecondary
$borderWhite
$borderBlack
$borderGray
$borderLight
$borderDarkGray
$borderSuccess
$borderInfo
$borderWarning
$borderDanger
$borderRadius

$button ⇥#

$buttonoptions
$buttonPrimary
$buttonSecondary
$buttonWhite
$buttonBlack
$buttonGray
$buttonLight
$buttonDarkGray
$buttonSuccess
$buttonInfo
$buttonWarning
$buttonDanger

$text ⇥#

$textoptions
$textPrimary
$textSecondary
$textWhite
$textBlack
$textGray
$textLight
$textDarkGray
$textSuccess
$textInfo
$textWarning
$textDanger
$textColor

$headingColor ⇥#

$headingColor

$font ⇥#

$fontoptions
$fontH1
$fontH2
$fontH3
$fontText
$fontMaster

clamp ⇥#

clamp(13px,1vw,20px)

importsetting ⇥#

@import "setting.scss";
@import "mixin.scss";

i-scrollbar ⇥#

@include scrollbar(5, 5, $bgPrimary);

i-lineclamp ⇥#

@include line-clamp(2);

i-j-evenly ⇥#

@include justify-content-evenly;

i-j-center ⇥#

@include justify-content-center;

i-j-start ⇥#

@include justify-content-flex-start;

i-j-end ⇥#

@include justify-content-flex-end;

i-j-between ⇥#

@include justify-content-between;

i-j-around ⇥#

@include justify-content-around;

i-a-end ⇥#

@include align-items-flex-end;

i-a-start ⇥#

@include align-items-flex-start;

i-row ⇥#

@include flex-direction-row;

i-column ⇥#

@include flex-direction-column;

i-wrap ⇥#

@include flex-wrap;

i-flex ⇥#

@include d-flex;

i-inlineflex ⇥#

@include d-inline-flex;

i-allcenter ⇥#

@include d-flex;
@include align-items-center;
@include justify-content-center;

i-block ⇥#

@include BLOCK {
}

boxshadow ⇥#

box-shadow: 0 0 10px 0 rgb(40 40 40 / 30%);

textshadow ⇥#

text-shadow: 1px 1px 2px $bgBlack, 0 0 1em $bgBlack, 0 0 0.2em $bgBlack;

lineclamp ⇥#

display: -webkit-box !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;

mediamin ⇥#

@media (min-width: $mdScreen){
}

mediamax ⇥#

@media (max-width: $mdScreen - 1){
}

keyframes ⇥#

@keyframes mymove {
from {top: 0px;}
to {top: 200px;}
}

Kaynak Kodları#

GitHub - tsoft-v5-snippet