Skip to content
This repository has been archived by the owner on May 30, 2024. It is now read-only.

Implemented RTL feature. #245

Open
wants to merge 17 commits into
base: develop
Choose a base branch
from

Conversation

NayanKhedkar
Copy link

$r.rangeslider({
polyfill: false,
isRTL:true,//set this property to true for RTL feature
onSlide:onSlideEnd
});

@NayanKhedkar
Copy link
Author

Hi, can anybody please go through this PR

@NayanKhedkar NayanKhedkar mentioned this pull request Jan 16, 2017
@andreruffert
Copy link
Owner

@NayanKhedkar first of all thanks for ur PR!

I would prefer a solution where u can set an attribute for the direction. To be more flexible and
consistent with the data-orientation attribute which already exists.

e.g. <input type="range" data-direction="rtl">

We should also consider the orientation of the element in combination with the direction.

@NayanKhedkar
Copy link
Author

@andreruffert hearty thanks! But I think this feature not implemented yet in rangeslider.js .

@NayanKhedkar
Copy link
Author

NayanKhedkar commented Jan 19, 2017

rangeslider

When the orientation is horizontal and I set <input type="range" data-direction="rtl"> but I unable to see the output like above image.

@andreruffert
Copy link
Owner

@NayanKhedkar yep the feature is not implemented so far. I was thinking about if you could refactor your implementation like I described above to be more flexible by using

<input type="range" data-direction="rtl">

instead of

$r.rangeslider({
polyfill: false,
isRTL:true, //set this property to true for RTL feature
onSlide:onSlideEnd
});

@NayanKhedkar
Copy link
Author

@andreruffert sure .

@NayanKhedkar
Copy link
Author

NayanKhedkar commented Jan 24, 2017

@andreruffert as you suggested I refactored implementation on the same PR . Supported data-directions are
1.right-to-left e.g. <input type="range" data-direction="rtl">
2.left-to-right e.g. <input type="range" data-direction="ltr">default for horizontal orientation.
3.top-to-bottom e.g. <input type="range" data-direction="ttb">
4.bottom-to-top e.g. <input type="range" data-direction="btt"> default for vertical orientation.

Please look at once to this PR,and if you have any additions, corrections or suggestions, please let me know.

/*top-to-bottom*/
.rangeslider__ttb {
top: 0;
bottom: initial;

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

initial isn't supported in Internet Explorer.

@NayanKhedkar
Copy link
Author

NayanKhedkar commented Feb 21, 2017

@andreruffert I would appreciate that you're busy at the moment. As you said I made the changes. Could you please look into the changes?

@peteygao
Copy link

@NayanKhedkar It's very hard to diff the style, as you've added two extra spaces to every single line, whether or not it was modified. Can you revert that change and follow the existing file's coding style of only using 2 spaces for indentation instead of 4? That will make the diff much smaller and focus only on your actual changes.

Not only that, but there's an extra space (9 in total) on this line: https://github.com/andreruffert/rangeslider.js/pull/245/files#diff-21d11fb857fabcd9805d3e86413a1c49R453

@NayanKhedkar
Copy link
Author

NayanKhedkar commented Mar 1, 2017

@peteygao Thanks , I have removed the extra spaces.Could you please review the changes . . .?

* @param {String} element
* @param {String} orientation
*/
function getDirection(element,orientation){
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you follow the rest of the file's formatting style for new code you've written? Namely, please have spaces between symbols, commas, and other delimiters. Example for this function:

function getDirection(element, orientation) {
  var direction = element[0].getAttribute('data-direction') || (orientation === 'vertical' ? 'btt' : 'ltr');

  if (constants.orientation[orientation].direction[direction]) {
    return direction;
  } else {
    return orientation === 'vertical' ? 'btt' : 'ltr';
  }
}

@NayanKhedkar
Copy link
Author

@peteygao Hi, I hope so this time is better.

@NayanKhedkar
Copy link
Author

NayanKhedkar commented Apr 19, 2017

Hi, I'm looking forward to feedback.

@moloko
Copy link

moloko commented Jun 26, 2017

@andreruffert @peteygao how is this looking now? keen to get this merged as we use this excellent library in https://github.com/adaptlearning/adapt-contrib-slider and would love to have it updated properly rather than having to hack our copy!

* @param {String} element
* @param {String} orientation
*/
function getDirection(element,orientation){

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@NayanKhedkar, can you correct the spacing in this function?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

@elron
Copy link

elron commented Oct 8, 2017

@NayanKhedkar Thank you so much!!!! <3

This was referenced Nov 10, 2017
@kontur
Copy link

kontur commented Jan 19, 2018

How's it looking for a merge for this?

On a sidenote: The data-direction method is nice, but a programmatic way to set the direction either on init or via method would be very useful as well.

@pbredenberg
Copy link

Thanks for the hard work! Any chance for a merge on this at some point soon?

@jimjenkins5
Copy link

Great work on all of this! Is there any status on when this will be merged and released?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

10 participants