├── .github └── ISSUE_TEMPLATE │ └── config.yml ├── .gitignore ├── CNAME ├── LICENSE ├── README.md ├── demo.css ├── demo.js ├── firebase.json └── index.html /.github/ISSUE_TEMPLATE/config.yml: -------------------------------------------------------------------------------- 1 | blank_issues_enabled: false 2 | contact_links: 3 | - name: 🛑 Repository Archived 4 | url: https://firebase.google.com/docs/samples 5 | about: This repository is archived. Visit our samples page for a list of up-to-date samples. 6 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .idea 2 | *.iml 3 | *sw? 4 | node_modules 5 | -------------------------------------------------------------------------------- /CNAME: -------------------------------------------------------------------------------- 1 | demo.firepad.io 2 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2013 Firebase, https://www.firebase.com/ 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy 4 | of this software and associated documentation files (the “Software”), to deal 5 | in the Software without restriction, including without limitation the rights 6 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 7 | copies of the Software, and to permit persons to whom the Software is 8 | furnished to do so, subject to the following conditions: 9 | 10 | The above copyright notice and this permission notice shall be included in 11 | all copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 19 | THE SOFTWARE. 20 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Sources for http://demo.firepad.io/ 2 | 3 | Although this is a gh-pages branch, we actually serve the site from Firebase 4 | Hosting now, so to deploy the site, run: 5 | 6 | firebase deploy 7 | 8 | ## Status 9 | 10 | ![Status: Archived](https://img.shields.io/badge/Status-Archived-red) 11 | 12 | This sample is no longer actively maintained and is left here for reference only. 13 | 14 | -------------------------------------------------------------------------------- /demo.css: -------------------------------------------------------------------------------- 1 | html { 2 | height: 100%; 3 | } 4 | 5 | body { 6 | margin: 0; 7 | width: 100%; 8 | height: 100%; 9 | font-family: "Helvetica Neue", sans-serif; 10 | min-width: 1020px; 11 | min-height: 400px; 12 | } 13 | 14 | .sprite-btn { 15 | display: inline-block; 16 | text-decoration: none; 17 | text-indent: -999999px; 18 | vertical-align: middle; 19 | } 20 | 21 | #top { 22 | position: relative; 23 | width: 100%; 24 | height: 100%; 25 | min-height: 400px; 26 | color: white; 27 | background-color: #fff; /* layer fill content */ 28 | background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSIxNC42NjMwOTkyNDgxNzQxJSIgeTE9Ii04LjgxMDQ3ODg5MTEyMDQ1JSIgeDI9Ijg1LjMzNjkwMDc1MTgyNTklIiB5Mj0iMTA4LjgxMDQ3ODg5MTEyJSI+CjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmMTY1MjEiIHN0b3Atb3BhY2l0eT0iMSIvPgo8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmYxMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogICA8L2xpbmVhckdyYWRpZW50PgoKPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjaGF0MCkiIC8+Cjwvc3ZnPg==); /* gradient overlay */ 29 | background-image: -moz-linear-gradient(301deg, #f16521 0%, #fff100 100%); /* gradient overlay */ 30 | background-image: -o-linear-gradient(301deg, #f16521 0%, #fff100 100%); /* gradient overlay */ 31 | background-image: -webkit-linear-gradient(301deg, #f16521 0%, #fff100 100%); /* gradient overlay */ 32 | background-image: linear-gradient(149deg, #f16521 0%, #fff100 100%); /* gradient overlay */ 33 | } 34 | 35 | #top-bg-tile { 36 | background-image: url('https://www.firepad.io/images/pixelbg.png'); 37 | width: 100%; 38 | height: 100%; 39 | } 40 | 41 | #firepad-demo { 42 | position: absolute; 43 | left: 30px; 44 | top: 30px; 45 | background-image: url('https://www.firepad.io/images/firepad-demo.png'); 46 | width: 174px; 47 | height: 38px; 48 | } 49 | 50 | #my-pads { 51 | position: absolute; 52 | background-image: url('https://www.firepad.io/images/my_pads.png'); 53 | width: 120px; 54 | height: 36px; 55 | right: 230px; 56 | top: 27px; 57 | cursor: pointer; 58 | cursor: hand; 59 | } 60 | 61 | #my-pads:active { 62 | background-image: url('https://www.firepad.io/images/my_pads_pressed.png'); 63 | } 64 | 65 | #my-pads-list { 66 | border: 1px solid #1b5ee9; 67 | -webkit-border-radius: 3px; 68 | -moz-border-radius: 3px; 69 | border-radius: 3px; 70 | background: #fff; 71 | position: absolute; 72 | right: 230px; 73 | top: 59px; 74 | max-height: 150px; 75 | overflow-y: auto; 76 | width: 150px; 77 | z-index: 10; 78 | display: none; 79 | } 80 | 81 | .my-pads-item { 82 | width: 100%; 83 | border-bottom: 1px solid #ccc; 84 | } 85 | 86 | #my-pads-list a { 87 | font-size: 15px; 88 | color: #0088cc; 89 | margin: 5px 10px; 90 | cursor: pointer; 91 | cursor: hand; 92 | display: inline-block; 93 | } 94 | 95 | #my-pads-list a:hover { 96 | text-decoration: underline; 97 | color: #eb8717; 98 | } 99 | 100 | #create-pad { 101 | position: absolute; 102 | background-image: url('https://www.firepad.io/images/create-pad.png'); 103 | width: 190px; 104 | height: 36px; 105 | right: 30px; 106 | top: 27px; 107 | cursor: pointer; 108 | cursor: hand; 109 | } 110 | 111 | #create-pad:active { 112 | background-image: url('https://www.firepad.io/images/create-pad-pressed.png'); 113 | } 114 | 115 | #firepad-container { 116 | position: absolute; 117 | left: 30px; 118 | top: 80px; 119 | right: 30px; 120 | bottom: 125px; 121 | background: white; 122 | /* TODO: Tune these more? */ 123 | -moz-box-shadow: 0 5px 25px #333; 124 | -webkit-box-shadow: 0 5px 25px #333; 125 | box-shadow: 0 5px 25px #333; 126 | } 127 | 128 | #firepad-container .firepad-userlist { 129 | position: absolute; 130 | left: 0; 131 | top: 0; 132 | bottom: 0; 133 | width: 175px; 134 | height: auto; 135 | } 136 | 137 | #firepad-container .firepad { 138 | position: absolute; 139 | left: 175px; 140 | right: 0; 141 | top: 0; 142 | bottom: 0; 143 | width: auto; 144 | height: auto; 145 | } 146 | 147 | #share-box { 148 | position: absolute; 149 | left: 30px; 150 | bottom: 40px; 151 | width: 650px; 152 | height: 56px; 153 | } 154 | 155 | #share-with-friends { 156 | font-size: 24px; 157 | color: white; 158 | text-shadow: 0 0 3px #555; 159 | } 160 | 161 | #share-features { 162 | height: 35px; 163 | } 164 | 165 | #share-features tr { 166 | margin-right: 10px; 167 | } 168 | 169 | #description { 170 | position: absolute; 171 | bottom: 20px; 172 | right: 40px; 173 | width: 380px; 174 | height: 80px; 175 | font-size: 18px; 176 | color: #282828; 177 | } 178 | 179 | #learn-more { 180 | margin-top: 10px; 181 | } 182 | 183 | #learn-more a { 184 | color: #dc4700; 185 | } 186 | 187 | #powered-by-firebase { 188 | position: absolute; 189 | right: 40px; 190 | bottom: 15px; 191 | width: 129px; 192 | height: 34px; 193 | background-image: url('https://www.firepad.io/images/powered-by-firebase-dim.png'); 194 | } 195 | 196 | #url { 197 | width: 280px; 198 | height: 30px; 199 | border: 1px solid #a5a5a5; 200 | font-size: 14px; 201 | color: #a6a6a6; 202 | text-align: center; 203 | cursor: pointer; 204 | } 205 | 206 | .fb-like 207 | { 208 | transform: scale(1.3); 209 | -ms-transform: scale(1.3); 210 | -webkit-transform: scale(1.3); 211 | -o-transform: scale(1.3); 212 | -moz-transform: scale(1.3); 213 | transform-origin: bottom left; 214 | -ms-transform-origin: bottom left; 215 | -webkit-transform-origin: bottom left; 216 | -moz-transform-origin: bottom left; 217 | -webkit-transform-origin: bottom left; 218 | } 219 | -------------------------------------------------------------------------------- /demo.js: -------------------------------------------------------------------------------- 1 | var firepad = null, userList = null, codeMirror = null; 2 | 3 | function joinFirepadForHash() { 4 | if (firepad) { 5 | // Clean up. 6 | firepad.dispose(); 7 | userList.dispose(); 8 | $('.CodeMirror').remove(); 9 | } 10 | 11 | var id = window.location.hash.replace(/#/g, '') || randomString(10); 12 | var url = window.location.toString().replace(/#.*/, '') + '#' + id; 13 | firebase.initializeApp({ 14 | apiKey: '', 15 | authDomain: "firepad.firebaseapp.com", 16 | databaseURL: "https://firepad.firebaseio.com" 17 | }); 18 | var firepadRef = firebase.database().ref('demo').child(id); 19 | 20 | var userId = firepadRef.push().key; // Just a random ID. 21 | codeMirror = CodeMirror(document.getElementById('firepad'), { lineWrapping: true }); 22 | firepad = Firepad.fromCodeMirror(firepadRef, codeMirror, 23 | { richTextToolbar: true, richTextShortcuts: true, userId: userId}); 24 | userList = FirepadUserList.fromDiv(firepadRef.child('users'), 25 | document.getElementById('firepad-userlist'), userId); 26 | 27 | firepad.on('ready', function() { 28 | if (firepad.isHistoryEmpty()) { 29 | firepad.setText('Welcome to your own private pad!\n\nShare the URL below and collaborate with your friends.'); 30 | } 31 | 32 | ensurePadInList(id); 33 | buildPadList(); 34 | }); 35 | 36 | codeMirror.focus(); 37 | 38 | window.location = url; 39 | $('#url').val(url); 40 | $("#url").on('click', function(e) { 41 | $(this).focus().select(); 42 | e.preventDefault(); 43 | return false; 44 | }); 45 | } 46 | 47 | function padListEnabled() { 48 | return (typeof localStorage !== 'undefined' && typeof JSON !== 'undefined' && localStorage.setItem && 49 | localStorage.getItem && JSON.parse && JSON.stringify); 50 | } 51 | 52 | function ensurePadInList(id) { 53 | if (!padListEnabled()) { return; } 54 | var list = JSON.parse(localStorage.getItem('demo-pad-list') || "{ }"); 55 | if (!(id in list)) { 56 | var now = new Date(); 57 | var year = now.getFullYear(), month = now.getMonth() + 1, day = now.getDate(); 58 | var hours = now.getHours(), minutes = now.getMinutes(); 59 | if (hours < 10) { hours = '0' + hours; } 60 | if (minutes < 10) { minutes = '0' + minutes; } 61 | 62 | list[id] = [year, month, day].join('/') + ' ' + hours + ':' + minutes; 63 | 64 | localStorage.setItem('demo-pad-list', JSON.stringify(list)); 65 | buildPadList(); 66 | } 67 | } 68 | 69 | function buildPadList() { 70 | if (!padListEnabled()) { return; } 71 | $('#my-pads-list').empty(); 72 | 73 | var list = JSON.parse(localStorage.getItem('demo-pad-list') || '{ }'); 74 | for(var id in list) { 75 | $('#my-pads-list').append( 76 | $('
').addClass('my-pads-item').append( 77 | makePadLink(id, list[id]) 78 | )); 79 | } 80 | } 81 | 82 | function makePadLink(id, name) { 83 | return $('') 84 | .text(name) 85 | .on('click', function() { 86 | window.location = window.location.toString().replace(/#.*/, '') + '#' + id; 87 | $('#my-pads-list').hide(); 88 | return false; 89 | }); 90 | } 91 | 92 | function randomString(length) { 93 | var text = ""; 94 | var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; 95 | 96 | for(var i=0; i < length; i++) 97 | text += possible.charAt(Math.floor(Math.random() * possible.length)); 98 | 99 | return text; 100 | } 101 | 102 | $(window).on('ready', function() { 103 | joinFirepadForHash(); 104 | setTimeout(function() { 105 | $(window).on('hashchange', joinFirepadForHash); 106 | }, 0); 107 | }); 108 | -------------------------------------------------------------------------------- /firebase.json: -------------------------------------------------------------------------------- 1 | { 2 | "firebase": "firepad-demosite", 3 | "public": ".", 4 | "ignore": [ 5 | "firebase.json", 6 | "**/.*", 7 | "**/node_modules/**" 8 | ] 9 | } 10 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Firepad Demo 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 24 |
25 |
26 |
27 |
28 | 29 | 30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
Edit with Friends
38 |
39 | 40 | 41 | 44 | 47 | 51 | 52 |
42 | 43 | 45 | 46 | 48 | 49 |
50 |
53 |
54 |
55 |
Firepad is an open source collaborative text editor you can add to your own website. 56 | 57 |
58 | 59 |
60 |
61 |
62 | 63 | 64 | 65 | 66 | 67 | 68 | 82 | 83 | 88 | 89 | 90 | --------------------------------------------------------------------------------