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

Get Flex actually working

Browse Source
This commit is contained in:
Zixaphir 2013-08-19 09:06:31 -07:00
parent eb12134f6c
commit 1facbe7dc1
15 changed files with 233 additions and 193 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
Gruntfile.coffee
View File

@ -145,18 +145,32 @@ module.exports = (grunt) ->
pkg = grunt.config 'pkg'
pkg.type = type;
grunt.config 'pkg', pkg
pkg.sizing = if type is 'crx'
'box-sizing'
else
'-moz-box-sizing'
pkg.filter = if type is 'crx'
'-webkit-filter'
else
'filter'
pkg.transform = if type is 'crx'
'-webkit-transform'
else
'transform'
pkg.flex = if type is 'crx'
'-webkit-flex'
else
'flex'
pkg.order = if type is 'crx'
'-webkit-order'
else
'order'
grunt.log.ok 'pkg.type = %s', type
grunt.registerTask 'build', [

54
builds/appchan-x.user.js
View File

File diff suppressed because one or more lines are too long

54
builds/crx/script.js
View File

File diff suppressed because one or more lines are too long

15
src/General/Header.coffee
View File

@ -53,7 +53,7 @@ Header =
$.on d, 'CreateNotification', @createNotification
@enableDesktopNotifications()
@addShortcut menuButton, [110, 100]
@addShortcut menuButton
$.asap (-> d.body), =>
return unless Main.isThisPageLegit()
@ -269,16 +269,9 @@ Header =
top -= headRect.top + headRect.height
window.scrollBy 0, top
addShortcut: do ->
span = $.el 'span',
className: 'shortcut'
(el, order) ->
order = order[if Conf["Icon Orientation"] is "horizontal" then 0 else 1]
shortcut = span.cloneNode()
shortcut.style.cssText = "order: #{order}; -webkit-order: #{order};"
$.add shortcut, el
$.prepend Header.shortcuts, shortcut
addShortcut: (el) ->
$.addClass el, 'shortcut'
$.add Header.shortcuts, el
menuToggle: (e) ->
Header.menu.toggle e, @, g

87
src/General/css/icons.base.css
View File

@ -1,87 +0,0 @@
#main-menu,
#returnIcon,
#sowIcon,
#psaIcon,
#slideNav,
#img-controls,
#catalog,
#fappeTyme,
.shortcut .icon {
z-index: 18;
display: inline-block;
width: 15px;
height: 15px;
content: "";
opacity: 0.5;
cursor: pointer;
}
.invisible-icons #main-menu,
.invisible-icons #returnIcon,
.invisible-icons #sowIcon,
.invisible-icons #psaIcon,
.invisible-icons #slideNav,
.invisible-icons #img-controls,
.invisible-icons #catalog,
.invisible-icons #fappeTyme,
.invisible-icons #navPrev,
.invisible-icons #navNext,
.invisible-icons .shortcut .icon {
opacity: 0;
}
#navtopright .exlinksOptionsLink,
#returnIcon,
#{if Conf['Slideout Watcher'] then '#thread-watcher,' else ''}
#{if Conf['Announcements'] is 'slideout' then '#globalMessage,' else ''}
#boardNavDesktopFoot,
#catalog {
z-index: 16;
}
#navtopright .exlinksOptionsLink:hover,
#returnIcon:hover,
#thread-watcher:hover,
#globalMessage:hover,
#slideNav:hover,
#img-controls,
#catalog:hover {
z-index: 17;
}
#main-menu {
background-position: 0 0;
}
#returnIcon {
background-position: 0 -15px;
}
#sowIcon {
background-position: 0 -30px;
}
#psaIcon {
background-position: 0 -45px;
}
#slideNav {
background-position: 0 -60px;
}
#img-controls {
background-position: 0 -90px;
}
#catalog {
background-position: 0 -120px;
}
#fappeTyme {
background-position: 0 -135px;
}
#slideNav:hover,
#psaIcon:hover,
#img-controls:hover,
#navPrev:hover,
#navNext:hover,
#appchanOptions:hover,
#main-menu:hover,
#qr #qrtab,
#sowIcon:hover,
.thumbnail#selected,
#returnIcon:hover,
#catalog:hover,
#fappeTyme:hover,
.shortcut .icon:hover {
opacity: 1 !important;
}

174
src/General/css/layout.css
View File

