├── src
    ├── icon.png
    ├── manifest.json
    ├── options
    │   ├── options.css
    │   ├── index.html
    │   ├── options.js
    │   └── ie6.1.b.css
    └── event.js
├── one-click-resize-extension.crx
└── readme.md


/src/icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/orangespaceman/one-click-resize-extension/master/src/icon.png


--------------------------------------------------------------------------------
/one-click-resize-extension.crx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/orangespaceman/one-click-resize-extension/master/one-click-resize-extension.crx


--------------------------------------------------------------------------------
/src/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "manifest_version": 2,
 3 |   "name": "One-click Resize",
 4 |   "version": "0.1.0",
 5 |   "description": "Resize your browser to a default size with a single click",
 6 |   "browser_action": {
 7 |     "default_icon": "icon.png"
 8 |   },
 9 |   "icons": {
10 |     "16": "icon.png",
11 |     "48": "icon.png",
12 |     "128": "icon.png"
13 |   },
14 |   "background": {
15 |     "scripts": ["event.js"],
16 |     "persistent": false
17 |   },
18 |   "permissions": [
19 |     "<all_urls>",
20 |     "storage"
21 |   ],
22 |   "options_page": "options/index.html"
23 | }


--------------------------------------------------------------------------------
/readme.md:
--------------------------------------------------------------------------------
 1 | # One-click resize - Chrome extension
 2 | 
 3 | A Chrome extension that resizes your browser to a default size with a single click
 4 | 
 5 | 
 6 | ## Installation
 7 | 
 8 | Open Chrome, open the *extensions view* (chrome://extensions/) and drag/drop the **one-click-resize-extension.crx** file into the window
 9 | 
10 | 
11 | ## Usage
12 | 
13 | The first time you click the icon, you will be redirected to the options page so you can set your preferred resize values.
14 | 
15 | From then on, the browser will be resized (and moved) to this position every time you click the icon.
16 | 
17 | You can change the desired values via the options page linked to from the Chrome extensions page.
18 | 
19 | 


--------------------------------------------------------------------------------
/src/options/options.css:
--------------------------------------------------------------------------------
 1 | /* override style defaults */
 2 | 
 3 | body {
 4 |     width:75%;
 5 | }
 6 | 
 7 | hr {
 8 |     margin:30px 0;
 9 | }
10 | 
11 | a {
12 |     text-decoration:underline;
13 | }
14 | 
15 | button {
16 |     cursor: pointer;
17 |     -webkit-appearance:none;
18 |     background:#fff;
19 |     border:none;
20 |     padding:10px;
21 |     font-size:1.5em;
22 |     margin-right:20px;
23 | }
24 | 
25 | button:hover {
26 |     background:#ff0;
27 | }
28 | 
29 | label {
30 |     min-width: 140px;
31 |     display: inline-block;
32 | }
33 | 
34 | input[type="text"] {
35 |     background:rgba(255,255,255,0.1);
36 |     color:#fff;
37 |     padding:10px;
38 |     font-size:1.5em;
39 |     border:none;
40 | }
41 | 
42 | .saved-note {
43 |     color: #0f0;
44 |     opacity:0;
45 |     transition: opacity 0.5s;
46 | }
47 | 


--------------------------------------------------------------------------------
/src/event.js:
--------------------------------------------------------------------------------
 1 | function resizeWindow (tab) {
 2 | 
 3 |     var storedValues = ['width', 'height', 'left', 'top'];
 4 | 
 5 |     chrome.storage.local.get(storedValues, function (response) {
 6 | 
 7 |         var hasStoredValues = true;
 8 |         storedValues.forEach(function (index) {
 9 |             if (!response[index]) {
10 |                 hasStoredValues = false;
11 |             }
12 |         });
13 | 
14 |         // if this is the first time the script is run,
15 |         // values won't be set, so send the user to the options page to set them
16 |         if (!hasStoredValues) {
17 |             chrome.tabs.create({url: "options/index.html"});
18 |         } else {
19 | 
20 |             // values exist, resize
21 |             chrome.windows.update(chrome.windows.WINDOW_ID_CURRENT, {
22 |                  width: parseInt(response.width, 10),
23 |                  height: parseInt(response.height, 10),
24 |                  left: parseInt(response.left, 10),
25 |                  top: parseInt(response.top, 10)
26 |             });
27 |         }
28 | 
29 |         return true;
30 |     });
31 | }
32 | 
33 | // Add listener to chrome extension button click
34 | chrome.browserAction.onClicked.addListener(resizeWindow);


--------------------------------------------------------------------------------
/src/options/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | <head>
 4 |     <meta charset="utf-8">
 5 |     <title>One-click resize options</title>
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1">
 7 |     <link rel="stylesheet" href="ie6.1.b.css">
 8 |     <link rel="stylesheet" href="options.css">
 9 | </head>
10 | <body class="chrome-bootstrap">
11 |     <main class="wrapper">
12 |         <header>
13 |             <h1>One-click resize options</h1>
14 |         </header>
15 | 
16 |         <h2>Resize your browser to a default size with a single click</h2>
17 | 
18 |         <p>Set your default browser dimensions here. You will be directed here the first time you use the extension, at which point your default browser dimensions will be saved.</p>
19 |         <p>If you want to change your saved preferences at a later date, you can find a link to this options page on the Chrome extensions page.</p>
20 | 
21 |         <hr>
22 | 
23 |         <form>
24 |             <p class="settings width">
25 |                 <label for="width">Width: </label>
26 |                 <input type="text" id="width">
27 |             </p>
28 |             <p class="settings height">
29 |                 <label for="height">Height: </label>
30 |                 <input type="text" id="height">
31 |             </p>
32 |             <p class="settings left">
33 |                 <label for="left">Left: </label>
34 |                 <input type="text" id="left">
35 |             </p>
36 |             <p class="settings top">
37 |                 <label for="top">Top: </label>
38 |                 <input type="text" id="top">
39 |             </p>
40 |             <p>
41 |                 <a class="js-current-values" href="#">Update values to current browser dimensions</a>
42 |             </p>
43 |             <p>
44 |                 <button class="js-save-btn">Save</button>
45 |                 <em class="saved-note js-saved-note">Saved...</em>
46 |             </p>
47 |         </form>
48 | 
49 |         <p><em>NB: there is no validation, entering incorrect values could break the extension</em></p>
50 | 
51 |         <hr>
52 |         <h2>Github</h2>
53 |         <p>The code for this extension is available on github: <a href="https://github.com/orangespaceman/one-click-resize-extension">github.com/orangespaceman/one-click-resize-extension</a></p>
54 |     </main>
55 |     <script src="options.js"></script>
56 | </body>
57 | </html>


--------------------------------------------------------------------------------
/src/options/options.js:
--------------------------------------------------------------------------------
 1 | window.addEventListener('load', function () {
 2 | 
 3 |     // cache page els
 4 |     var widthEl = document.querySelector('input#width');
 5 |     var heightEl = document.querySelector('input#height');
 6 |     var leftEl = document.querySelector('input#left');
 7 |     var topEl = document.querySelector('input#top');
 8 |     var savedEl = document.querySelector('.js-saved-note');
 9 |     var saveBtn = document.querySelector('.js-save-btn');
10 |     var currentValuesBtn = document.querySelector('.js-current-values');
11 | 
12 |     // update input text field values on load
13 |     // retrieve values from chrome extension storage
14 |     // setting defaults of current dimensions if no value found
15 |     var storedValues = ['width', 'height', 'left', 'top'];
16 |     chrome.storage.local.get(storedValues, function (items) {
17 |         widthEl.value = items.width || window.outerWidth;
18 |         heightEl.value = items.height || window.outerHeight;
19 |         leftEl.value = items.left || window.screenX;
20 |         topEl.value = items.top || window.screenY;
21 | 
22 |         // store values on initial page load
23 |         // ensures the options page will only ever appear the first time
24 |         // that the user clicks the resize button
25 |         saveValues();
26 |     });
27 | 
28 |     // update text field values from current browser dimensions when requested
29 |     currentValuesBtn.addEventListener('click', function (e) {
30 |         e.preventDefault();
31 |         widthEl.value = window.outerWidth;
32 |         heightEl.value = window.outerHeight;
33 |         leftEl.value = window.screenX;
34 |         topEl.value = window.screenY;
35 |     });
36 | 
37 |     // Save input text field values to chrome extension storage on save
38 |     saveBtn.addEventListener('click', function (e) {
39 |         e.preventDefault();
40 |         saveValues();
41 |     });
42 | 
43 |     // store values
44 |     function saveValues () {
45 |         // update stored vals
46 |         chrome.storage.local.set({
47 |             width: widthEl.value,
48 |             height: heightEl.value,
49 |             left: leftEl.value,
50 |             top: topEl.value
51 |         }, function () {
52 | 
53 |             // add saved notification
54 |             savedEl.style.opacity = 1;
55 |             setTimeout(function () {
56 |                 savedEl.style.opacity = 0;
57 |             }, 1500);
58 |         });
59 |     }
60 | });


--------------------------------------------------------------------------------
/src/options/ie6.1.b.css:
--------------------------------------------------------------------------------
  1 | /* --------------------------------------------------------------
  2 | Universal Internet Explorer 6 stylesheet:
  3 | http://stuffandnonsense.co.uk/blog/about/universal_internet_explorer_6_css/
  4 | 
  5 | Author: Andy Clarke
  6 | Web site: http://stuffandnonsense.co.uk
  7 | Web site: http://forabeautifulweb.com
  8 | Web site: http://transcending.com
  9 | Web site: http://hardboiledwebdesign.com
 10 | Twitter: http://twitter.com/malarkey
 11 | 
 12 | Version date : 13th June 2010
 13 | Version: 1.1b Light-on-dark version
 14 | 
 15 | License: Creative Commons CC Zero Declaration. No Rights Reserved.
 16 | 
 17 | Based on the work of:
 18 | Mark Boulton: http://markboulton.co.uk
 19 | Eric Meyer: http://meyerweb.com
 20 | Cameron Moll: http://cameronmoll.com
 21 | Richard Rutter: http://clagnut.com
 22 | Khoi Vinh: http://subtraction.com
 23 | 
 24 | -------------------------------------------------------------- */
 25 | 
 26 | html,       body,
 27 | div,      span,
 28 | object,     iframe,
 29 | h1, h2, h3, h4, h5, h6,
 30 | p,         blockquote,
 31 | pre,       a,
 32 | abbr,       acronym,
 33 | address,     code,
 34 | del,       dfn,
 35 | em,       img,
 36 | q,         dl,
 37 | dt,       dd,
 38 | ol,       ul,
 39 | li,       fieldset,
 40 | form,       label,
 41 | legend,     table,
 42 | caption,     tbody,
 43 | tfoot,       thead,
 44 | tr,       th, td {
 45 | margin : 0;
 46 | padding : 0;
 47 | border : 0;
 48 | font-weight : inherit;
 49 | font-style : inherit;
 50 | font-size : 100%;
 51 | font-family : inherit;
 52 | vertical-align : baseline; }
 53 | 
 54 | /* Body ---------------------------------------------------- */
 55 | 
 56 | body {
 57 | width : 60%;
 58 | 
 59 | /* http://www.cameronmoll.com/archives/000892.html */
 60 | width : expression(document.body.clientWidth < 640? "640px" : document.body.clientWidth > 120? "120em" : "auto");
 61 | margin : 0 auto;
 62 | padding : 2em 0;
 63 | font : 100% Georgia, Times, serif;
 64 | line-height : 1.4;
 65 | background :  #181818;
 66 | color : #a8a8a8; }
 67 | 
 68 | /* Headings ---------------------------------------------------- */
 69 | 
 70 | h1, h2, h3, h4, h5, h6 {
 71 | font-weight : normal; color:#fff; }
 72 | 
 73 | h1 {
 74 | margin-bottom : .5em;
 75 | font-size : 2em;
 76 | line-height : 1; }
 77 | 
 78 | h2 {
 79 | margin-bottom : .75em;
 80 | font-size : 1.6em; }
 81 | 
 82 | h3 {
 83 | margin-bottom : 1em;
 84 | font-size : 1.2em;
 85 | line-height : 1 ; }
 86 | 
 87 | h4 {
 88 | margin-bottom : 1.25em;
 89 | font-size : 1.1em;
 90 | line-height : 1.25; }
 91 | 
 92 | h5, h6 {
 93 | margin-bottom : 1.5em;
 94 | font-weight : bold;
 95 | font-size : 1em; }
 96 | 
 97 | h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {
 98 | margin : 0; }
 99 | 
100 | /* Text elements -------------------------------------------------------------- */
101 | 
102 | p {
103 | margin : 0 0 1.5em; }
104 | 
105 | a {
106 | color : #fff;
107 | text-decoration : none; }
108 | 
109 | a:visited {
110 | color : #ddd; }
111 | 
112 | a:focus, a:hover {
113 | color : #ff0;
114 | text-decoration: underline; }
115 | 
116 | a img {
117 | border : none; }
118 | 
119 | blockquote {
120 | margin : 1.5em 1.5em 1.5em -1.5em;
121 | padding-left : 1.5em;
122 | border-left : 1px solid #a8a8a8;
123 | font : italic 1.2em "Times New Roman", Times, serif; }
124 | 
125 | strong {
126 | font-weight : bold; }
127 | 
128 | em, dfn {
129 | font-style : italic; }
130 | 
131 | dfn {
132 | font-weight : bold; }
133 | 
134 | sup, sub {
135 | line-height : 0; }
136 | 
137 | abbr, acronym {
138 | border-bottom : 1px dotted #a8a8a8;
139 | cursor : help; }
140 | 
141 | address {
142 | margin : 0 0 1.5em;
143 | font-style : italic; }
144 | 
145 | del {
146 | color : #666; }
147 | 
148 | pre, code, tt {
149 | margin : 1.5em 1.5em 1.5em -1.5em;
150 | padding-left : 1.5em;
151 | border-left : 1px dotted #a8a8a8;
152 | font : 1em 'andale mono', 'lucida console', monospace;
153 | line-height : 1.5; }
154 | 
155 | pre {
156 | white-space : pre; }
157 | 
158 | 
159 | /* Lists -------------------------------------------------------------- */
160 | 
161 | li ul, li ol {
162 | list-style-type : circle;
163 | margin : 0 1.5em .75em 1.5em; }
164 | 
165 | ul, ol {
166 | margin : 0 1.5em 1.5em 2em; }
167 | 
168 | ul {
169 | list-style-type : disc; }
170 | 
171 | ol {
172 | list-style-type : decimal; }
173 | 
174 | li {
175 | padding-bottom:0.25em; }
176 | 
177 | dl {
178 | margin-bottom: 1.5em;
179 | padding-top: 1.5em;
180 | border-top : 1px solid #a8a8a8; }
181 | 
182 | dl dt {
183 | margin-bottom : .75em;
184 | font-size : 1.2em;
185 | line-height : 1.25; }
186 | 
187 | dd {
188 | margin-bottom: 1.5em;
189 | padding-bottom: 1.5em;
190 | border-bottom : 1px solid #a8a8a8; }
191 | 
192 | /* Tables -------------------------------------------------------------- */
193 | 
194 | table {
195 | border-collapse : separate;
196 | border-spacing : 0;
197 | margin-bottom : 1.4em;
198 | width : 100%; }
199 | 
200 | table, td, th {
201 | vertical-align : top; }
202 | 
203 | th, thead th {
204 | font-weight : bold; }
205 | 
206 | th, td, caption {
207 | padding : 4px 10px 4px 5px;
208 | text-align : left;
209 | font-weight : normal; }
210 | 
211 | th, td {
212 | border-bottom : 1px solid #a8a8a8; }
213 | 
214 | tfoot {
215 | font-size : .9em; }
216 | 
217 | caption {
218 | margin-bottom : 1em;
219 | font-size : 1.5em;
220 | line-height : 1 ; }
221 | 
222 | /* Forms -------------------------------------------------------------- */
223 | 
224 | label {
225 | font-weight : bold; }
226 | 
227 | fieldset {
228 | margin : 0 0 1.5em 0;
229 | padding : 1.4em 1.4em 0 1.4em;
230 | border : 1px solid #a8a8a8; }
231 | 
232 | legend {
233 | font-size : 1.2em;
234 | font-weight : bold; }
235 | 
236 | textarea {
237 | width : 390px;
238 | height : 250px;
239 | padding : 5px; }


--------------------------------------------------------------------------------