custom_loader 0.1.0 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: ae30473feec446854beaeee94d332aab257245b9
4
- data.tar.gz: fc0ae92fb161840ad3be50c5d2aeae481dfea1ec
3
+ metadata.gz: 1ee5c43c2e1e5eb4c3641d1294d895243646a752
4
+ data.tar.gz: 69a9637417ddfa8be0223806174c09250f3a66c9
5
5
  SHA512:
6
- metadata.gz: 1619564cc1b919748f957497956273ad4a521b685143ab68d581e865eab3e37092a0d92a6d2eb0de7feec7a16285515dbdcade4ae0621d22730787e0748569c6
7
- data.tar.gz: dd07f34cadb8e7b34765fd91e59e6894e8bde66e66e79d1907ab0b6a7b43b0a6f6e070c3cb5ea19b4c10e3f9855def78ff55a047fa0a5ab85dcfcc39755c08ae
6
+ metadata.gz: 17217805f979943fb0241bb2f80037e194f2afe899e6c2cf198d04afddce06ad6803ff0ff74b790b4fe08c9fcd3a328da684fe341c3f7bcf32e062abfd7d4d21
7
+ data.tar.gz: 906a01dbd5ca993488782acb55454293c71abfd7307c44658da6b380044338eb565db9d36e267fc16f087d0db3d940a1d580b045754137cf83a7614549372518
data/README.md CHANGED
@@ -25,20 +25,33 @@ I would suggest including the below line in application.html layout but you can
25
25
 
26
26
  <%= CustomLoader.setup_custom_loader_images.html_safe%>
27
27
 
28
- This command will include all loader images on viewport . If you will not include this then all loaders images will take time to render on first load. Now add the below line where ever you want to add the loader:
28
+ Now if you are planning to include your own custom images which are not existing in your rails asset path and you are having some open source URLs of your images then pass those URLs in an array with the named parameter as mentioned below:
29
29
 
30
- CustomLoader.custom_loader('main-timeline','blue_diameter','Edit Profile','gold').html_safe
30
+ <%= CustomLoader.setup_custom_loader_images(my_img_urls: ["URL1","URL2",....,"URLn"]).html_safe%>
31
31
 
32
- The custom_loader method is in below format:
32
+ This command will include all loader images on viewport . If you will not include this then all loaders images that are not existing in your assets folder will take time to render on first load. Now add the below line where ever you want to add the loader:
33
33
 
34
- parameter 1: provide the HTML elements(div,span,etc) ID where the loader needs to be appended.
34
+ CustomLoader.custom_loader(NAMED PARAMETERS).html_safe
35
35
 
36
- parameter 2: specify the loader type to be rendered from the following sets of loaders: stream, circle, blob, blue_diameter, bouncing_balls, dna, gears1, gears2, pie_loader_cyan, snake_game, sand_clock_up, sliding_discs_up, sand_clock, sliding_discs.
36
+ The custom_loader method Named Parameters are described below:
37
37
 
38
- parameter 3: Enter the text to be displayed with the loader, if nil then Loading will be displayed as default.
38
+ element_reference_name: Provide the HTML elements(div,span,etc) identifier where the loader needs to be appended, for example it can be an elements ID, Class or you can specify the HTML tags like: body, span, label, etc...
39
+
40
+ reference_type: Here specify that what kind of identifier is your previous parameter(element_reference_name) , for example :- "id","class", for other cases you need not initialize this parameter.
41
+
42
+ image_url: If you wish to use your own custom image, you can pass its URL here. You can use asset_path to provide assets image URL or can pass a open source web URL directly.
43
+
44
+ loader_type: If you wish to use some custom loader images provided by us you can simply leave image_url parameter and specify the loader type to be rendered from the following sets of loaders: stream, circle, blob, blue_diameter, bouncing_balls, dna, gears1, gears2, pie_loader_cyan, snake_game, sand_clock, sliding_discs.
45
+
46
+ content_position: Specify the position of text with respect to image in loader. It can be: "up", "down", "left", "right", "middle"
47
+
48
+ content: Enter the text to be displayed with the loader, if nil then Loading will be displayed as default.
39
49
 
40
- parameter 4: Enter the text color to be displayed with the loader, if nil then black text will be displayed as default. If you want to customize the color but not the Default text then pass parameter 3 as nil .
50
+ text_color: Enter the text color to be displayed with the loader, if nil then black text will be displayed as default. If you want to customize the color but not the Default text then pass parameter 3 as nil .
41
51
 
52
+ Suppose you need to provide a loader in a div with id: "test_div" and want a stream Loader with text in golden color, so you can define loader as below example:
53
+
54
+ CustomLoader.custom_loader(element_reference_name: "test_div", reference_type: "id", loader_type: "stream", text_color: "gold").html_safe
42
55
 
43
56
  ## Development
44
57
 
data/lib/custom_loader.rb CHANGED
@@ -2,77 +2,84 @@ require "custom_loader/version"
2
2
 
3
3
  module CustomLoader
4
4
  class Error < StandardError; end
5
- def self.custom_loader(div_id,loader_type,content=nil,text_color=nil)
5
+ def self.custom_loader(element_reference_name: nil, reference_type: nil, image_url: nil, loader_type: nil, content_position: nil, content: nil, text_color: nil)
6
6
  loader_label=''
