ClockOut button
I'd like to make a script that opens chrome, navigates to a website, logs me in, and activates the "ClockOut" button on a website (if it's there) if I forget to clock out at the end of the day. How would I go about doing this? I'm familiar with JS/HTML/Bash but won't tackle this if it's to complicated.
When I navigate to the login portal of the website, www.login.website.com lastpass auto logs me in, so I wouldn't need to input any text, just use the "login" button. I then get loaded into the dashboard, where the "ClockOut" button would be. The page source for the "login" button:
<div class="pcty-row-flex">
<div class="pcty-col pcty-padding-top pcty-large-padding-horizontal">
<button type="submit" class="pcty-button pcty-size-medium pcty-button-full-width pcty-button-full-width-mobile pcty-size-responsive submit-button login-button">Login</button>
</div>
The page source for the "ClockOut" button:
<section class="js-employeepunch">
<div class="card-content">
<div class="webclock js-serverclock-container">
<div class="title">Clocked In since 12:48 PM</div>
<div class="clock-seconds js-serverclock-seconds"></div>
<div class="clock js-serverclock">
<div class="clock-loader">
<span class='spinner'></span> Updating...
</div>
</div>
<div class="clock-details">
<span>CST</span>
<span class="js-serverclock-period"></span>
</div>
</div>
</div>
<div class="card-actions js-employeePunchButtons">
<div class="form-group">
<label for="wtNotes">Notes</label>
<input type="text" id="wtNotes" value="">
</div>
<button name="ClockOut" value="Clock Out" class="button full-width">Clock Out</button>
Related
I want to click and send text within a textbox but not able to find the element.
This is the html I want to click and send text
<div class="text_write_g comment_write">
<div class="inner_text_write">
<div class="box_textarea">
<textarea placeholder="add coment." maxlength="600" style="height: 86px;"></textarea>
</div>
<div class="wrap_menu">
<div class="area_l">
<button class="btn_g_ico btn_item image_upload_button" data-image-url="" data-image-name="" data-image-size="" id="attach_uploader0"><span class="ico_bbs ico_photo">image_upload</span></button>
<div class="keyboard_wrapper">
<div id="buttonLayer0">
<button id="keyboardBtn0" class="keyboard_btn btn_g_ico btn_item"><span class="ico_bbs ico_emoticon">imoticon</span></button>
</div>
</div>
</div>
<div class="area_r">
<span class="num_text"><span class="sr_only">text_number</span><span class="num_count empty">0</span>/<span class="sr_only">total_text_number</span>600</span>
<button class="btn_g_ico btn_item secret_button " data-is-hidden=""><span class="ico_bbs ico_lock_state">secret_reply</span></button>
<div class="btn_group">
<button class="btn_g full_type1 confirm_button" style="font-size: 13px;">confirm</button>
</div>
</div>
</div>
</div>
</div>
I tried around 100ways but not work it...;(
I googled it also searched in stackoverflow
please please help this newbie
I struggled 3days already...:(
/* action dropdown*/
jQuery(document).ready(function(){
jQuery(".action-toggler").click(function(ev){
jQuery(this).children(".action-dropdown").toggle();
ev.stopPropagation();
});
jQuery("body").click(function(){
jQuery(".action-dropdown").hide();
});
});
/* modle-popup*/
jQuery(document).ready(function(){
jQuery(".popup-button").click(function(){
event.preventDefault();
jQuery("body").addClass("sitemodal-open");
jQuery(".sitemodal").addClass("in");
});
jQuery('.sitemodal .sitemodal-dialog').click(function($){
$.stopPropagation();
});
jQuery(".close-popup ,.sitemodal").click(function(){
jQuery("body").removeClass("sitemodal-open");
jQuery(".sitemodal").removeClass("in");
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="msg-icon action-toggler" style="float:right;">
<img src="images/dots.png" ></img>
<ul class="action-dropdown">
<li>
<a class="popup-button" data-target="#delete-popup" >Delete</a>
<!-- siteModal content-->
<div class="sitemodal fade" id="reply-popup">
<div class="sitemodal-dialog">
<div class="sitemodal-content">
<div class="sitemodal-header">
<h4 class="sitemodal-title">Delete</h4>
</div>
<hr style="margin-top: 8px;margin-bottom:2px;">
<div class="sitemodal-body" style="padding: 16px 0;">
<h4 class="sitemodal-title" style="font-size: 16px;font-weight: 400;">Are you sure you want to delete this message?</h4>
<form enctype="multipart/form-data" method="Post" action="" name="" onsubmit="">
<hr style="margin-top: 16px;margin-bottom:2px;">
<div class="sitemodal-footer" style="display: flex;margin-bottom: -8px;">
//php code here
</div>
</form>
</div>
</div>
</div>
</div>
</li>
</ul>
</span>
I have a drop down menu which contains a "delete" option when clicked it shows a pop up window
the problem that i am having is that when the "delete" option is clicked nothing happens first time but when clicked second time the pop up shows up
tried to trigger drop down window from the "model-pop" but didn't work
trid to remove the pop-up window outside of the </ul> but didnt work
can you please give me a hint or i am getting wrong at the least
removed some unrelated code to be easier to read
I tried to make a link to a section on a one page. It works strangely sometimes, but mostly it gets stuck at the section where you clicked the item and then if you want to scroll manually it does not work at all.
As far as I have seen on the Internet, there is no more to do than creating an a tag with href="#someID" and then clicking it, it should take me to the corresponding id or am I missing something?
<div>
<div class="content-wrapper">
<div class="v-center">
<div class="main-content" style="margin-top: 200px">
<p> Some Text </p>
<ul>
<li>Problem Collection<br></li>
<li>Specific Problem1<br></li>
<li>Specific Problem2<br></li>
<li>Specific Problem3<br></li>
</ul>
</div>
</div>
</div>
<div style="margin-top: 400px">
<div>
<div id="anmeldungsprobleme">
<h2>IDC Anmeldung schlägt generell fehl</h2>
</div>
<div>
<p>Descriptive Text</p>
<p style="color: green"> Username: Placeholder<br> Passwort: *********</p>
</div>
</div>
</div>
<div id="anmeldungJA">
<h3>Anmeldung ist möglich</h3>
<p>Text about the problem</p>
</div>
</div>
Thank you so mcuh for your help #ProEvilz
I tried it outside of my IDE and now it works...
Seems to be a problem inside of brackets.
I created the popup when I am trying to call action on click for close pop up icon no change is shown.
In index.html in bottom there is code for pop up, this will be shown when user will click on change zip code link.
<!-- Pop up div -->
<div class="popup" ng-show="myModal" ng-controller="utilityCtrl">
<!-- Modal content -->
<div class="popup-content">
<span class="close" ng-click="closePopup">×</span>
<div class="dynamicContect" id="dynamicContect"> Loading ...
</div>
</div>
</div>
<!-- html of change zip code -->
<div class="hidden" id="updateZipContent">
<div class="zipContent">
<div class="padding-bt-2">Please enter new zip code</div>
<div class="row">
<div class="text-left col-md-6 padding-bt-2">
<input ng-model="zipCode" type="text" class="form-control" maxlength="5" data-required="true" number-only>
</div>
<div class="text-left col-md-4">
<button class="btn btn-primary form-control">Update</button>
</div>
</div>
</div>
</div>
Change zip code action is written in autoQuotectrl.js
$scope.changeZipCode = function()
{
$rootScope.myModal = true;
var firstDivContent = document.getElementById('updateZipContent');
var secondDivContent = document.getElementById('dynamicContect');
secondDivContent.innerHTML = firstDivContent.innerHTML;
}
To keep other action separate I wrote new controller utilityCtrl.js.
Here I wrote action for hide this popup .
$scope.closePopup = function ()
{
console.log('here in utility');
$rootScope.myModal = false;
document.getElementById('dynamicContect').innerHTML = "";
}
But nothing is working, please help me to understand what I am missing here.
It seems $rootScope.myModal is not accessible in utilityCtrl
You don't invoke function closePopup in template.
See example on plunker.
<div class="popup" ng-show="myModal" ng-controller="utilityCtrl">
<!-- Modal content -->
<div class="popup-content">
<span class="close" ng-click="closePopup()">×</span>
<div class="dynamicContect" id="dynamicContect"> Loading ...
</div>
</div>
</div>
they are in two controller,so the $scope is diferent ,you can use $rootScope.$broadcast and $scope.$on
I am designing a webpage with 2 materialize modals. I want to set dismissible:false for both of them, but it only seems to work with one. The documentation is pretty vague on how to specify which modal you are setting options for, and right now it only works with the first modal. Here is the code where I set the dismissible option to false:
$(document).ready(function () {
$('.modal-trigger').leanModal({
dismissible: false
});
});
And here is the html for the modals:
<div class="row">
<div id="forgotPasswordPIN" class="modal col s10 offset-s1 m8 offset-m2 l6 offset-l3">
<form name="emailForm" ng-submit="submitForm()" novalidate>
<div class="modal-content">
<h4>Forgot PIN/Password</h4>
<span class="flow-text">Send PIN and password to: </span>
<br />
<br />
<div class="input-field">
<input required id="email" type="text" style="font-size:175%;" name="email" ng-model="email" ng-minlength="2" ng-pattern="/[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*#(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/"/>
<label for="email" class="flow-text">Email</label>
<div ng-messages="emailForm.email.$error">
<div class="red-text" ng-message="required">This field is required</div>
<div class="red-text" ng-message="pattern">Invalid Email</div>
</div>
</div>
</div>
<div class="modal-footer">
Send
<a class="btn disabled" ng-hide="emailForm.$valid">Send</a>
Cancel
</div>
</form>
</div>
</div>
<div id="bottomModal" class="modal bottom-sheet">
<div class="modal-content">
<h4 id="successTitle">Email Sent</h4>
<p id="successContent">
Your password will be sent to <span ng-bind="email"></span>.<br /> Please allow up to 10 minutes for the email to be received.
</p>
<h4 id="errorTitle">Invalid Email</h4>
<p id="errorContent" class="red-text">
Sorry, we do not recognize that email. Please try again.
</p>
</div>
</div>
How do I specify which modal I am setting options for? Thanks in advance.
EDIT: My main issue is that I am opening the second one programmatically, and not with an anchor tag. In Materialize documentation the only way it shows to set options is according to the trigger, or anchor tag. So I may not be able to do it without using an actual trigger.
I know this was asked a while ago, but maybe someone else is having similar issues.
If you use the modal options, as listed by the OP, inside the function you use to open the modal it will work.
For example:
$('#bottomModal').openModal({
dismissible: false
});
you just have to initialize both modals in different calls, using different classes. Doing that you can use different parameters to each one.
$(document).ready(function () {
$('.modal-trigger1').leanModal({
dismissible: false
});
$('.modal-trigger2').leanModal({
dismissible: false
});
});
//Them:
<a class="modal-trigger1 waves-effect waves-light btn" href="#forgotPasswordPIN">Modal</a>
<a class="modal-trigger2 waves-effect waves-light btn" href="#bottomModal">Modal</a>