Kompresi Hasil Keluaran PHP `var_export` Tanpa Regex
Fungsi ini akan menghapus semua indentasi dan ganti baris pada hasil keluaran yang dihasilkan oleh PHP var_export untuk mengurangi alokasi memori penyimpanan data statis:
Kebanyakan dari kita akan menggunakan cara ini untuk mendapatkan daftar berkas pada sebuah direktori, yang mana ini akan menampilkan semua jalur berkas dan folder, namun tidak dengan jalur berkas dan folder yang memiliki awalan ., misalnya pada berkas dengan nama .htaccess:
$files = glob('.\path\to\folder\*');
Untuk mengatasi masalah ini, biasanya kita akan menggabungkan dua pola yaitu .* untuk menelusuri berkas dan folder dengan awalan . dan pola * untuk menelusuri berkas dan folder generik:
Kendala sekarang ada pada jalur .\path\to\folder\. dan .\path\to\folder\.. yang sebenarnya tidak kita perlukan, namun muncul juga di dalam daftar. Sehingga kita perlu melakukan usaha ekstra untuk menyingkirkan item tersebut dari daftar:
Meskipun berkas dengan nama seperti ...foo-bar.baz akan gagal lolos pada pola penelusuran di atas, namun penamaan berkas dengan awalan . lebih dari satu sepertinya sangat jarang ada, jadi Saya kira pola ini cukup aman.
Saat menggunakan aplikasi Google+, tajuk dan navigasi di bagian atas dan bawah akan menghilang ketika Anda menggulung layar ke bawah, sebaliknya, ketika Anda menggulung layar ke atas, tajuk dan navigasi akan muncul kembali.
JavaScript
var currentPageXOffset = 0,
currentPageYOffset = 0;
window.addEventListener("scroll", function() {
var X = this.pageXOffset,
Y = this.pageYOffset;
if (currentPageXOffset < X) {
console.log('scroll right');
} else if (currentPageXOffset > X) {
console.log('scroll left');
}
if (currentPageYOffset < Y) {
console.log('scroll down');
} else if (currentPageYOffset > Y) {
console.log('scroll up');
}
currentPageXOffset = X;
currentPageYOffset = Y;
}, false);
Contoh
Demonstrasi penggunaan deteksi arah gulungan layar untuk menentukan kapan elemen <header> dan <footer> harus ditampilkan atau disembunyikan:
Fungsi PHP dan JavaScript untuk Navigasi Halaman Angka
Berikut ini adalah fungsi navigasi halaman angka yang paling standar dan paling sesuai untuk diterapkan pada semua kasus. Saya sediakan dalam bahasa JavaScript dan PHP, karena menurut Saya tampilan navigasi ini sangat sederhana namun sudah mencakup semua fitur yang ada. Yaitu fitur navigasi halaman Awal, Akhir, Berikutnya, Sebelumnya, dan navigasi halaman angka yang memungkinkan kita untuk melompati beberapa halaman sekaligus.
JavaScript
function pager(current, count, chunk, peek, fn, first, previous, next, last) {
var begin = 1,
end = Math.ceil(count / chunk),
s = "",
i, min, max;
if (end <= 1) {
return s;
}
if (current <= peek + peek) {
min = begin;
max = Math.min(begin + peek + peek, end);
} else if (current > end - peek - peek) {
min = end - peek - peek;
max = end;
} else {
min = current - peek;
max = current + peek;
}
if (previous) {
s = '<span>';
if (current === begin) {
s += '<b title="' + previous + '">' + previous + '</b>';
} else {
s += '<a href="' + fn(current - 1) + '" title="' + previous + '" rel="prev">' + previous + '</a>';
}
s += '</span> ';
}
if (first && last) {
s += '<span>';
if (min > begin) {
s += '<a href="' + fn(begin) + '" title="' + first + '" rel="prev">' + begin + '</a>';
if (min > begin + 1) {
s += ' <span>…</span>';
}
}
for (i = min; i <= max; ++i) {
if (current === i) {
s += ' <b title="' + i + '">' + i + '</b>';
} else {
s += ' <a href="' + fn(i) + '" title="' + i + '" rel="' + (current >= i ? 'prev' : 'next') + '">' + i + '</a>';
}
}
if (max < end) {
if (max < end - 1) {
s += ' <span>…</span>';
}
s += ' <a href="' + fn(end) + '" title="' + last + '" rel="next">' + end + '</a>';
}
s += '</span>';
}
if (next) {
s += ' <span>';
if (current === end) {
s += '<b title="' + next + '">' + next + '</b>';
} else {
s += '<a href="' + fn(current + 1) + '" title="' + next + '" rel="next">' + next + '</a>';
}
s += '</span>';
}
return s;
}
Tentukan nomor halaman saat ini (dimulai dari angka 1), pada current, jumlah total data pada count, jumlah data yang ingin ditampilkan per halaman pada chunk, jumlah navigasi angka yang perlu ditampilkan sebelum dan sesudah angka halaman yang aktif pada peek, fungsi untuk membuat tautan pada fn dan teks untuk masing-masing tautan navigasi pada first, previous, next dan last.
Mengakses Tag Kondisional Halaman Blogger di dalam JavaScript
_WidgetManager._GetAllData()
document.addEventListener("DOMContentLoaded", function() {
if (typeof _WidgetManager === "undefined") return;
var data = _WidgetManager._GetAllData();
// Lakukan sesuatu dengan `data` di sini …
}, false);
Parser JSON untuk Blogger · Tahun Awal dan Tahun Akhir
var url = 'http://dte-feed.blogspot.com/feeds/posts/summary?alt=json-in-script&callback=';
// Function to load a `<script>` tag without `document.write`
function load(url) {
var script = document.createElement('script');
script.src = url;
document.head.appendChild(script);
}
// Get the first and last post year…
function getFirstAndLastYear($) {
$ = $.feed || {};
var entry = $.entry || [],
range = {};
// Get the first post year from `json.feed.entry[i].published.$t` value
range[0] = entry[0] && +entry[0].published.$t.split('-')[0] || false;
// Get the last post year from `json.feed.updated.$t` value
range[1] = +$.updated.$t.split('-')[0];
// [3]. Result will be available in the `range` variable as `[from, to]` format
console.log(range);
// You can now do stuff using the `range` variable start from here
document.getElementById('blog-history').innerHTML = '\u00A9 Copyright ' + range[0] + ' \u2013 ' + range[1];
}
// Get the total posts…
function getTotalPosts($) {
$ = $.feed || {};
var i = $.openSearch$totalResults.$t,
entry = $.entry || [];
// [2]. Get the first and last post year…
// Use the `max-results` and `start-index` parameter to limit the posts
load(url + 'getFirstAndLastYear&max-results=1&start-index=' + i);
}
// [1]. Get the total posts…
load(url + 'getTotalPosts&max-results=0');
Mendapatkan konten dari dokumen HTML yang lain pada domain yang sama tanpa menggunakan jQuery.
/**
* Get data from a URL
* @param {String} url The URL to get
* @param {Function} success Callback to run on success
* @param {Function} error Callback to run on error
*/
var getURL = function(url, success, error) {
// Feature detection
if (!window.XMLHttpRequest) return;
// Create new request
var request = new XMLHttpRequest();
// Setup callbacks
request.onreadystatechange = function() {
// If the request is complete
if (request.readyState === 4) {
// If the request failed
if (request.status !== 200) {
if (error && typeof error === "function") {
error(request.responseText, request);
}
return;
}
// If the request succeeded
if (success && typeof success === "function") {
success(request.responseText, request);
}
}
};
// Get the HTML
request.open('GET', url);
request.send();
};
Penggunaan
Dasar:
getURL(
'/about',
function(data) {
// On success…
},
function(data) {
// On failure…
}
);
Cari elemen spesifik pada halaman yang dipanggil dan masukkan kontennya ke dalam elemen tertentu pada halaman saat ini:
getURL(
'/about',
function(data) {
// Create a `<div>` and inject the HTML into it
var div = document.createElement(div);
div.innerHTML = data;
// Find the element you’re looking for in the `<div>`
var from = div.querySelector('#some-element');
var to = document.querySelector('#another-element');
// Quit if the element or the place where you want to inject it doesn’t exist
if (!from || !to) return;
// Inject the element into the DOM
to.innerHTML = from.innerHTML;
}
);
Pemutakhiran Sintaks dan Operator XML Blogger 2015
Baru-baru ini Blogger telah merilis beberapa operator baru untuk sintaks XML mereka. Sintaks baru ini memungkinkan kita untuk dapat menulis kode templat yang lebih baik, lebih logis dan lebih efisien. Selain dapat mengurangi ukuran berkas XML, sintaks baru ini juga memungkinkan para pengembang untuk dapat menemukan potensi-potensi baru dalam memanipulasi kode templat Blogger yang dulu sebagian besar hanya bisa kita lakukan dengan JavaScript. Berikut ini adalah ringkasannya…
And
Sebelum
<b:if cond='data:blog.searchQuery'>
<b:if cond='data:numPosts > 10'>
Hasil pencarian dengan jumlah posting lebih dari 10…
</b:if>
</b:if>
Sesudah
<b:if cond='data:blog.searchQuery and data:numPosts > 10'>
Hasil pencarian dengan jumlah posting lebih dari 10…
</b:if>
<b:if cond='data:blog.searchQuery && data:numPosts > 10'>
Hasil pencarian dengan jumlah posting lebih dari 10…
</b:if>
<b:if cond='data:comment.isDeleted'>
<b:else/>
Komentar yang tidak terhapus di sini…
</b:if>
<b:if cond='data:comment.isDeleted == "false"'>
Komentar yang tidak terhapus di sini…
</b:if>
Sesudah
<b:if cond='!data:comment.isDeleted'>
Komentar yang tidak terhapus di sini…
</b:if>
<b:if cond='not data:comment.isDeleted'>
Komentar yang tidak terhapus di sini…
</b:if>
Yang ini tidak bisa:
<!-- TEMPLATE ERROR: 'not' term cannot be used as operator except when preceding 'in' or 'contains' -->
<b:if cond='data:comment.isDeleted not "false"'>
Komentar yang tidak terhapus di sini…
</b:if>
<!-- TEMPLATE ERROR: Extra characters at end of string: buf=[!] remainder=["false"] -->
<b:if cond='data:comment.isDeleted ! "false"'>
Komentar yang tidak terhapus di sini…
</b:if>
Yang ini bisa:
<b:if cond='not data:comment.isDeleted == "false"'>
Komentar yang tidak terhapus di sini…
</b:if>
<b:if cond='!data:comment.isDeleted == "false"'>
Komentar yang tidak terhapus di sini…
</b:if>
Fungsi ini setara dengan jQuery.extend() yang memungkinkan kita untuk menciptakan variabel opsional, dimana variabel tersebut bisa dinyatakan ataupun ditiadakan. Jika tidak dinyatakan, maka nilai variabel yang tidak hadir tersebut akan jatuh pada nilai default yang telah ditentukan di dalam fungsi:
function extend(def, alt) {
alt = alt || {};
for (var i in def) {
if (typeof alt[i] === "undefined") {
alt[i] = def[i];
} else if (
typeof def[i] === "object" &&
typeof alt[i] === "object" &&
alt[i] !== null
) {
alt[i] = extend(def[i], alt[i]);
}
}
return alt;
}
Ketika Anda mengubah beberapa nilai variabel konfigurasi, maka variabel-variabel konfigurasi default yang lain yang tidak diubah akan menyesuaikan:
myFunction({
firstName: 'Foo'
});
Hasil
Taufik telah berubah menjadi Foo.
Sebenarnya dulu Saya sudah pernah menulis posting yang sejenis dengan ini. Tapi metode yang Saya tuliskan dalam posting tersebut tidak mampu untuk menangani objek multi-dimensi seperti ini:
