perymimon

[TOC] ddl system {#welcome}

Introduction

ddl system used to auto fill all SELECT element when page finished loaded.
also it convert SELECT that as autocomplete to autoComplete input.
part of the data that used to fill SELECTEs is local hardcode
part loaded form the server when user login to back office

perymimon

Libraries

• jQuery - The de-facto library for the modern age. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.
• Backbone - Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface.
• AngularJS - Conventions based MVC framework for HTML5 apps.
• Underscore - Underscore is a utility-belt library for JavaScript that provides a lot of the functional programming support that you would expect in Prototype.js (or Ruby), but without extending any of the built-in JavaScript objects.
• lawnchair - Key/value store adapter for indexdb, localStorage

perymimon

function throttle( fn, time ) {
    var t = 0;
    return function() {
        var args = arguments, ctx = this;
        clearTimeout(t);

        t = setTimeout( function() {
            fn.apply( ctx, args );
        }, time );
    };

perymimon

<link href="style.css" rel="stylesheet" />

<!-- I am collapsed by default -->
<nav id="main-navigation" class="navigation">
   <a href="#">Nav Links</a>
      <!-- more -->
</nav>

<!-- I am full width by default -->
<div class="page-wrap">

perymimon

/**
 * Created by pery on 09/05/2015.
 */
var gulp = require('gulp');
var sass = require('gulp-sass');
var sourcemaps = require('gulp-sourcemaps');
var ngAnnotate = require('gulp-ng-annotate');
var uglify = require('gulp-uglify');
var inject = require('gulp-inject');
var mainBowerFiles = require('main-bower-files');

perymimon

function loaderScript(scriptUrl){
   return new Promise(function (res, rej) {
    let script = document.createElement('script');
    script.src = scriptUrl;
    script.type = 'text/javascript';
    script.onError = rej;
    script.async = true;
    script.onload = res;
    script.addEventListener('error',rej);
    script.addEventListener('load',res);

perymimon

function copyText(){
    var code = document.querySelector('pre').innerText;
    var select = document.querySelector('#clipboard');
    select.value = code;
    select.select();

    try {
      document.execCommand('copy');
      alert('Text copied to clipboard!');
    } catch (err) {

perymimon

function addToBookmark(title,href){
    if (window.sidebar && window.sidebar.addPanel) { // Mozilla Firefox Bookmark
      window.sidebar.addPanel(title,href,'');
    } else if(window.external && ('AddFavorite' in window.external)) { // IE Favorite
      window.external.AddFavorite(href, title);
    } else if(window.opera && window.print) { // Opera Hotlist
      this.title = title;
        return true;
    } else { // webkit - safari/chrome
        alert('Press ' + (navigator.userAgent.toLowerCase().indexOf('mac') != - 1 ? 'Command/Cmd' : 'CTRL') + ' + D to bookmark this page.');

perymimon

var data = [{a:1, b:2},{c:3,b:2},{d:4,a:1}];
objectsToTableRows(data);

/* return ... 
{ 
 headers:(4) ["a", "b", "c", "d"],
 rows:Array(3)
 0:(2) [1, 2]
 1:(3) [undefined × 1, 2, 3]
 2:(4) [1, undefined × 2, 4]

perymimon

const fs = require('fs');
const readline = require('readline');
const {google} = require('googleapis');

// If modifying these scopes, delete token.json.
const SCOPES = ['https://www.googleapis.com/auth/spreadsheets.readonly'];
// The file token.json stores the user's access and refresh tokens, and is
// created automatically when the authorization flow completes for the first
// time.
const TOKEN_PATH = 'token.json';