<%= process.env.npm_package

diff --git a/README.md b/README.md index 6959969..bee0d8d 100644 --- a/README.md +++ b/README.md @@ -56,7 +56,7 @@ For convenience, I add the `budo` command to the `scripts` section of my ```json { "scripts": { - "start": "budo index.js" + "start": "budo index.js:bundle.js" } } ``` diff --git a/electron-webpack-vuejs/.gitignore b/electron-webpack-vuejs/.gitignore new file mode 100644 index 0000000..0841ed3 --- /dev/null +++ b/electron-webpack-vuejs/.gitignore @@ -0,0 +1,3 @@ +dist +node_modules +package-lock.json \ No newline at end of file diff --git a/electron-webpack-vuejs/README.md b/electron-webpack-vuejs/README.md new file mode 100644 index 0000000..e5b86ce --- /dev/null +++ b/electron-webpack-vuejs/README.md @@ -0,0 +1,10 @@ +# Electron with webpack and Vue.js + +> [https://youtu.be/oL7vIDkDOsg](https://youtu.be/oL7vIDkDOsg) + +Install [Node.js](https://nodejs.org/). + +Within this folder run the terminal command `npm install` to install the +`dependencies` and `devDependencies`. + +Then run `npm start` to run the app. diff --git a/electron-webpack-vuejs/package.json b/electron-webpack-vuejs/package.json new file mode 100644 index 0000000..cd652ea --- /dev/null +++ b/electron-webpack-vuejs/package.json @@ -0,0 +1,24 @@ +{ + "name": "electron-webpack-vuejs", + "version": "0.1.0", + "description": "", + "main": "index.js", + "scripts": { + "start": "electron-webpack dev", + "build": "electron-webpack && electron-builder -c.mac.identity=null" + }, + "author": "Kyle Robinson Young (http://dontkry.com)", + "license": "MIT", + "devDependencies": { + "electron": "^2.0.2", + "electron-builder": "^20.15.1", + "electron-webpack": "^2.1.2", + "vue": "^2.5.16", + "vue-loader": "^15.2.2", + "vue-template-compiler": "^2.5.16", + "webpack": "^4.9.1" + }, + "dependencies": { + "source-map-support": "^0.5.6" + } +} diff --git a/electron-webpack-vuejs/src/index.html b/electron-webpack-vuejs/src/index.html new file mode 100644 index 0000000..b438956 --- /dev/null +++ b/electron-webpack-vuejs/src/index.html @@ -0,0 +1,18 @@ + + + + <%= process.env.npm_package_productName %> + + + + +

+ + diff --git a/electron-webpack-vuejs/src/main/index.js b/electron-webpack-vuejs/src/main/index.js new file mode 100644 index 0000000..acd13a1 --- /dev/null +++ b/electron-webpack-vuejs/src/main/index.js @@ -0,0 +1,32 @@ +import { app, BrowserWindow } from 'electron' +import path from 'path' +import { format as formatUrl } from 'url' + +const isDevelopment = process.env.NODE_ENV !== 'production' + +app.on('ready', () => { + let window = new BrowserWindow({ + width: 1024, + webPreferences: { + nodeIntegration: true + } + }) + if (isDevelopment) { + window.loadURL(`http://localhost:${process.env.ELECTRON_WEBPACK_WDS_PORT}`) + } else { + window.loadURL(formatUrl({ + pathname: path.join(__dirname, 'index.html'), + protocol: 'file', + slashes: true + })) + } + window.on("closed", () => { + window = null; + }) +}) + +app.on("window-all-closed", () => { + if (process.platform !== "darwin") { + app.quit(); + } +}) \ No newline at end of file diff --git a/electron-webpack-vuejs/src/renderer/App.vue b/electron-webpack-vuejs/src/renderer/App.vue new file mode 100644 index 0000000..49f4ae4 --- /dev/null +++ b/electron-webpack-vuejs/src/renderer/App.vue @@ -0,0 +1,13 @@ + + + \ No newline at end of file diff --git a/electron-webpack-vuejs/src/renderer/index.js b/electron-webpack-vuejs/src/renderer/index.js new file mode 100644 index 0000000..734a3c1 --- /dev/null +++ b/electron-webpack-vuejs/src/renderer/index.js @@ -0,0 +1,8 @@ +import Vue from 'vue' +import App from './App.vue' +new Vue({ + el: '#app', + render(h) { + return h(App) + } +}) \ No newline at end of file diff --git a/electron-webpack-vuejs/webpack.config.js b/electron-webpack-vuejs/webpack.config.js new file mode 100644 index 0000000..f9d3d0e --- /dev/null +++ b/electron-webpack-vuejs/webpack.config.js @@ -0,0 +1,14 @@ +const VueLoaderPlugin = require('vue-loader/lib/plugin') +module.exports = { + module: { + rules: [ + { + test: /\.vue$/, + use: 'vue-loader' + } + ] + }, + plugins: [ + new VueLoaderPlugin() + ] +} \ No newline at end of file diff --git a/how-to-make-chrome-extensions/bear/content.js b/how-to-make-chrome-extensions/bear/content.js index e11d1c4..b249bae 100644 --- a/how-to-make-chrome-extensions/bear/content.js +++ b/how-to-make-chrome-extensions/bear/content.js @@ -6,7 +6,8 @@ // }) const re = new RegExp('bear', 'gi') -const matches = document.documentElement.innerHTML.match(re) +const matches = document.documentElement.innerHTML.match(re) || [] + chrome.runtime.sendMessage({ url: window.location.href, count: matches.length diff --git a/javascript-filereader/README.md b/javascript-filereader/README.md new file mode 100644 index 0000000..f2e3785 --- /dev/null +++ b/javascript-filereader/README.md @@ -0,0 +1,10 @@ +# JavaScript FileReader + +> [https://www.youtube.com/watch?v=-AR-6X_98rM](https://www.youtube.com/watch?v=-AR-6X_98rM) + +Install [Node.js](https://nodejs.org/). + +Within this folder run the terminal command `npm install` to install the +`dependencies` and `devDependencies`. + +Then run `npm start` to run the app viewable on `http://localhost:9966`. diff --git a/javascript-filereader/bear.jpg b/javascript-filereader/bear.jpg new file mode 100644 index 0000000..3b4a4ae Binary files /dev/null and b/javascript-filereader/bear.jpg differ diff --git a/javascript-filereader/bears.csv b/javascript-filereader/bears.csv new file mode 100644 index 0000000..771bfa2 --- /dev/null +++ b/javascript-filereader/bears.csv @@ -0,0 +1,3 @@ +name,type +tim,grizzly +randy,brown \ No newline at end of file diff --git a/javascript-filereader/index.html b/javascript-filereader/index.html new file mode 100644 index 0000000..1a19517 --- /dev/null +++ b/javascript-filereader/index.html @@ -0,0 +1,13 @@ + + + + + JS FileReader + + + + + + + + \ No newline at end of file diff --git a/javascript-filereader/index.js b/javascript-filereader/index.js new file mode 100644 index 0000000..2b3ef6f --- /dev/null +++ b/javascript-filereader/index.js @@ -0,0 +1,56 @@ +const input = document.querySelector('input[type="file"]') +function handleFiles (files) { + console.log(files) + const reader = new FileReader() + reader.onload = function () { + // const lines = reader.result.split('\n').map(function (line) { + // return line.split(',') + // }) + // console.log(lines) + const img = new Image() + img.onload = function () { + const canvas = document.createElement('canvas') + const context = canvas.getContext('2d') + context.drawImage(img, 0, 0) + + const imageData = context.getImageData(0, 0, canvas.width, canvas.height) + const data = imageData.data + for (var i = 0; i <= data.length; i += 4) { + const avg = (data[i] + data[i + 1] + data[i + 2]) / 3 + data[i] = avg + data[i + 1] = avg + data[i + 2] = avg + } + context.putImageData(imageData, 0, 0) + + document.body.appendChild(canvas) + //canvas.toDataURL() + //const csvfile = new Blob(['one,two,three'], { type: 'text/csv' }) + canvas.toBlob(function (blob) { + const form = new FormData() + form.append('image', blob, 'moody.jpg') + const xhr = new XMLHttpRequest() + xhr.open('POST', '/imageupload', true) + xhr.send(form) + }) + } + img.src = reader.result + //document.body.appendChild(img) + } + //reader.readAsText(files[0]) + reader.readAsDataURL(files[0]) +} + +input.addEventListener('change', function (e) { + handleFiles(input.files) +}, false) + +document.addEventListener('dragover', function (e) { + e.preventDefault() + e.stopPropagation() +}, false) +document.addEventListener('drop', function (e) { + e.preventDefault() + e.stopPropagation() + handleFiles(e.dataTransfer.files) +}, false) \ No newline at end of file diff --git a/javascript-filereader/package.json b/javascript-filereader/package.json new file mode 100644 index 0000000..270a1f7 --- /dev/null +++ b/javascript-filereader/package.json @@ -0,0 +1,14 @@ +{ + "name": "javascript-filereader", + "version": "0.1.0", + "description": "", + "main": "index.js", + "scripts": { + "start": "budo index.js:bundle.js" + }, + "author": "Kyle Robinson Young (http://dontkry.com)", + "license": "MIT", + "devDependencies": { + "budo": "^11.2.2" + } +} diff --git a/vuejs-computed-properties/App.vue b/vuejs-computed-properties/App.vue new file mode 100644 index 0000000..3bc8f6a --- /dev/null +++ b/vuejs-computed-properties/App.vue @@ -0,0 +1,69 @@ + + + \ No newline at end of file diff --git a/vuejs-computed-properties/README.md b/vuejs-computed-properties/README.md new file mode 100644 index 0000000..7a5eefd --- /dev/null +++ b/vuejs-computed-properties/README.md @@ -0,0 +1,10 @@ +# Vue.js Computed Properties + +> [https://www.youtube.com/watch?v=8antoF7LyIo](https://www.youtube.com/watch?v=8antoF7LyIo) + +Install [Node.js](https://nodejs.org/). + +Within this folder run the terminal command `npm install` to install the +`dependencies` and `devDependencies`. + +Then run `npm start` to run the app viewable on `http://localhost:9966`. diff --git a/vuejs-computed-properties/index.html b/vuejs-computed-properties/index.html new file mode 100644 index 0000000..e16f160 --- /dev/null +++ b/vuejs-computed-properties/index.html @@ -0,0 +1,11 @@ + + + + + Document + + +