@ -189,7 +189,9 @@ th {
border-right: 6px solid transparent;
border-left: 6px solid transparent;
opacity: 0.5;
margin: 3px 2px;
margin: 2px 1px;
width: 0;
height: 0;
}
#navPrev {
border-bottom: 11px solid rgb(130,130,130);
@ -201,7 +203,7 @@ th {
#header-bar {
z-index: 6;
border-width: 1px;
padding: 0 2px;
padding: 1px 2px;
border-style: solid;
}
.pagination-sticky-top .pagelist,
@ -253,19 +255,6 @@ th {
color: transparent;
word-spacing: 2px;
}
#shortcuts {
position: fixed;
display: flex;
display: -webkit-flex;
top: 1px;
}
.sidebar-location-right #shortcuts {
right: 0;
text-align: right;
}
.sidebar-location-left #shortcuts {
left: 0;
}
.fixed #header-bar.autohide {
z-index: 24;
}
@ -375,6 +364,161 @@ th {
width: 100%;
overflow: auto;
}
/* Shortcuts */
#shortcuts {
position: fixed;
display: <%= flex %>;
top: 0;
}
.shortcut {
margin: 1px;
}
.icon-orientation-vertical #shortcuts {
<%= flex %>-direction: column;
}
.sidebar-location-right #shortcuts {
right: 0;
text-align: right;
}
.sidebar-location-right .shortcut {
align-self: flex-end;
-webkit-align-self: flex-end;
}
.sidebar-location-left #shortcuts {
left: 0;
}
.icon-orientation-horizontal #shortcuts {
<%= flex %>-direction: row-reverse;
}
.icon-orientation-horizontal.sidebar-location-left #shortcuts {
<%= flex %>-direction: row;
}
#main-menu {
<%= order %>: 0;
}
#qr-shortcut {
<%= order %>: 10;
}
#img-controls {
<%= order %>: 20;
}
#fappeTyme {
<%= order %>: 30;
}
#slideNav {
<%= order %>: 40;
}
#sowIcon {
<%= order %>: 50;
}
#psaIcon {
<%= order %>: 60;
}
#navPrev {
<%= order %>: 70;
}
#navNext {
<%= order %>: 80;
}
#catalog {
<%= order %>: 90;
}
#returnIcon {
<%= order %>: 100;
}
#thread-stats {
<%= order %>: 110;
}
#updater {
<%= order %>: 120;
}
#main-menu,
#returnIcon,
#sowIcon,
#psaIcon,
#slideNav,
#img-controls,
#catalog,
#fappeTyme,
#shortcuts .icon {
z-index: 18;
display: inline-block;
width: 15px;
height: 15px;
content: "";
opacity: 0.5;
cursor: pointer;
}
.invisible-icons #main-menu,
.invisible-icons #returnIcon,
.invisible-icons #sowIcon,
.invisible-icons #psaIcon,
.invisible-icons #slideNav,
.invisible-icons #img-controls,
.invisible-icons #catalog,
.invisible-icons #fappeTyme,
.invisible-icons #navPrev,
.invisible-icons #navNext,
.invisible-icons #shortcuts .icon {
opacity: 0;
}
#navtopright .exlinksOptionsLink,
#returnIcon,
#{if Conf['Slideout Watcher'] then '#thread-watcher,' else ''}
#{if Conf['Announcements'] is 'slideout' then '#globalMessage,' else ''}
#boardNavDesktopFoot,
#catalog {
z-index: 16;
}
#navtopright .exlinksOptionsLink:hover,
#returnIcon:hover,
#thread-watcher:hover,
#globalMessage:hover,
#slideNav:hover,
#img-controls,
#catalog:hover {
z-index: 17;
}
#main-menu {
background-position: 0 0;
}
#returnIcon {
background-position: 0 -15px;
}
#sowIcon {
background-position: 0 -30px;
}
#psaIcon {
background-position: 0 -45px;
}
#slideNav {
background-position: 0 -60px;
}
#img-controls {
background-position: 0 -90px;
}
#catalog {
background-position: 0 -120px;
}
#fappeTyme {
background-position: 0 -135px;
}
#slideNav:hover,
#psaIcon:hover,
#img-controls:hover,
#navPrev:hover,
#navNext:hover,
#appchanOptions:hover,
#main-menu:hover,
#qr #qrtab,
#sowIcon:hover,
.thumbnail#selected,
#returnIcon:hover,
#catalog:hover,
#fappeTyme:hover,
#shortcuts .icon:hover {
opacity: 1 !important;
}
/* Updater / Thread Stats */
.float #thread-stats,
.float #updater {

2
src/Images/FappeTyme.coffee
View File

@ -8,7 +8,7 @@ FappeTyme =
$.on el, 'click', FappeTyme.toggle
Header.addShortcut el, [30, 30]
Header.addShortcut el
Post::callbacks.push
name: 'Fappe Tyme'

2
src/Images/ImageExpand.coffee
View File

