javascript बनत एक वेबपेज पर माउस के साथ कंपकंपी(उदाहरण के लिए पार्किंसंस रोग से)?




हाथ कांपने का होम्योपैथिक इलाज (11)

मैंने कुछ ऐसा त्वरित डेमो बनाया है जो आपको उम्मीद है कि पॉइंटर लॉक एपीआई का उपयोग करके आप अपने कोड को आधार देने में सक्षम होना चाहिए।

मैंने इस पॉइंटर-लॉक-डेमो रेपो को फोर्क किया और इसे एक यादृच्छिक आंदोलन तत्व जोड़ने के लिए संशोधित किया।

मेरे गिटहब पेज का लिंक यहां दिया गया है: https://aristocrates.github.io/pointer-lock-demo
और यहां मेरे रेपो का लिंक है: https://github.com/aristocrates/pointer-lock-demo

canvasLoop(e) विधि में, app.js में महत्व का जावास्क्रिप्ट कोड निहित है।

मूल डेमो से बदल गई एकमात्र चीज लाइनों के बाद थी

x += movementX * 2;
y += movementY * 2;

मैंने यादृच्छिक आंदोलन का प्रतिनिधित्व करने के लिए दो पंक्तियां जोड़ दीं:

x += Math.floor(Math.random()*3 - 1);
y += Math.floor(Math.random()*3 - 1);

अभी भी बहुत सी चीजें हैं जो आप सुधार सकते हैं, लेकिन उम्मीद है कि इससे आपको शुरुआत करने में मदद मिल सकती है।

मैं एक नींव के लिए काम कर रहा हूं जो इंटरनेट में पहुंच के लिए जागरूकता बढ़ाता है। एक प्रस्तुति के लिए, हम एक छोटी कार्यशाला की पेशकश करना चाहते हैं जो लोगों को विभिन्न विकलांगताओं / हानियों का अनुकरण करे। यह विशेष रूप से इस प्रस्तुति के लिए बनाई गई वेबसाइट के माध्यम से किया जाता है।

दिखाए गए विकारों में से एक में कंपकंपी हो रही है, जिसका अर्थ है कमजोर, कठिन-नियंत्रित नियंत्रण वाले आंदोलनों का अनुभव करना। इस हानि के साथ, माउस कर्सर को ठीक से स्थानांतरित करना और माउस बटन को दबाकर माउस बटन दबाकर बहुत मुश्किल है। कुछ पुराने लोग और बीमारी वाले लोग, जैसे पार्किंसंस, कड़क से पीड़ित हो सकते हैं।

अब मैं किसी भी तरह से माउस कर्सर को एक अप्रत्याशित तरीके से ले जाना चाहता हूं, ताकि लोगों के लिए एक छोटे बटन पर क्लिक करना बहुत मुश्किल हो। चूंकि जावास्क्रिप्ट सीधे माउस कर्सर को स्थानांतरित करने की अनुमति नहीं देता है, इसलिए मैं इसे प्राप्त करने के अन्य तरीकों की तलाश में हूं। मैं निम्नलिखित विचारों के साथ आया था:

  • माउस चालक / उपयोगिता का उपयोग करना जो माउस हिलाने को अनुकरण करता है।
  • माउस कर्सर को सीएसएस के माध्यम से छुपाएं, मूल कर्सर (जावास्क्रिप्ट के साथ) पर एक हिलाने वाले माउस कर्सर की एक जीआईएफ एनीमेशन रखें, और उसके बाद लक्ष्य लिंक को केवल कुछ सेकंड के लिए प्रत्येक सेकेंड में क्लिक करने योग्य बनाएं। यह कम से कम महसूस कर देगा जैसे कि कोई हमेशा गलत पल पर क्लिक करता है।

जबकि पहला विचार बहुत अच्छा होगा, मुझे इस तरह का टूल नहीं मिला, चाहे मैक के लिए और न ही विंडोज के लिए। और मेरे पास ऐसी चीज प्रोग्रामिंग में कोई कौशल नहीं है।

दूसरा विचार थोड़ा बेकार लगता है, लेकिन मुझे लगता है कि वांछित प्रभाव प्राप्त होगा।

क्या किसी के पास कोई और विचार है?


यहां मेरी xdotool स्क्रिप्ट का एक विंडोज संस्करण है जो ऑटोआईट का उपयोग करता है। यह मेरी पहली ऑटोआईटी स्क्रिप्ट थी, और इसे लिखने में केवल कुछ मिनट लग गए, इसलिए मुझे यकीन है कि इसे बेहतर किया जा सकता है। बस एक्सटेंशन .au3 के साथ सहेजें और इसे ऑटोआईट (रन स्क्रिप्ट x86) के साथ चलाएं।

