Skip to content

Commit

Permalink
refreshed preferences ui
Browse files Browse the repository at this point in the history
  • Loading branch information
gornostal committed Jan 16, 2018
1 parent 910ee67 commit 55ff8df
Show file tree
Hide file tree
Showing 10 changed files with 148 additions and 36 deletions.
39 changes: 35 additions & 4 deletions data/preferences/src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -71,22 +71,53 @@ html {
body {
color: #3d3d3d;
background: #f2f2f2;
border: 1px solid #e4e4e4;
border: 1px solid #c7c7c7;
}
/* custom scrollbar */
/* width */
::-webkit-scrollbar {
width: 10px;
}
/* Track */
::-webkit-scrollbar-track {
background: #f1f1f1;
margin-right: 3px;
}
/* Handle */
::-webkit-scrollbar-thumb {
background: #999;
border-radius: 9px;
background-clip: padding-box;
border: 3px solid rgba(0, 0, 0, 0);
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
}
::-webkit-scrollbar-button {
width: 0;
height: 0;
display: none;
}
::-webkit-scrollbar-corner {
background-color: transparent;
}
button {
cursor: pointer;
}
#header {
width: 100%;
height: 60px;
height: 69px;
position: fixed;
top: 0;
left: 1px;
right: 1px;
}
#app {
height: 100%;
}
.page-content {
margin-top: 60px;
margin-top: 69px;
max-height: calc(100% - 60px);
overflow-y: auto;
overflow-x: hidden;
Expand Down
2 changes: 2 additions & 0 deletions data/preferences/src/api/fixture.js
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,8 @@ export default function(url, params) {
} else if (isMatch(url, '/extension/remove')) {
console.log('/extension/remove', params)
setTimeout(resolve, 0)
} else if (isMatch(url, '/close')) {
console.log('/close')
} else {
reject(`Unknown URL "${url}"`)
}
Expand Down
Binary file added data/preferences/src/assets/big-plus-sign.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added data/preferences/src/assets/stripe.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
48 changes: 38 additions & 10 deletions data/preferences/src/components/NavBar.vue
Original file line number Diff line number Diff line change
@@ -1,27 +1,44 @@
<template>
<div class="main-header">
<ul>
<li><router-link to="/preferences"><i class="fa fa-cog"></i> Preferences</router-link></li>
<li><router-link to="/shortcuts"><i class="fa fa-external-link-square"></i>Shortcuts</router-link></li>
<li><router-link to="/extensions"><i class="fa fa-cubes"></i>Extensions</router-link></li>
<li><router-link to="/help"><i class="fa fa-support"></i>Help</router-link></li>
<li><router-link to="/about"><i class="fa fa-info-circle"></i>About</router-link></li>
</ul>
<div>
<div class="stripe"></div>
<div class="main-header">
<ul>
<li><router-link to="/preferences"><i class="fa fa-cog"></i> Preferences</router-link></li>
<li><router-link to="/shortcuts"><i class="fa fa-external-link-square"></i>Shortcuts</router-link></li>
<li><router-link to="/extensions"><i class="fa fa-cubes"></i>Extensions</router-link></li>
<li><router-link to="/help"><i class="fa fa-support"></i>Help</router-link></li>
<li><router-link to="/about"><i class="fa fa-info-circle"></i>About</router-link></li>
</ul>
<div class="close-btn" @click="closeWindow"></div>
</div>
</div>
</template>

<script>
import jsonp from '@/api'
import bus from '@/event-bus'
export default {
name: 'navbar'
name: 'navbar',
methods: {
closeWindow () {
jsonp('prefs://close').then(null, (err) => bus.$emit('error', err))
}
}
}
</script>

<style lang="scss" scoped>
$headerHeight: 60px;
$underlineHeight: 4px;
$darkBlue: #015aa7;
$darkBlue: #006890;
$veryLightGrey: #c8c8c8;
.stripe {
background: #4B71A5 url('../assets/stripe.png') no-repeat;
height: 9px;
}
.main-header {
box-sizing: border-box;
height: $headerHeight;
Expand All @@ -30,6 +47,17 @@ $veryLightGrey: #c8c8c8;
background: #e4e4e4;
font-size: 0.95em;
letter-spacing: 0.04px;
position: relative;
.close-btn {
position: absolute;
top: 18px;
right: 25px;
cursor: pointer;
width: 28px;
height: 28px;
background: url('../assets/big-plus-sign.png') no-repeat;
}
}
ul, li {
Expand Down
1 change: 1 addition & 0 deletions data/preferences/src/components/pages/About.vue
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,7 @@
<p>
<ul>
<li>Igor Yatsenko &lt;yatsenko.igor@gmail.com&gt;</li>
<li>Eugene Chulkov &lt;genechulkov@gmail.com&gt;</li>
</ul>
</p>
</div>
Expand Down
33 changes: 17 additions & 16 deletions data/preferences/src/components/pages/Preferences.vue
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,18 @@
</td>
</tr>

<tr>
<td>
<label for="theme-name">Color Theme</label>
</td>
<td>
<b-form-select
id="theme-name"
:options="prefs.available_themes"
v-model="theme_name"></b-form-select>
</td>
</tr>

<tr>
<td>
<label for="autostart">Launch at Login</label>
Expand Down Expand Up @@ -51,31 +63,20 @@

<tr>
<td>
<label for="theme-name">Color Theme</label>
<label for="clear_previous_query">Clear Input on Hide</label>
</td>
<td>
<b-form-select
id="theme-name"
:options="prefs.available_themes"
v-model="theme_name"></b-form-select>
<b-form-checkbox
id="clear_previous_query"
v-model="clear_previous_query"></b-form-checkbox>
</td>
</tr>

</table>

<h1>Advanced</h1>

<table>
<tr>
<td>
<label for="clear_previous_query">Clear Query <br> When App Looses Focus</label>
</td>
<td>
<b-form-checkbox
id="clear_previous_query"
v-model="clear_previous_query"></b-form-checkbox>
</td>
</tr>

<tr>
<td class="pull-top">
<label>Blacklisted app dirs</label>
Expand Down
5 changes: 5 additions & 0 deletions data/styles/preferences.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
@import url("../themes/light/reset.css");

.app-box {
box-shadow: 0 0 7px rgba(0, 0, 0, 0.4);
}
43 changes: 37 additions & 6 deletions data/ui/PreferencesUlauncherDialog.ui
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,11 @@
<property name="window_position">center</property>
<property name="icon_name">ulauncher</property>
<property name="type_hint">normal</property>
<property name="decorated">False</property>
<child internal-child="vbox">
<object class="GtkBox" id="dialog_vbox1">
<property name="visible">True</property>
<property name="app_paintable">True</property>
<property name="can_focus">True</property>
<property name="is_focus">True</property>
<property name="orientation">vertical</property>
Expand Down Expand Up @@ -53,6 +55,9 @@
<property name="position">1</property>
</packing>
</child>
<style>
<class name="dialog-area"/>
</style>
</object>
<packing>
<property name="expand">False</property>
Expand All @@ -62,22 +67,48 @@
</packing>
</child>
<child>
<object class="GtkScrolledWindow" id="scrolled_window">
<property name="width_request">800</property>
<property name="height_request">600</property>
<object class="GtkBox" id="window_wrapper">
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="shadow_type">in</property>
<property name="can_focus">False</property>
<property name="margin_left">20</property>
<property name="margin_right">20</property>
<property name="margin_top">20</property>
<property name="margin_bottom">20</property>
<property name="orientation">vertical</property>
<child>
<placeholder/>
<object class="GtkScrolledWindow" id="scrolled_window">
<property name="width_request">996</property>
<property name="height_request">599</property>
<property name="visible">True</property>
<property name="app_paintable">True</property>
<property name="can_focus">True</property>
<property name="shadow_type">in</property>
<child>
<placeholder/>
</child>
<style>
<class name="scrolled-window"/>
</style>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">0</property>
</packing>
</child>
<style>
<class name="app-box"/>
</style>
</object>
<packing>
<property name="expand">True</property>
<property name="fill">True</property>
<property name="position">1</property>
</packing>
</child>
<style>
<class name="outer-box"/>
</style>
</object>
</child>
<action-widgets>
Expand Down
13 changes: 13 additions & 0 deletions ulauncher/ui/windows/PreferencesUlauncherDialog.py
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@ def finish_initializing(self, builder):

self.settings = Settings.get_instance()
self._init_webview()
self.init_styles(get_data_file('styles', 'preferences.css'))
self.autostart_pref = AutostartPreference()
self.hotkey_dialog = HotkeyDialog()
self.hotkey_dialog.connect('hotkey-set', self.on_hotkey_set)
Expand All @@ -101,6 +102,7 @@ def _init_webview(self):

self.webview.get_context().register_uri_scheme('prefs', self.on_scheme_callback)
self.webview.get_context().set_cache_model(WebKit2.CacheModel.DOCUMENT_VIEWER) # disable caching
self.webview.connect('button-press-event', self.webview_on_button_press_event)
self.webview.connect('context-menu', self.webview_on_context_menu)

inspector = self.webview.get_inspector()
Expand All @@ -121,6 +123,17 @@ def show(self, page):
######################################
# GTK event handlers
######################################
#
def webview_on_button_press_event(self, widget, event):
"""
Makes preferences window draggable by empty an empty space between navigation and close button
also by the color stripe
"""
window_width = self.get_size()[0]
if event.button == 1 and (670 < event.x < window_width - 100 and 0 < event.y < 69) or event.y <= 11:
self.begin_move_drag(event.button, event.x_root, event.y_root, event.time)

return False

def webview_on_context_menu(self, *args):
return bool(not get_options().dev)
Expand Down

0 comments on commit 55ff8df

Please sign in to comment.