@ -10,7 +10,7 @@ ImageExpand =
$.on @EAI, 'click', ImageExpand.cb.toggleAll
Header.addShortcut @EAI, [80, 130]
Header.addShortcut @EAI
Post::callbacks.push
name: 'Image Expansion'

2
src/Miscellaneous/CatalogLinks.coffee
View File

@ -56,5 +56,5 @@ CatalogLinks =
ready: ->
if catalogLink = ($('.pages.cataloglink a', d.body) or $ '[href=".././catalog"]', d.body)
catalogLink.textContent = ''
Header.addShortcut catalogLink, [70, 70]
Header.addShortcut catalogLink
catalogLink.id = 'catalog'

4
src/Miscellaneous/Nav.coffee
View File

@ -15,8 +15,8 @@ Nav =
href: 'javascript:;'
id: 'navNext'
Header.addShortcut prev, [10, 10]
Header.addShortcut next, [20, 20]
Header.addShortcut prev
Header.addShortcut next
$.on prev, 'click', @prev
$.on next, 'click', @next

4
src/Monitoring/ThreadStats.coffee
View File

@ -4,11 +4,11 @@ ThreadStats =
if Conf['Updater and Stats in Header']
@dialog = sc = $.el 'span',
innerHTML: "<span id=post-count>0</span> / <span id=file-count>0</span>#{if Conf["Page Count in Stats"] then " / <span id=page-count>0</span>" else ""}"
innerHTML: "[<span id=post-count>0</span> / <span id=file-count>0</span>#{if Conf["Page Count in Stats"] then " / <span id=page-count>0</span>" else ""}]"
id: 'thread-stats'
title: 'Post Count / File Count' + (if Conf["Page Count in Stats"] then " / Page Count" else "")
$.ready ->
Header.addShortcut [$.tn('['), sc, $.tn("]\u00A0")], [10,10]
Header.addShortcut sc
else
@dialog = sc = UI.dialog 'thread-stats', 'bottom: 0px; right: 0px;',
"<div class=move title='Post Count / File Count#{if Conf["Page Count in Stats"] then " / Page Count" else ""}'><span id=post-count>0</span> / <span id=file-count>0</span>#{if Conf["Page Count in Stats"] then " / <span id=page-count>0</span>" else ""}</div>"

4
src/Monitoring/ThreadUpdater.coffee
View File

@ -6,10 +6,10 @@ ThreadUpdater =
if Conf['Updater and Stats in Header']
@dialog = sc = $.el 'span',
innerHTML: "<span id=update-status></span><span id=update-timer title='Update now'></span>"
innerHTML: "[<span id=update-status></span><span id=update-timer title='Update now'></span>]\u00A0"
id: 'updater'
$.ready ->
Header.addShortcut [$.tn('['), sc, $.tn("]\u00A0")], [0,0]
Header.addShortcut sc
else
@dialog = sc = UI.dialog 'updater', 'bottom: 0px; left: 0px;',
"<div class=move><span id=update-status></span><span id=update-timer title='Update now'></span></div>"

2
src/Monitoring/ThreadWatcher.coffee
View File

@ -44,7 +44,7 @@ ThreadWatcher =
if Conf['Slideout Watcher']
el = $.el 'i', id: 'sowIcon'
Header.addShortcut el, [80, 70]
Header.addShortcut el
else
el = d.body

2
src/Posting/QuickReply.coffee
View File

@ -31,7 +31,7 @@ QR =
QR.close()
$.toggleClass @, 'disabled'
return Header.addShortcut sc, [20, 140] if Conf['Header Shortcut']
return Header.addShortcut sc if Conf['Header Shortcut']
$.addClass sc, 'on-page'
sc.textContent = if g.VIEW is 'thread' then 'Reply to Thread' else 'Start a Thread'

6
src/Theming/Style.coffee
View File

@ -178,20 +178,20 @@ Style =
# Slideout Navigation
slideNav = $.el 'i', id: 'slideNav'
$.add $.id('boardNavDesktopFoot'), slideNav
Header.addShortcut slideNav, [50, 110] if Conf['Slideout Navigation'] isnt 'hide'
Header.addShortcut slideNav if Conf['Slideout Navigation'] isnt 'hide'
# Announcements
if Conf['Announcements'] is 'slideout'
if (psa = $.id '#globalMessage') and !psa.hidden
psaIcon = $.el 'i', id: 'psaIcon'
$.add psa, psaIcon
Header.addShortcut psaIcon, [90, 80]
Header.addShortcut psaIcon
if g.VIEW is 'thread'
el = $('body > div.navLinks > a')
el.textContent = ''
el.id = 'returnIcon'
Header.addShortcut el, [40, 40]
Header.addShortcut el
Style.icons.textContent = css