chore: initial commit for 1.0.0-rc1

Author: velveteer

.editorconfig

@@ -0,0 +1,14 @@
+root = true
+
+[{src,scripts,config}/**.{ts,json,js}]
+end_of_line = lf
+charset = utf-8
+quote_type = single
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+
+[*.md]
+insert_final_newline = false
+trim_trailing_whitespace = false

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,13 @@
+* **What kind of change does this PR introduce?** (Bug fix, feature, docs update, ...)
+
+
+
+* **What is the current behavior?** (You can also link to an open issue here)
+
+
+
+* **What is the new behavior (if this is a feature change)?**
+
+
+
+* **Other information**:

.gitignore

@@ -1,4 +1,13 @@
-dist_cdn
 node_modules
-.DS_Store
+build
+src/**.js
+
+coverage
 *.log
+.env
+.nyc_output
+.DS_Store
+
+# VS Code
+.vscode
+!.vscode/tasks.js

.npmignore

@@ -0,0 +1,13 @@
+config
+examples
+test
+tsconfig.json
+tslint.json
+.travis.yml
+.github
+build/temp
+build/docs
+
+coverage
+.nyc_output
+*.log

LICENSE

@@ -1,5 +1,17 @@
-Copyright (c) 2017, Filestack
-
-Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+/*
+ * Copyright (c) ${year} by Filestack.
+ * Some rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */

README.md

@@ -0,0 +1,5 @@
+---
+name: Filestack Demo - Picker
+description: How to assign picture to user
+normalize_css: no
+...

_config.yml

@@ -0,0 +1 @@
+<script src="//static.filestackapi.com/filestack-js/1.x.x/filestack.min.js"></script>

config/env_production.js

@@ -0,0 +1,42 @@
+// sample function to get user id
+const getUserId = () => {
+  return new Promise((resolve) => {
+    resolve({
+      userId: 'SAMPLE_USER_ID'
+    })
+  });
+};
+
+// sample function for saving user data
+const saveUserData = (data) => {
+  return new Promise((resolve) => {
+    console.log(data);
+    resolve({
+      success: true
+    })
+  });
+};
+
+window.addEventListener('DOMContentLoaded', function () {
+  // user id taken from external source ie: your database, Facebook etc.
+  getUserId().then((response) => {
+    const userId = response.userId;
+    const apikey = 'YOUR_APIKEY';
+    const client = filestack.init(apikey);
+    const options = {
+      uploadInBackground: false,
+      onFileUploadFinished: (response) => {
+        // after file upload, make request with data to your application
+        saveUserData({
+          userId,
+          fileHandle: response.handle
+        }).then((res) => {
+          console.log('User data has been saved', res);
+        })
+      }
+    };
+    const picker = client.picker(options);
+    picker.open();
+  });
+});
+

config/s3.json

@@ -0,0 +1,5 @@
+---
+name: Filestack Demo - cropFiles
+description: Crop files using client
+normalize_css: no
+...

dist/filestack.es2015.js

@@ -0,0 +1,2 @@
+<input type="file" multiple />
+<script src="//static.filestackapi.com/filestack-js/1.x.x/filestack.min.js"></script>

dist/filestack.es2015.js.map

@@ -0,0 +1,19 @@
+window.addEventListener('DOMContentLoaded', function () {
+  const apikey = 'YOUR_APIKEY';
+  const client = filestack.init(apikey);
+
+  document.querySelector('input').addEventListener('change', (event) => {
+    const files = event.target.files;
+    const pickOptions = {
+      transformations: {
+        crop: {
+          aspectRatio: 16/9,
+        },
+        circle: false
+      },
+      onUploadDone: res => console.log(res),
+    };
+    const picker = client.picker(pickOptions);
+    picker.crop(files);
+  });
+});

dist/filestack.js

@@ -0,0 +1,42 @@
+/* change picker appearance  */
+.fsp-picker {
+    background: rgba(0,0,0,.288)!important;
+}
+
+/* update styles for drop area */
+.fsp-picker .fsp-drop-area {
+    background: rgba(0,0,0,.03);
+    border-radius: 0;
+}
+
+/* customize picker modal  */
+.fsp-picker .fsp-modal {
+    background: #fff;
+    border-radius: 0;
+    border:none;
+    box-shadow: 0 11px 15px -7px rgba(0,0,0,.2), 0 24px 38px 3px rgba(0,0,0,.14), 0 9px 46px 8px rgba(0,0,0,.12)
+}
+
+.fsp-picker .fsp-header {
+    color: rgba(0,0,0,.54);
+}
+
+.fsp-picker .fsp-url-source__input,
+.fsp-picker .fsp-url-source__submit-button {
+    border: none;
+    border-radius: 0;
+    height: 30px;
+    border-bottom: 1px solid #2e68fb;
+}
+
+.fsp-picker .fsp-url-source__input:focus {
+    outline: none;
+    border: none;
+    border-bottom: 1px solid #2e68fb;
+}
+
+.fsp-picker .fsp-url-source__submit-button {
+    width: 30px;
+    border: 1px solid #2e68fb;
+    padding:0;
+}

dist/filestack.js.map

@@ -0,0 +1,5 @@
+---
+name: Filestack Demo - css customization
+description: Easy customization with BEM standard (http://getbem.com/)
+normalize_css: no
+...

examples/assign-file-to-user/demo.css

@@ -0,0 +1 @@
+<script src="//static.filestackapi.com/filestack-js/1.x.x/filestack.min.js"></script>

examples/assign-file-to-user/demo.details

@@ -0,0 +1,11 @@
+window.addEventListener('DOMContentLoaded', function () {
+  const apikey = 'YOUR_APIKEY';
+  const client = filestack.init(apikey);
+  const picker = client.picker({
+    fromSources: ['local_file_system', 'url', 'imagesearch'],
+    maxFiles: 20,
+    uploadInBackground: false,
+    onOpen: () => console.log('opened!'),
+  });
+  picker.open();
+});

examples/assign-file-to-user/demo.html

@@ -0,0 +1,133 @@
+const express = require('express');
+const util = require('util');
+const fs = require('fs');
+const path = require('path');
+const app = express();
+const yaml = require('js-yaml');
+const readFile = util.promisify(fs.readFile);
+const readDir = util.promisify(fs.readdir);
+
+ // hardcoded names because of jsFiddle <== github integration
+const files = {
+  index: 'demo.html',
+  script: 'demo.js',
+  config: 'demo.details',
+  css: 'demo.css',
+};
+
+const filesContent = {
+  script: null,
+  css: null,
+  config: null
+};
+
+const template = `
+<html>
+    <title>{{title}}</title>
+    <head>
+        {{headScript}}
+        <style>
+          {{style}}
+        </style>
+    </head>
+    <body>
+        {{content}}
+        <script src="http://localhost:4000/index.umd.js"></script>
+        <script>
+            {{script}}
+        </script>
+    </body>
+</html>
+`;
+
+const listTemplate = `
+<html>
+    <body>
+        <ul>{{list}}</ul>
+    </body>
+</html>
+`;
+
+let examples;
+const getExamples = () => {
+  examples = [];
+  return readDir(__dirname).then((results) => {
+    results.forEach((val) => {
+      if (fs.statSync(path.join(__dirname, val)).isDirectory()
+      && fs.existsSync(path.join(__dirname, val, files.config))) {
+        examples.push(val);
+      }
+    });
+  });
+};
+
+// render examples list
+app.get('/', (req, res) => {
+  getExamples().then(() => {
+    const list = examples.map(val => `<li><a href="/${val}" alt="val">${val}</a></li>`);
+    res.send(listTemplate.replace('{{list}}', list.join('\r\n')));
+  });
+});
+
+// render example based on jsFiddle github integration
+app.get('/*', (req, res) => {
+  const requestedPath = req.path;
+  const promises = [];
+  if (req.path === '/index.umd.js') {
+    return readFile(path.join(__dirname, '../build/browser/index.umd.js'))
+      .then((file) => res.send(file.toString()));
+  }
+
+  const stripped = req.path.substring(1);
+  if (examples.indexOf(stripped) === -1) {
+    res.status(404);
+    res.end();
+    return;
+  }
+
+  Object.keys(files).forEach((key) => {
+    const promiseFn = readFile(path.join(__dirname, requestedPath, files[key]));
+    promiseFn.then((res) => {
+      filesContent[key] = res.toString();
+    });
+
+    promises.push(promiseFn);
+  });
+
+  Promise.all(promises).then(() => {
+    if (!filesContent.config) {
+      res.status(404);
+      res.end();
+      return;
+    }
+
+    const config = yaml.safeLoad(filesContent.config);
+    let tpl = template + '';
+    tpl = tpl.replace('{{title}}', config.name || '')
+      .replace('{{content}}', filesContent.index)
+      .replace('{{script}}', filesContent.script)
+      .replace('{{style}}', filesContent.css || '');
+
+    if (config.resources) {
+      let resources = [];
+
+      config.resources.forEach((val) => {
+        resources.push(`<script src="${val}"></script>`)
+      });
+
+      tpl = tpl.replace('{{headScript}}', resources.join('\r\n'))
+    } else {
+      tpl = tpl.replace('{{headScript}}', '')
+    }
+
+    res.send(tpl);
+  }).catch((err) => {
+    console.log(err);
+    res.status(404);
+    res.end();
+  });
+});
+
+getExamples().then(() => {
+  app.listen(4000, () => console.log('Filestack Examples server is listening on http://localhost:4000'))
+});