Skip to content

Instantly share code, notes, and snippets.

View sparrow's full-sized avatar

Volodymyr Vorobiov sparrow

90 followers · 0 following
View GitHub Profile
@sparrow
sparrow / filtersDemoVue.js
Created March 6, 2018 08:44
This is a JavaScript code snippet that we used for our blog post https://rubygarage.org/blog/things-vue-takes-from-react-and-angular at RubyGarage. This is an example of filter syntax implementation in Vue.
<span>{{ message | uppercase }}</span>
@sparrow
sparrow / TwoWayDataBindingDemoAngular.js
Created March 6, 2018 08:43
This is a JavaScript code snippet that we used for our blog post https://rubygarage.org/blog/things-vue-takes-from-react-and-angular at RubyGarage. This is an example of two-way data binding implementation in Angular.
<div class='field'>
<input placeholder='Title' ng-model='newArticle.title' />
</div>
@sparrow
sparrow / twoWayDataBindingDemoVue.js
Created March 6, 2018 08:42
This is a JavaScript code snippet that we used for our blog post https://rubygarage.org/blog/things-vue-takes-from-react-and-angular at RubyGarage. This is an example of two-way data binding implementation in Vue.
<div class='field'>
<input placeholder='Title' v-model='newArticle.title' />
</div>
@sparrow
sparrow / renderFunctionDemoReact.js
Created March 6, 2018 08:41
This is a JavaScript code snippet that we used for our blog post https://rubygarage.org/blog/things-vue-takes-from-react-and-angular at RubyGarage. This is an example of rendering functions & JSX support implementation in React.
import React from 'react'
const Demo = () => {
const sayHi = () =>
alert('Hi.')
return (
<span onClick={sayHi}>Say hi!</span>
)
}
@sparrow
sparrow / renderFunctionDemoVue.js
Created March 6, 2018 08:40
This is a JavaScript code snippet that we used for our blog post https://rubygarage.org/blog/things-vue-takes-from-react-and-angular at RubyGarage. This is an example of rendering functions & JSX support implementation in Vue.
import Vue from 'vue'
new Vue({
el: '#demo',
methods: {
sayHi () {
alert('Hi.')
}
},
render (h) => {
@sparrow
sparrow / task.vue
Created March 6, 2018 08:39
This is a JavaScript code snippet that we used for our blog post https://rubygarage.org/blog/things-vue-takes-from-react-and-angular at RubyGarage. This is an example of animation implementation in Vue.
<template>
<div>
<div class='item'>
<div class='middle aligned content'>
<div class='ui fitted checkbox'>
<input @click='removeTask(task)' type='checkbox'>
<label></label>
</div>
<span class='task-text'>{{task}}</span>
</div>
@sparrow
sparrow / project.vue
Created March 6, 2018 08:38
This is a JavaScript code snippet that we used for our blog post https://rubygarage.org/blog/things-vue-takes-from-react-and-angular at RubyGarage. This is an example of animation implementation in Vue.
<template>
<div class='container'>
<div class='ui form'>
<div class='field'>
<div class='ui fluid action input'>
<input v-model='newTask' type='text' placeholder='Start typing here to create a task...'>
<button @click='addTask' class='ui green button'>Add Task</button>
</div>
</div>
</div>
@sparrow
sparrow / adding-an-image-and-text-over-a-video.swift
Created August 6, 2017 16:25
This is a Swift code snippet that we used for our blog post at RubyGarage https://rubygarage.org/. To add an image and text over a video.
if let item = MediaItem(url: url) {
let logoImage = UIImage(named: "logo")
let firstElement = MediaElement(image: logoImage!)
firstElement.frame = CGRect(x: 0, y: 0, width: logoImage!.size.width, height: logoImage!.size.height)
let testStr = "Attributed Text"
let attributes = [ NSForegroundColorAttributeName: UIColor.white, NSFontAttributeName: UIFont.systemFont(ofSize: 35) ]
let attrStr = NSAttributedString(string: testStr, attributes: attributes)
@sparrow
sparrow / render-an-image-and-text-over-another-image.swift
Created August 6, 2017 16:09
This is a Swift code snippet that we used for our blog post at RubyGarage https://rubygarage.org/. The next script template will work if you need to render an image and text over another image.
let item = MediaItem(image: image)
let logoImage = UIImage(named: "logo")
let firstElement = MediaElement(image: logoImage!)
firstElement.frame = CGRect(x: 0, y: 0, width: logoImage!.size.width, height: logoImage!.size.height)
let testStr = "Test Attributed String"
let attributes = [ NSForegroundColorAttributeName: UIColor.white, NSFontAttributeName: UIFont.systemFont(ofSize: 35) ]
let attrStr = NSAttributedString(string: testStr, attributes: attributes)
@sparrow
sparrow / adding-two-images-with-different-coordinates-over-a-third-image.swift
Last active August 6, 2017 16:20
This is a Swift code snippet that we used for our blog post at RubyGarage https://rubygarage.org/. To add two images with different coordinates over a third image.
let item = MediaItem(image: image)
let logoImage = UIImage(named: "logo")
let firstElement = MediaElement(image: logoImage!)
firstElement.frame = CGRect(x: 0, y: 0, width: logoImage!.size.width, height: logoImage!.size.height)
let secondElement = MediaElement(image: logoImage!)
secondElement.frame = CGRect(x: 300, y: 300, width: logoImage!.size.width, height: logoImage!.size.height)