HotKeySet("{HOME}", "GStart")
HotKeySet("{PAUSE}", "Gpause")
HotKeySet("{ESC}", "Gexit")

While 1
    Sleep(100)
WEnd

Func Gstart()
While 1
    sleep(100)
    $pos = MouseGetPos()
    $x = $pos[0] + 10 - Random(0, 20, 1)
    $y = $pos[1] + 10 - Random(0, 20, 1)
    MouseMove($x,$y)
Wend
Endfunc


Func Gpause()
While 1
   sleep(100)
Wend
Endfunc

Func Gexit()
    MsgBox(0, "exit box", "Script exited")
    Exit 0
EndFunc

नियंत्रण

  • होम: सिमुलेशन शुरू करें।
  • रोकें: सिमुलेशन रोकें।
  • Esc: अनुकरण सिमुलेशन।

या here से मेरे संकलित संस्करण का उपयोग here


भयानक "दाएं" पाने के लिए बस एक विचार, आप एक वास्तविक रोगी के माउस आंदोलन को रिकॉर्ड कर सकते हैं, इससे आप लोगों को बताते हैं कि डेटा कहां से आता है, यह अधिक प्रामाणिक बनाता है।

एक बिल्ली को अपने माउस कर्सर का पालन करने के लिए एक स्क्रिप्ट्स, आप एक दूसरे कर्सर को अपने कर्सर का पालन करने (चारों ओर कूदने) देने के लिए समायोजित कर सकते हैं। पृष्ठ दूसरे कर्सर की स्थिति की गणना कर रहा है, इसलिए यह भी निर्धारित कर सकता है कि कोई क्लिक ईवेंट सफल है या नहीं।

यदि आप कर सकते हैं, तो कृपया इसे वेब आधारित बनाएं, आप प्रोग्राम स्थापित करने या फ़्लैश सक्रिय करने या जो कुछ भी सक्रिय करने के लिए कहने से कहीं अधिक लोगों तक पहुंचेंगे।


आपका दूसरा विचार (कर्सर छुपाएं) आधा रास्ते है जो मुझे लगता है कि आपके लिए अच्छा काम कर सकता है:

  • जैसा कि आप सुझाव देते हैं, सीएसएस के माध्यम से माउस कर्सर छुपाएं। ( cursor:none आईआईआरसी cursor:none )
  • एक shaky कर्सर जीआईएफ के बजाय, माउस सूचक का अनुकरण करने के लिए कुछ छवि + सीएसएस पूर्ण स्थिति + जेएस का उपयोग करें; यानी, पृष्ठ के चारों ओर माउस का पालन करें और कर्सर छवि को लगाएं जहां माउस कर्सर मूल रूप से होगा।

फिर, आप कर्सर को "हिलाएं" के लिए अपने कर्सर कोड में कुछ कंप्रेसर गणित जोड़ते हैं। यह निर्धारित करने के लिए कि सही वक्र सही ढंग से कंप्रेसर इनपुट को अनुकरण करने के लिए क्या हैं।

अंत में: जो भी नियंत्रण आप प्रोग्रामिंग कर रहे हैं (लिंक, इत्यादि):

  • क्लिक घटनाओं को कैप्चर करें, उन्हें अपने कंपकंपी वक्र की स्थिति के आधार पर वर्तमान "कंपकंपी" स्थान पर घुमाएं, और सीमाओं को जांचें ताकि यह देखने के लिए कि क्या उपयोगकर्ता उद्देश्य से तत्व को हिलाकर रखता है, या संभवतः उस तत्व में जो इरादा नहीं था ।

इस कार्यान्वयन के साथ एक बड़ा बोनस : आपका 'shaky कर्सर' स्पर्श उपकरणों पर प्रदर्शित किया जाएगा, जिसमें एक कर्सर शुरू करने के लिए नहीं होगा।

संपादित करें:

टिप्पणियों से माइकल थेरियट (बहुत साफ और सहायक!) आधार जेएसफ़िल्ड के आधार पर, यहां एक ऐसा है जो वर्तमान कर्सर स्थान के आस-पास सामान्य रूप से वितरित स्वीप के साथ लगातार कंपकंपी करता है: http://jsfiddle.net/benmosher/0x4mc64v/4/

