forked from drivenotepad/drivenotepad.github.io
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
191 lines (155 loc) · 18.3 KB
/
index.html
File metadata and controls
191 lines (155 loc) · 18.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<link href='https://fonts.googleapis.com/css?family=Chivo:900' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="stylesheets/stylesheet.css" media="screen">
<link rel="stylesheet" type="text/css" href="stylesheets/github-dark.css" media="screen">
<link rel="stylesheet" type="text/css" href="stylesheets/print.css" media="print">
<style type="text/css">
b{
font-weight: bold;
}
header{
padding-left: 130px;
position: relative;
padding-top: 60px;
padding-bottom: 50px;
}
.logo{
width: 128px;
height: 128px;
width: 128px;
height: 128px;
position: absolute;
top: 30px;
left: 0px;
background: url(images/icon-128.png);
}
#by_dm{
position: relative;
bottom: 30px;
margin-left: 5px;
padding: 3px 6px 3px 6px;
background: #396498;
color: #fff;
font-weight: bold;
font-size: 12px;
border-radius: 2px;
letter-spacing: initial;
font-family: sans-serif;
white-space: nowrap;
}
h1 a, h1 a:active, h1 a:visited, h1 a:hover{
color: #000;
}
.linkunit_holder{
text-align: center;
margin-bottom: 10px;
}
.linkunit_inner{
display: inline-block;
margin-left: 10px;
border: 1px solid #000;
background: #FAEBD7;
border-radius: 2px;
font-size: 20px;
padding: 3px 5px 0px 5px;
}
.linkunit_text{
display: inline-block;
}
</style>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<title>Drive Notepad</title>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico?">
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-74999669-1', 'auto');
ga('send', 'pageview');
</script>
<meta name="description" content="View and edit plain-text files in your Google Drive™ without leaving your browser. Drive Notepad is free to use, and provides syntax highlighting for many programming langugages, a find/replace tool, and interactive file-history explorer.">
</head>
<body>
<div id="container">
<div class="inner">
<header>
<a href="\app"><div class="logo" title="launch app"></div></a>
<h1><a href="\app" title="launch app">Drive Notepad</a><span id="by_dm">by DM</span></h1>
View and edit your Google Drive™ files in your browser.
</header>
<hr>
<section id="main_content">
<div class="linkunit_holder">
<div class="linkunit_inner">
<a href="\app">
<img src="images/icon-128.png" width="20px" height="20px">
<div class="linkunit_text">Launch App</div>
</a>
</div>
<div class="linkunit_inner">
<a href="https://plus.google.com/b/108192375095500160194/communities/107691649945880497995">
<img src="https://ssl.gstatic.com/images/icons/gplus-32.png" width="20px" height="20px">
<div class="linkunit_text">Drive Notepad Users</div>
</a>
</div>
</div>
<hr>
<p>The app is hosted <a href="https://help.github.com/categories/github-pages-basics/">free on github</a>, and Google Drive API requests are also <a href="http://stackoverflow.com/a/10313416/2399799">fulfilled for free</a>. This means it costs nothing to keep the app up and running, and hence it can be provided to users for free. Yay!</p>
<p>The editor itself is an instance of the <a href="http://github.com/ajaxorg/ace/">ace.js poject</a> (including the css). The file history viewer uses <a href="http://snowtide.com/jsdifflib">jsdifflib</a> for diffing (the diff-chaining and UI are custom built). The menu icons are from <a href="http://modernuiicons.com/">modernuiicons.com</a>. the shake animation is from <a href="http://daneden.me/animate/">daneden.me</a>, all other CSS is custom "designed". JavaScript keybinding use <a href="https://github.com/madrobby/keymaster">keymaster.js</a>.</p>
<iframe width="560" height="315" src="//www.youtube.com/embed/JhV-8L7Kkvk" frameborder="0" allowfullscreen="true"></iframe>
<h3><a id="news" class="anchor" href="#news" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>News</h3>
<p><b>Mar 2016.</b> Drive Notepad has moved from <code>appspot.com</code> to <code>github.io</code>. It has also undergone a major refresh. The new version should have improved stability, speed and useability, however for the first few days there may be some issues that need resolving. As always, please provide feedback in the <a href="https://plus.google.com/communities/107691649945880497995">Google+ community</a>. </p>
<p><b>Aug 2015. !!!! IMPORTANT !!!!</b> After August 2016 you will no longer be able to use Google Drive as a simple web-server for HTML/JS/CSS/images etc (see this <a href="http://googleappsdeveloper.blogspot.co.uk/2015/08/deprecating-web-hosting-support-in.html">Google blog post</a>).
Your files will not disappear from your Google Drive - you will still be able to access them via the usual web interface and/or desktop sync program, and you will still be able to open them with Drive Notepad (or other similar 3rd party apps), however you will no longer be able to use Google Drive + Drive Notepad as a means of quickly building publicly visible websites. In terms of replacements, there may not be anything quite as easy/free/simple out there, but there are a large number of alternatives with varying strengths.
One option is to create a repository with a <code>gh-pages</code> branch on github and then access it at <code>your_username.github.io/your_repository_name</code>. This is how drivenotepad itself is now being served (although it is a github "organisation" rather than a user). If you know of a better alternative please comment on the <a href="https://plus.google.com/108192375095500160194/posts/ZkW3GwcHyoA">Google+ version of this announcement</a> for others to see.</p>
<h3><a iclass="anchor" href="#faq" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>FAQ</h3>
<p><b>How do I uninstall Drive Notepad?</b> It is not enough to uninstall the Chrome Webstore app, you need to remove Drive Notepad from your Google Drive account - see Google's instruction <a href="http://support.google.com/drive/bin/answer.py?hl=en&answer=2523073">here</a>.</p>
<p><b>How do I log out of Drive Notepad?</b>
If you are logged in to your Google account you will have access to Drive Notepad. Logging out of your Google account will log you out of Drive Notepad in so far as you will not be able to open new pages with Drive Notepad. However, to fully log out you you must close all Drive Notepad tabs in your browser. If you want to prevent Drive Notepad from ever being able to access your files again then see <a href="http://support.google.com/drive/bin/answer.py?hl=en&answer=2523073">here</a>.
</p>
<p><b>It doesn't work! Huh?!</b>
There are many web browsers and operating systems in existence, but only a very limited number have been used during testing, and fewer still were found to give the fully correct experience. If possible, use Google Chrome. If that's not an option, try Firefox or Microsof's Edge browser. If you really are restricted to some other browser, then unfortunately it is unlikely that Drive Notepad will work for you, but please post in the Google+ community to see whether there is anything that can be done. Sometime the problem is not with the browser but with a virus, popup/ad blocker or extension. To test this, try opening your browser with extensions disabled ("incognito" mode in Chrome), and try it on a separate computer. If the problem persists please report it in the Google+ community.
</p>
<p><b>My non-English characters are mangled.</b>
This is a highly confusing topic, the story goes like this: in Unicode there are thousands of characters, each with its own unique ID called a "code point". When writing text on a computer you can choose to use the unicode IDs (we'll come back to this in a moment) or you can choose to use something else entirely. If you go with the "something else entirely" option, then you may get lucky and find that the IDs in your alternative system line up roughly speaking with the IDs in unicode, which is the case for <a href="https://en.wikipedia.org/wiki/Windows-1252">Windows-1252</a>, but in general the IDs in your special system will have no particular correspondence to IDs in unicode.</p><p> So, back to unicode: although every character has a unique "ID" (or "code point"), there are several ways you can choose to write it down. One option is to simply spell out all 32bits for each character (since IDs are at most 32 bits long), this is called UTF-32. Although this is a possibility, it's rather wasteful because it's rare to use IDs with high values. Another option is to use 16bits most of the time, and have a special code to allow expansion to 32bits on individual rare occasions. This means the total size of the text is now smaller, however it introduces compelixities for programmers as there is now no fixed correspondence between the size of a string in bytes and its length in characters. In fact, once you start with these compelxities you could <a href="http://unicode.org/faq/utf_bom.html#gen6">choose</a> to go down to 8 bits, with occasional expansion to 16 or more bits. Not surprisingly, these schemes are known as UTF-16 and UTF-8. One final thing to note is that the 32bits in UTF-32 are formed of 4 bytes, and those bytes can be ordered in memory in either little or big "endian" form (and similarly for the two bytes of UTF-16). Usually, files encoded with UTF16 or UTF32 will begin with a special "<a href='https://en.wikipedia.org/wiki/Byte_order_mark'>Byte Order Mark</a>" (BOM) which states unambiguously which order the bytes appear within each unit. Sometimes there is a BOM included in UTF8 as well, although this is redundant as UTF8 is composed of one-byte units.*</p>
<p>So, why then are your characters mangled by Drive Notepad? Well, the application aims to support UTF8 and UTF16 (both little and big endian), but it does not support UTF32 or other non-unicode encodings. If you know your file is encoded with UTF8 or UTF16 but it's not rendered correctly by Drive Notepad then please post in the Google+ Community, and ideally provide a sample file and note your operating system and browser. If you think that the application should support other encodings then please also use the Google+ community to explain why. Note that files are saved in UTF-8 format.</p>
<p>*This is actually not quite the end of the story, though things get a bit hazzier now...JavaScript uses unicode IDs, with 16bit units, but it doesn't strictly speaking implement UTF-16. Instead, for IDs larger than 16bits, it spuriously separates the two halves into two seemingly separate characters. And then there's <code>atob</code> and <code>btoa</code> which work only on 8-bit characters, turning a 3-tuple of 8-bit characters into a 4-tuple of 6-bit characters (and back again). That gets used internally by the google client library.</p>
<p>Well, you get the idea: putting words on a page can sometimes turn out to be rather complicated.</p>
<p><b>Can I hide line numbers and/or change other configuration of ace?</b>
Most of the settings you are likely to want to change are shown in the settings tab of the widget. And any changes you make there will be <a href="http://support.google.com/drive/bin/answer.py?hl=en&answer=2409045">remembered</a> across visits to Drive Notepad. However, the editor, which is an open source project called <a href="http://github.com/ajaxorg/ace/">ace</a> has a "secret" settings menu built in which provides some additional options. Use the keyboard shortcut <code>Ctrl/Cmd-,</code> (that's a comma) to access the menu. These extra settings will not be remembered across visits to Drive Notepad, and may possibly interfere with the working of the application (though in most cases that is unlikely). If you really want a particular setting to be "upgraded", i.e. to be fully supported, then please post in the Google+ community.
</p>
<p><b>Can I access/modify my document programatically? [Advanced Users]</b>
Although Drive Notepad doesn't "officially" support interfering with the editor/document programatically, you can in fact do so fairly easily. Open your dev console and type <code>dn.editor</code>. That's the main instance of <a href="http://github.com/ajaxorg/ace/">ace</a> that you see in the page. To read the document use <code>dn.editor.session.getValue()</code> and to set it use <code>dn.editor.session.setValue(some_value)</code>. You can also use all the other methods described in the ace API reference. Note, however, that some actions may interfere with the running of the applciation in unexpected ways, so be careful! If you find yourself using the command line often, then please consider posting in the Google+ community, describing what it is you're doing. It might be of interest to other users and could perhaps inspire a new feature for the app. It might also be worth mentioning that the source for Drive Notepad itself is available on <a href="https://github.com/drivenotepad/app">github</a>.
<p><b>How secure is Drive Notepad?</b>
DM is not a specialist in security, but Drive Notepad is likely to be reasonably secure as it only consists of the code running in your browser, i.e. there is no customized backend server or database with users' information. The application is served from github, and API requests are made directly to Google, using Google's own JavaScript library. Your personal settings are <a href="https://developers.google.com/drive/v3/web/appdata#what_is_the_application_data_folder">stored</a> in your Google Drive. See below for privacy policy regarding Google Analytics.
</p>
<p><b>Can I go back to a previous version of a file?</b> Yes. Yes, you can. Version control is very much part of Google Drive, and Drive Notepad in theory should never mess this up. See Google's help <a href="http://support.google.com/drive/bin/answer.py?hl=en&answer=2409045">here</a>. Drive Notepad now has a tool built in that lets you view the history of a file in an interactive way - click the history button in the file tab or use the shorcut ctrl-H. Be gentle with the history tool as it's still under development and may still have the odd bug (it won't mess up your file but it might not yet show you what you need)!</p>
<h3><a id="ads" class="ads" href="#ads" name="ads" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Why have ads?</h3>
<p><b>Note that currently ads are disabled.</b> It takes time and effort to make and maintain a web app, and ad revenue supports and encourages the developer to invest time in doing so. The ads in Drive Notepad are hand picked from <a href="cj.com">cj.com</a>, which runs what is known as an "affiliate program". Income is generated not when a users clicks on an ad, but if and when the user actually engages with the advertiser's business in some way, which generally means purchasing a product (and not returning it!). The ads in Drive Notepad appear on the right-hand side of the page roughly every 15 minutes, disapearing automatically after about 1 minute, or when the user clicks 'close'. It is hoped that this level of advertising will be sufficiently discrete so as to not distract from working on documents within the application. Note that you can set a narrow word wrap width in the settings tab if you don't want ads to cover up your content. If you want to express an opinion on this matter then please post in the Google+ Community. Note that there is currently no plan to have a paid-for ad-free version of the application.</p>
<h3><a id="privacy" class="anchor" href="#privacy" name="privacy" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Privacy Policy</h3>
<p>This website uses Google Analytics to help Analyse how users use the site. The tool uses "cookies," which are text files placed on your computer, to collect standard Internet log information and visitor behavior information in an anonymous form. The information generated by the cookie about your use of the website (including IP address) is transmitted to Google. This information is then used by the developer to evaluate visitors' use of the website and to compile statistical reports on website activity.</p>
<p>Drive Notepad will never (and will not allow any third party to) use the statistical analytics tool to track or to collect any Personally Identifiable Information (PII) of visitors to the site. Google will not associate your IP address with any other data held by Google. Neither Drive Notepad nor Google will link, or seek to link, an IP address with the identity of a computer user. Drive Notepad will not associate any data gathered from this site with any Personally Identifiable Information from any source.</p>
<p>You may choose to accept or decline cookies. Most Web browsers automatically default to accept them, but you can usually modify your browser setting to decline cookies. If you decline cookies by changing your browser settings then Drive Notepad willl no longer be able to function because the communication with Google Drive relies on cookies.</p>
</section>
<footer>
<a href="https://github.com/drivenotepad/app">source on github</a> |
<a href="https://chrome.google.com/webstore/detail/drive-notepad/gpgjomejfimnbmobcocilppikhncegaj">chrome extension</a> |
<a href="https://plus.google.com/communities/107691649945880497995">google+ community</a> |
<a href="d1manson.wordpress.com">developer's blog</a> |
DM, Mar 2016.
<br><br>
Drive Notepad is not affiliated with Google, it is made by DM.<br>
Google Drive is a trademark of Google Inc. Use of this trademark is subject to Google Permissions.<br>
This page uses the tactile theme by <a href="https://twitter.com/jasonlong">Jason Long</a><br>
</footer>
</div>
</div>
</body>
</html>