Skip to content

Instantly share code, notes, and snippets.

View pablohpsilva's full-sized avatar
🏠
Working from home

PHPS pablohpsilva

🏠
Working from home
View GitHub Profile
{
id: String, //Filter's identifier
args: Array, //an Array that will apply on the function here declared
func: Function //The filter per se.
}
/**
* formatResult receives a value a.k.a. the list being filtered and an array
* of filter functions, using the structure I created and mentioned before.
* The idea here is to get every item in the array function and use it on
* the list. The result list of each filter will be used in the next
* round of filters. Keep in mind the structure I used before.
*/
export const formatResult = (value, functionArray) => {
if (functionArray) {
let rList = value,
<style>
</style>
<template>
<div class="" v-for="item in list | formatResult filter">
{{item}}
</div>
</template>
<script type="text/babel">
Vue.filter('formatResult', function(value, functionArray){
if (functionArray) {
let rList = value,
aux = [];
for (let i = 0, total = functionArray.length; i < total; i++) {
aux = [rList].concat((functionArray[i]).args);
rList = (functionArray[i]).func.apply(null, aux);
}
return rList;
}
@pablohpsilva
pablohpsilva / ProductItem.vue
Created November 23, 2016 17:26
ProductItem
<template lang="html">
<div class="ProductItem__wrapper"
v-if="product">
<div class="ProductItem__img"
@click.stop="openProductPage()">
<img :src="product.image" alt="">
</div>
<div class="ProductItem__infowrapper">
<div :class="{
'ProductItem__infocontainer': !openDetails,
@pablohpsilva
pablohpsilva / InlinedProduct.vue
Last active November 30, 2016 14:50
InlinedProduct
<template lang="html">
<div @click="clicked()">oi</div>
</template>
<script type="text/babel">
import ProductItem from '../../shared-components/Item';
export default {
extends: { // The Magic is happening right here
props: {
import babel from 'rollup-plugin-babel';
import commonjs from 'rollup-plugin-commonjs';
import eslint from 'rollup-plugin-eslint';
import html from 'rollup-plugin-html';
import livereload from 'rollup-plugin-livereload';
import nodeResolve from 'rollup-plugin-node-resolve';
import path from 'path';
import serve from 'rollup-plugin-serve';
import stylus from 'rollup-plugin-stylus-css-modules';
import uglify from 'rollup-plugin-uglify';
@pablohpsilva
pablohpsilva / vmodelVSregular.vue
Created April 4, 2017 03:00
Comparing v-model with the combination of value and @input
<template>
<input v-model="someVariable" />
<!-- Is the same as: -->
<input :value="someVariable" @input="onInputUpdateSomeVariable" />
</template>
@pablohpsilva
pablohpsilva / mdAutocomplete.vue
Created April 4, 2017 03:23
An autocomple for vue-material framework
<template lang="html">
<div class="md-autocomplete"
@focus="onFocus"
@blur="onBlur">
<md-menu md-menu-trigger
ref="menu">
<span md-menu-trigger></span>
<input class="md-input"
ref="input"
type="text"
@pablohpsilva
pablohpsilva / vuedynamicclass.vue
Last active October 8, 2017 19:04
Vuejs + dynamic classing example
<template>
<div
class="{
toolbar: true,
toolbar-fixed: fixed,
}">
</div>
</template>