Skip to content

Instantly share code, notes, and snippets.

💻
Writing JavaScript

Angelos Chalaris Chalarangelo

💻
Writing JavaScript
Block or report user

Report or block Chalarangelo

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View copyToClipboard.js
const copyToClipboard = str => {
const el = document.createElement('textarea'); // Create a <textarea> element
el.value = str; // Set its value to the string that you want copied
el.setAttribute('readonly', ''); // Make it readonly to be tamper-proof
el.style.position = 'absolute';
el.style.left = '-9999px'; // Move outside the screen to make it invisible
document.body.appendChild(el); // Append the <textarea> element to the HTML document
const selected =
document.getSelection().rangeCount > 0 // Check if there is any content selected previously
? document.getSelection().getRangeAt(0) // Store selection if found
View copyToClipboard.js
const copyToClipboard = str => {
const el = document.createElement('textarea');
el.value = str;
el.setAttribute('readonly', '');
el.style.position = 'absolute';
el.style.left = '-9999px';
document.body.appendChild(el);
el.select();
document.execCommand('copy');
document.body.removeChild(el);
View copyToClipboard.js
const copyToClipboard = str => {
const el = document.createElement('textarea');
el.value = str;
document.body.appendChild(el);
el.select();
document.execCommand('copy');
document.body.removeChild(el);
};
@Chalarangelo
Chalarangelo / index.json
Created Nov 29, 2017
Metadata structure
View index.json
{
"lang": "en",
"title": "Index",
"stylesheets": ["./css/style.css"],
"scripts": ["./js/main.js"],
"charset": "utf-8",
"description": "This is a page",
"keywords": "page, sample",
"author": "None",
"favicon": "./images/favicon.png",
View card-basic-syntax.json
{'code': '&lt;div class="row"&gt;\r\n'
' &lt;div class="card"&gt;\r\n'
' &lt;div class="section"&gt;\r\n'
' &lt;h3&gt;Card Title&lt;/h3&gt;\r\n'
' &lt;p&gt;Card content...&lt;/p&gt;\r\n'
' &lt;/div&gt;\r\n'
' &lt;/div&gt;\r\n'
' &lt;div class="card"&gt;\r\n'
' &lt;div class="section"&gt;\r\n'
' &lt;h3&gt;Card Title&lt;/h3&gt;\r\n'
View App.jsx
<input type="search" className="searchBox" onChange={event => {
if(event.currentTarget.value) this.searchPost(event.currentTarget.value);
else this.viewAll();
}}/>
View reducer.js
const posts = (state = {data: [], selected: []}, action) => {
let posts = {data: [], selected: []};
switch(action.type){
case VIEW_ALL:
Object.assign(posts.data, state.data);
posts.selected = [];
return posts;
case SEARCH_POST:
Object.assign(posts.data, state.data);
let search = new JsSearch.Search('date-added');
View App.jsx
// Import necessary packages...
class App extends Component {
// Constructor and methods...
// Mounting the component causes an action
componentDidMount(){
fetch("https://jsonbin.io/b/59f721644ef213575c9f6531")
.then( response => response.json())
.then( data => {
let posts = {
View render.jsx
let posts = '', postLinks = '';
if(this.state.posts && this.state.posts.data){
posts = this.state.posts.data.map(post => {return <Post post={post} key={"post_"+post.id}/>;});
postLinks = this.state.posts.data.map(post => {return <a href={"#"+post.id} key={"post_link_"+post.id} className="button">{post.title}</a>})
}
View App.js
componentDidMount(){
fetch("https://jsonbin.io/b/59f721644ef213575c9f6531")
.then( response => response.json())
.then( data => { this.setState({posts: data})});
}
You can’t perform that action at this time.