function getDistanceFromLatLonInKm(lat1,lon1,lat2,lon2) {
var R = 6371; // Radius of the earth in km
var dLat = deg2rad(lat2-lat1); // deg2rad below
var dLon = deg2rad(lon2-lon1);
var a =
Math.sin(dLat/2) * Math.sin(dLat/2) +
Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) *
Math.sin(dLon/2) * Math.sin(dLon/2)
;
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
var d = R * c; // Distance in km
return d;
}
function deg2rad(deg) {
return deg * (Math.PI/180)
}
const distanceMOWBKK = getDistanceFromLatLonInKm(
55.45, 37.36, 13.45, 100.30
)
console.log(distanceMOWBKK);
import Vue from 'vue';
export const EventBus = new Vue();
import { EventBus } from './event-bus.js';
methods: {
addToCart: function() {
EventBus.$emit('add-to-cart', 1);
}
}
EventBus.$on("add-to-cart", count => {
console.log(`Cart updated on ${count} items.`)
})
Как сделать так, чтобы эти компоненты появлялись только после взаимодействия с ними пользователя на прошлом шаге? (т.е 2 появляется после того как пользователь выбрал значение на первом и тд..)
<App>
<StepOne></StepOne>
<StepTwo v-if="isListItemSelected"></StepTwo>
<StepThree v-if="isRangeShowing"></StepThree>
</App>
<StepThree v-if="isRangeShowing" :range="rangeValues"></StepThree>
и не забыть указать в StepThree параметр props: ['range']. $("#bg1").parent().addClass("bg3").stop().delay(1000).animate({backgroundPosition:"(0 0)"},200);
Return Date as Date Object
The mongo shell wrap objects of Date type with the ISODate helper; however, the objects remain of type Date.
The following example uses new Date() to return Date object with the specified UTC datetime.var myDate = new Date("2016-05-18T16:00:00Z");
const flattenArr = (arr) => {
const flatArray = [];
const parseArray = (arr) => {
arr.forEach(item => Array.isArray(item) ? parseArray(item) : flatArray.push(item))
}
parseArray(arr)
return flatArray
}
transition:width 6s cubic-bezier(.55,.055,.675,.19),height 6s cubic-bezier(.55,.055,.675,.19)
npm init
задаёт вам разные вопросы и создает package.json, который определяет настройки проекта, зависимости, скрипты, название и прочее.npm install [module]
устанавливает модуль с именем module.npm init
(можно с опцией --yes
, которая установит на все вопросы дефолтные ответы), а потом уже устанавливать модули командой npm install
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<input type="text" class="field-na na-1" placeholder="na1" size="1" value="1">
<input type="text" class="field-na na-2" placeholder="na2" size="1" value="4">
<input type="text" class="field-na na-3" placeholder="na3" size="1" value="6">
<input type="text" class="field-na na-4" placeholder="na4" size="1" value="7">
<button class="field-recalc">Пересчитать</button>
<br>
<br>
<input type="text" placeholder="1" size="1" value="1" class="field-to-change">
<input type="text" placeholder="2" size="1" value="1" class="field-to-change">
<input type="text" placeholder="3" size="1" value="1" class="field-to-change">
<input type="text" placeholder="4" size="1" value="1" class="field-to-change">
<input type="text" placeholder="5" size="1" value="1" class="field-to-change">
<input type="text" placeholder="6" size="1" value="1" class="field-to-change">
<input type="text" placeholder="7" size="1" value="1" class="field-to-change">
<script src="index.js"></script>
</body>
</html>
const calculateFields = () => {
const getFieldValue = (className, idx) => {
const value = document.querySelectorAll(className)[idx].value;
return Number(value)
}
const fields = {
na1: getFieldValue('.field-na', 0),
na2: getFieldValue('.field-na', 1),
na3: getFieldValue('.field-na', 2),
na4: getFieldValue('.field-na', 3),
}
const countRange = (start, end) => {
let range = [];
for(let i = start; i <= end; i++) {
range.push(i - 1)
}
return range
}
const firstRange = countRange(fields.na1, fields.na2);
const secondRange = countRange(fields.na3, fields.na4);
return Array.prototype.forEach.call(document.querySelectorAll('.field-to-change'), (elem, index)=>{
if(firstRange.indexOf(index) > -1 || secondRange.indexOf(index) > -1) {
elem.value = 0
}
})
}
document.querySelectorAll('.field-recalc')[0].addEventListener('click', () => {
calculateFields()
})
// document.addEventListener('DOMContentLoaded', () => {
// calculateFields();
// })
function doSomething({ one, two = "two", callback = null, ...args } = {}) {
// some function shite
if (args.anotherParam) {
callback(two);
} else {
callback(one);
}
}
doSomething({
one: "notSoOne",
callback: console.log,
anotherParam: "mmmmmmhhhmm"
});
v-enter-active и v-leave-active дают возможность указать различные анимационные эффекты для переходов появления и исчезновения элемента.
$('.data-img').on('click', function() {
this.src = this.src.replace('.gif', '.jpg')
})
$('.data-img').on('click', function() {
this.src = this.src.replace(/\.gif$/i, '.jpg')
})
<script>
var bx = $('.bxslider').bxSlider({
auto: true,
infiniteLoop: true,
pager: false,
controls: true,
pause: 5000,
onSlideBefore: syncTextSlider
});
var cx = $("#slider-text").bxSlider({
infiniteLoop: true,
pager: false,
controls: false
});
function syncTextSlider($ele, from, to) {
cx.goToSlide(to);
}
</script>