(Github Image Viewer) regex pattern improvements + directory detection

[jP6a9b3OR6FN5mVP81pQ2aOrtfMhKEhaBX8WkP1]

• with regexp: add .bmp format (e.g. https://github.com/quentinmrzt/Darlizot/tree/master/sprite), escape filetype dots and ignore the case (e.g. https://github.com/PeterLawrence/WinTimeStampUtility)

--- _imageRegex: /(.jpe?g|.png|.gif|.ico|.tiff?)$/,
+++ _imageRegex: /(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i,

• with folders: check icon sibling for '.octicon-file-text' / !'.octicon-file-directory' class (e.g. https://github.com/github/octicons)

if (target.classList && target.classList.contains("js-directory-link")
+++     && target.parentElement.parentElement.parentElement.firstElementChild.firstElementChild.classList.contains("octicon-file-text")
        && GithubImageViewer._imageRegex.test(target.href)) {

[jerone]

@jP6a9b3OR6FN5mVP81pQ2aOrtfMhKEhaBX8WkP1 commented on 14 nov. 2015 05:30 CET:

• with regexp: add .bmp format (e.g. https://github.com/quentinmrzt/Darlizot/tree/master/sprite), escape filetype dots and ignore the case (e.g. https://github.com/PeterLawrence/WinTimeStampUtility)

--- _imageRegex: /(.jpe?g|.png|.gif|.ico|.tiff?)$/,
+++ _imageRegex: /(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i,

These changes are awesome! If you want credit you can send a PR. Otherwise I can make the changes if you want.

• with folders: check icon sibling for '.octicon-file-text' / !'.octicon-file-directory' class (e.g. https://github.com/github/octicons)

if (target.classList && target.classList.contains("js-directory-link")
+++     && target.parentElement.parentElement.parentElement.firstElementChild.firstElementChild.classList.contains("octicon-file-text")
        && GithubImageViewer._imageRegex.test(target.href)) {

You mean when folders are named after image extensions, including the dot?

[jP6a9b3OR6FN5mVP81pQ2aOrtfMhKEhaBX8WkP1]

@jerone commented on Nov 14, 2015, 12:54 PM GMT+2:

These changes are awesome! If you want credit you can send a PR. Otherwise I can make the changes if you want.

it will be very kind of you if you do everything by yourself

You mean when folders are named after image extensions, including the dot?

yes, exactly: prevent GithubImageViewer from triggering by folders with names like "bmp"/".bmp"

[jerone]

@jP6a9b3OR6FN5mVP81pQ2aOrtfMhKEhaBX8WkP1 commented on 14 nov. 2015 13:19 CET:

@jerone commented on Nov 14, 2015, 12:54 PM GMT+2:

You mean when folders are named after image extensions, including the dot?

yes, exactly: prevent GithubImageViewer from triggering by folders with names like "bmp"/".bmp"

I want to stay away from GitHub page elements as much as possible, definitely traveling up the tree and back down again. They change their page layout very often. I was thinking of extending the regex:

--- _imageRegex: /(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i,
+++ _imageRegex: /.+(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i,

[jP6a9b3OR6FN5mVP81pQ2aOrtfMhKEhaBX8WkP1]

I want to stay away from GitHub page elements as much as possible ...

agree with such intentions, but unfortunately there no other way in code

... definitely traveling up the tree and back down again ...

3 ups to ".js-navigation-item" and ~ queryselector/queryselectorall[0] ".js-navigation-item .octicon-file-text" )

... They change their page layout very often. ...

once or twice per year during last few years or am I wrong? knocking on wood

I was thinking of extending the regex:

--- _imageRegex: /(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i
+++ _imageRegex: /.+(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i

ok, but it just simply excludes ".bmp"-named file or folder

[jerone]

@jP6a9b3OR6FN5mVP81pQ2aOrtfMhKEhaBX8WkP1 commented on 14 nov. 2015 15:01 CET:

I was thinking of extending the regex:

--- _imageRegex: /(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i
+++ _imageRegex: /.+(\.jpe?g|\.png|\.gif|\.bmp|\.ico|\.tiff?)$/i

ok, but it just simply excludes ".bmp"-named file or folder

Anything named X.bmp for example. I can understand someone naming a folder bmp or .bmp, but a folder named anything.bmp seems far fetched. I'm going to use the new regex, I can always change to DOM traversing when more examples pop-up. Thanks for the improvements!

[jerone]

:clapper: Released new version of Github Image Viewer

[jP6a9b3OR6FN5mVP81pQ2aOrtfMhKEhaBX8WkP1]

the same to you