( normal सरणी मेरे आर कंसोल में rnorm(100) को कॉल करने का परिणाम है। सरल तरीके से मैं सामान्य रूप से वितरित यादृच्छिक पूर्णांक का नमूना देने के लिए जेएस में सोच सकता हूं।)


पॉइंटर को स्थानांतरित करने की कोशिश करने के बजाय, आप इसके बजाय एप्लिकेशन (वेब ​​पेज) ले जा सकते हैं। मैंने एक साधारण HTML फॉर्म लिखा जिसमें इसमें कुछ प्रविष्टि फ़ील्ड हैं। जब आप माउस को फॉर्म पर ले जाते हैं, तो फॉर्म चलता है।

आप jsfiddle पर चलती फ़ॉर्म का डेमो देख सकते हैं। प्रभाव देखने के लिए इनपुट फ़ील्ड में से किसी एक पर क्लिक करने का प्रयास करें।

मैंने इसे प्राप्त करने के लिए jquery shake प्रभाव का उपयोग किया। शेक प्रभाव के लिए जावास्क्रिप्ट इस तरह दिखता है, और जब भी माउस उस पर स्थानांतरित होता है तो फ़ॉर्म ऊपर और नीचे जाने का कारण बनता है:

<script type="text/javascript">
    $(document).ready(function() {
        $("#toggle").hover(function () {
            $(this).effect("shake", { direction: "up", times: 1, distance: 40}, 1000);
        });
    });
</script>

हालांकि फॉर्म केवल ऊपर और नीचे चलता है, मुझे लगता है कि इसका वांछित प्रभाव है। फॉर्म आंदोलन को ट्विक करने के लिए आप पैरामीटर (दिशा, समय, दूरी, साथ ही साथ अन-नामित "1000") के साथ खेल सकते हैं।


हार्डवेयर समाधान का उपयोग क्यों नहीं करें? वहां कुछ चूहों हैं जो आप लॉजिटेक जी 500 की तरह वजन डाल सकते हैं। वजन कम करने के बजाय, एक छोटी सी उत्तेजना वाली मोटर में डालें जो माउस को थोड़ा सा हिलाता है। यह वास्तविक विकार को भी अधिक अनुकरण करता है: यह केवल कर्सर नहीं है जो हिलाता है, लेकिन पूरे हाथ और माउस। और इसका मतलब यह भी है कि आप वेबसाइटों की तुलना में अन्य सॉफ्टवेयर दिखा सकते हैं।

वज़न स्लॉट वाले माउस के बजाए, आप माउस को कुछ टेप भी कर सकते हैं, लेकिन यह अधिक ध्यान देने योग्य है।


मैंने पिल्ला लिनक्स फोरम पर एक बार एक मजाक के रूप में ऐसा किया और टिप्पणी प्राप्त की कि:

पार्किंसंस के लोग यह नहीं सोचेंगे कि यह मजाकिया है !!!

यहां इलाज करें, सौभाग्य से cntrl-C है।

यहां शेल स्क्रिप्ट है जिसके लिए xdotool आवश्यकता है

#!/bin/sh
while :; do
   xdotool mousemove_relative -- -$(($RANDOM % 10)) $(($RANDOM % 10))
   xdotool mousemove_relative -- $(($RANDOM % 10)) -$(($RANDOM % 10))
   sleep ${1:-.1} #adjust this as necessary for effect
done

Parkinson_sim के रूप में नाम दें और ट्रैमर के बीच के समय के लिए वैकल्पिक तर्क के साथ चलाएं जो 0.001 से 999.0 हो सकता है।

parkinson_sim [time_between_tremors_in_seconds] #default 0.1 है

मैंने इसे कमांड लाइन से चलाने की बजाय खुद पर क्लिक करने की गलती की और जल्दी से पता चला कि यह कितना निराशाजनक होना चाहिए। इसे मारने के लिए टर्मिनल विंडो खोलने के लिए मुझे कई कोशिशें हुईं।


भूकंप को अनुकरण करने के निम्न स्तर के हिस्सों का अब उत्तर दिया जाता है। मैं अनुकरण करने के लिए कंपकंपी के प्रकार पर ध्यान केंद्रित करने वाला कुछ जोड़ूंगा:

अधिकांश उत्तर एक माउस कर्सर को कार्यान्वित करते हैं जो एक्स और वाई दिशा में कुछ निश्चित अधिकतम चरण चौड़ाई के साथ यादृच्छिक पथ पर आगे बढ़ रहा है।

यह बटन के समान विशिष्ट क्षेत्र को हिट करने के लिए कठिन परिश्रम के उपयोग के लिए पर्याप्त रूप से काम करना चाहिए।

पार्किंसंस रोग से एक कंपकंपी के कारण यूआई समस्याओं को अनुकरण करने के अधिक सामान्य मुद्दे के लिए, वास्तव में इस तरह के कंपकंपी के हाथों की गतिविधियों को अनुकरण करना कम से कम दिलचस्प होगा।
मुझे संदेह है कि यादृच्छिक चलना बहुत अच्छा अनुमान नहीं हो सकता है।

पाठ्यक्रम के कंपकंपी आंदोलन के वास्तविक हाथ ट्रेस डेटा को पकड़ना मुश्किल हो सकता है, लेकिन इस तरह के कंपकंपी का विश्लेषण करने के बारे में निश्चित रूप से कागजात हैं:

पार्किंसंस रोग में हाथ आंदोलन का पेपर पैरामेट्रिक प्रतिनिधित्व इस बारे में है कि कैसे 3 डी हाथ आंदोलन के निशानों को सबसे अच्छी तरह से साजिश करना है।
पेपर का भुगतान किया जाता है, लेकिन पुस्तक छवि पर "लुक इनसाइड>" लेबल वाले ऊपरी दाएं पूर्वावलोकन, हाथ ट्रेस डेटा के विभिन्न प्रस्तुतियों के कुछ रोचक प्लॉट दिखाता है।


जैसा कि आप कस्टम माउस ड्राइवर के साथ ऐसा करने के बारे में सोच रहे थे, मुझे लगता है कि पीसी पर चलने वाला एक छोटा प्रोग्राम या तो होगा? यदि ऐसा है, तो यहां सी # के लिए एक छोटा सा स्निपेट है, जो वर्तमान कर्सर स्थिति के आस-पास प्लस माइनस 5px की सीमा के साथ अनजाने में कर्सर को अनगिनत रूप से ले जाता है। प्रत्येक विस्थापन के बाद कार्यक्रम 50 एमएस से 100 एमएस तक प्रतीक्षा करता है (सटीक नहीं!)। विस्थापन और विराम के मानों को अनुकूलित करके अशक्तता को कॉन्फ़िगर किया जा सकता है। मैंने इसे एक कंसोल एप्लिकेशन में चलाया और - मूल्यों के आधार पर - इसने मुझे कार्यक्रम को रोकने में काफी कठिन समय दिया।

Random rand = new Random();

while(true)
{
    Cursor.Position = new Point() { X = Cursor.Position.X + rand.Next(11)-5, Y = Cursor.Position.Y + rand.Next(11)-5 };
    Thread.Sleep(rand.Next(50) + 50);
}

आप पुराने लेख सिमुलेशन सूट का उपयोग कर सकते हैं, जैसे कि this आलेख में वर्णित एक ... मुझे संदेह है कि हाथ-कंपकंपी भाग केवल कलाई के चारों ओर एक स्पंदित मोटर है, साथ ही कुछ मोटे दस्ताने हाथों को आम तौर पर बेकार बनाने के लिए करते हैं।


  • अपने DIV , कर्सर का उपयोग कर cursor:none; छुपाएं cursor:none;
  • एक .png कर्सर छवि बनाएं और mousemove पर jQ के साथ इसे ( left , top ) ले जाएं
  • एक setTimeout का उपयोग करके .png margin-left और margin-top यादृच्छिक करें (पुन: पोजीशनिंग चिकनी उपयोग CSS3 transition या इसे jQ .animate() साथ करें।

नोट: स्क्रिप्ट यह नहीं जान सकती कि हाथ अभी भी माउस पर है या नहीं;)

function rand(min, max) {return Math.random() * (max - min) + min;}

var $cursor = $('div img');

$('div').mousemove(function(e) {  // Make .png follow the mouse coordinates
  $cursor.css({
    left: e.pageX,
    top:e.pageY
  });
}).hover(function(e){
  $cursor.toggle(); // Show .png cursor as we enter the DIV
});

(function tremor(){ // Add tremor to .png image
  $cursor.css({
      marginLeft: rand(-15,15), // arm tremor
      marginTop:  rand(-30,30)  // hand contractions
  });
  setTimeout(tremor, rand(50,100));
}());
div{
  position:absolute;
  background:#eee;
  height:100%;
  width:100%;
  cursor:none;
}

div img{
  display:none;
  position:absolute;
  transition: margin 0.2s;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div><img src="http://i.stack.imgur.com/KwMGA.png"></div>







simulation