7
- if content.nil?
8
- content="Loading"
7
+ content||="Loading"
8
+ text_color||=""
9
+ content_position||="down"
10
+ loader_type||="bouncing_balls"
11
+ reference_type||="id"
12
+ element_reference_name||=""
13
+ image_url||=""
14
+ if image_url.empty?
15
+ image_path="https://raw.githubusercontent.com/RajDhruv/hubCafe/master/app/assets/images/custom_loader"
16
+ case loader_type
17
+ when "stream"
18
+ image_url="#{image_path}/stream_loader.gif"
19
+ when "circle"
20
+ image_url="#{image_path}/circle_loader.gif"
21
+ when "blob"
22
+ image_url="#{image_path}/blob.gif"
23
+ when "blue_diameter"
24
+ image_url="#{image_path}/blue_diameter.gif"
25
+ when "bouncing_balls"
26
+ image_url="#{image_path}/bouncing_balls.gif"
27
+ when "dna"
28
+ image_url="#{image_path}/dna.gif"
29
+ when "gears1"
30
+ image_url="#{image_path}/gears1.gif"
31
+ when "gears2"
32
+ image_url="#{image_path}/gears2.gif"
33
+ when "pie_loader_cyan"
34
+ image_url="#{image_path}/pie_loader_cyan.gif"
35
+ when "snake_game"
36
+ image_url="#{image_path}/snake_game.gif"
37
+ when "sand_clock"
38
+ image_url="#{image_path}/sand_clock.gif"
39
+ when "sliding_discs"
40
+ image_url="#{image_path}/sliding_discs.gif"
41
+ end
9
42
  end
10
- if text_color.nil?
11
- text_color=""
43
+ if content_position=="up"
44
+ loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div>"+content+"</div><div><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></div></center>"
45
+ elsif content_position=="down"
46
+ loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
47
+ elsif content_position=="left"
48
+ loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'>"+content+"</td><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td></tr></table></center>"
49
+ elsif content_position=="right"
50
+ loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td></tr></table></center>"
51
+ elsif content_position=="middle"
52
+ loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td></tr></table></center>"
53
+ end
54
+ return_string=""
55
+ if reference_type=="id"
56
+ return_string="$(\"#"+element_reference_name+"\").html(\""+loader_label+"\")"
57
+ elsif reference_type=="class"
58
+ return_string="$(\"."+element_reference_name+"\").html(\""+loader_label+"\")"
59
+ else
60
+ return_string="$(\""+element_reference_name+"\").html(\""+loader_label+"\")"
12
61
  end
13
- image_path="https://raw.githubusercontent.com/RajDhruv/hubCafe/master/app/assets/images/custom_loader"
14
- if loader_type=="stream"
15
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'>"+content+"&nbsp;<img src=\'#{image_path}/stream_loader.gif\' alt=\'...\' width=\'50\'/></center>"
16
- elsif loader_type=="circle"
17
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/circle_loader.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
18
- elsif loader_type=="blob"
19
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/blob.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
20
- elsif loader_type=="blue_diameter"
21
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/blue_diameter.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
22
- elsif loader_type=="bouncing_balls"
23
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/bouncing_balls.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
24
- elsif loader_type=="dna"
25
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/dna.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
26
- elsif loader_type=="gears1"
27
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/gears1.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
28
- elsif loader_type=="gears2"
29
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/gears2.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
30
- elsif loader_type=="pie_loader_cyan"
31
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/pie_loader_cyan.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
32
- elsif loader_type=="snake_game"
33
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/snake_game.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
34
- elsif loader_type=="sand_clock_up"
35
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
36
- elsif loader_type=="sliding_discs_up"
37
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
38
- elsif loader_type=="sand_clock"
39
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td></tr></table></center>"
40
- elsif loader_type=="sliding_discs"
41
- loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td><td align=\'center\'><img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\'/></td></tr></table></center>"
42
- end
43
- "$(\"#"+div_id+"\").html(\""+loader_label+"\")"
62
+ return_string
44
63
  end
45
64
 
46
- def self.setup_custom_loader_images()
65
+ def self.setup_custom_loader_images(my_img_urls: [])
47
66
  loader_label_img=''
48
67
  image_path="https://raw.githubusercontent.com/RajDhruv/hubCafe/master/app/assets/images/custom_loader"
49
68
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/stream_loader.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
50
-
51
69
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/circle_loader.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
52
-
53
70
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/blob.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
54
-
55
71
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/blue_diameter.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
56
-
57
72
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/bouncing_balls.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
58
-
59
73
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/dna.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
60
-
61
74
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/gears1.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
62
-
63
75
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/gears2.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
64
-
65
76
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/pie_loader_cyan.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
66
-
67
77
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/snake_game.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
68
-
69
- loader_label_img=loader_label_img+"<img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
70
-
71
- loader_label_img=loader_label_img+"<img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
72
-
73
78
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
74
-
75
79
  loader_label_img=loader_label_img+"<img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
80
+ my_img_urls.each do |url|
81
+ loader_label_img=loader_label_img+"<img src=\'#{url}\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
82
+ end
76
83
  loader_label_img
77
84
  end
78
85
  end
@@ -1,3 +1,3 @@
1
1
  module CustomLoader
2
- VERSION = "0.1.0"
2
+ VERSION = "0.2.0"
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: custom_loader
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.0
4
+ version: 0.2.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Dhruv Raj
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2019-04-07 00:00:00.000000000 Z
11
+ date: 2019-04-09 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler