├── .gitignore ├── Hyper-John.gif ├── README.md ├── cena.js ├── index.js └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_STORE 2 | node_modules 3 | *.log 4 | -------------------------------------------------------------------------------- /Hyper-John.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cwright017/hyper-john/87937ee26db2da33c688a7101b4e13a54c53647e/Hyper-John.gif -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Hyper: John! 2 | 3 | A 10% change of getting hit with John Cena when opening new [Hyper](https://hyperterm.org) instances (windows/tabs/splits). 4 | ##### __*Contains flashing images :eyes:__! 5 | 6 | ![Hyper-john](https://raw.githubusercontent.com/Cwright017/hyper-john/master/Hyper-John.gif) 7 | 8 | ### Install 9 | 10 | 1. Open Hyper's preferences with Cmd + , (or open `~/.hyper.js` in an editor). 11 | 2. Add `hyper-john` to your list of plugins: 12 | 13 | ```javascript 14 | plugins: [ 15 | 'hyper-john' 16 | ], 17 | ``` 18 | 3. Fully reload Hyper (`Cmd + Shift + R`), and :boom:! 19 | 20 | ### License 21 | 22 | MIT © [CWright017][author] 23 | 24 | [author]: https://github.com/Cwright017 25 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | const AUDIO_SRC = require('./cena.js'); 2 | 3 | module.exports.decorateTerm = (Term, {React, notify}) => { 4 | return class extends React.Component { 5 | constructor (props, context) { 6 | super(props, context) 7 | this._onTerminal = this._onTerminal.bind(this); 8 | this._audio = new Audio(AUDIO_SRC); 9 | this._audio.onended = this._onAudioEnded.bind(this); 10 | this._audio.onplay = this._onAudioPlay.bind(this); 11 | } 12 | 13 | _onAudioPlay () { 14 | this._audioPlaying = setInterval(() => { 15 | this._shake(); 16 | }, 200); 17 | } 18 | 19 | _resetShake() { 20 | if (this._div) this._div.style.transform = ''; 21 | } 22 | 23 | _resetAudio() { 24 | this._audio.pause(); 25 | this._audio.currentTime = 0; 26 | clearInterval(this._audioPlaying); 27 | } 28 | 29 | _onAudioEnded () { 30 | this._resetAudio(); 31 | this._resetShake(); 32 | } 33 | 34 | //based on shake from 35 | // https://github.com/zeit/hyperpower/blob/master/index.js 36 | _shake () { 37 | const x = (Math.random() * this._window.innerWidth); 38 | const y = (Math.random() * this._window.innerHeight); 39 | this._div.style.transform = `translate3d(${x}px, ${y}px, 0)`; 40 | 41 | setTimeout(() => { 42 | this._resetShake(); 43 | }, 75); 44 | } 45 | 46 | _onTerminal (term) { 47 | this._div = term.div_; 48 | this._window = term.document_.defaultView; 49 | 50 | const johnIndex = Math.floor(Math.random() * 9); 51 | if (johnIndex === 1) { 52 | this._audio.play(); 53 | } 54 | 55 | if (this.props.onTerminal) { 56 | this.props.onTerminal(term); 57 | } 58 | } 59 | 60 | componentWillUnmount () { 61 | this._resetShake(); 62 | this._resetAudio(); 63 | } 64 | 65 | render () { 66 | return React.createElement(Term, Object.assign({}, this.props, { 67 | onTerminal: this._onTerminal 68 | })) 69 | } 70 | } 71 | } 72 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "hyper-john", 3 | "version": "1.1.0", 4 | "description": "Bring John Cena to Hyper, with a 10% change to get hit when opening tabs.", 5 | "main": "index.js", 6 | "repository": "CWright017/hyper-john", 7 | "author": "CWright ", 8 | "license": "MIT", 9 | "dependencies": { 10 | }, 11 | "keywords": [ 12 | "hyper", 13 | "hyperterm", 14 | "hyper-plugin", 15 | "hyperterm-plugin", 16 | "plugin", 17 | "hyper-john", 18 | "John cena" 19 | ] 20 | } 21 | --------------------------------------------------------------------------------