Jump to content


Photo

PasswordMeter

password meter

  • Please log in to reply
15 replies to this topic

#1 Delphi Developer

Delphi Developer

    Advanced Member

  • Moderators
  • 3430 posts

Posted 13 July 2016 - 02:35 PM

Hello Friends!

 

Simple meter for password strength:

 

Attached File  passwordmeter.png   4.82KB   30 downloads

 

How to use?

 

For example for UniEdit:

 

1. UniServerModule.CustomCSS :

.x-form-strengthmeter {
    width : 100%;
    float: right;
    background: #ff4c00; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    
    background: -moz-linear-gradient(left,  #ff4c00 0%, #edd712 50%, #1aff00 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ff4c00), color-stop(50%,#edd712), color-stop(100%,#1aff00)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  #ff4c00 0%,#edd712 50%,#1aff00 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  #ff4c00 0%,#edd712 50%,#1aff00 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  #ff4c00 0%,#edd712 50%,#1aff00 100%); /* IE10+ */
    background: linear-gradient(left,  #ff4c00 0%,#edd712 50%,#1aff00 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff4c00', endColorstr='#1aff00',GradientType=1 ); /* IE6-8 */
}
 
.x-form-strengthmeter-scorebar {
    background-color: white;
    float: right;
    line-height: 6px;
    width: 100%;
}

2. UniEdit->ClientEvents->UniEvents: beforeInit fn

 

Spoiler

 

Of course still need to optimize the calcStrength function.

Try...

 

Best regards.


  • 4

#2 Marlon

Marlon

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 337 posts
  • LocationNova Mutum - MT - Brasil

Posted 13 July 2016 - 03:18 PM

;)


  • 0

#3 mohammad

mohammad

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 673 posts
  • LocationKufur Kassem, Palestine

Posted 13 July 2016 - 03:54 PM

Thank you


  • 0

#4 billyChou

billyChou

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 121 posts

Posted 23 July 2016 - 12:55 AM

thanks


  • 0

#5 stiaan

stiaan

    Advanced Member

  • Members
  • PipPipPipPip
  • 118 posts

Posted 25 July 2016 - 08:15 AM

Awesome! Thanks!


  • 0

#6 HarryG

HarryG

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 190 posts

Posted 31 August 2016 - 08:58 AM

This is really nice.

The font.size defined in the object inspector gets overridden - presumably some addition to the before init js code to redefine this is possible.?

My attempts have so far resulted in broken js

 

Anyone?

 

Thanks


  • 0

#7 Delphi Developer

Delphi Developer

    Advanced Member

  • Moderators
  • 3430 posts

Posted 31 August 2016 - 09:18 AM

The font.size defined in the object inspector gets overridden - presumably some addition to the before init js code to redefine this is possible.?

My attempts have so far resulted in broken js

 

Hi,

 

If I understand correctly you, try this:

 

Spoiler

 

Best regards.


  • 0

#8 HarryG

HarryG

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 190 posts

Posted 31 August 2016 - 09:27 AM

Perfect !

 

Many thanks


  • 0

#9 alf

alf

    Member

  • uniGUI Subscriber
  • PipPip
  • 42 posts

Posted 24 September 2016 - 10:14 AM

Hello:

 

How to check in Delphi code strength(meter) of  this component??

 

Thank's


  • 0

#10 Delphi Developer

Delphi Developer

    Advanced Member

  • Moderators
  • 3430 posts

Posted 24 September 2016 - 12:00 PM

Hi,

 

For example, like this:

 

1.

...
    config.updateMeter = function(val) {
        var me = this,
            maxWidth, score, scoreWidth,
            objMeter = me.el.down('.' + Ext.baseCSSPrefix + 'form-strengthmeter'),
            scoreBar = me.el.down('.' + Ext.baseCSSPrefix + 'form-strengthmeter-scorebar');

        if (val) {
            maxWidth = objMeter.getWidth();
            score = me.calcStrength(val);
            scoreWidth = maxWidth - (maxWidth / 100) * score;
            scoreBar.setWidth(scoreWidth, true);
            ajaxRequest(me, "strengthmeter", ["val="+score]);
        } else {
            maxWidth = objMeter.getWidth();
            scoreBar.setWidth(maxWidth, true);
            ajaxRequest(me, "strengthmeter", ["val=0"]);
        }
    };
...

2.

procedure TMainForm.UniEdit1AjaxEvent(Sender: TComponent; EventName: string;
  Params: TUniStrings);
begin
  if EventName='strengthmeter' then
    yourVariable := Params.Values['val']
end;

Best regards.


  • 0

#11 alf

alf

    Member

  • uniGUI Subscriber
  • PipPip
  • 42 posts

Posted 24 September 2016 - 01:35 PM

Great!!!

 

Thank's


  • 0

#12 aGaVVa

aGaVVa

    Newbie

  • Members
  • Pip
  • 7 posts

Posted 05 September 2017 - 11:02 AM

How to change color of input box (default -  white).


  • 0

#13 Delphi Developer

Delphi Developer

    Advanced Member

  • Moderators
  • 3430 posts

Posted 05 September 2017 - 12:01 PM

Hi,

 

How to change color of input box (default -  white).

 

Try UniEdit -> Color property for this

 

BTW, which edition and build are you using ?!

 

Best regards,


  • 0

#14 aGaVVa

aGaVVa

    Newbie

  • Members
  • Pip
  • 7 posts

Posted 06 September 2017 - 05:51 AM

Hi,

 

 

Try UniEdit -> Color property for this

 

BTW, which edition and build are you using ?!

 

Best regards,

 

The thing is that after applying the PassWord Modifier, UniEdit became white, and before that the Color property was yellow.


  • 0

#15 Delphi Developer

Delphi Developer

    Advanced Member

  • Moderators
  • 3430 posts

Posted 06 September 2017 - 05:57 AM

Hi,

 

The thing is that after applying the PassWord Modifier, UniEdit became white, and before that the Color property was yellow.

 

http://forums.unigui...ter/#entry36322


  • 0

#16 aGaVVa

aGaVVa

    Newbie

  • Members
  • Pip
  • 7 posts

Posted 11 September 2017 - 05:56 AM

 

Thanks!


  • 0




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users