meistudioli/msc-input-assistant meistudioli/msc-input-assistant

  • Stars
    star
    1
  • Language
    JavaScript
  • License
    MIT License
  • Created almost 2 years ago
  • Updated over 1 year ago
Twitter logo Share LinkedIn logo Share Facebook logo Share
meistudioli/msc-input-assistant
github

meistudioli

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

<msc-input-assistant /> is a web component which help user to input wisely. Users could search or pick option with list we provide. Once options are not good enough for them, they can 「add」 their own options for usage.

More Repositories

1

protractorEx

JavaScript
13
star
2

gaExt

PHP
11
star
3

illuTransC

JavaScript
8
star
4

hashtag

JavaScript
6
star
5

pasteIt

JavaScript
4
star
6

msc-image-uploader

<msc-image-uploader /> is a web component based image uploader. Users could pick & upload images by 「file picker」、「drag & drop」and even direct「paste」image content.
JavaScript
3
star
7

msc-circle-progress

<msc-circle-progress /> provides progress with circle shape. Developers could use it to indicate upload、form complete status for users.
JavaScript
3
star
8

msc-any-pip

Imaging what if we can let anything Picture-in-Picture (not only <video />) ?! Here comes <msc-any-pip /> to let it dream comes true. <msc-any-pip /> apply Document Picture-in-Picture API to given elements have Picture-in-Picture feature.
JavaScript
3
star
9

automation_nau

JavaScript
2
star
10

maskGenerator

JavaScript
2
star
11

JSDC2015Ex

HTML
2
star
12

remPolyfill

JavaScript
2
star
13

msc-select-list

<msc-select-list /> provides a common UI as select and group checkboxs as its drop menu. So user could experience it as usual and have multi-select feature.
JavaScript
2
star
14

msc-lens

Google Lens is famous and powerful for image search. Users could use its fancy UI for image selection. I like its effect and wanna to apply it for services I owned. That's also the main reason I wrapped it into <msc-lens />. Developers could received exactly the image which users just selected and do some analytics and recommend. Then render results through event which <msc-lens /> provided.
JavaScript
2
star
15

msc-ez-video

Modern browsers already had a vivid player for <video />. However, web developers and designers still want to custom their own style player for different situations. Sounds like web component will do a lot favor for this purpose. With <msc-ez-video /> support, customize control panel will become a piece of cake. <msc-ez-video /> adopts CSS custom properties, developers could style them as they want.
JavaScript
2
star
16

stretchIt

JavaScript
1
star
17

msc-web-push

Push messaging provides a simple and effective way to re-engage with your users. Once users subscribed, vendor could push messaging for them. <msc-web-push /> provides a simple usage for developers. It will handle subscription process and UI mutations.
JavaScript
1
star
18

inAPP

HTML
1
star
19

yahoo-auction-automation

Puppeteer exercise - from submit merchandise to payok at TW Yahoo Auction.
JavaScript
1
star
20

msc-zoom

Zoom is a web component which provide zoom-in / zoom-out effects for image closing watch. Users could just tap the part they like to have a closing watch.
JavaScript
1
star
21

hashtagT

JavaScript
1
star
22

mail-template

Suitable mail template for light / dark mode.
HTML
1
star
23

msc-sidebar

A sidebar provides a way to display meta content intended for temporary access (navigation links, buttons, menus, etc.). The sidebar can be revealed by a button tap while the main content remains visually underneath.
JavaScript
1
star
24

msc-any-fullscreen-popup

Imagine the feature to open a popup window in fullscreen mode. With window-management support, user could directly open a popup window in fullscreen mode in just one click. <msc-any-fullscreen-popup /> is a web component which wrap this feature. Developers could apply it to any element they like.
JavaScript
1
star
25

msc-stretch-textarea

Users used to experience autogrowing <textarea /> since Facebook announced this fancy effect. There are so many skills to apply this effect in web page. Here comes the most cleanest trick for autogrowing textareas. With this trick, decvelopers could apply CSS > Grid to make <textarea /> autogrowing with fewest event listeners. Very smart & bravo !! <msc-stretch-textarea /> is a web component which wrap this trick to let developers could easy adopt this effect in web page instead of annoying HTML code & CSS setting. All we need to do is just make a few setting and everything will be all set.
JavaScript
1
star
26

msc-portable-video

Video - the most popular content in web page. Visitors always attracted with vivid contents. That's why editor like to place video contents in web page. We could see these video modules fixed in web page corner easily, such as YouTube. It's a very common effect nowadays. But what if visitors could place video module where they want. Or adjust video size for more smooth browsing they like. That's the main purpose why I design <msc-portable-video /> this web component. With a few setting and everything will be all set.
JavaScript
1
star
27

msc-ripple

Interaction with UI mutation is usability 101 level stuff. Web developers should always keep this in mind to let user realize which element has beeb tapped. I like Google Material Design's ripple effect when user taped some clickable elements, suh as <a />、<button />. That's why I deign <msc-ripple /> to wrap clickable elements and let them have ripple effect after user tapped. Besides that, <msc-ripple /> also provide sound & vibrate options to let developers decide turn them on or not.
JavaScript
1
star