Goyslop/4chan-x
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

firstrun: CSS arrows, changed the close behaviour.

Browse Source
This commit is contained in:
Nicolas Stepien 2011-06-20 02:00:44 +02:00
parent e0fe93d204
commit e3aff3ab6e
2 changed files with 60 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
4chan_x.user.js
View File

@ -2475,24 +2475,19 @@
}; };
firstRun = { firstRun = {
init: function() { init: function() {
var a, aa, css, dialog, style, _i, _len, _results; var css, dialog, style;
css = " #navtopr, #navbotr { font-size: 3em; position: relative; z-index: 99999; } "; css = " #navtopr, #navbotr { position: relative; } #navtopr::before { content: ''; height: 50px; width: 100px; background: red; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform-origin: 100% 200%; -moz-transform-origin: 100% 200%; -o-transform-origin: 100% 200%; position: absolute; top: 100%; right: 100%; z-index: 999; } #navtopr::after { content: ''; border-top: 100px solid red; border-left: 100px solid transparent; position: absolute; top: 100%; right: 100%; z-index: 999; } #navbotr::before { content: ''; height: 50px; width: 100px; background: red; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform-origin: 100% -100%; -moz-transform-origin: 100% -100%; -o-transform-origin: 100% -100%; position: absolute; bottom: 100%; right: 100%; z-index: 999; } #navbotr::after { content: ''; border-bottom: 100px solid red; border-left: 100px solid transparent; position: absolute; bottom: 100%; right: 100%; z-index: 999; } ";
style = $.addStyle(css); style = $.addStyle(css);
style.className = 'firstrun'; style.className = 'firstrun';
dialog = $.el('div', { dialog = $.el('div', {
id: 'overlay', id: 'overlay',
innerHTML: "<div id=options><div class='reply dialog'>Click the <strong>4chan X</strong> link for options.<br>There is another link at the bottom of the page.</div></div>" className: 'firstrun',
innerHTML: "<div id=options><div class='reply dialog'>Click the <strong>4chan X</strong> links for options.<br>There is one on top of and the other at the bottom of the page.</div></div>"
}); });
$.append(d.body, dialog); $.append(d.body, dialog);
aa = $$('#navtopr a, navbotr a'); return $.bind(dialog, 'click', firstRun.close);
_results = [];
for (_i = 0, _len = aa.length; _i < _len; _i++) {
a = aa[_i];
_results.push($.bind(a, 'click', firstRun.click));
}
return _results;
}, },
click: function() { close: function() {
$.setValue('firstrun', true); $.setValue('firstrun', true);
$.rm($('style.firstrun', d.head)); $.rm($('style.firstrun', d.head));
return $.rm($('#overlay')); return $.rm($('#overlay'));

61
script.coffee
View File

@ -1853,9 +1853,57 @@ firstRun =
init: -> init: ->
css = " css = "
#navtopr, #navbotr { #navtopr, #navbotr {
font-size: 3em;
position: relative; position: relative;
z-index: 99999; }
#navtopr::before {
content: '';
height: 50px;
width: 100px;
background: red;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-webkit-transform-origin: 100% 200%;
-moz-transform-origin: 100% 200%;
-o-transform-origin: 100% 200%;
position: absolute;
top: 100%;
right: 100%;
z-index: 999;
}
#navtopr::after {
content: '';
border-top: 100px solid red;
border-left: 100px solid transparent;
position: absolute;
top: 100%;
right: 100%;
z-index: 999;
}
#navbotr::before {
content: '';
height: 50px;
width: 100px;
background: red;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-webkit-transform-origin: 100% -100%;
-moz-transform-origin: 100% -100%;
-o-transform-origin: 100% -100%;
position: absolute;
bottom: 100%;
right: 100%;
z-index: 999;
}
#navbotr::after {
content: '';
border-bottom: 100px solid red;
border-left: 100px solid transparent;
position: absolute;
bottom: 100%;
right: 100%;
z-index: 999;
} }
" "
style = $.addStyle css style = $.addStyle css
@ -1863,14 +1911,13 @@ firstRun =
dialog = $.el 'div', dialog = $.el 'div',
id: 'overlay' id: 'overlay'
innerHTML: "<div id=options><div class='reply dialog'>Click the <strong>4chan X</strong> link for options.<br>There is another link at the bottom of the page.</div></div>" className: 'firstrun'
innerHTML: "<div id=options><div class='reply dialog'>Click the <strong>4chan X</strong> links for options.<br>There is one on top of and the other at the bottom of the page.</div></div>"
$.append d.body, dialog $.append d.body, dialog
aa = $$ '#navtopr a, navbotr a' $.bind dialog, 'click', firstRun.close
for a in aa
$.bind a, 'click', firstRun.click
click: -> close: ->
$.setValue 'firstrun', true $.setValue 'firstrun', true
$.rm $ 'style.firstrun', d.head $.rm $ 'style.firstrun', d.head
$.rm $ '#overlay' $.rm $ '#overlay'