+ + + \ No newline at end of file diff --git a/vuejs-computed-properties/index.js b/vuejs-computed-properties/index.js new file mode 100644 index 0000000..49fe2a2 --- /dev/null +++ b/vuejs-computed-properties/index.js @@ -0,0 +1,28 @@ +const Vue = require('vue') +const App = require('./App.vue') + +const beardb = { + 'bear1': { + name: 'Oliver', + type: 'grizzly' + }, + 'bear3': { + name: 'Sheryl', + type: 'brown' + }, + 'bear55': { + name: 'Frank', + type: 'polar' + }, +} + +new Vue({ + el: '#app', + render: function (h) { + return h(App, { + props: { + beardb: beardb + } + }) + } +}) \ No newline at end of file diff --git a/vuejs-computed-properties/package.json b/vuejs-computed-properties/package.json new file mode 100644 index 0000000..8f6f8b5 --- /dev/null +++ b/vuejs-computed-properties/package.json @@ -0,0 +1,22 @@ +{ + "name": "vuejs-computed-properties", + "version": "0.1.0", + "description": "", + "main": "index.js", + "scripts": { + "start": "budo index.js:bundle.js -- -t vueify", + "test": "node test.js" + }, + "browser": { + "vue": "vue/dist/vue.common.js" + }, + "author": "Kyle Robinson Young (http://dontkry.com)", + "license": "MIT", + "devDependencies": { + "budo": "^11.2.0", + "vueify": "^9.4.1" + }, + "dependencies": { + "vue.js": "^0.3.2" + } +}